forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 馃挮
1import {type JSX, useCallback, useRef} from 'react'
2import {Linking} from 'react-native'
3import * as Notifications from 'expo-notifications'
4import {i18n, type MessageDescriptor} from '@lingui/core'
5import {msg} from '@lingui/macro'
6import {
7 type BottomTabBarProps,
8 createBottomTabNavigator,
9} from '@react-navigation/bottom-tabs'
10import {
11 CommonActions,
12 createNavigationContainerRef,
13 DarkTheme,
14 DefaultTheme,
15 type LinkingOptions,
16 NavigationContainer,
17 StackActions,
18} from '@react-navigation/native'
19
20import {timeout} from '#/lib/async/timeout'
21import {useAccountSwitcher} from '#/lib/hooks/useAccountSwitcher'
22import {useColorSchemeStyle} from '#/lib/hooks/useColorSchemeStyle'
23import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
24import {
25 getNotificationPayload,
26 type NotificationPayload,
27 notificationToURL,
28 storePayloadForAccountSwitch,
29} from '#/lib/hooks/useNotificationHandler'
30import {useWebScrollRestoration} from '#/lib/hooks/useWebScrollRestoration'
31import {logger as notyLogger} from '#/lib/notifications/util'
32import {buildStateObject} from '#/lib/routes/helpers'
33import {
34 type AllNavigatorParams,
35 type BottomTabNavigatorParams,
36 type FlatNavigatorParams,
37 type HomeTabNavigatorParams,
38 type MessagesTabNavigatorParams,
39 type MyProfileTabNavigatorParams,
40 type NotificationsTabNavigatorParams,
41 type SearchTabNavigatorParams,
42} from '#/lib/routes/types'
43import {type RouteParams, type State} from '#/lib/routes/types'
44import {attachRouteToLogEvents, logEvent} from '#/lib/statsig/statsig'
45import {bskyTitle} from '#/lib/strings/headings'
46import {logger} from '#/logger'
47import {isNative, isWeb} from '#/platform/detection'
48import {useUnreadNotifications} from '#/state/queries/notifications/unread'
49import {useSession} from '#/state/session'
50import {useLoggedOutViewControls} from '#/state/shell/logged-out'
51import {
52 shouldRequestEmailConfirmation,
53 snoozeEmailConfirmationPrompt,
54} from '#/state/shell/reminders'
55import {useCloseAllActiveElements} from '#/state/util'
56import {CommunityGuidelinesScreen} from '#/view/screens/CommunityGuidelines'
57import {CopyrightPolicyScreen} from '#/view/screens/CopyrightPolicy'
58import {DebugModScreen} from '#/view/screens/DebugMod'
59import {FeedsScreen} from '#/view/screens/Feeds'
60import {HomeScreen} from '#/view/screens/Home'
61import {ListsScreen} from '#/view/screens/Lists'
62import {ModerationBlockedAccounts} from '#/view/screens/ModerationBlockedAccounts'
63import {ModerationModlistsScreen} from '#/view/screens/ModerationModlists'
64import {ModerationMutedAccounts} from '#/view/screens/ModerationMutedAccounts'
65import {NotFoundScreen} from '#/view/screens/NotFound'
66import {NotificationsScreen} from '#/view/screens/Notifications'
67import {PostThreadScreen} from '#/view/screens/PostThread'
68import {PrivacyPolicyScreen} from '#/view/screens/PrivacyPolicy'
69import {ProfileScreen} from '#/view/screens/Profile'
70import {ProfileFeedLikedByScreen} from '#/view/screens/ProfileFeedLikedBy'
71import {Storybook} from '#/view/screens/Storybook'
72import {SupportScreen} from '#/view/screens/Support'
73import {TermsOfServiceScreen} from '#/view/screens/TermsOfService'
74import {BottomBar} from '#/view/shell/bottom-bar/BottomBar'
75import {createNativeStackNavigatorWithAuth} from '#/view/shell/createNativeStackNavigatorWithAuth'
76import {BookmarksScreen} from '#/screens/Bookmarks'
77import {SharedPreferencesTesterScreen} from '#/screens/E2E/SharedPreferencesTesterScreen'
78import {FindContactsFlowScreen} from '#/screens/FindContactsFlowScreen'
79import HashtagScreen from '#/screens/Hashtag'
80import {LogScreen} from '#/screens/Log'
81import {MessagesScreen} from '#/screens/Messages/ChatList'
82import {MessagesConversationScreen} from '#/screens/Messages/Conversation'
83import {MessagesInboxScreen} from '#/screens/Messages/Inbox'
84import {MessagesSettingsScreen} from '#/screens/Messages/Settings'
85import {ModerationScreen} from '#/screens/Moderation'
86import {Screen as ModerationVerificationSettings} from '#/screens/Moderation/VerificationSettings'
87import {Screen as ModerationInteractionSettings} from '#/screens/ModerationInteractionSettings'
88import {NotificationsActivityListScreen} from '#/screens/Notifications/ActivityList'
89import {PostLikedByScreen} from '#/screens/Post/PostLikedBy'
90import {PostQuotesScreen} from '#/screens/Post/PostQuotes'
91import {PostRepostedByScreen} from '#/screens/Post/PostRepostedBy'
92import {ProfileKnownFollowersScreen} from '#/screens/Profile/KnownFollowers'
93import {ProfileFeedScreen} from '#/screens/Profile/ProfileFeed'
94import {ProfileFollowersScreen} from '#/screens/Profile/ProfileFollowers'
95import {ProfileFollowsScreen} from '#/screens/Profile/ProfileFollows'
96import {ProfileLabelerLikedByScreen} from '#/screens/Profile/ProfileLabelerLikedBy'
97import {ProfileSearchScreen} from '#/screens/Profile/ProfileSearch'
98import {ProfileListScreen} from '#/screens/ProfileList'
99import {SavedFeeds} from '#/screens/SavedFeeds'
100import {SearchScreen} from '#/screens/Search'
101import {AboutSettingsScreen} from '#/screens/Settings/AboutSettings'
102import {AccessibilitySettingsScreen} from '#/screens/Settings/AccessibilitySettings'
103import {AccountSettingsScreen} from '#/screens/Settings/AccountSettings'
104import {ActivityPrivacySettingsScreen} from '#/screens/Settings/ActivityPrivacySettings'
105import {AppearanceSettingsScreen} from '#/screens/Settings/AppearanceSettings'
106import {AppIconSettingsScreen} from '#/screens/Settings/AppIconSettings'
107import {AppPasswordsScreen} from '#/screens/Settings/AppPasswords'
108import {ContentAndMediaSettingsScreen} from '#/screens/Settings/ContentAndMediaSettings'
109import {ExternalMediaPreferencesScreen} from '#/screens/Settings/ExternalMediaPreferences'
110import {FindContactsSettingsScreen} from '#/screens/Settings/FindContactsSettings'
111import {FollowingFeedPreferencesScreen} from '#/screens/Settings/FollowingFeedPreferences'
112import {InterestsSettingsScreen} from '#/screens/Settings/InterestsSettings'
113import {LanguageSettingsScreen} from '#/screens/Settings/LanguageSettings'
114import {LegacyNotificationSettingsScreen} from '#/screens/Settings/LegacyNotificationSettings'
115import {NotificationSettingsScreen} from '#/screens/Settings/NotificationSettings'
116import {ActivityNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/ActivityNotificationSettings'
117import {LikeNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/LikeNotificationSettings'
118import {LikesOnRepostsNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/LikesOnRepostsNotificationSettings'
119import {MentionNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/MentionNotificationSettings'
120import {MiscellaneousNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/MiscellaneousNotificationSettings'
121import {NewFollowerNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/NewFollowerNotificationSettings'
122import {QuoteNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/QuoteNotificationSettings'
123import {ReplyNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/ReplyNotificationSettings'
124import {RepostNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/RepostNotificationSettings'
125import {RepostsOnRepostsNotificationSettingsScreen} from '#/screens/Settings/NotificationSettings/RepostsOnRepostsNotificationSettings'
126import {PrivacyAndSecuritySettingsScreen} from '#/screens/Settings/PrivacyAndSecuritySettings'
127import {SettingsScreen} from '#/screens/Settings/Settings'
128import {ThreadPreferencesScreen} from '#/screens/Settings/ThreadPreferences'
129import {
130 StarterPackScreen,
131 StarterPackScreenShort,
132} from '#/screens/StarterPack/StarterPackScreen'
133import {Wizard} from '#/screens/StarterPack/Wizard'
134import TopicScreen from '#/screens/Topic'
135import {VideoFeed} from '#/screens/VideoFeed'
136import {type Theme, useTheme} from '#/alf'
137import {
138 EmailDialogScreenID,
139 useEmailDialogControl,
140} from '#/components/dialogs/EmailDialog'
141import {router} from '#/routes'
142import {Referrer} from '../modules/expo-bluesky-swiss-army'
143
144const navigationRef = createNavigationContainerRef<AllNavigatorParams>()
145
146const HomeTab = createNativeStackNavigatorWithAuth<HomeTabNavigatorParams>()
147const SearchTab = createNativeStackNavigatorWithAuth<SearchTabNavigatorParams>()
148const NotificationsTab =
149 createNativeStackNavigatorWithAuth<NotificationsTabNavigatorParams>()
150const MyProfileTab =
151 createNativeStackNavigatorWithAuth<MyProfileTabNavigatorParams>()
152const MessagesTab =
153 createNativeStackNavigatorWithAuth<MessagesTabNavigatorParams>()
154const Flat = createNativeStackNavigatorWithAuth<FlatNavigatorParams>()
155const Tab = createBottomTabNavigator<BottomTabNavigatorParams>()
156
157/**
158 * These "common screens" are reused across stacks.
159 */
160function commonScreens(Stack: typeof Flat, unreadCountLabel?: string) {
161 const title = (page: MessageDescriptor) =>
162 bskyTitle(i18n._(page), unreadCountLabel)
163
164 return (
165 <>
166 <Stack.Screen
167 name="NotFound"
168 getComponent={() => NotFoundScreen}
169 options={{title: title(msg`Not Found`)}}
170 />
171 <Stack.Screen
172 name="Lists"
173 component={ListsScreen}
174 options={{title: title(msg`Lists`), requireAuth: true}}
175 />
176 <Stack.Screen
177 name="Moderation"
178 getComponent={() => ModerationScreen}
179 options={{title: title(msg`Moderation`), requireAuth: true}}
180 />
181 <Stack.Screen
182 name="ModerationModlists"
183 getComponent={() => ModerationModlistsScreen}
184 options={{title: title(msg`Moderation Lists`), requireAuth: true}}
185 />
186 <Stack.Screen
187 name="ModerationMutedAccounts"
188 getComponent={() => ModerationMutedAccounts}
189 options={{title: title(msg`Muted Accounts`), requireAuth: true}}
190 />
191 <Stack.Screen
192 name="ModerationBlockedAccounts"
193 getComponent={() => ModerationBlockedAccounts}
194 options={{title: title(msg`Blocked Accounts`), requireAuth: true}}
195 />
196 <Stack.Screen
197 name="ModerationInteractionSettings"
198 getComponent={() => ModerationInteractionSettings}
199 options={{
200 title: title(msg`Post Interaction Settings`),
201 requireAuth: true,
202 }}
203 />
204 <Stack.Screen
205 name="ModerationVerificationSettings"
206 getComponent={() => ModerationVerificationSettings}
207 options={{
208 title: title(msg`Verification Settings`),
209 requireAuth: true,
210 }}
211 />
212 <Stack.Screen
213 name="Settings"
214 getComponent={() => SettingsScreen}
215 options={{title: title(msg`Settings`), requireAuth: true}}
216 />
217 <Stack.Screen
218 name="LanguageSettings"
219 getComponent={() => LanguageSettingsScreen}
220 options={{title: title(msg`Language Settings`), requireAuth: true}}
221 />
222 <Stack.Screen
223 name="Profile"
224 getComponent={() => ProfileScreen}
225 options={({route}) => ({
226 title: bskyTitle(`@${route.params.name}`, unreadCountLabel),
227 })}
228 />
229 <Stack.Screen
230 name="ProfileFollowers"
231 getComponent={() => ProfileFollowersScreen}
232 options={({route}) => ({
233 title: title(msg`People following @${route.params.name}`),
234 })}
235 />
236 <Stack.Screen
237 name="ProfileFollows"
238 getComponent={() => ProfileFollowsScreen}
239 options={({route}) => ({
240 title: title(msg`People followed by @${route.params.name}`),
241 })}
242 />
243 <Stack.Screen
244 name="ProfileKnownFollowers"
245 getComponent={() => ProfileKnownFollowersScreen}
246 options={({route}) => ({
247 title: title(msg`Followers of @${route.params.name} that you know`),
248 })}
249 />
250 <Stack.Screen
251 name="ProfileList"
252 getComponent={() => ProfileListScreen}
253 options={{title: title(msg`List`), requireAuth: true}}
254 />
255 <Stack.Screen
256 name="ProfileSearch"
257 getComponent={() => ProfileSearchScreen}
258 options={({route}) => ({
259 title: title(msg`Search @${route.params.name}'s posts`),
260 })}
261 />
262 <Stack.Screen
263 name="PostThread"
264 getComponent={() => PostThreadScreen}
265 options={({route}) => ({
266 title: title(msg`Post by @${route.params.name}`),
267 })}
268 />
269 <Stack.Screen
270 name="PostLikedBy"
271 getComponent={() => PostLikedByScreen}
272 options={({route}) => ({
273 title: title(msg`Post by @${route.params.name}`),
274 })}
275 />
276 <Stack.Screen
277 name="PostRepostedBy"
278 getComponent={() => PostRepostedByScreen}
279 options={({route}) => ({
280 title: title(msg`Post by @${route.params.name}`),
281 })}
282 />
283 <Stack.Screen
284 name="PostQuotes"
285 getComponent={() => PostQuotesScreen}
286 options={({route}) => ({
287 title: title(msg`Post by @${route.params.name}`),
288 })}
289 />
290 <Stack.Screen
291 name="ProfileFeed"
292 getComponent={() => ProfileFeedScreen}
293 options={{title: title(msg`Feed`)}}
294 />
295 <Stack.Screen
296 name="ProfileFeedLikedBy"
297 getComponent={() => ProfileFeedLikedByScreen}
298 options={{title: title(msg`Liked by`)}}
299 />
300 <Stack.Screen
301 name="ProfileLabelerLikedBy"
302 getComponent={() => ProfileLabelerLikedByScreen}
303 options={{title: title(msg`Liked by`)}}
304 />
305 <Stack.Screen
306 name="Debug"
307 getComponent={() => Storybook}
308 options={{title: title(msg`Storybook`), requireAuth: true}}
309 />
310 <Stack.Screen
311 name="DebugMod"
312 getComponent={() => DebugModScreen}
313 options={{title: title(msg`Moderation states`), requireAuth: true}}
314 />
315 <Stack.Screen
316 name="SharedPreferencesTester"
317 getComponent={() => SharedPreferencesTesterScreen}
318 options={{title: title(msg`Shared Preferences Tester`)}}
319 />
320 <Stack.Screen
321 name="Log"
322 getComponent={() => LogScreen}
323 options={{title: title(msg`Log`), requireAuth: true}}
324 />
325 <Stack.Screen
326 name="Support"
327 getComponent={() => SupportScreen}
328 options={{title: title(msg`Support`)}}
329 />
330 <Stack.Screen
331 name="PrivacyPolicy"
332 getComponent={() => PrivacyPolicyScreen}
333 options={{title: title(msg`Privacy Policy`)}}
334 />
335 <Stack.Screen
336 name="TermsOfService"
337 getComponent={() => TermsOfServiceScreen}
338 options={{title: title(msg`Terms of Service`)}}
339 />
340 <Stack.Screen
341 name="CommunityGuidelines"
342 getComponent={() => CommunityGuidelinesScreen}
343 options={{title: title(msg`Community Guidelines`)}}
344 />
345 <Stack.Screen
346 name="CopyrightPolicy"
347 getComponent={() => CopyrightPolicyScreen}
348 options={{title: title(msg`Copyright Policy`)}}
349 />
350 <Stack.Screen
351 name="AppPasswords"
352 getComponent={() => AppPasswordsScreen}
353 options={{title: title(msg`App Passwords`), requireAuth: true}}
354 />
355 <Stack.Screen
356 name="SavedFeeds"
357 getComponent={() => SavedFeeds}
358 options={{title: title(msg`Edit My Feeds`), requireAuth: true}}
359 />
360 <Stack.Screen
361 name="PreferencesFollowingFeed"
362 getComponent={() => FollowingFeedPreferencesScreen}
363 options={{
364 title: title(msg`Following Feed Preferences`),
365 requireAuth: true,
366 }}
367 />
368 <Stack.Screen
369 name="PreferencesThreads"
370 getComponent={() => ThreadPreferencesScreen}
371 options={{title: title(msg`Threads Preferences`), requireAuth: true}}
372 />
373 <Stack.Screen
374 name="PreferencesExternalEmbeds"
375 getComponent={() => ExternalMediaPreferencesScreen}
376 options={{
377 title: title(msg`External Media Preferences`),
378 requireAuth: true,
379 }}
380 />
381 <Stack.Screen
382 name="AccessibilitySettings"
383 getComponent={() => AccessibilitySettingsScreen}
384 options={{
385 title: title(msg`Accessibility Settings`),
386 requireAuth: true,
387 }}
388 />
389 <Stack.Screen
390 name="AppearanceSettings"
391 getComponent={() => AppearanceSettingsScreen}
392 options={{
393 title: title(msg`Appearance`),
394 requireAuth: true,
395 }}
396 />
397 <Stack.Screen
398 name="AccountSettings"
399 getComponent={() => AccountSettingsScreen}
400 options={{
401 title: title(msg`Account`),
402 requireAuth: true,
403 }}
404 />
405 <Stack.Screen
406 name="PrivacyAndSecuritySettings"
407 getComponent={() => PrivacyAndSecuritySettingsScreen}
408 options={{
409 title: title(msg`Privacy and Security`),
410 requireAuth: true,
411 }}
412 />
413 <Stack.Screen
414 name="ActivityPrivacySettings"
415 getComponent={() => ActivityPrivacySettingsScreen}
416 options={{
417 title: title(msg`Privacy and Security`),
418 requireAuth: true,
419 }}
420 />
421 <Stack.Screen
422 name="FindContactsSettings"
423 getComponent={() => FindContactsSettingsScreen}
424 options={{
425 title: title(msg`Find Contacts`),
426 requireAuth: true,
427 }}
428 />
429 <Stack.Screen
430 name="NotificationSettings"
431 getComponent={() => NotificationSettingsScreen}
432 options={{title: title(msg`Notification settings`), requireAuth: true}}
433 />
434 <Stack.Screen
435 name="ReplyNotificationSettings"
436 getComponent={() => ReplyNotificationSettingsScreen}
437 options={{
438 title: title(msg`Reply notifications`),
439 requireAuth: true,
440 }}
441 />
442 <Stack.Screen
443 name="MentionNotificationSettings"
444 getComponent={() => MentionNotificationSettingsScreen}
445 options={{
446 title: title(msg`Mention notifications`),
447 requireAuth: true,
448 }}
449 />
450 <Stack.Screen
451 name="QuoteNotificationSettings"
452 getComponent={() => QuoteNotificationSettingsScreen}
453 options={{
454 title: title(msg`Quote notifications`),
455 requireAuth: true,
456 }}
457 />
458 <Stack.Screen
459 name="LikeNotificationSettings"
460 getComponent={() => LikeNotificationSettingsScreen}
461 options={{
462 title: title(msg`Like notifications`),
463 requireAuth: true,
464 }}
465 />
466 <Stack.Screen
467 name="RepostNotificationSettings"
468 getComponent={() => RepostNotificationSettingsScreen}
469 options={{
470 title: title(msg`Repost notifications`),
471 requireAuth: true,
472 }}
473 />
474 <Stack.Screen
475 name="NewFollowerNotificationSettings"
476 getComponent={() => NewFollowerNotificationSettingsScreen}
477 options={{
478 title: title(msg`New follower notifications`),
479 requireAuth: true,
480 }}
481 />
482 <Stack.Screen
483 name="LikesOnRepostsNotificationSettings"
484 getComponent={() => LikesOnRepostsNotificationSettingsScreen}
485 options={{
486 title: title(msg`Likes of your reposts notifications`),
487 requireAuth: true,
488 }}
489 />
490 <Stack.Screen
491 name="RepostsOnRepostsNotificationSettings"
492 getComponent={() => RepostsOnRepostsNotificationSettingsScreen}
493 options={{
494 title: title(msg`Reposts of your reposts notifications`),
495 requireAuth: true,
496 }}
497 />
498 <Stack.Screen
499 name="ActivityNotificationSettings"
500 getComponent={() => ActivityNotificationSettingsScreen}
501 options={{
502 title: title(msg`Activity notifications`),
503 requireAuth: true,
504 }}
505 />
506 <Stack.Screen
507 name="MiscellaneousNotificationSettings"
508 getComponent={() => MiscellaneousNotificationSettingsScreen}
509 options={{
510 title: title(msg`Miscellaneous notifications`),
511 requireAuth: true,
512 }}
513 />
514 <Stack.Screen
515 name="ContentAndMediaSettings"
516 getComponent={() => ContentAndMediaSettingsScreen}
517 options={{
518 title: title(msg`Content and Media`),
519 requireAuth: true,
520 }}
521 />
522 <Stack.Screen
523 name="InterestsSettings"
524 getComponent={() => InterestsSettingsScreen}
525 options={{
526 title: title(msg`Your interests`),
527 requireAuth: true,
528 }}
529 />
530 <Stack.Screen
531 name="AboutSettings"
532 getComponent={() => AboutSettingsScreen}
533 options={{
534 title: title(msg`About`),
535 requireAuth: true,
536 }}
537 />
538 <Stack.Screen
539 name="AppIconSettings"
540 getComponent={() => AppIconSettingsScreen}
541 options={{
542 title: title(msg`App Icon`),
543 requireAuth: true,
544 }}
545 />
546 <Stack.Screen
547 name="Hashtag"
548 getComponent={() => HashtagScreen}
549 options={{title: title(msg`Hashtag`)}}
550 />
551 <Stack.Screen
552 name="Topic"
553 getComponent={() => TopicScreen}
554 options={{title: title(msg`Topic`)}}
555 />
556 <Stack.Screen
557 name="MessagesConversation"
558 getComponent={() => MessagesConversationScreen}
559 options={{title: title(msg`Chat`), requireAuth: true}}
560 />
561 <Stack.Screen
562 name="MessagesSettings"
563 getComponent={() => MessagesSettingsScreen}
564 options={{title: title(msg`Chat settings`), requireAuth: true}}
565 />
566 <Stack.Screen
567 name="MessagesInbox"
568 getComponent={() => MessagesInboxScreen}
569 options={{title: title(msg`Chat request inbox`), requireAuth: true}}
570 />
571 <Stack.Screen
572 name="NotificationsActivityList"
573 getComponent={() => NotificationsActivityListScreen}
574 options={{title: title(msg`Notifications`), requireAuth: true}}
575 />
576 <Stack.Screen
577 name="LegacyNotificationSettings"
578 getComponent={() => LegacyNotificationSettingsScreen}
579 options={{title: title(msg`Notification settings`), requireAuth: true}}
580 />
581 <Stack.Screen
582 name="Feeds"
583 getComponent={() => FeedsScreen}
584 options={{title: title(msg`Feeds`)}}
585 />
586 <Stack.Screen
587 name="StarterPack"
588 getComponent={() => StarterPackScreen}
589 options={{title: title(msg`Starter Pack`)}}
590 />
591 <Stack.Screen
592 name="StarterPackShort"
593 getComponent={() => StarterPackScreenShort}
594 options={{title: title(msg`Starter Pack`)}}
595 />
596 <Stack.Screen
597 name="StarterPackWizard"
598 getComponent={() => Wizard}
599 options={{title: title(msg`Create a starter pack`), requireAuth: true}}
600 />
601 <Stack.Screen
602 name="StarterPackEdit"
603 getComponent={() => Wizard}
604 options={{title: title(msg`Edit your starter pack`), requireAuth: true}}
605 />
606 <Stack.Screen
607 name="VideoFeed"
608 getComponent={() => VideoFeed}
609 options={{
610 title: title(msg`Video Feed`),
611 requireAuth: true,
612 }}
613 />
614 <Stack.Screen
615 name="Bookmarks"
616 getComponent={() => BookmarksScreen}
617 options={{
618 title: title(msg`Saved Posts`),
619 requireAuth: true,
620 }}
621 />
622 <Stack.Screen
623 name="FindContactsFlow"
624 getComponent={() => FindContactsFlowScreen}
625 options={{
626 title: title(msg`Find Contacts`),
627 requireAuth: true,
628 gestureEnabled: false,
629 }}
630 />
631 </>
632 )
633}
634
635/**
636 * The TabsNavigator is used by native mobile to represent the routes
637 * in 3 distinct tab-stacks with a different root screen on each.
638 */
639function TabsNavigator() {
640 const tabBar = useCallback(
641 (props: JSX.IntrinsicAttributes & BottomTabBarProps) => (
642 <BottomBar {...props} />
643 ),
644 [],
645 )
646
647 return (
648 <Tab.Navigator
649 initialRouteName="HomeTab"
650 backBehavior="initialRoute"
651 screenOptions={{headerShown: false, lazy: true}}
652 tabBar={tabBar}>
653 <Tab.Screen name="HomeTab" getComponent={() => HomeTabNavigator} />
654 <Tab.Screen name="SearchTab" getComponent={() => SearchTabNavigator} />
655 <Tab.Screen
656 name="MessagesTab"
657 getComponent={() => MessagesTabNavigator}
658 />
659 <Tab.Screen
660 name="NotificationsTab"
661 getComponent={() => NotificationsTabNavigator}
662 />
663 <Tab.Screen
664 name="MyProfileTab"
665 getComponent={() => MyProfileTabNavigator}
666 />
667 </Tab.Navigator>
668 )
669}
670
671function screenOptions(t: Theme) {
672 return {
673 fullScreenGestureEnabled: true,
674 headerShown: false,
675 contentStyle: t.atoms.bg,
676 } as const
677}
678
679function HomeTabNavigator() {
680 const t = useTheme()
681
682 return (
683 <HomeTab.Navigator screenOptions={screenOptions(t)} initialRouteName="Home">
684 <HomeTab.Screen name="Home" getComponent={() => HomeScreen} />
685 <HomeTab.Screen name="Start" getComponent={() => HomeScreen} />
686 {commonScreens(HomeTab as typeof Flat)}
687 </HomeTab.Navigator>
688 )
689}
690
691function SearchTabNavigator() {
692 const t = useTheme()
693 return (
694 <SearchTab.Navigator
695 screenOptions={screenOptions(t)}
696 initialRouteName="Search">
697 <SearchTab.Screen name="Search" getComponent={() => SearchScreen} />
698 {commonScreens(SearchTab as typeof Flat)}
699 </SearchTab.Navigator>
700 )
701}
702
703function NotificationsTabNavigator() {
704 const t = useTheme()
705 return (
706 <NotificationsTab.Navigator
707 screenOptions={screenOptions(t)}
708 initialRouteName="Notifications">
709 <NotificationsTab.Screen
710 name="Notifications"
711 getComponent={() => NotificationsScreen}
712 options={{requireAuth: true}}
713 />
714 {commonScreens(NotificationsTab as typeof Flat)}
715 </NotificationsTab.Navigator>
716 )
717}
718
719function MyProfileTabNavigator() {
720 const t = useTheme()
721 return (
722 <MyProfileTab.Navigator
723 screenOptions={screenOptions(t)}
724 initialRouteName="MyProfile">
725 <MyProfileTab.Screen
726 // MyProfile is not in AllNavigationParams - asserting as Profile at least
727 // gives us typechecking for initialParams -sfn
728 name={'MyProfile' as 'Profile'}
729 getComponent={() => ProfileScreen}
730 initialParams={{name: 'me', hideBackButton: true}}
731 />
732 {commonScreens(MyProfileTab as unknown as typeof Flat)}
733 </MyProfileTab.Navigator>
734 )
735}
736
737function MessagesTabNavigator() {
738 const t = useTheme()
739 return (
740 <MessagesTab.Navigator
741 screenOptions={screenOptions(t)}
742 initialRouteName="Messages">
743 <MessagesTab.Screen
744 name="Messages"
745 getComponent={() => MessagesScreen}
746 options={({route}) => ({
747 requireAuth: true,
748 animationTypeForReplace: route.params?.animation ?? 'push',
749 })}
750 />
751 {commonScreens(MessagesTab as typeof Flat)}
752 </MessagesTab.Navigator>
753 )
754}
755
756/**
757 * The FlatNavigator is used by Web to represent the routes
758 * in a single ("flat") stack.
759 */
760const FlatNavigator = () => {
761 const t = useTheme()
762 const numUnread = useUnreadNotifications()
763 const screenListeners = useWebScrollRestoration()
764 const title = (page: MessageDescriptor) => bskyTitle(i18n._(page), numUnread)
765
766 return (
767 <Flat.Navigator
768 screenListeners={screenListeners}
769 screenOptions={screenOptions(t)}>
770 <Flat.Screen
771 name="Home"
772 getComponent={() => HomeScreen}
773 options={{title: title(msg`Home`)}}
774 />
775 <Flat.Screen
776 name="Search"
777 getComponent={() => SearchScreen}
778 options={{title: title(msg`Explore`)}}
779 />
780 <Flat.Screen
781 name="Notifications"
782 getComponent={() => NotificationsScreen}
783 options={{title: title(msg`Notifications`), requireAuth: true}}
784 />
785 <Flat.Screen
786 name="Messages"
787 getComponent={() => MessagesScreen}
788 options={{title: title(msg`Messages`), requireAuth: true}}
789 />
790 <Flat.Screen
791 name="Start"
792 getComponent={() => HomeScreen}
793 options={{title: title(msg`Home`)}}
794 />
795 {commonScreens(Flat, numUnread)}
796 </Flat.Navigator>
797 )
798}
799
800/**
801 * The RoutesContainer should wrap all components which need access
802 * to the navigation context.
803 */
804
805const LINKING = {
806 // TODO figure out what we are going to use
807 // note: `bluesky://` is what is used in app.config.js
808 prefixes: ['bsky://', 'bluesky://', 'https://bsky.app'],
809
810 getPathFromState(state: State) {
811 // find the current node in the navigation tree
812 let node = state.routes[state.index || 0]
813 while (node.state?.routes && typeof node.state?.index === 'number') {
814 node = node.state?.routes[node.state?.index]
815 }
816
817 // build the path
818 const route = router.matchName(node.name)
819 if (typeof route === 'undefined') {
820 return '/' // default to home
821 }
822 return route.build((node.params || {}) as RouteParams)
823 },
824
825 getStateFromPath(path: string) {
826 const [name, params] = router.matchPath(path)
827
828 // Any time we receive a url that starts with `intent/` we want to ignore it here. It will be handled in the
829 // intent handler hook. We should check for the trailing slash, because if there isn't one then it isn't a valid
830 // intent
831 // On web, there is no route state that's created by default, so we should initialize it as the home route. On
832 // native, since the home tab and the home screen are defined as initial routes, we don't need to return a state
833 // since it will be created by react-navigation.
834 if (path.includes('intent/')) {
835 if (isNative) return
836 return buildStateObject('Flat', 'Home', params)
837 }
838
839 if (isNative) {
840 if (name === 'Search') {
841 return buildStateObject('SearchTab', 'Search', params)
842 }
843 if (name === 'Notifications') {
844 return buildStateObject('NotificationsTab', 'Notifications', params)
845 }
846 if (name === 'Home') {
847 return buildStateObject('HomeTab', 'Home', params)
848 }
849 if (name === 'Messages') {
850 return buildStateObject('MessagesTab', 'Messages', params)
851 }
852 // if the path is something else, like a post, profile, or even settings, we need to initialize the home tab as pre-existing state otherwise the back button will not work
853 return buildStateObject('HomeTab', name, params, [
854 {
855 name: 'Home',
856 params: {},
857 },
858 ])
859 } else {
860 const res = buildStateObject('Flat', name, params)
861 return res
862 }
863 },
864} satisfies LinkingOptions<AllNavigatorParams>
865
866/**
867 * Used to ensure we don't handle the same notification twice
868 */
869let lastHandledNotificationDateDedupe: number | undefined
870
871function RoutesContainer({children}: React.PropsWithChildren<{}>) {
872 const theme = useColorSchemeStyle(DefaultTheme, DarkTheme)
873 const {currentAccount, accounts} = useSession()
874 const {onPressSwitchAccount} = useAccountSwitcher()
875 const {setShowLoggedOut} = useLoggedOutViewControls()
876 const prevLoggedRouteName = useRef<string | undefined>(undefined)
877 const emailDialogControl = useEmailDialogControl()
878 const closeAllActiveElements = useCloseAllActiveElements()
879
880 /**
881 * Handle navigation to a conversation, or prepares for account switch.
882 *
883 * Non-reactive because we need the latest data from some hooks
884 * after an async call - sfn
885 */
886 const handleChatMessage = useNonReactiveCallback(
887 (payload: Extract<NotificationPayload, {reason: 'chat-message'}>) => {
888 notyLogger.debug(`handleChatMessage`, {payload})
889
890 if (payload.recipientDid !== currentAccount?.did) {
891 // handled in useNotificationHandler after account switch finishes
892 storePayloadForAccountSwitch(payload)
893 closeAllActiveElements()
894
895 const account = accounts.find(a => a.did === payload.recipientDid)
896 if (account) {
897 onPressSwitchAccount(account, 'Notification')
898 } else {
899 setShowLoggedOut(true)
900 }
901 } else {
902 // @ts-expect-error nested navigators aren't typed -sfn
903 navigate('MessagesTab', {
904 screen: 'Messages',
905 params: {
906 pushToConversation: payload.convoId,
907 },
908 })
909 }
910 },
911 )
912
913 async function handlePushNotificationEntry() {
914 if (!isNative) return
915
916 // deep links take precedence - on android,
917 // getLastNotificationResponseAsync returns a "notification"
918 // that is actually a deep link. avoid handling it twice -sfn
919 if (await Linking.getInitialURL()) {
920 return
921 }
922
923 /**
924 * The notification that caused the app to open, if applicable
925 */
926 const response = await Notifications.getLastNotificationResponseAsync()
927
928 if (response) {
929 notyLogger.debug(`handlePushNotificationEntry: response`, {response})
930
931 if (response.notification.date === lastHandledNotificationDateDedupe)
932 return
933 lastHandledNotificationDateDedupe = response.notification.date
934
935 const payload = getNotificationPayload(response.notification)
936
937 if (payload) {
938 notyLogger.metric(
939 'notifications:openApp',
940 {reason: payload.reason, causedBoot: true},
941 {statsig: false},
942 )
943
944 if (payload.reason === 'chat-message') {
945 handleChatMessage(payload)
946 } else {
947 const path = notificationToURL(payload)
948
949 if (path === '/notifications') {
950 resetToTab('NotificationsTab')
951 notyLogger.debug(`handlePushNotificationEntry: default navigate`)
952 } else if (path) {
953 const [screen, params] = router.matchPath(path)
954 // @ts-expect-error nested navigators aren't typed -sfn
955 navigate('HomeTab', {screen, params})
956 notyLogger.debug(`handlePushNotificationEntry: navigate`, {
957 screen,
958 params,
959 })
960 }
961 }
962 }
963 }
964 }
965
966 function onReady() {
967 prevLoggedRouteName.current = getCurrentRouteName()
968 if (currentAccount && shouldRequestEmailConfirmation(currentAccount)) {
969 emailDialogControl.open({
970 id: EmailDialogScreenID.VerificationReminder,
971 })
972 snoozeEmailConfirmationPrompt()
973 }
974 }
975
976 return (
977 <>
978 <NavigationContainer
979 ref={navigationRef}
980 linking={LINKING}
981 theme={theme}
982 onStateChange={() => {
983 logger.metric(
984 'router:navigate',
985 {from: prevLoggedRouteName.current},
986 {statsig: false},
987 )
988 prevLoggedRouteName.current = getCurrentRouteName()
989 }}
990 onReady={() => {
991 attachRouteToLogEvents(getCurrentRouteName)
992 logModuleInitTime()
993 onReady()
994 logger.metric('router:navigate', {}, {statsig: false})
995 handlePushNotificationEntry()
996 }}
997 // WARNING: Implicit navigation to nested navigators is depreciated in React Navigation 7.x
998 // However, there's a fair amount of places we do that, especially in when popping to the top of stacks.
999 // See BottomBar.tsx for an example of how to handle nested navigators in the tabs correctly.
1000 // I'm scared of missing a spot (esp. with push notifications etc) so let's enable this legacy behaviour for now.
1001 // We will need to confirm we handle nested navigators correctly by the time we migrate to React Navigation 8.x
1002 // -sfn
1003 navigationInChildEnabled>
1004 {children}
1005 </NavigationContainer>
1006 </>
1007 )
1008}
1009
1010function getCurrentRouteName() {
1011 if (navigationRef.isReady()) {
1012 return navigationRef.getCurrentRoute()?.name
1013 } else {
1014 return undefined
1015 }
1016}
1017
1018/**
1019 * These helpers can be used from outside of the RoutesContainer
1020 * (eg in the state models).
1021 */
1022
1023function navigate<K extends keyof AllNavigatorParams>(
1024 name: K,
1025 params?: AllNavigatorParams[K],
1026) {
1027 if (navigationRef.isReady()) {
1028 return Promise.race([
1029 new Promise<void>(resolve => {
1030 const handler = () => {
1031 resolve()
1032 navigationRef.removeListener('state', handler)
1033 }
1034 navigationRef.addListener('state', handler)
1035
1036 // @ts-ignore I dont know what would make typescript happy but I have a life -prf
1037 navigationRef.navigate(name, params)
1038 }),
1039 timeout(1e3),
1040 ])
1041 }
1042 return Promise.resolve()
1043}
1044
1045function resetToTab(
1046 tabName: 'HomeTab' | 'SearchTab' | 'MessagesTab' | 'NotificationsTab',
1047) {
1048 if (navigationRef.isReady()) {
1049 navigate(tabName)
1050 if (navigationRef.canGoBack()) {
1051 navigationRef.dispatch(StackActions.popToTop()) //we need to check .canGoBack() before calling it
1052 }
1053 }
1054}
1055
1056// returns a promise that resolves after the state reset is complete
1057function reset(): Promise<void> {
1058 if (navigationRef.isReady()) {
1059 navigationRef.dispatch(
1060 CommonActions.reset({
1061 index: 0,
1062 routes: [{name: isNative ? 'HomeTab' : 'Home'}],
1063 }),
1064 )
1065 return Promise.race([
1066 timeout(1e3),
1067 new Promise<void>(resolve => {
1068 const handler = () => {
1069 resolve()
1070 navigationRef.removeListener('state', handler)
1071 }
1072 navigationRef.addListener('state', handler)
1073 }),
1074 ])
1075 } else {
1076 return Promise.resolve()
1077 }
1078}
1079
1080let didInit = false
1081function logModuleInitTime() {
1082 if (didInit) {
1083 return
1084 }
1085 didInit = true
1086
1087 const initMs = Math.round(
1088 // @ts-ignore Emitted by Metro in the bundle prelude
1089 performance.now() - global.__BUNDLE_START_TIME__,
1090 )
1091 console.log(`Time to first paint: ${initMs} ms`)
1092 logEvent('init', {
1093 initMs,
1094 })
1095
1096 if (isWeb) {
1097 const referrerInfo = Referrer.getReferrerInfo()
1098 if (referrerInfo && referrerInfo.hostname !== 'bsky.app') {
1099 logEvent('deepLink:referrerReceived', {
1100 to: window.location.href,
1101 referrer: referrerInfo?.referrer,
1102 hostname: referrerInfo?.hostname,
1103 })
1104 }
1105 }
1106
1107 if (__DEV__) {
1108 // This log is noisy, so keep false committed
1109 const shouldLog = false
1110 // Relies on our patch to polyfill.js in metro-runtime
1111 const initLogs = (global as any).__INIT_LOGS__
1112 if (shouldLog && Array.isArray(initLogs)) {
1113 console.log(initLogs.join('\n'))
1114 }
1115 }
1116}
1117
1118export {
1119 FlatNavigator,
1120 navigate,
1121 reset,
1122 resetToTab,
1123 RoutesContainer,
1124 TabsNavigator,
1125}