dd4533efd2
Tap any saved recording to open ActivityDetailScreen: - Full-screen MapLibre map with track fitted to bounds (LngLatBounds padding) - Stats panel: duration, distance, avg speed, elevation gain (computed from track points), avg HR/power/cadence, point count - 'Edit' button in header opens a pageSheet modal with title TextInput, sport grid, and subtype pills — same controls as PostRecordingScreen - updateRecording() added to db.ts; edits update header title and sport summary without navigating away SavedRecordingsScreen: tapping a card in normal mode navigates to detail; tapping in selection mode still toggles the checkbox.
66 lines
2.7 KiB
TypeScript
66 lines
2.7 KiB
TypeScript
import React from 'react';
|
|
import { NavigationContainer } from '@react-navigation/native';
|
|
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
|
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
|
|
import { Text } from 'react-native';
|
|
|
|
import { RecordingScreen } from '../screens/RecordingScreen';
|
|
import { PostRecordingScreen } from '../screens/PostRecordingScreen';
|
|
import { SensorPairingScreen } from '../screens/SensorPairingScreen';
|
|
import { SavedRecordingsScreen } from '../screens/SavedRecordingsScreen';
|
|
import { SettingsScreen } from '../screens/SettingsScreen';
|
|
import { ActivityDetailScreen } from '../screens/ActivityDetailScreen';
|
|
import { RootStackParamList, TabParamList } from '../types';
|
|
import { colors } from '../theme';
|
|
import { useTheme } from '../ThemeContext';
|
|
|
|
const Stack = createNativeStackNavigator<RootStackParamList>();
|
|
const Tab = createBottomTabNavigator<TabParamList>();
|
|
|
|
const TAB_ICONS: Record<string, string> = {
|
|
Recording: '◉',
|
|
Saved: '☰',
|
|
Settings: '⚙',
|
|
};
|
|
|
|
function Tabs() {
|
|
const { accent } = useTheme();
|
|
return (
|
|
<Tab.Navigator
|
|
screenOptions={({ route }) => ({
|
|
headerStyle: { backgroundColor: colors.bg },
|
|
headerTintColor: colors.text,
|
|
tabBarStyle: { backgroundColor: colors.surface, borderTopColor: colors.border },
|
|
tabBarActiveTintColor: accent,
|
|
tabBarInactiveTintColor: colors.textMuted,
|
|
tabBarIcon: ({ color }) => (
|
|
<Text style={{ color, fontSize: 18 }}>{TAB_ICONS[route.name]}</Text>
|
|
),
|
|
})}
|
|
>
|
|
<Tab.Screen name="Recording" component={RecordingScreen} />
|
|
<Tab.Screen name="Saved" component={SavedRecordingsScreen} />
|
|
<Tab.Screen name="Settings" component={SettingsScreen} />
|
|
</Tab.Navigator>
|
|
);
|
|
}
|
|
|
|
export function AppNavigator() {
|
|
return (
|
|
<NavigationContainer>
|
|
<Stack.Navigator
|
|
screenOptions={{
|
|
headerStyle: { backgroundColor: colors.bg },
|
|
headerTintColor: colors.text,
|
|
contentStyle: { backgroundColor: colors.bg },
|
|
}}
|
|
>
|
|
<Stack.Screen name="Tabs" component={Tabs} options={{ headerShown: false }} />
|
|
<Stack.Screen name="PostRecording" component={PostRecordingScreen} options={{ title: 'Save Recording', presentation: 'modal' }} />
|
|
<Stack.Screen name="SensorPairing" component={SensorPairingScreen} options={{ title: 'Sensors', presentation: 'modal' }} />
|
|
<Stack.Screen name="ActivityDetail" component={ActivityDetailScreen} options={{ title: '' }} />
|
|
</Stack.Navigator>
|
|
</NavigationContainer>
|
|
);
|
|
}
|