Improve performance of Routes.tsx

This commit is contained in:
Brandon Presley 2023-01-01 18:05:11 +13:00
parent 3c9b93f0bc
commit 80f2dfdff5
1 changed files with 30 additions and 24 deletions

View File

@ -1,11 +1,9 @@
import {createDrawerNavigator} from '@react-navigation/drawer'
import {useMemo} from 'react'
import {IconButton} from 'react-native-paper'
import BestPage from './BestPage'
import {DrawerParamList} from './drawer-param-list'
import HomePage from './HomePage'
import PlanPage from './PlanPage'
import Route from './route'
import SettingsPage from './SettingsPage'
import TimerPage from './TimerPage'
import useDark from './use-dark'
@ -16,18 +14,6 @@ const Drawer = createDrawerNavigator<DrawerParamList>()
export default function Routes() {
const dark = useDark()
const routes: Route[] = useMemo(
() => [
{name: 'Home', component: HomePage, icon: 'home'},
{name: 'Plans', component: PlanPage, icon: 'event'},
{name: 'Best', component: BestPage, icon: 'insights'},
{name: 'Workouts', component: WorkoutsPage, icon: 'fitness-center'},
{name: 'Timer', component: TimerPage, icon: 'access-time'},
{name: 'Settings', component: SettingsPage, icon: 'settings'},
],
[],
)
return (
<Drawer.Navigator
screenOptions={{
@ -35,16 +21,36 @@ export default function Routes() {
swipeEdgeWidth: 1000,
headerShown: false,
}}>
{routes.map(route => (
<Drawer.Screen
key={route.name}
name={route.name}
component={route.component}
options={{
drawerIcon: () => <IconButton icon={route.icon} />,
}}
/>
))}
<Drawer.Screen
name="Home"
component={HomePage}
options={{drawerIcon: () => <IconButton icon="home" />}}
/>
<Drawer.Screen
name="Plans"
component={PlanPage}
options={{drawerIcon: () => <IconButton icon="event" />}}
/>
<Drawer.Screen
name="Best"
component={BestPage}
options={{drawerIcon: () => <IconButton icon="insights" />}}
/>
<Drawer.Screen
name="Workouts"
component={WorkoutsPage}
options={{drawerIcon: () => <IconButton icon="fitness-center" />}}
/>
<Drawer.Screen
name="Timer"
component={TimerPage}
options={{drawerIcon: () => <IconButton icon="access-time" />}}
/>
<Drawer.Screen
name="Settings"
component={SettingsPage}
options={{drawerIcon: () => <IconButton icon="settings" />}}
/>
</Drawer.Navigator>
)
}