From ab33e2132f8e6fdb4a3c36e34c0f2ff04e09f11f Mon Sep 17 00:00:00 2001
From: gorhom <gorhom.dev@gmail.com>
Date: Mon, 14 Oct 2024 21:08:15 +0100
Subject: [PATCH] fix(#1968): moved the flashlist optional import into the
 component body

---
 .../BottomSheetFlashList.tsx                  | 25 ++++++++++++-------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx b/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx
index 683278c8..56b88f9d 100644
--- a/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx
+++ b/src/components/bottomSheetScrollable/BottomSheetFlashList.tsx
@@ -9,24 +9,25 @@ import type {
   BottomSheetScrollableProps,
 } from './types';
 
-let FlashList: React.FC;
-
+let FlashList: {
+  FlashList: React.FC;
+};
+// since FlashList is not a dependency for the library
+// we try to import it using metro optional import
 try {
-  FlashList = require('@shopify/flash-list').FlashList as never;
-} catch (_) {
-  throw 'You need to install FlashList first, `yarn install @shopify/flash-list`';
-}
+  FlashList = require('@shopify/flash-list') as never;
+} catch (_) {}
 
 export type BottomSheetFlashListProps<T> = Omit<
   Animated.AnimateProps<FlashListProps<T>>,
   'decelerationRate' | 'onScroll' | 'scrollEventThrottle'
 > &
   BottomSheetScrollableProps & {
-    ref?: Ref<typeof FlashList>;
+    ref?: Ref<React.FC>;
   };
 
 const BottomSheetFlashListComponent = forwardRef<
-  typeof FlashList,
+  React.FC,
   // biome-ignore lint/suspicious/noExplicitAny: to be addressed
   BottomSheetFlashListProps<any>
 >((props, ref) => {
@@ -40,6 +41,12 @@ const BottomSheetFlashListComponent = forwardRef<
   }: any = props;
   //#endregion
 
+  useMemo(() => {
+    if (!FlashList) {
+      throw 'You need to install FlashList first, `yarn install @shopify/flash-list`';
+    }
+  }, []);
+
   //#region render
   const renderScrollComponent = useMemo(
     () =>
@@ -61,7 +68,7 @@ const BottomSheetFlashListComponent = forwardRef<
     [focusHook, scrollEventsHandlersHook, enableFooterMarginAdjustment]
   );
   return (
-    <FlashList
+    <FlashList.FlashList
       ref={ref}
       renderScrollComponent={renderScrollComponent}
       {...rest}