1 files changed, 6 insertions, 12 deletions
diff --git a/src/components/common/BottomDrawer.tsx b/src/components/common/BottomDrawer.tsx
index bef9434a..988c1e79 100644
--- a/src/components/common/BottomDrawer.tsx
+++ b/src/components/common/BottomDrawer.tsx
@@ -6,7 +6,7 @@ import {
   View,
   ViewProps,
 } from 'react-native';
-import Animated from 'react-native-reanimated';
+import Animated, {interpolateColors} from 'react-native-reanimated';
 import BottomSheet from 'reanimated-bottom-sheet';
 import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
 
@@ -50,6 +50,10 @@ const BottomDrawer: React.FC<BottomDrawerProps> = (props) => {
     );
   };
 
+  const backgroundColor = interpolateColors(bgAlpha, {
+    inputRange: [0, 1],
+    outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'],
+  });
   return (
     <Modal
       transparent
@@ -75,17 +79,7 @@ const BottomDrawer: React.FC<BottomDrawerProps> = (props) => {
         onPress={() => {
           setIsOpen(false);
         }}>
-        <Animated.View
-          style={[
-            styles.backgroundView,
-            {
-              backgroundColor: Animated.interpolateColors(bgAlpha, {
-                inputRange: [0, 1],
-                outputColorRange: ['rgba(0,0,0,0.3)', 'rgba(0,0,0,0)'],
-              }),
-            },
-          ]}
-        />
+        <Animated.View style={[styles.backgroundView, {backgroundColor}]} />
       </TouchableWithoutFeedback>
     </Modal>
   );