feat: implement React Query for Supabase data fetching

- Install @tanstack/react-query and async-storage-persister
- Wrap app with QueryClientProvider in root layout
- Migrate useSupabaseData hooks to React Query
- Add loading skeleton components for better UX
- Configure 5-minute stale time and 24-hour cache
- Add query keys for proper cache management
- Remove duplicate files and clean up structure

app/_layout.tsx

@@ -29,6 +29,7 @@ import { useUserStore } from '@/src/shared/stores'
 import { useNotifications } from '@/src/shared/hooks'
 import { initializePurchases } from '@/src/shared/services/purchases'
 import { initializeAnalytics, getPostHogClient, trackScreen } from '@/src/shared/services/analytics'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 
 Notifications.setNotificationHandler({
   handleNotification: async () => ({
@@ -42,6 +43,18 @@ Notifications.setNotificationHandler({
 
 SplashScreen.preventAutoHideAsync()
 
+// Create React Query Client
+const queryClient = new QueryClient({
+  defaultOptions: {
+    queries: {
+      staleTime: 1000 * 60 * 5, // 5 minutes
+      gcTime: 1000 * 60 * 60 * 24, // 24 hours
+      retry: 2,
+      refetchOnWindowFocus: false,
+    },
+  },
+})
+
 function RootLayoutInner() {
   const colors = useThemeColors()
 
@@ -86,6 +99,7 @@ function RootLayoutInner() {
   }
 
   const content = (
+    <QueryClientProvider client={queryClient}>
       <View style={{ flex: 1, backgroundColor: colors.bg.base }} onLayout={onLayoutRootView}>
         <StatusBar style={colors.statusBarStyle} />
         <Stack
@@ -135,6 +149,7 @@ function RootLayoutInner() {
             />
           </Stack>
       </View>
+    </QueryClientProvider>
   )
 
   const posthogClient = getPostHogClient()