diff --git a/app/stacks/InsideStack.tsx b/app/stacks/InsideStack.tsx index baaa6c8d0fc..2884044d1a4 100644 --- a/app/stacks/InsideStack.tsx +++ b/app/stacks/InsideStack.tsx @@ -1,12 +1,19 @@ -import { useContext } from 'react'; +import { useContext, type ComponentType } from 'react'; import { I18nManager } from 'react-native'; -import { createNativeStackNavigator } from '@react-navigation/native-stack'; +import { + createNativeStackNavigator, + createNativeStackScreen, + type NativeStackNavigationOptions +} from '@react-navigation/native-stack'; import { createDrawerNavigator } from '@react-navigation/drawer'; +import { type StaticScreenProps } from '@react-navigation/native'; import { ThemeContext } from '../theme'; import { defaultHeader, themedHeader } from '../lib/methods/helpers/navigation'; +import withNavigation from '../lib/navigation/withNavigation'; import Sidebar from '../views/SidebarView'; -// Chats Stack +import { isIOS } from '../lib/methods/helpers'; +import { type TNavigation } from './stackType'; import RoomView from '../views/RoomView'; import RoomsListView from '../views/RoomsListView'; import RoomActionsView from '../views/RoomActionsView'; @@ -32,317 +39,351 @@ import TeamChannelsView from '../views/TeamChannelsView'; import ReadReceiptsView from '../views/ReadReceiptView'; import CannedResponsesListView from '../views/CannedResponsesListView'; import CannedResponseDetail from '../views/CannedResponseDetail'; -// Profile Stack +import JitsiMeetView from '../views/JitsiMeetView'; +import DiscussionsView from '../views/DiscussionsView'; +import ChangeAvatarView from '../views/ChangeAvatarView'; +import AddChannelTeamView from '../views/AddChannelTeamView'; +import AddExistingChannelView from '../views/AddExistingChannelView'; +import SelectListView from '../views/SelectListView'; +import QueueListView from '../ee/omnichannel/views/QueueListView'; import ProfileView from '../views/ProfileView'; import UserPreferencesView from '../views/UserPreferencesView'; import UserNotificationPrefView from '../views/UserNotificationPreferencesView'; import ChangePasswordView from '../views/ChangePasswordView'; -// Display Preferences View -import DisplayPrefsView from '../views/DisplayPrefsView'; -// Settings Stack import SettingsView from '../views/SettingsView'; import SecurityPrivacyView from '../views/SecurityPrivacyView'; import GetHelpView from '../views/GetHelpView'; import PushTroubleshootView from '../views/PushTroubleshootView'; import E2EEncryptionSecurityView from '../views/E2EEncryptionSecurityView'; import LanguageView from '../views/LanguageView'; -import ThemeView from '../views/ThemeView'; import DefaultBrowserView from '../views/DefaultBrowserView'; import ScreenLockConfigView from '../views/ScreenLockConfigView'; import MediaAutoDownloadView from '../views/MediaAutoDownloadView'; -// Admin Stack +import LegalView from '../views/LegalView'; +import AccessibilityAndAppearanceView from '../views/AccessibilityAndAppearanceView'; +import DisplayPrefsView from '../views/DisplayPrefsView'; +import ThemeView from '../views/ThemeView'; import AdminPanelView from '../views/AdminPanelView'; -// NewMessage Stack import NewMessageView from '../views/NewMessageView'; import CreateChannelView from '../views/CreateChannelView'; -// E2ESaveYourPassword Stack +import CreateDiscussionView from '../views/CreateDiscussionView'; +import ForwardMessageView from '../views/ForwardMessageView'; import E2ESaveYourPasswordView from '../views/E2ESaveYourPasswordView'; import E2EHowItWorksView from '../views/E2EHowItWorksView'; -// E2EEnterYourPassword Stack import E2EEnterYourPasswordView from '../views/E2EEnterYourPasswordView'; -// InsideStackNavigator import AttachmentView from '../views/AttachmentView'; import ModalBlockView from '../views/ModalBlockView'; -import JitsiMeetView from '../views/JitsiMeetView'; import StatusView from '../views/StatusView'; import ShareView from '../views/ShareView'; import CallView from '../views/CallView'; -import CreateDiscussionView from '../views/CreateDiscussionView'; -import ForwardMessageView from '../views/ForwardMessageView'; -import QueueListView from '../ee/omnichannel/views/QueueListView'; -import AddChannelTeamView from '../views/AddChannelTeamView'; -import AddExistingChannelView from '../views/AddExistingChannelView'; -import SelectListView from '../views/SelectListView'; -import DiscussionsView from '../views/DiscussionsView'; -import ChangeAvatarView from '../views/ChangeAvatarView'; -import LegalView from '../views/LegalView'; -import { - type AdminPanelStackParamList, - type ChatsStackParamList, - type DrawerParamList, - type E2EEnterYourPasswordStackParamList, - type E2ESaveYourPasswordStackParamList, - type InsideStackParamList, - type NewMessageStackParamList, - type ProfileStackParamList, - type SettingsStackParamList, - type AccessibilityStackParamList -} from './types'; -import { isIOS } from '../lib/methods/helpers'; -import { type TNavigation } from './stackType'; -import AccessibilityAndAppearanceView from '../views/AccessibilityAndAppearanceView'; -// ChatsStackNavigator -const ChatsStack = createNativeStackNavigator(); -const ChatsStackNavigator = () => { +// Cast through `any` to break the navigation-prop type cycle; removing it reintroduces a real TS circular ref. +const RoomViewScreen = withNavigation(RoomView as any) as any; +const RoomActionsViewScreen = withNavigation(RoomActionsView as any) as any; +const SelectListViewScreen = withNavigation(SelectListView as any) as any; +const RoomInfoEditViewScreen = withNavigation(RoomInfoEditView as any) as any; +const SearchMessagesViewScreen = withNavigation(SearchMessagesView as any) as any; +const InviteUsersViewScreen = withNavigation(InviteUsersView as any) as any; +const MessagesViewScreen = withNavigation(MessagesView as any) as any; +const DirectoryViewScreen = withNavigation(DirectoryView as any) as any; +const PushTroubleshootViewScreen: ComponentType> = withNavigation( + PushTroubleshootView as any +) as any; +const LivechatEditViewScreen = withNavigation(LivechatEditView as any) as any; +const ThreadMessagesViewScreen = withNavigation(ThreadMessagesView as any) as any; +const TeamChannelsViewScreen = withNavigation(TeamChannelsView as any) as any; +const ReadReceiptsViewScreen = withNavigation(ReadReceiptsView as any) as any; +const CannedResponsesListViewScreen = withNavigation(CannedResponsesListView as any) as any; +const ProfileViewScreen: ComponentType> = withNavigation(ProfileView as any) as any; +const ChangePasswordViewScreen: ComponentType> = withNavigation(ChangePasswordView as any) as any; +const UserPreferencesViewScreen: ComponentType> = withNavigation(UserPreferencesView as any) as any; +const SecurityPrivacyViewScreen: ComponentType> = withNavigation(SecurityPrivacyView as any) as any; +const ScreenLockConfigViewScreen: ComponentType> = withNavigation( + ScreenLockConfigView as any +) as any; +const CreateDiscussionViewScreen = withNavigation(CreateDiscussionView as any) as any; +const E2EEnterYourPasswordViewScreen: ComponentType> = withNavigation( + E2EEnterYourPasswordView as any +) as any; +const ShareViewScreen = withNavigation(ShareView as any) as any; +const ModalBlockViewScreen = withNavigation(ModalBlockView as any) as any; +const RoomInfoViewScreen = RoomInfoView as any; +const ReportUserViewScreen = ReportUserView as any; +const RoomMembersViewScreen = RoomMembersView as any; +const DiscussionsViewScreen = DiscussionsView as any; +const SelectedUsersViewScreen = SelectedUsersView as any; +const InviteUsersEditViewScreen = InviteUsersEditView as any; +const AutoTranslateViewScreen = AutoTranslateView as any; +const NotificationPrefViewScreen = NotificationPrefView as any; +const E2EEToggleRoomViewScreen = withNavigation(E2EEToggleRoomView as any) as any; +const CloseLivechatViewScreen = CloseLivechatView as any; +const CreateChannelViewScreen = CreateChannelView as any; +const AddChannelTeamViewScreen = AddChannelTeamView as any; +const AddExistingChannelViewScreen = AddExistingChannelView as any; +const CannedResponseDetailScreen = CannedResponseDetail as any; +const JitsiMeetViewScreen = JitsiMeetView as any; +const ChangeAvatarViewScreen = ChangeAvatarView as any; +const UserNotificationPrefViewScreen: ComponentType> = UserNotificationPrefView as any; +const SettingsViewScreen: ComponentType> = SettingsView as any; +const E2EEncryptionSecurityViewScreen: ComponentType> = E2EEncryptionSecurityView as any; +const LanguageViewScreen: ComponentType> = LanguageView as any; +const DefaultBrowserViewScreen: ComponentType> = DefaultBrowserView as any; +const MediaAutoDownloadViewScreen: ComponentType> = MediaAutoDownloadView as any; +const GetHelpViewScreen: ComponentType> = GetHelpView as any; +const LegalViewScreen: ComponentType> = LegalView as any; +const AccessibilityAndAppearanceViewScreen: ComponentType> = AccessibilityAndAppearanceView as any; +const DisplayPrefsViewScreen: ComponentType> = DisplayPrefsView as any; +const ThemeViewScreen: ComponentType> = ThemeView as any; +const AdminPanelViewScreen: ComponentType> = AdminPanelView as any; +const NewMessageViewScreen: ComponentType> = NewMessageView as any; +const ForwardMessageViewScreen = ForwardMessageView as any; +const E2ESaveYourPasswordViewScreen: ComponentType> = E2ESaveYourPasswordView as any; +const E2EHowItWorksViewScreen = E2EHowItWorksView as any; +const StatusViewScreen: ComponentType> = StatusView as any; +const CallViewScreen: ComponentType> = CallView as any; +const QueueListViewScreen: ComponentType> = QueueListView as any; + +// Explicit param types so the TNavigation screens keep precise route params instead of inferred `any`. +const PickerViewScreen: ComponentType> = PickerView as any; +const ForwardLivechatViewScreen: ComponentType> = + ForwardLivechatView as any; +const AttachmentViewScreen: ComponentType> = AttachmentView as any; + +const ChatsStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + RoomsListView: createNativeStackScreen({ + screen: RoomsListView, + options: { freezeOnBlur: true } + }), + RoomView: RoomViewScreen, + RoomActionsView: createNativeStackScreen({ + screen: RoomActionsViewScreen, + options: (args: any): NativeStackNavigationOptions => (RoomActionsView as any).navigationOptions(args) + }), + SelectListView: SelectListViewScreen, + RoomInfoView: RoomInfoViewScreen, + ReportUserView: ReportUserViewScreen, + RoomInfoEditView: RoomInfoEditViewScreen, + ChangeAvatarView: ChangeAvatarViewScreen, + RoomMembersView: RoomMembersViewScreen, + DiscussionsView: DiscussionsViewScreen, + SearchMessagesView: createNativeStackScreen({ + screen: SearchMessagesViewScreen, + options: (args: any): NativeStackNavigationOptions => (SearchMessagesView as any).navigationOptions(args) + }), + SelectedUsersView: SelectedUsersViewScreen, + InviteUsersView: InviteUsersViewScreen, + InviteUsersEditView: InviteUsersEditViewScreen, + MessagesView: MessagesViewScreen, + AutoTranslateView: AutoTranslateViewScreen, + DirectoryView: DirectoryViewScreen, + NotificationPrefView: NotificationPrefViewScreen, + E2EEToggleRoomView: E2EEToggleRoomViewScreen, + PushTroubleshootView: PushTroubleshootViewScreen, + ForwardLivechatView: ForwardLivechatViewScreen, + CloseLivechatView: CloseLivechatViewScreen, + LivechatEditView: LivechatEditViewScreen, + PickerView: PickerViewScreen, + ThreadMessagesView: ThreadMessagesViewScreen, + TeamChannelsView: TeamChannelsViewScreen, + CreateChannelView: CreateChannelViewScreen, + AddChannelTeamView: AddChannelTeamViewScreen, + AddExistingChannelView: AddExistingChannelViewScreen, + ReadReceiptsView: createNativeStackScreen({ + screen: ReadReceiptsViewScreen, + options: (args: any): NativeStackNavigationOptions => (ReadReceiptsView as any).navigationOptions(args) + }), + QueueListView: QueueListViewScreen, + CannedResponsesListView: CannedResponsesListViewScreen, + CannedResponseDetail: CannedResponseDetailScreen, + JitsiMeetView: createNativeStackScreen({ + screen: JitsiMeetViewScreen, + options: { headerShown: false, animation: isIOS ? 'default' : 'none' } + }) + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); - return ( - - - - - {/* @ts-ignore */} - - - - {/* @ts-ignore */} - - - - {/* @ts-ignore */} - - - - {/* @ts-ignore */} - - - - - {/* @ts-ignore */} - - - - - - {/* @ts-ignore */} - - {/* @ts-ignore */} - - - {/* @ts-ignore */} - - - - - - {/* @ts-ignore */} - - - - - - - ); -}; + return ; +}); -// ProfileStackNavigator -const ProfileStack = createNativeStackNavigator(); -const ProfileStackNavigator = () => { +const ProfileStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + ProfileView: ProfileViewScreen, + ChangePasswordView: ChangePasswordViewScreen, + UserPreferencesView: UserPreferencesViewScreen, + ChangeAvatarView: ChangeAvatarViewScreen, + UserNotificationPrefView: UserNotificationPrefViewScreen, + PushTroubleshootView: PushTroubleshootViewScreen, + PickerView: PickerViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); - return ( - - - - - - - - - - ); -}; + return ; +}); -// SettingsStackNavigator -const SettingsStack = createNativeStackNavigator(); -const SettingsStackNavigator = () => { +const SettingsStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + SettingsView: SettingsViewScreen, + SecurityPrivacyView: SecurityPrivacyViewScreen, + PushTroubleshootView: PushTroubleshootViewScreen, + E2EEncryptionSecurityView: E2EEncryptionSecurityViewScreen, + LanguageView: LanguageViewScreen, + DefaultBrowserView: DefaultBrowserViewScreen, + MediaAutoDownloadView: MediaAutoDownloadViewScreen, + GetHelpView: GetHelpViewScreen, + LegalView: LegalViewScreen, + ScreenLockConfigView: createNativeStackScreen({ + screen: ScreenLockConfigViewScreen, + options: (): NativeStackNavigationOptions => (ScreenLockConfigView as any).navigationOptions() + }) + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - - - - - - - {/* @ts-ignore */} - - - - ); -}; - -// AdminPanelStackNavigator -const AdminPanelStack = createNativeStackNavigator(); -const AdminPanelStackNavigator = () => { +const AdminPanelStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + AdminPanelView: AdminPanelViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - ); -}; - -// AccessibilityStackNavigator -const AccessibilityStack = createNativeStackNavigator(); -const AccessibilityStackNavigator = () => { +const AccessibilityStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + AccessibilityAndAppearanceView: AccessibilityAndAppearanceViewScreen, + DisplayPrefsView: DisplayPrefsViewScreen, + ThemeView: ThemeViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); - return ( - - - - - - ); -}; + return ; +}); -// DrawerNavigator -const Drawer = createDrawerNavigator(); -const DrawerNavigator = () => { +const DrawerStack = createDrawerNavigator({ + screenOptions: { + swipeEnabled: false, + headerShown: false, + drawerPosition: I18nManager.isRTL ? 'right' : 'left', + drawerType: 'slide', + freezeOnBlur: true + }, + screens: { + ChatsStackNavigator: ChatsStack, + ProfileStackNavigator: ProfileStack, + SettingsStackNavigator: SettingsStack, + AdminPanelStackNavigator: AdminPanelStack, + AccessibilityStackNavigator: AccessibilityStack + } +}).with(({ Navigator }) => { 'use memo'; const { colors } = useContext(ThemeContext); - return ( - } - screenOptions={{ - swipeEnabled: false, - headerShown: false, - drawerPosition: I18nManager.isRTL ? 'right' : 'left', - drawerType: 'slide', - overlayColor: `rgba(0,0,0,${colors.backdropOpacity})`, - freezeOnBlur: true - }}> - - - - - - + } + screenOptions={{ overlayColor: `rgba(0,0,0,${colors.backdropOpacity})` }} + /> ); -}; +}); -// NewMessageStackNavigator -const NewMessageStack = createNativeStackNavigator(); -const NewMessageStackNavigator = () => { +const NewMessageStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + NewMessageView: NewMessageViewScreen, + SelectedUsersView: SelectedUsersViewScreen, + CreateChannelView: CreateChannelViewScreen, + CreateDiscussionView: CreateDiscussionViewScreen, + ForwardMessageView: ForwardMessageViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - - {/* @ts-ignore */} - - - - ); -}; - -// E2ESaveYourPasswordStackNavigator -const E2ESaveYourPasswordStack = createNativeStackNavigator(); -const E2ESaveYourPasswordStackNavigator = () => { +const E2ESaveYourPasswordStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + E2ESaveYourPasswordView: E2ESaveYourPasswordViewScreen, + E2EHowItWorksView: E2EHowItWorksViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - - ); -}; - -// E2EEnterYourPasswordStackNavigator -const E2EEnterYourPasswordStack = createNativeStackNavigator(); -const E2EEnterYourPasswordStackNavigator = () => { +const E2EEnterYourPasswordStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + E2EEnterYourPasswordView: E2EEnterYourPasswordViewScreen, + E2EEncryptionSecurityView: E2EEncryptionSecurityViewScreen + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - - ); -}; - -// InsideStackNavigator -const InsideStack = createNativeStackNavigator(); -const InsideStackNavigator = () => { +const InsideStack = createNativeStackNavigator({ + screenOptions: { ...defaultHeader, presentation: 'containedModal' }, + screens: { + DrawerNavigator: createNativeStackScreen({ + screen: DrawerStack, + options: { headerShown: false } + }), + NewMessageStackNavigator: createNativeStackScreen({ + screen: NewMessageStack, + options: { headerShown: false } + }), + E2ESaveYourPasswordStackNavigator: createNativeStackScreen({ + screen: E2ESaveYourPasswordStack, + options: { headerShown: false } + }), + E2EEnterYourPasswordStackNavigator: createNativeStackScreen({ + screen: E2EEnterYourPasswordStack, + options: { headerShown: false } + }), + AttachmentView: AttachmentViewScreen, + StatusView: StatusViewScreen, + ShareView: ShareViewScreen, + ModalBlockView: createNativeStackScreen({ + screen: ModalBlockViewScreen, + options: (args: any): NativeStackNavigationOptions => (ModalBlockView as any).navigationOptions(args) + }), + CallView: createNativeStackScreen({ + screen: CallViewScreen, + options: { headerShown: false } + }) + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + return ; +}); - return ( - - - - - - - - {/* @ts-ignore */} - - {/* @ts-ignore */} - - - - ); -}; +const InsideStackScreen = InsideStack.getComponent(); -export default InsideStackNavigator; +export default InsideStackScreen; diff --git a/app/stacks/MasterDetailStack/index.tsx b/app/stacks/MasterDetailStack/index.tsx index d8c22d8caea..02ec28fd9a6 100644 --- a/app/stacks/MasterDetailStack/index.tsx +++ b/app/stacks/MasterDetailStack/index.tsx @@ -1,15 +1,24 @@ -import { memo, useContext } from 'react'; -import { createNativeStackNavigator, type NativeStackNavigationProp } from '@react-navigation/native-stack'; +import { useContext, type ComponentType } from 'react'; +import { + createNativeStackNavigator, + createNativeStackScreen, + type NativeStackNavigationProp +} from '@react-navigation/native-stack'; import { createDrawerNavigator } from '@react-navigation/drawer'; +import { type StaticScreenProps, useNavigation } from '@react-navigation/native'; import { ThemeContext } from '../../theme'; import { defaultHeader, themedHeader, drawerStyle } from '../../lib/methods/helpers/navigation'; -// Chats Stack +import withNavigation from '../../lib/navigation/withNavigation'; +import { isIOS } from '../../lib/methods/helpers'; +import { ModalContainer } from './ModalContainer'; +import { type MasterDetailChatsStackParamList, type MasterDetailInsideStackParamList, type ModalStackParamList } from './types'; import RoomView from '../../views/RoomView'; import RoomsListView from '../../views/RoomsListView'; import RoomActionsView from '../../views/RoomActionsView'; import RoomInfoView from '../../views/RoomInfoView'; import ReportUserView from '../../views/ReportUserView'; +import SelectListView from '../../views/SelectListView'; import RoomInfoEditView from '../../views/RoomInfoEditView'; import ChangeAvatarView from '../../views/ChangeAvatarView'; import RoomMembersView from '../../views/RoomMembersView'; @@ -50,194 +59,247 @@ import LegalView from '../../views/LegalView'; import SecurityPrivacyView from '../../views/SecurityPrivacyView'; import MediaAutoDownloadView from '../../views/MediaAutoDownloadView'; import E2EEncryptionSecurityView from '../../views/E2EEncryptionSecurityView'; -// InsideStackNavigator -import AttachmentView from '../../views/AttachmentView'; -import ModalBlockView from '../../views/ModalBlockView'; -import JitsiMeetView from '../../views/JitsiMeetView'; -import CallView from '../../views/CallView'; import StatusView from '../../views/StatusView'; import CreateDiscussionView from '../../views/CreateDiscussionView'; import E2ESaveYourPasswordView from '../../views/E2ESaveYourPasswordView'; import E2EHowItWorksView from '../../views/E2EHowItWorksView'; import E2EEnterYourPasswordView from '../../views/E2EEnterYourPasswordView'; -import ShareView from '../../views/ShareView'; import QueueListView from '../../ee/omnichannel/views/QueueListView'; import AddChannelTeamView from '../../views/AddChannelTeamView'; import AddExistingChannelView from '../../views/AddExistingChannelView'; -import SelectListView from '../../views/SelectListView'; import DiscussionsView from '../../views/DiscussionsView'; import AccessibilityAndAppearanceView from '../../views/AccessibilityAndAppearanceView'; -import { ModalContainer } from './ModalContainer'; -import { - type MasterDetailChatsStackParamList, - type MasterDetailDrawerParamList, - type MasterDetailInsideStackParamList, - type ModalStackParamList -} from './types'; -import { isIOS } from '../../lib/methods/helpers'; -import { type TNavigation } from '../stackType'; import { SupportedVersionsWarning } from '../../containers/SupportedVersions'; +import AttachmentView from '../../views/AttachmentView'; +import ModalBlockView from '../../views/ModalBlockView'; +import JitsiMeetView from '../../views/JitsiMeetView'; +import ShareView from '../../views/ShareView'; +import CallView from '../../views/CallView'; -// ChatsStackNavigator -const ChatsStack = createNativeStackNavigator(); -const ChatsStackNavigator = memo(() => { - 'use memo'; +// Cast through `any` to break the navigation-prop type cycle; removing it reintroduces a real TS circular ref. +// `.navigationOptions` stays reachable on the wrapped components because connect()/withTheme() hoist statics. - const { theme } = useContext(ThemeContext); +const RoomViewScreen: ComponentType> = withNavigation( + RoomView as any +) as any; - return ( - - - - ); -}); +const RoomActionsViewScreen: ComponentType> = withNavigation( + RoomActionsView as any +) as any; +const SelectListViewScreen: ComponentType> = withNavigation( + SelectListView as any +) as any; +const SearchMessagesViewScreen: ComponentType> = withNavigation( + SearchMessagesView as any +) as any; +const MessagesViewScreen: ComponentType> = withNavigation( + MessagesView as any +) as any; +const ThreadMessagesViewScreen: ComponentType> = withNavigation( + ThreadMessagesView as any +) as any; +const TeamChannelsViewScreen: ComponentType> = withNavigation( + TeamChannelsView as any +) as any; +const ReadReceiptsViewScreen: ComponentType> = withNavigation( + ReadReceiptsView as any +) as any; +const ScreenLockConfigViewScreen: ComponentType> = withNavigation( + ScreenLockConfigView as any +) as any; + +const RoomInfoEditViewScreen: ComponentType> = withNavigation( + RoomInfoEditView as any +) as any; +const InviteUsersViewScreen: ComponentType> = withNavigation( + InviteUsersView as any +) as any; +const DirectoryViewScreen: ComponentType> = withNavigation( + DirectoryView as any +) as any; +const E2EEToggleRoomViewScreen: ComponentType> = withNavigation( + E2EEToggleRoomView as any +) as any; +const CannedResponsesListViewScreen: ComponentType> = + withNavigation(CannedResponsesListView as any) as any; +const LivechatEditViewScreen: ComponentType> = withNavigation( + LivechatEditView as any +) as any; +const ProfileViewScreen: ComponentType> = withNavigation( + ProfileView as any +) as any; +const ChangePasswordViewScreen: ComponentType> = withNavigation( + ChangePasswordView as any +) as any; +const CreateDiscussionViewScreen: ComponentType> = withNavigation( + CreateDiscussionView as any +) as any; +const E2EEnterYourPasswordViewScreen: ComponentType> = + withNavigation(E2EEnterYourPasswordView as any) as any; +const UserPreferencesViewScreen: ComponentType> = withNavigation( + UserPreferencesView as any +) as any; +const SecurityPrivacyViewScreen: ComponentType> = withNavigation( + SecurityPrivacyView as any +) as any; +const PushTroubleshootViewScreen: ComponentType> = withNavigation( + PushTroubleshootView as any +) as any; +const SupportedVersionsWarningScreen: ComponentType> = + withNavigation(SupportedVersionsWarning as any) as any; -// DrawerNavigator -const Drawer = createDrawerNavigator(); -const DrawerNavigator = memo(() => { +const ModalBlockViewScreen: ComponentType> = withNavigation( + ModalBlockView as any +) as any; +const ShareViewScreen: ComponentType> = withNavigation( + ShareView as any +) as any; + +const ChatsStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + RoomView: createNativeStackScreen({ + screen: RoomViewScreen, + options: { title: '' } + }) + } +}).with(({ Navigator }) => { 'use memo'; - return ( - }> - - - ); + const { theme } = useContext(ThemeContext); + return ; }); -export interface INavigation { - navigation: NativeStackNavigationProp; -} +const DrawerNav = createDrawerNavigator({ + screenOptions: { drawerType: 'permanent', headerShown: false, drawerStyle: { ...drawerStyle } }, + drawerContent: () => , + screens: { + ChatsStackNavigator: ChatsStack + } +}); -const ModalStack = createNativeStackNavigator(); -const ModalStackNavigator = memo(({ navigation }: INavigation) => { +const ModalStack = createNativeStackNavigator({ + screenOptions: defaultHeader, + screens: { + RoomActionsView: createNativeStackScreen({ + screen: RoomActionsViewScreen, + options: props => RoomActionsView.navigationOptions!({ ...props, isMasterDetail: true }) + }), + RoomInfoView, + ReportUserView, + SelectListView: SelectListViewScreen, + RoomInfoEditView: RoomInfoEditViewScreen, + ChangeAvatarView, + RoomMembersView, + SearchMessagesView: createNativeStackScreen({ + screen: SearchMessagesViewScreen, + options: SearchMessagesView.navigationOptions + }), + SelectedUsersView, + InviteUsersView: InviteUsersViewScreen, + AddChannelTeamView, + AddExistingChannelView, + InviteUsersEditView, + MessagesView: MessagesViewScreen, + AutoTranslateView, + DirectoryView: DirectoryViewScreen, + QueueListView, + NotificationPrefView, + E2EEToggleRoomView: E2EEToggleRoomViewScreen, + ForwardMessageView, + ForwardLivechatView, + CloseLivechatView, + CannedResponsesListView: CannedResponsesListViewScreen, + CannedResponseDetail, + LivechatEditView: LivechatEditViewScreen, + PickerView, + ThreadMessagesView: ThreadMessagesViewScreen, + DiscussionsView, + TeamChannelsView: TeamChannelsViewScreen, + ReadReceiptsView: createNativeStackScreen({ + screen: ReadReceiptsViewScreen, + options: props => ReadReceiptsView.navigationOptions!({ ...props, isMasterDetail: true }) + }), + SettingsView, + LegalView, + LanguageView, + ThemeView, + DefaultBrowserView, + ScreenLockConfigView: createNativeStackScreen({ + screen: ScreenLockConfigViewScreen, + options: ScreenLockConfigView.navigationOptions + }), + StatusView, + ProfileView: ProfileViewScreen, + ChangePasswordView: ChangePasswordViewScreen, + DisplayPrefsView, + AdminPanelView, + NewMessageView, + CreateChannelView, + CreateDiscussionView: CreateDiscussionViewScreen, + E2ESaveYourPasswordView, + E2EHowItWorksView, + E2EEnterYourPasswordView: E2EEnterYourPasswordViewScreen, + UserPreferencesView: UserPreferencesViewScreen, + UserNotificationPrefView, + SecurityPrivacyView: SecurityPrivacyViewScreen, + MediaAutoDownloadView, + E2EEncryptionSecurityView, + PushTroubleshootView: PushTroubleshootViewScreen, + SupportedVersionsWarning: SupportedVersionsWarningScreen, + AccessibilityAndAppearanceView + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); + const navigation = useNavigation>(); return ( - - RoomActionsView.navigationOptions!({ ...props, isMasterDetail: true })} - /> - - - {/* @ts-ignore */} - - {/* @ts-ignore */} - - - - - - {/* @ts-ignore */} - - - - - - - - - - - - - - - - {/* @ts-ignore */} - - - {/* @ts-ignore */} - - - - ReadReceiptsView.navigationOptions!({ ...props, isMasterDetail: true })} - /> - - - - - - - - - - - - - - {/* @ts-ignore */} - - - - - - - - - - - - - + ); }); -// InsideStackNavigator -const InsideStack = createNativeStackNavigator(); -const InsideStackNavigator = memo(() => { +const InsideStack = createNativeStackNavigator({ + screenOptions: { + ...defaultHeader, + presentation: isIOS ? 'containedTransparentModal' : 'containedModal' + }, + screens: { + DrawerNavigator: createNativeStackScreen({ + screen: DrawerNav as any, + options: { headerShown: false } + }), + ModalStackNavigator: createNativeStackScreen({ + screen: ModalStack as any, + options: { headerShown: false } + }), + AttachmentView, + ModalBlockView: createNativeStackScreen({ + screen: ModalBlockViewScreen, + options: ModalBlockView.navigationOptions as any + }), + JitsiMeetView: createNativeStackScreen({ + screen: JitsiMeetView, + options: { + headerShown: false, + animation: isIOS ? 'default' : 'none' + } + }), + ShareView: ShareViewScreen, + CallView: createNativeStackScreen({ + screen: CallView, + options: { headerShown: false } + }) + } +}).with(({ Navigator }) => { 'use memo'; const { theme } = useContext(ThemeContext); - return ( - - - - - {/* @ts-ignore */} - - - {/* @ts-ignore */} - - - - ); + return ; }); -export default InsideStackNavigator; +const MasterDetailStack = InsideStack.getComponent(); + +export default MasterDetailStack; diff --git a/app/stacks/types.ts b/app/stacks/types.ts index 56cf34e8fb0..8c1b6608281 100644 --- a/app/stacks/types.ts +++ b/app/stacks/types.ts @@ -19,6 +19,8 @@ import { import { type ModalStackParamList } from './MasterDetailStack/types'; import { type TNavigation } from './stackType'; +// Hand-written rather than StaticParamList-inferred: views use composite navigation props spanning +// cross-stack destinations (ModalStackNavigator, E2E stacks), and explicit params avoid implicit `any`. export type ChatsStackParamList = { ModalStackNavigator: NavigatorScreenParams; E2ESaveYourPasswordStackNavigator: NavigatorScreenParams; @@ -43,7 +45,7 @@ export type ChatsStackParamList = { usedCannedResponse?: string; status?: string; } - | undefined; // Navigates back to RoomView already on stack + | undefined; RoomActionsView: { room: TSubscriptionModel; member?: any; @@ -135,7 +137,7 @@ export type ChatsStackParamList = { }; LivechatEditView: { room: ISubscription; - roomUser: any; // TODO: Change + roomUser: any; }; ThreadMessagesView: { rid: string; @@ -146,7 +148,7 @@ export type ChatsStackParamList = { joined: boolean; }; CreateChannelView: { - isTeam?: boolean; // TODO: To check + isTeam?: boolean; teamId?: string; }; AddChannelTeamView: { @@ -201,6 +203,8 @@ export type ProfileStackParamList = { ChangePasswordView: undefined; }; +// Cross-stack entries (ProfileView, DisplayPrefsView, AccessibilityAndAppearanceView) are reachable +// from SettingsView via the drawer/accessibility stack. export type SettingsStackParamList = { LegalView: undefined; SettingsView: undefined; @@ -248,9 +252,9 @@ export type NewMessageStackParamList = { buttonText?: string; nextAction?: Function; showSkipText?: boolean; - }; // TODO: Change + }; CreateChannelView?: { - isTeam?: boolean; // TODO: To check + isTeam?: boolean; teamId?: string; }; CreateDiscussionView: { @@ -294,7 +298,7 @@ export type InsideStackParamList = { startShareView: () => { text: string; selectedMessages: string[] }; }; ModalBlockView: { - data: any; // TODO: Change; + data: any; }; CallView: undefined; };