From 2820d9ccd4023342d570b7a9187c8921cdc9e8ee Mon Sep 17 00:00:00 2001
From: ramin-deriv <ramin.vakili@deriv.com>
Date: Mon, 24 Jun 2024 11:29:34 +0800
Subject: [PATCH] fix issue of overscrolling chips list causing bottom sheet to
 drag

---
 .../lib/src/mobile_tools_ui/chips_list.dart   |  2 +-
 .../mobile_tools_bottom_sheet_content.dart    | 52 +++++++++++--------
 2 files changed, 31 insertions(+), 23 deletions(-)

diff --git a/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/chips_list.dart b/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/chips_list.dart
index 0a5b03b2c..1efad8eb6 100644
--- a/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/chips_list.dart
+++ b/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/chips_list.dart
@@ -31,7 +31,7 @@ class ChipsList extends StatelessWidget {
   final double horizontalPadding;
 
   @override
-  Widget build(BuildContext context) => Container(
+  Widget build(BuildContext context) => SizedBox(
         height: ThemeProvider.margin36,
         child: ListView.builder(
           scrollDirection: Axis.horizontal,
diff --git a/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/mobile_tools_bottom_sheet_content.dart b/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/mobile_tools_bottom_sheet_content.dart
index 21b93dc82..40553b897 100644
--- a/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/mobile_tools_bottom_sheet_content.dart
+++ b/packages/deriv_mobile_chart_wrapper/lib/src/mobile_tools_ui/mobile_tools_bottom_sheet_content.dart
@@ -58,28 +58,36 @@ class MobileToolsBottomSheetContent extends StatelessWidget {
   }
 
   Widget _buildChipsList() {
-    return const ChipsList(items: <CustomChip>[
-      CustomChip(
-        value: 'Active',
-        borderRadius: ThemeProvider.margin40,
-      ),
-      CustomChip(
-        value: 'All',
-        borderRadius: ThemeProvider.margin40,
-      ),
-      CustomChip(
-        value: 'Momentum',
-        borderRadius: ThemeProvider.margin40,
-      ),
-      CustomChip(
-        value: 'Volatility',
-        borderRadius: ThemeProvider.margin40,
-      ),
-      CustomChip(
-        value: 'Moving average',
-        borderRadius: ThemeProvider.margin40,
-      ),
-    ]);
+    // Overscroll behaviour of horizontal chips list sometimes triggers
+    // BottomSheet top <-> bottom dragging. That's why we're capturing the
+    // overscroll here so it doesn't propagate up to the BottomSheet.
+    return NotificationListener<OverscrollNotification>(
+      onNotification: (OverscrollNotification notification) {
+        return true;
+      },
+      child: const ChipsList(items: <CustomChip>[
+        CustomChip(
+          value: 'Active',
+          borderRadius: ThemeProvider.margin40,
+        ),
+        CustomChip(
+          value: 'All',
+          borderRadius: ThemeProvider.margin40,
+        ),
+        CustomChip(
+          value: 'Momentum',
+          borderRadius: ThemeProvider.margin40,
+        ),
+        CustomChip(
+          value: 'Volatility',
+          borderRadius: ThemeProvider.margin40,
+        ),
+        CustomChip(
+          value: 'Moving average',
+          borderRadius: ThemeProvider.margin40,
+        ),
+      ]),
+    );
   }
 
   Widget _buildHeader(BuildContext context) => Container(