From 5942f8954c4d1ac5b4ead0b80d9b3bfb95adadea Mon Sep 17 00:00:00 2001
From: mudabbir-ahmad <mudabbira.uk@gmail.com>
Date: Mon, 6 Apr 2026 02:13:35 +0100
Subject: [PATCH] Refactor API base URL handling for dynamic environment
 detection; update navigation stack options for improved layout consistency

---
 App.js                    | 21 +++++++++++++++++----
 src/components/API/API.js | 11 +++++++++--
 2 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/App.js b/App.js
index 77a2d4f..6ac5cf6 100644
--- a/App.js
+++ b/App.js
@@ -22,7 +22,11 @@ const AdminStackNav = createNativeStackNavigator();
 
 const AuthStack = () => (
     <AuthStackNav.Navigator
-        screenOptions={{headerShown: false}}
+        screenOptions={{
+            headerShown: false,
+            contentStyle: { backgroundColor: '#ffffff' },
+            keyboardHandlingEnabled: false,
+        }}
     >
         <AuthStackNav.Screen name="LoginScreen" component={LoginScreen}/>
         <AuthStackNav.Screen name="RegisterScreen" component={RegisterScreen}/>
@@ -31,7 +35,10 @@ const AuthStack = () => (
 
 const GameStack = () => (
     <GameStackNav.Navigator
-        screenOptions={{headerShown: false}}
+        screenOptions={{
+            headerShown: false,
+            contentStyle: { backgroundColor: '#ffffff' },
+        }}
     >
         <GameStackNav.Screen name="GameTypeScreen" component={GameTypeScreen}/>
         <GameStackNav.Screen name="JoinPrivateGameScreen" component={JoinPrivateGameScreen}/>
@@ -47,7 +54,10 @@ const GameStack = () => (
 
 const AdminStack = () => (
     <AdminStackNav.Navigator
-        screenOptions={{headerShown: false}}
+        screenOptions={{
+            headerShown: false,
+            contentStyle: { backgroundColor: '#ffffff' },
+        }}
     >
         <AdminStackNav.Screen name="AdminHubScreen" component={AdminHubScreen}/>
         <AdminStackNav.Screen name="ManageSubgroupsScreen" component={ManageSubgroupsScreen}/>
@@ -64,7 +74,10 @@ export const App = () => {
         <SafeAreaProvider>
             <NavigationContainer>
                 <RootStack.Navigator
-                    screenOptions={{headerShown: false}}
+                    screenOptions={{
+                        headerShown: false,
+                        contentStyle: { backgroundColor: '#ffffff' },
+                    }}
                 >
                     <RootStack.Screen name="Auth" component={AuthStack}/>
                     <RootStack.Screen name="Game" component={GameStack}/>
diff --git a/src/components/API/API.js b/src/components/API/API.js
index 4692ada..1207822 100644
--- a/src/components/API/API.js
+++ b/src/components/API/API.js
@@ -1,5 +1,12 @@
-//export const API_BASE_URL = 'http://192.168.8.100:3000';
-export const API_BASE_URL = 'http://api.bobby.ip-ddns.com';
+import Constants from 'expo-constants';
+
+const getBaseUrl = () => {
+    const host = Constants.expoGoConfig?.debuggerHost;
+    if (host) return `http://${host.split(':')[0]}:3000`;
+    return 'http://api.bobby.ip-ddns.com';
+};
+
+export const API_BASE_URL = getBaseUrl();
 const API = {};
 
 API.get = (endpoint) => callFetch(endpoint, 'GET');