124 lines
3.9 KiB
TypeScript
124 lines
3.9 KiB
TypeScript
import React from 'react';
|
|
import { NavigationContainer, DefaultTheme } from '@react-navigation/native';
|
|
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
|
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
|
|
import { Home, Calendar, Settings } from 'lucide-react-native';
|
|
|
|
import { HomeScreen } from '../screens/HomeScreen';
|
|
import { ProfileScreen } from '../screens/ProfileScreen';
|
|
import { AppointmentsScreen } from '../screens/AppointmentsScreen';
|
|
import { SettingsScreen } from '../screens/SettingsScreen';
|
|
import { LoginScreen } from '../screens/LoginScreen';
|
|
import { PersonalInformationScreen } from '../screens/PersonalInformationScreen';
|
|
import { ManageSkillsScreen } from '../screens/ManageSkillsScreen';
|
|
import { AddSkillScreen } from '../screens/AddSkillScreen';
|
|
import { AvailabilityListScreen } from '../screens/AvailabilityListScreen';
|
|
import { AddAvailabilityScreen } from '../screens/AddAvailabilityScreen';
|
|
import { EditAvailabilityScreen } from '../screens/EditAvailabilityScreen';
|
|
|
|
export type RootStackParamList = {
|
|
Login: undefined;
|
|
MainTabs: undefined;
|
|
Profile: { caregiverId: string };
|
|
PersonalInformation: undefined;
|
|
ManageSkills: undefined;
|
|
AddSkill: undefined;
|
|
AvailabilityList: undefined;
|
|
AddAvailability: undefined;
|
|
EditAvailability: {
|
|
day_of_week: string;
|
|
start_time: string;
|
|
end_time: string;
|
|
};
|
|
};
|
|
|
|
export type TabParamList = {
|
|
HomeTab: undefined;
|
|
Appointments: undefined;
|
|
Settings: undefined;
|
|
};
|
|
|
|
const Stack = createNativeStackNavigator<RootStackParamList>();
|
|
const Tab = createBottomTabNavigator<TabParamList>();
|
|
|
|
function MainTabs() {
|
|
return (
|
|
<Tab.Navigator
|
|
id={undefined}
|
|
screenOptions={{
|
|
headerShown: false,
|
|
tabBarStyle: {
|
|
backgroundColor: '#FFFFFF',
|
|
borderTopWidth: 0,
|
|
elevation: 0,
|
|
shadowOpacity: 0,
|
|
height: 60,
|
|
paddingBottom: 8,
|
|
paddingTop: 8,
|
|
},
|
|
tabBarActiveTintColor: 'navy', // Primary color
|
|
tabBarInactiveTintColor: '#9CA3AF',
|
|
}}
|
|
>
|
|
<Tab.Screen
|
|
name="HomeTab"
|
|
component={HomeScreen}
|
|
options={{
|
|
tabBarLabel: 'Home',
|
|
tabBarIcon: ({ color, size }) => <Home color={color} size={size} />,
|
|
}}
|
|
/>
|
|
<Tab.Screen
|
|
name="Appointments"
|
|
component={AppointmentsScreen}
|
|
options={{
|
|
tabBarLabel: 'Appointments',
|
|
tabBarIcon: ({ color, size }) => <Calendar color={color} size={size} />,
|
|
}}
|
|
/>
|
|
<Tab.Screen
|
|
name="Settings"
|
|
component={SettingsScreen}
|
|
options={{
|
|
tabBarLabel: 'Settings',
|
|
tabBarIcon: ({ color, size }) => <Settings color={color} size={size} />,
|
|
}}
|
|
/>
|
|
</Tab.Navigator>
|
|
);
|
|
}
|
|
|
|
|
|
const MyTheme = {
|
|
...DefaultTheme,
|
|
colors: {
|
|
...DefaultTheme.colors,
|
|
background: '#F9FAFB',
|
|
},
|
|
};
|
|
|
|
export const AppNavigator = () => {
|
|
return (
|
|
<NavigationContainer theme={MyTheme}>
|
|
<Stack.Navigator
|
|
id={undefined}
|
|
initialRouteName="Login"
|
|
screenOptions={{
|
|
headerShown: false,
|
|
contentStyle: { backgroundColor: '#F9FAFB' }
|
|
}}
|
|
>
|
|
<Stack.Screen name="Login" component={LoginScreen} />
|
|
<Stack.Screen name="MainTabs" component={MainTabs} />
|
|
<Stack.Screen name="Profile" component={ProfileScreen} />
|
|
<Stack.Screen name="PersonalInformation" component={PersonalInformationScreen} />
|
|
<Stack.Screen name="ManageSkills" component={ManageSkillsScreen} />
|
|
<Stack.Screen name="AddSkill" component={AddSkillScreen} />
|
|
<Stack.Screen name="AvailabilityList" component={AvailabilityListScreen} />
|
|
<Stack.Screen name="AddAvailability" component={AddAvailabilityScreen} />
|
|
<Stack.Screen name="EditAvailability" component={EditAvailabilityScreen} />
|
|
</Stack.Navigator>
|
|
</NavigationContainer>
|
|
);
|
|
};
|