Add files via upload

app.json

@@ -29,7 +29,8 @@
     },
     "scheme": "burmalda",
     "plugins": [
-      "expo-router"
+      "expo-router",
+      "react-native-track-player"
     ],
     "updates": {
       "enabled": false

app/(tabs)/index.tsx

@@ -60,9 +60,9 @@ export default function HomeScreen() {
     load();
   }, []);
 
-  useFocusEffect(() => {
+  useFocusEffect(useCallback(() => {
     loadDownloadedTracks();
-  });
+  }, [loadDownloadedTracks]));
 
   const onRefresh = async () => {
     setRefresh(true);

app/_layout.tsx

@@ -5,21 +5,7 @@ import { StatusBar } from 'expo-status-bar';
 import { useBootAuth } from '../hooks/useAuth';
 import { Colors } from '../constants/theme';
 
-export default function RootLayout() {
-  useBootAuth();
-  useOTAUpdates();
-
-  return (
-    <GestureHandlerRootView style={{ flex: 1, backgroundColor: Colors.bg }}>
-      <StatusBar style="light" />
-      <Stack screenOptions={{ headerShown: false, contentStyle: { backgroundColor: Colors.bg } }}>
-        <Stack.Screen name="(tabs)" />
-        <Stack.Screen name="auth" options={{ presentation: 'fullScreenModal' }} />
-      </Stack>
-    </GestureHandlerRootView>
-  );
-}
-
+// Must be defined before use — hooks are not hoisted
 function useOTAUpdates() {
   useEffect(() => {
     if (__DEV__) return;
@@ -38,3 +24,18 @@ function useOTAUpdates() {
     })();
   }, []);
 }
+
+export default function RootLayout() {
+  useBootAuth();
+  useOTAUpdates();
+
+  return (
+    <GestureHandlerRootView style={{ flex: 1, backgroundColor: Colors.bg }}>
+      <StatusBar style="light" />
+      <Stack screenOptions={{ headerShown: false, contentStyle: { backgroundColor: Colors.bg } }}>
+        <Stack.Screen name="(tabs)" />
+        <Stack.Screen name="auth" options={{ presentation: 'fullScreenModal' }} />
+      </Stack>
+    </GestureHandlerRootView>
+  );
+}

hooks/useAudio.ts

@@ -14,15 +14,11 @@ let _lastLoadedId: number | null = null;
 
 async function ensureSetup() {
   if (_setupDone) return;
-  _setupDone = true;
   try {
     await TrackPlayer.setupPlayer({
       minBuffer: 15,
       maxBuffer: 50,
       playBuffer: 2.5,
-      // iOS: show full artwork on lock screen
-      iosCategory: 'playback' as any,
-      iosCategoryMode: 'default' as any,
     });
     await TrackPlayer.updateOptions({
       android: {
@@ -42,7 +38,6 @@ async function ensureSetup() {
         Capability.Pause,
         Capability.SkipToNext,
       ],
-      // iOS lock screen: larger artwork
       notificationCapabilities: [
         Capability.Play,
         Capability.Pause,
@@ -51,12 +46,14 @@ async function ensureSetup() {
         Capability.SeekTo,
       ],
     });
+    _setupDone = true;
   } catch (e: any) {
+    // "already" means player was set up before (e.g. hot reload)
     if (e?.message?.toLowerCase().includes('already')) {
       _setupDone = true;
       return;
     }
-    _setupDone = false;
+    // Other errors — allow retry next call
     throw e;
   }
 }

index.js

@@ -3,9 +3,12 @@ import 'expo-router/entry';
 // Register TrackPlayer background service safely
 // Must be wrapped — if native module isn't ready, app would white-screen otherwise
 try {
-  const TrackPlayer = require('react-native-track-player').default;
+  const TP = require('react-native-track-player');
+  const TrackPlayer = TP.default ?? TP;
   const { PlaybackService } = require('./hooks/PlaybackService');
+  if (TrackPlayer?.registerPlaybackService && typeof PlaybackService === 'function') {
     TrackPlayer.registerPlaybackService(() => PlaybackService);
+  }
 } catch (e) {
   // TrackPlayer native module not ready yet — skip service registration
   // Music playback via TrackPlayer will still work, just no remote controls

package.json

@@ -21,7 +21,7 @@
     "expo-image": "~1.12.15",
     "expo-linear-gradient": "~13.0.2",
     "expo-linking": "~6.3.1",
-    "expo-network": "^55.0.13",
+    "expo-network": "~4.0.0",
     "expo-router": "~3.5.23",
     "expo-secure-store": "~13.0.2",
     "expo-status-bar": "~1.12.1",