Initialize screen modules lazily (#1763)

* Initialize screen modules lazily

* Use getComponent (thanks @ecreeth for the tip)
zio/stable
dan 2023-10-27 19:06:28 +01:00 committed by GitHub
parent 53afafb04f
commit 7ebf1ed371
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 44 additions and 41 deletions

View File

@ -92,42 +92,42 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
<> <>
<Stack.Screen <Stack.Screen
name="NotFound" name="NotFound"
component={NotFoundScreen} getComponent={() => NotFoundScreen}
options={{title: title('Not Found')}} options={{title: title('Not Found')}}
/> />
<Stack.Screen <Stack.Screen
name="Moderation" name="Moderation"
component={ModerationScreen} getComponent={() => ModerationScreen}
options={{title: title('Moderation')}} options={{title: title('Moderation')}}
/> />
<Stack.Screen <Stack.Screen
name="ModerationMuteLists" name="ModerationMuteLists"
component={ModerationMuteListsScreen} getComponent={() => ModerationMuteListsScreen}
options={{title: title('Mute Lists')}} options={{title: title('Mute Lists')}}
/> />
<Stack.Screen <Stack.Screen
name="ModerationMutedAccounts" name="ModerationMutedAccounts"
component={ModerationMutedAccounts} getComponent={() => ModerationMutedAccounts}
options={{title: title('Muted Accounts')}} options={{title: title('Muted Accounts')}}
/> />
<Stack.Screen <Stack.Screen
name="ModerationBlockedAccounts" name="ModerationBlockedAccounts"
component={ModerationBlockedAccounts} getComponent={() => ModerationBlockedAccounts}
options={{title: title('Blocked Accounts')}} options={{title: title('Blocked Accounts')}}
/> />
<Stack.Screen <Stack.Screen
name="Settings" name="Settings"
component={SettingsScreen} getComponent={() => SettingsScreen}
options={{title: title('Settings')}} options={{title: title('Settings')}}
/> />
<Stack.Screen <Stack.Screen
name="LanguageSettings" name="LanguageSettings"
component={LanguageSettingsScreen} getComponent={() => LanguageSettingsScreen}
options={{title: title('Language Settings')}} options={{title: title('Language Settings')}}
/> />
<Stack.Screen <Stack.Screen
name="Profile" name="Profile"
component={ProfileScreen} getComponent={() => ProfileScreen}
options={({route}) => ({ options={({route}) => ({
title: title(`@${route.params.name}`), title: title(`@${route.params.name}`),
animation: 'none', animation: 'none',
@ -135,101 +135,101 @@ function commonScreens(Stack: typeof HomeTab, unreadCountLabel?: string) {
/> />
<Stack.Screen <Stack.Screen
name="ProfileFollowers" name="ProfileFollowers"
component={ProfileFollowersScreen} getComponent={() => ProfileFollowersScreen}
options={({route}) => ({ options={({route}) => ({
title: title(`People following @${route.params.name}`), title: title(`People following @${route.params.name}`),
})} })}
/> />
<Stack.Screen <Stack.Screen
name="ProfileFollows" name="ProfileFollows"
component={ProfileFollowsScreen} getComponent={() => ProfileFollowsScreen}
options={({route}) => ({ options={({route}) => ({
title: title(`People followed by @${route.params.name}`), title: title(`People followed by @${route.params.name}`),
})} })}
/> />
<Stack.Screen <Stack.Screen
name="ProfileList" name="ProfileList"
component={ProfileListScreen} getComponent={() => ProfileListScreen}
options={{title: title('Mute List')}} options={{title: title('Mute List')}}
/> />
<Stack.Screen <Stack.Screen
name="PostThread" name="PostThread"
component={PostThreadScreen} getComponent={() => PostThreadScreen}
options={({route}) => ({title: title(`Post by @${route.params.name}`)})} options={({route}) => ({title: title(`Post by @${route.params.name}`)})}
/> />
<Stack.Screen <Stack.Screen
name="PostLikedBy" name="PostLikedBy"
component={PostLikedByScreen} getComponent={() => PostLikedByScreen}
options={({route}) => ({title: title(`Post by @${route.params.name}`)})} options={({route}) => ({title: title(`Post by @${route.params.name}`)})}
/> />
<Stack.Screen <Stack.Screen
name="PostRepostedBy" name="PostRepostedBy"
component={PostRepostedByScreen} getComponent={() => PostRepostedByScreen}
options={({route}) => ({title: title(`Post by @${route.params.name}`)})} options={({route}) => ({title: title(`Post by @${route.params.name}`)})}
/> />
<Stack.Screen <Stack.Screen
name="CustomFeed" name="CustomFeed"
component={CustomFeedScreen} getComponent={() => CustomFeedScreen}
options={{title: title('Feed')}} options={{title: title('Feed')}}
/> />
<Stack.Screen <Stack.Screen
name="CustomFeedLikedBy" name="CustomFeedLikedBy"
component={CustomFeedLikedByScreen} getComponent={() => CustomFeedLikedByScreen}
options={{title: title('Liked by')}} options={{title: title('Liked by')}}
/> />
<Stack.Screen <Stack.Screen
name="Debug" name="Debug"
component={DebugScreen} getComponent={() => DebugScreen}
options={{title: title('Debug')}} options={{title: title('Debug')}}
/> />
<Stack.Screen <Stack.Screen
name="Log" name="Log"
component={LogScreen} getComponent={() => LogScreen}
options={{title: title('Log')}} options={{title: title('Log')}}
/> />
<Stack.Screen <Stack.Screen
name="Support" name="Support"
component={SupportScreen} getComponent={() => SupportScreen}
options={{title: title('Support')}} options={{title: title('Support')}}
/> />
<Stack.Screen <Stack.Screen
name="PrivacyPolicy" name="PrivacyPolicy"
component={PrivacyPolicyScreen} getComponent={() => PrivacyPolicyScreen}
options={{title: title('Privacy Policy')}} options={{title: title('Privacy Policy')}}
/> />
<Stack.Screen <Stack.Screen
name="TermsOfService" name="TermsOfService"
component={TermsOfServiceScreen} getComponent={() => TermsOfServiceScreen}
options={{title: title('Terms of Service')}} options={{title: title('Terms of Service')}}
/> />
<Stack.Screen <Stack.Screen
name="CommunityGuidelines" name="CommunityGuidelines"
component={CommunityGuidelinesScreen} getComponent={() => CommunityGuidelinesScreen}
options={{title: title('Community Guidelines')}} options={{title: title('Community Guidelines')}}
/> />
<Stack.Screen <Stack.Screen
name="CopyrightPolicy" name="CopyrightPolicy"
component={CopyrightPolicyScreen} getComponent={() => CopyrightPolicyScreen}
options={{title: title('Copyright Policy')}} options={{title: title('Copyright Policy')}}
/> />
<Stack.Screen <Stack.Screen
name="AppPasswords" name="AppPasswords"
component={AppPasswords} getComponent={() => AppPasswords}
options={{title: title('App Passwords')}} options={{title: title('App Passwords')}}
/> />
<Stack.Screen <Stack.Screen
name="SavedFeeds" name="SavedFeeds"
component={SavedFeeds} getComponent={() => SavedFeeds}
options={{title: title('Edit My Feeds')}} options={{title: title('Edit My Feeds')}}
/> />
<Stack.Screen <Stack.Screen
name="PreferencesHomeFeed" name="PreferencesHomeFeed"
component={PreferencesHomeFeed} getComponent={() => PreferencesHomeFeed}
options={{title: title('Home Feed Preferences')}} options={{title: title('Home Feed Preferences')}}
/> />
<Stack.Screen <Stack.Screen
name="PreferencesThreads" name="PreferencesThreads"
component={PreferencesThreads} getComponent={() => PreferencesThreads}
options={{title: title('Threads Preferences')}} options={{title: title('Threads Preferences')}}
/> />
</> </>
@ -254,14 +254,17 @@ function TabsNavigator() {
backBehavior="initialRoute" backBehavior="initialRoute"
screenOptions={{headerShown: false, lazy: true}} screenOptions={{headerShown: false, lazy: true}}
tabBar={tabBar}> tabBar={tabBar}>
<Tab.Screen name="HomeTab" component={HomeTabNavigator} /> <Tab.Screen name="HomeTab" getComponent={() => HomeTabNavigator} />
<Tab.Screen name="SearchTab" component={SearchTabNavigator} /> <Tab.Screen name="SearchTab" getComponent={() => SearchTabNavigator} />
<Tab.Screen name="FeedsTab" component={FeedsTabNavigator} /> <Tab.Screen name="FeedsTab" getComponent={() => FeedsTabNavigator} />
<Tab.Screen <Tab.Screen
name="NotificationsTab" name="NotificationsTab"
component={NotificationsTabNavigator} getComponent={() => NotificationsTabNavigator}
/>
<Tab.Screen
name="MyProfileTab"
getComponent={() => MyProfileTabNavigator}
/> />
<Tab.Screen name="MyProfileTab" component={MyProfileTabNavigator} />
</Tab.Navigator> </Tab.Navigator>
) )
} }
@ -278,7 +281,7 @@ function HomeTabNavigator() {
animationDuration: 250, animationDuration: 250,
contentStyle, contentStyle,
}}> }}>
<HomeTab.Screen name="Home" component={HomeScreen} /> <HomeTab.Screen name="Home" getComponent={() => HomeScreen} />
{commonScreens(HomeTab)} {commonScreens(HomeTab)}
</HomeTab.Navigator> </HomeTab.Navigator>
) )
@ -295,7 +298,7 @@ function SearchTabNavigator() {
animationDuration: 250, animationDuration: 250,
contentStyle, contentStyle,
}}> }}>
<SearchTab.Screen name="Search" component={SearchScreen} /> <SearchTab.Screen name="Search" getComponent={() => SearchScreen} />
{commonScreens(SearchTab as typeof HomeTab)} {commonScreens(SearchTab as typeof HomeTab)}
</SearchTab.Navigator> </SearchTab.Navigator>
) )
@ -312,7 +315,7 @@ function FeedsTabNavigator() {
animationDuration: 250, animationDuration: 250,
contentStyle, contentStyle,
}}> }}>
<FeedsTab.Screen name="Feeds" component={FeedsScreen} /> <FeedsTab.Screen name="Feeds" getComponent={() => FeedsScreen} />
{commonScreens(FeedsTab as typeof HomeTab)} {commonScreens(FeedsTab as typeof HomeTab)}
</FeedsTab.Navigator> </FeedsTab.Navigator>
) )
@ -331,7 +334,7 @@ function NotificationsTabNavigator() {
}}> }}>
<NotificationsTab.Screen <NotificationsTab.Screen
name="Notifications" name="Notifications"
component={NotificationsScreen} getComponent={() => NotificationsScreen}
/> />
{commonScreens(NotificationsTab as typeof HomeTab)} {commonScreens(NotificationsTab as typeof HomeTab)}
</NotificationsTab.Navigator> </NotificationsTab.Navigator>
@ -353,7 +356,7 @@ const MyProfileTabNavigator = observer(function MyProfileTabNavigatorImpl() {
<MyProfileTab.Screen <MyProfileTab.Screen
name="MyProfile" name="MyProfile"
// @ts-ignore // TODO: fix this broken type in ProfileScreen // @ts-ignore // TODO: fix this broken type in ProfileScreen
component={ProfileScreen} getComponent={() => ProfileScreen}
initialParams={{ initialParams={{
name: store.me.did, name: store.me.did,
}} }}
@ -384,22 +387,22 @@ const FlatNavigator = observer(function FlatNavigatorImpl() {
}}> }}>
<Flat.Screen <Flat.Screen
name="Home" name="Home"
component={HomeScreen} getComponent={() => HomeScreen}
options={{title: title('Home')}} options={{title: title('Home')}}
/> />
<Flat.Screen <Flat.Screen
name="Search" name="Search"
component={SearchScreen} getComponent={() => SearchScreen}
options={{title: title('Search')}} options={{title: title('Search')}}
/> />
<Flat.Screen <Flat.Screen
name="Feeds" name="Feeds"
component={FeedsScreen} getComponent={() => FeedsScreen}
options={{title: title('Feeds')}} options={{title: title('Feeds')}}
/> />
<Flat.Screen <Flat.Screen
name="Notifications" name="Notifications"
component={NotificationsScreen} getComponent={() => NotificationsScreen}
options={{title: title('Notifications')}} options={{title: title('Notifications')}}
/> />
{commonScreens(Flat as typeof HomeTab, unreadCountLabel)} {commonScreens(Flat as typeof HomeTab, unreadCountLabel)}