working backend connectivity

carry-your-live/app/(tabs)/settings.tsx

@@ -7,6 +7,7 @@ import { CategoryEditorModal } from '@/components/CategoryEditorModal';
 import { SyncModal } from '@/components/SyncModal';
 import { FriendsModal } from '@/components/FriendsModal';
 import { LegalModal } from '@/components/LegalModal';
+import { ServerUrlModal } from '@/components/ServerUrlModal';
 import SyncStatus from '@/components/SyncStatus';
 import { useSettings, SORT_OPTIONS, REMINDER_OPTIONS } from '@/theme';
 import { useCategories } from '@/hooks/useDatabase';
@@ -16,13 +17,14 @@ import Category from '@/models/Category';
 import Svg, { Path } from 'react-native-svg';
 
 export default function SettingsScreen() {
-  const { theme, notifications, setNotifications, defaultCategoryId, setDefaultCategoryId, sortBy, setSortBy, reminderPreference, setReminderPreference } = useSettings();
+  const { theme, notifications, setNotifications, defaultCategoryId, setDefaultCategoryId, sortBy, setSortBy, reminderPreference, setReminderPreference, apiUrl } = useSettings();
   const categories = useCategories();
   const [picker, setPicker] = useState<null | 'category' | 'sort' | 'reminder'>(null);
   const [editingCategory, setEditingCategory] = useState<Category | null | 'new'>(null);
   const [syncVisible, setSyncVisible] = useState(false);
   const [friendsVisible, setFriendsVisible] = useState(false);
   const [legalVisible, setLegalVisible] = useState<null | 'privacy' | 'terms'>(null);
+  const [serverUrlVisible, setServerUrlVisible] = useState(false);
   const [syncSubtitle, setSyncSubtitle] = useState('Checking...');
 
   const refreshSyncStatus = async () => {
@@ -136,6 +138,13 @@ export default function SettingsScreen() {
           onPress={() => setFriendsVisible(true)}
           showChevron
         />
+        <Text style={[styles.sectionTitle, { color: theme.textMuted }]}>Server</Text>
+        <ListItem
+          title="Backend URL"
+          subtitle={apiUrl}
+          onPress={() => setServerUrlVisible(true)}
+          showChevron
+        />
         <Text style={[styles.sectionTitle, { color: theme.textMuted }]}>About</Text>
         <ListItem
           title="Version"
@@ -191,6 +200,8 @@ export default function SettingsScreen() {
 
       <FriendsModal visible={friendsVisible} onClose={() => setFriendsVisible(false)} />
 
+      <ServerUrlModal visible={serverUrlVisible} onClose={() => setServerUrlVisible(false)} />
+
       <LegalModal
         visible={legalVisible !== null}
         type={legalVisible}
@@ -213,7 +224,7 @@ const styles = StyleSheet.create({
     flex: 1,
   },
   content: {
-    flex: 1,
+    flexGrow: 1,
     paddingHorizontal: 16,
     paddingTop: 8,
   },