fix: bug

jest.setup.js

@@ -1,3 +1,8 @@
+// Mock react-native-css-interop FIRST to avoid appearance listener issues
+jest.mock('react-native-css-interop', () => ({
+  __esModule: true,
+}))
+
 // Mock react-native BEFORE any other imports to avoid flow type issues
 jest.mock('react-native', () => {
   const React = require('react')
@@ -11,7 +16,11 @@ jest.mock('react-native', () => {
     Pressable: 'Pressable',
     TouchableOpacity: 'TouchableOpacity',
     TextInput: 'TextInput',
-    Platform: { OS: 'web' },
+    ActivityIndicator: 'ActivityIndicator',
+    Platform: {
+      OS: 'web',
+      select: (obj) => obj.web || obj.default,
+    },
     Animated: {
       View: 'Animated.View',
       Text: 'Animated.Text',
@@ -49,11 +58,27 @@ jest.mock('react-native', () => {
     Linking: {
       openURL: jest.fn(),
     },
+    Appearance: {
+      getColorScheme: jest.fn(() => 'light'),
+      addChangeListener: jest.fn(),
+      removeChangeListener: jest.fn(),
+    },
+    BackHandler: {
+      addEventListener: jest.fn(() => ({ remove: jest.fn() })),
+      removeEventListener: jest.fn(),
+    },
   }
 })
 
 require('@testing-library/jest-native/extend-expect')
 
+// Mock global Appearance for react-native-css-interop
+global.Appearance = {
+  getColorScheme: jest.fn(() => 'light'),
+  addChangeListener: jest.fn(() => ({ remove: jest.fn() })),
+  removeChangeListener: jest.fn(),
+}
+
 // Initialize globals for react-native-reanimated
 global._tagToJSPropNamesMapping = {}
 global._WORKLET = false
@@ -95,6 +120,18 @@ jest.mock('expo-linear-gradient', () => ({
   LinearGradient: 'LinearGradient',
 }))
 
+// Mock expo-blur
+jest.mock('expo-blur', () => ({
+  BlurView: 'BlurView',
+}))
+
+// Mock react-native-safe-area-context
+jest.mock('react-native-safe-area-context', () => ({
+  useSafeAreaInsets: () => ({ top: 0, bottom: 0, left: 0, right: 0 }),
+  SafeAreaProvider: ({ children }: any) => children,
+  SafeAreaView: 'SafeAreaView',
+}))
+
 // Mock react-native-gesture-handler
 jest.mock('react-native-gesture-handler', () => {
   const { View } = require('react-native')
@@ -142,11 +179,34 @@ jest.mock('expo-splash-screen', () => ({
 }))
 
 // Mock react-native-reanimated
-jest.mock('react-native-reanimated', () => {
-  const Reanimated = require('react-native-reanimated/mock')
-  Reanimated.default.call = () => {}
-  return Reanimated
-})
+jest.mock('react-native-reanimated', () => ({
+  __esModule: true,
+  default: {
+    createAnimatedComponent: (Component) => Component,
+    call: () => {},
+  },
+  useSharedValue: (v) => ({ value: v }),
+  useAnimatedStyle: (fn) => fn(),
+  withTiming: (v) => v,
+  withSpring: (v) => v,
+  withDecay: (v) => v,
+  withRepeat: (v) => v,
+  withSequence: (...args) => args[0],
+  Easing: {
+    linear: (v) => v,
+    ease: (v) => v,
+    quad: (v) => v,
+    cubic: (v) => v,
+  },
+  runOnJS: (fn) => fn,
+  runOnUI: (fn) => fn,
+}))
+
+// Mock react-native-screens
+jest.mock('react-native-screens', () => ({
+  FullWindowOverlay: 'FullWindowOverlay',
+  enableScreens: jest.fn(),
+}))
 
 // Mock nativewind
 jest.mock('nativewind', () => ({
@@ -225,8 +285,49 @@ jest.mock('@/components/icon', () => ({
   LeftArrowIcon: () => null,
   UploadIcon: () => null,
   WhitePointsIcon: () => null,
+  RightArrowIcon: () => null,
 }))
 
+// Mock UI components that have complex dependencies
+jest.mock('@/components/ui/Text', () => {
+  const mockReact = require('react')
+  const mockRN = require('react-native')
+  const Text = mockReact.forwardRef(({ children, ...props }, ref) => (
+    mockReact.createElement(mockRN.Text, { ref, ...props }, children)
+  ))
+  Text.displayName = 'Text'
+  return {
+    __esModule: true,
+    default: Text,
+  }
+})
+
+jest.mock('@/components/ui/Block', () => {
+  const mockReact = require('react')
+  const mockRN = require('react-native')
+  const Block = mockReact.forwardRef(({ children, onClick, ...props }, ref) => {
+    if (onClick) {
+      return mockReact.createElement(mockRN.Pressable, { ref, onPress: onClick, ...props }, children)
+    }
+    return mockReact.createElement(mockRN.View, { ref, ...props }, children)
+  })
+  Block.displayName = 'Block'
+  return {
+    __esModule: true,
+    default: Block,
+  }
+})
+
+jest.mock('@/components/ui/button', () => {
+  const mockReact = require('react')
+  const mockRN = require('react-native')
+  return {
+    Button: mockReact.forwardRef(({ children, onPress, disabled, ...props }, ref) => (
+      mockReact.createElement(mockRN.Pressable, { ref, onPress, disabled, ...props }, children)
+    )),
+  }
+})
+
 jest.mock('@/components/skeleton/HomeSkeleton', () => ({
   HomeSkeleton: () => null,
 }))