From 2327778136afe5ccc9a64175fd0b9c501a894068 Mon Sep 17 00:00:00 2001
From: Honey <me_honeyy@proton.me>
Date: Wed, 10 Jun 2026 09:21:27 +0200
Subject: [PATCH] fix: move gesture-handler and TrackPlayer init to index.js,
 fix Dimensions usage

---
 mobile/App.js                      | 4 ----
 mobile/index.js                    | 9 +++++----
 mobile/src/screens/ArtistDetail.js | 6 ++++--
 mobile/src/screens/Library.js      | 6 ++++--
 4 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/mobile/App.js b/mobile/App.js
index 0cc7e7e..e73924a 100644
--- a/mobile/App.js
+++ b/mobile/App.js
@@ -1,4 +1,3 @@
-import 'react-native-gesture-handler';
 import React, { useEffect, useState } from 'react';
 import { View, StatusBar } from 'react-native';
 import { NavigationContainer } from '@react-navigation/native';
@@ -8,7 +7,6 @@ import { SafeAreaProvider } from 'react-native-safe-area-context';
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import { Ionicons } from '@expo/vector-icons';
 import TrackPlayer, { Event, State } from 'react-native-track-player';
-import { PlaybackService } from './src/audio/service';
 import { setupPlayer } from './src/audio/player';
 import { useStore } from './src/store';
 
@@ -21,8 +19,6 @@ import LoginScreen        from './src/screens/Login';
 import NowPlayingScreen   from './src/screens/NowPlaying';
 import PlayerBar          from './src/components/PlayerBar';
 
-TrackPlayer.registerPlaybackService(() => PlaybackService);
-
 const Tab   = createBottomTabNavigator();
 const Stack = createStackNavigator();
 
diff --git a/mobile/index.js b/mobile/index.js
index 1d6e981..3987e41 100644
--- a/mobile/index.js
+++ b/mobile/index.js
@@ -1,8 +1,9 @@
+import 'react-native-gesture-handler';
 import { registerRootComponent } from 'expo';
-
+import TrackPlayer from 'react-native-track-player';
+import { PlaybackService } from './src/audio/service';
 import App from './App';
 
-// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
-// It also ensures that whether you load the app in Expo Go or in a native build,
-// the environment is set up appropriately
+TrackPlayer.registerPlaybackService(() => PlaybackService);
+
 registerRootComponent(App);
diff --git a/mobile/src/screens/ArtistDetail.js b/mobile/src/screens/ArtistDetail.js
index 3495926..6e917a2 100644
--- a/mobile/src/screens/ArtistDetail.js
+++ b/mobile/src/screens/ArtistDetail.js
@@ -1,8 +1,10 @@
 import React, { useEffect, useState } from 'react';
 import {
   View, Text, FlatList, Image, TouchableOpacity,
-  StyleSheet, ActivityIndicator, ScrollView,
+  StyleSheet, ActivityIndicator, Dimensions,
 } from 'react-native';
+
+const SCREEN_WIDTH = Dimensions.get('window').width;
 import { useNavigation, useRoute } from '@react-navigation/native';
 import { Ionicons } from '@expo/vector-icons';
 import { api, apiCached, dispArtistById, dispAlbumName, coverUrl, getArtistImage, cacheArtistSortNames } from '../api';
@@ -61,7 +63,7 @@ export default function ArtistDetailScreen() {
             <View style={{ flex: 1, padding: 8 }}>
               <AlbumCard
                 album={item}
-                size={(require('react-native').Dimensions.get('window').width / 2) - 20}
+                size={(SCREEN_WIDTH / 2) - 20}
                 onPress={() => navigation.navigate('AlbumDetail', { album: item })}
               />
             </View>
diff --git a/mobile/src/screens/Library.js b/mobile/src/screens/Library.js
index 5cd8391..62916e8 100644
--- a/mobile/src/screens/Library.js
+++ b/mobile/src/screens/Library.js
@@ -1,8 +1,10 @@
 import React, { useEffect, useState, useCallback } from 'react';
 import {
   View, Text, FlatList, TouchableOpacity,
-  StyleSheet, ActivityIndicator, Image, TextInput, RefreshControl,
+  StyleSheet, ActivityIndicator, Image, TextInput, RefreshControl, Dimensions,
 } from 'react-native';
+
+const SCREEN_WIDTH = Dimensions.get('window').width;
 import { useNavigation } from '@react-navigation/native';
 import { Ionicons } from '@expo/vector-icons';
 import { apiCached, cacheArtistSortNames, dispArtistById, dispAlbumName, coverUrl, getArtistImage } from '../api';
@@ -145,7 +147,7 @@ export function AlbumsScreen() {
           <View style={{ flex: 1, padding: 6 }}>
             <AlbumCard
               album={item}
-              size={(require('react-native').Dimensions.get('window').width / 2) - 18}
+              size={(SCREEN_WIDTH / 2) - 18}
               onPress={() => navigation.navigate('AlbumDetail', { album: item })}
             />
           </View>