Merge pull request #40967 from nkdengineer/fix/40488

Fix Workspace - Name RHP stays open while not found view is loading
Expensify · Apr 26, 2024 · db9be2c · db9be2c
2 parents 91d3562 + 4d04342
commit db9be2c
Show file tree

Hide file tree

Showing 7 changed files with 161 additions and 146 deletions.
diff --git a/src/pages/workspace/AdminPolicyAccessOrNotFoundWrapper.tsx b/src/pages/workspace/AdminPolicyAccessOrNotFoundWrapper.tsx
@@ -9,6 +9,7 @@ import Navigation from '@libs/Navigation/Navigation';
 import * as PolicyUtils from '@libs/PolicyUtils';
 import NotFoundPage from '@pages/ErrorPage/NotFoundPage';
 import * as Policy from '@userActions/Policy';
+import type {TranslationPaths} from '@src/languages/types';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
 import type * as OnyxTypes from '@src/types/onyx';
@@ -28,6 +29,12 @@ type AdminPolicyAccessOrNotFoundComponentProps = AdminAccessOrNotFoundOnyxProps
 
     /** The report currently being looked at */
     policyID: string;
+
+    /** Function to call when pressing the navigation link */
+    onLinkPress?: () => void;
+
+    /** The key in the translations file to use for the subtitle */
+    subtitleKey?: TranslationPaths;
 };
 
 function AdminPolicyAccessOrNotFoundComponent(props: AdminPolicyAccessOrNotFoundComponentProps) {
@@ -45,7 +52,7 @@ function AdminPolicyAccessOrNotFoundComponent(props: AdminPolicyAccessOrNotFound
 
     const shouldShowFullScreenLoadingIndicator = props.isLoadingReportData !== false && (!Object.entries(props.policy ?? {}).length || !props.policy?.id);
 
-    const shouldShowNotFoundPage = isEmptyObject(props.policy) || !props.policy?.id || !PolicyUtils.isPolicyAdmin(props.policy);
+    const shouldShowNotFoundPage = isEmptyObject(props.policy) || !props.policy?.id || !PolicyUtils.isPolicyAdmin(props.policy) || PolicyUtils.isPendingDeletePolicy(props.policy);
 
     if (shouldShowFullScreenLoadingIndicator) {
         return <FullscreenLoadingIndicator />;
@@ -61,6 +68,8 @@ function AdminPolicyAccessOrNotFoundComponent(props: AdminPolicyAccessOrNotFound
                         shouldShow
                         shouldForceFullScreen
                         onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
+                        onLinkPress={props.onLinkPress}
+                        subtitleKey={props.subtitleKey}
                     />
                 </ScreenWrapper>
             );

diff --git a/src/pages/workspace/WorkspaceInviteMessagePage.tsx b/src/pages/workspace/WorkspaceInviteMessagePage.tsx
@@ -6,7 +6,6 @@ import {Keyboard, View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
 import type {GestureResponderEvent} from 'react-native/Libraries/Types/CoreEventTypes';
-import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
 import type {FormInputErrors} from '@components/Form/types';
@@ -37,6 +36,7 @@ import type SCREENS from '@src/SCREENS';
 import INPUT_IDS from '@src/types/form/WorkspaceInviteMessageForm';
 import type {InvitedEmailsToAccountIDs, PersonalDetailsList} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import SearchInputManager from './SearchInputManager';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
@@ -133,15 +133,14 @@ function WorkspaceInviteMessagePage({
     const policyName = policy?.name;
 
     return (
-        <ScreenWrapper
-            includeSafeAreaPaddingBottom={false}
-            testID={WorkspaceInviteMessagePage.displayName}
+        <AdminPolicyAccessOrNotFoundWrapper
+            policyID={route.params.policyID}
+            subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
+            onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
         >
-            <FullPageNotFoundView
-                shouldShow={isEmptyObject(policy) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy)}
-                subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
-                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
+            <ScreenWrapper
+                includeSafeAreaPaddingBottom={false}
+                testID={WorkspaceInviteMessagePage.displayName}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.inviteMessage.inviteMessageTitle')}
@@ -216,8 +215,8 @@ function WorkspaceInviteMessagePage({
                         />
                     </View>
                 </FormProvider>
-            </FullPageNotFoundView>
-        </ScreenWrapper>
+            </ScreenWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
     );
 }
 

diff --git a/src/pages/workspace/WorkspaceInvitePage.tsx b/src/pages/workspace/WorkspaceInvitePage.tsx
@@ -3,7 +3,6 @@ import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import type {SectionListData} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx';
-import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import FormAlertWithSubmitButton from '@components/FormAlertWithSubmitButton';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import {useOptionsList} from '@components/OptionListContextProvider';
@@ -33,6 +32,7 @@ import type SCREENS from '@src/SCREENS';
 import type {Beta, InvitedEmailsToAccountIDs} from '@src/types/onyx';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import SearchInputManager from './SearchInputManager';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
@@ -52,7 +52,7 @@ type WorkspaceInvitePageProps = WithPolicyAndFullscreenLoadingProps &
     WorkspaceInvitePageOnyxProps &
     StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.INVITE>;
 
-function WorkspaceInvitePage({route, betas, invitedEmailsToAccountIDsDraft, policy, isLoadingReportData = true}: WorkspaceInvitePageProps) {
+function WorkspaceInvitePage({route, betas, invitedEmailsToAccountIDsDraft, policy}: WorkspaceInvitePageProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
     const [searchTerm, setSearchTerm] = useState('');
@@ -280,18 +280,17 @@ function WorkspaceInvitePage({route, betas, invitedEmailsToAccountIDsDraft, poli
     );
 
     return (
-        <ScreenWrapper
-            shouldEnableMaxHeight
-            shouldUseCachedViewportHeight
-            testID={WorkspaceInvitePage.displayName}
-            includeSafeAreaPaddingBottom={false}
-            onEntryTransitionEnd={() => setDidScreenTransitionEnd(true)}
+        <AdminPolicyAccessOrNotFoundWrapper
+            policyID={route.params.policyID}
+            subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
+            onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
         >
-            <FullPageNotFoundView
-                shouldShow={(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy)}
-                subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
-                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
-                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
+            <ScreenWrapper
+                shouldEnableMaxHeight
+                shouldUseCachedViewportHeight
+                testID={WorkspaceInvitePage.displayName}
+                includeSafeAreaPaddingBottom={false}
+                onEntryTransitionEnd={() => setDidScreenTransitionEnd(true)}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.invite.invitePeople')}
@@ -321,8 +320,8 @@ function WorkspaceInvitePage({route, betas, invitedEmailsToAccountIDsDraft, poli
                     shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()}
                     footerContent={footerContent}
                 />
-            </FullPageNotFoundView>
-        </ScreenWrapper>
+            </ScreenWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
     );
 }
 

diff --git a/src/pages/workspace/WorkspaceNamePage.tsx b/src/pages/workspace/WorkspaceNamePage.tsx
@@ -15,6 +15,7 @@ import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import INPUT_IDS from '@src/types/form/WorkspaceSettingsForm';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import withPolicy from './withPolicy';
 import type {WithPolicyProps} from './withPolicy';
 
@@ -53,39 +54,41 @@ function WorkspaceNamePage({policy}: Props) {
     }, []);
 
     return (
-        <ScreenWrapper
-            includeSafeAreaPaddingBottom={false}
-            shouldEnableMaxHeight
-            testID={WorkspaceNamePage.displayName}
-        >
-            <HeaderWithBackButton
-                title={translate('workspace.editor.nameInputLabel')}
-                onBackButtonPress={() => Navigation.goBack()}
-            />
-
-            <FormProvider
-                formID={ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM}
-                submitButtonText={translate('workspace.editor.save')}
-                style={[styles.flexGrow1, styles.ph5]}
-                scrollContextEnabled
-                validate={validate}
-                onSubmit={submit}
-                enabledWhenOffline
+        <AdminPolicyAccessOrNotFoundWrapper policyID={policy?.id ?? ''}>
+            <ScreenWrapper
+                includeSafeAreaPaddingBottom={false}
+                shouldEnableMaxHeight
+                testID={WorkspaceNamePage.displayName}
             >
-                <View style={styles.mb4}>
-                    <InputWrapper
-                        InputComponent={TextInput}
-                        role={CONST.ROLE.PRESENTATION}
-                        inputID={INPUT_IDS.NAME}
-                        label={translate('workspace.editor.nameInputLabel')}
-                        accessibilityLabel={translate('workspace.editor.nameInputLabel')}
-                        defaultValue={policy?.name}
-                        spellCheck={false}
-                        autoFocus
-                    />
-                </View>
-            </FormProvider>
-        </ScreenWrapper>
+                <HeaderWithBackButton
+                    title={translate('workspace.editor.nameInputLabel')}
+                    onBackButtonPress={() => Navigation.goBack()}
+                />
+
+                <FormProvider
+                    formID={ONYXKEYS.FORMS.WORKSPACE_SETTINGS_FORM}
+                    submitButtonText={translate('workspace.editor.save')}
+                    style={[styles.flexGrow1, styles.ph5]}
+                    scrollContextEnabled
+                    validate={validate}
+                    onSubmit={submit}
+                    enabledWhenOffline
+                >
+                    <View style={styles.mb4}>
+                        <InputWrapper
+                            InputComponent={TextInput}
+                            role={CONST.ROLE.PRESENTATION}
+                            inputID={INPUT_IDS.NAME}
+                            label={translate('workspace.editor.nameInputLabel')}
+                            accessibilityLabel={translate('workspace.editor.nameInputLabel')}
+                            defaultValue={policy?.name}
+                            spellCheck={false}
+                            autoFocus
+                        />
+                    </View>
+                </FormProvider>
+            </ScreenWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
     );
 }
 

diff --git a/src/pages/workspace/WorkspaceProfileCurrencyPage.tsx b/src/pages/workspace/WorkspaceProfileCurrencyPage.tsx
@@ -1,7 +1,6 @@
 import React, {useState} from 'react';
 import type {OnyxEntry} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
-import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import ScreenWrapper from '@components/ScreenWrapper';
 import SelectionList from '@components/SelectionList';
@@ -13,6 +12,7 @@ import * as Policy from '@userActions/Policy';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {CurrencyList} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import type {WithPolicyAndFullscreenLoadingProps} from './withPolicyAndFullscreenLoading';
 import withPolicyAndFullscreenLoading from './withPolicyAndFullscreenLoading';
 
@@ -31,7 +31,7 @@ type WorkspaceProfileCurrencyPageSectionItem = {
 
 const getDisplayText = (currencyCode: string, currencySymbol: string) => `${currencyCode} - ${currencySymbol}`;
 
-function WorkspaceProfileCurrencyPage({currencyList = {}, policy, isLoadingReportData = true}: WorkspaceProfileCurrentPageProps) {
+function WorkspaceProfileCurrencyPage({currencyList = {}, policy}: WorkspaceProfileCurrentPageProps) {
     const {translate} = useLocalize();
     const [searchText, setSearchText] = useState('');
     const trimmedText = searchText.trim().toLowerCase();
@@ -71,15 +71,14 @@ function WorkspaceProfileCurrencyPage({currencyList = {}, policy, isLoadingRepor
     };
 
     return (
-        <ScreenWrapper
-            includeSafeAreaPaddingBottom={false}
-            testID={WorkspaceProfileCurrencyPage.displayName}
+        <AdminPolicyAccessOrNotFoundWrapper
+            policyID={policy?.id ?? ''}
+            onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
+            subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
         >
-            <FullPageNotFoundView
-                onBackButtonPress={PolicyUtils.goBackFromInvalidPolicy}
-                onLinkPress={PolicyUtils.goBackFromInvalidPolicy}
-                shouldShow={(isEmptyObject(policy) && !isLoadingReportData) || !PolicyUtils.isPolicyAdmin(policy) || PolicyUtils.isPendingDeletePolicy(policy)}
-                subtitleKey={isEmptyObject(policy) ? undefined : 'workspace.common.notAuthorized'}
+            <ScreenWrapper
+                includeSafeAreaPaddingBottom={false}
+                testID={WorkspaceProfileCurrencyPage.displayName}
             >
                 <HeaderWithBackButton
                     title={translate('workspace.editor.currencyInputLabel')}
@@ -97,8 +96,8 @@ function WorkspaceProfileCurrencyPage({currencyList = {}, policy, isLoadingRepor
                     initiallyFocusedOptionKey={initiallyFocusedOptionKey}
                     showScrollIndicator
                 />
-            </FullPageNotFoundView>
-        </ScreenWrapper>
+            </ScreenWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
     );
 }
 

diff --git a/src/pages/workspace/WorkspaceProfileDescriptionPage.tsx b/src/pages/workspace/WorkspaceProfileDescriptionPage.tsx
@@ -17,6 +17,7 @@ import variables from '@styles/variables';
 import * as Policy from '@userActions/Policy';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
+import AdminPolicyAccessOrNotFoundWrapper from './AdminPolicyAccessOrNotFoundWrapper';
 import withPolicy from './withPolicy';
 import type {WithPolicyProps} from './withPolicy';
 
@@ -68,47 +69,49 @@ function WorkspaceProfileDescriptionPage({policy}: Props) {
     );
 
     return (
-        <ScreenWrapper
-            includeSafeAreaPaddingBottom={false}
-            shouldEnableMaxHeight
-            testID={WorkspaceProfileDescriptionPage.displayName}
-        >
-            <HeaderWithBackButton
-                title={translate('workspace.editor.descriptionInputLabel')}
-                onBackButtonPress={() => Navigation.goBack()}
-            />
-
-            <FormProvider
-                formID={ONYXKEYS.FORMS.WORKSPACE_DESCRIPTION_FORM}
-                submitButtonText={translate('workspace.editor.save')}
-                style={[styles.flexGrow1, styles.ph5]}
-                scrollContextEnabled
-                onSubmit={submit}
-                validate={validate}
-                enabledWhenOffline
+        <AdminPolicyAccessOrNotFoundWrapper policyID={policy?.id ?? ''}>
+            <ScreenWrapper
+                includeSafeAreaPaddingBottom={false}
+                shouldEnableMaxHeight
+                testID={WorkspaceProfileDescriptionPage.displayName}
             >
-                <View style={styles.mb4}>
-                    <InputWrapper
-                        InputComponent={TextInput}
-                        role={CONST.ROLE.PRESENTATION}
-                        inputID="description"
-                        label={translate('workspace.editor.descriptionInputLabel')}
-                        accessibilityLabel={translate('workspace.editor.descriptionInputLabel')}
-                        value={description}
-                        maxLength={CONST.REPORT_DESCRIPTION.MAX_LENGTH}
-                        spellCheck={false}
-                        autoFocus
-                        onChangeText={setDescription}
-                        autoGrowHeight
-                        maxAutoGrowHeight={variables.textInputAutoGrowMaxHeight}
-                        isMarkdownEnabled
-                        ref={(el: BaseTextInputRef | null): void => {
-                            updateMultilineInputRange(el);
-                        }}
-                    />
-                </View>
-            </FormProvider>
-        </ScreenWrapper>
+                <HeaderWithBackButton
+                    title={translate('workspace.editor.descriptionInputLabel')}
+                    onBackButtonPress={() => Navigation.goBack()}
+                />
+
+                <FormProvider
+                    formID={ONYXKEYS.FORMS.WORKSPACE_DESCRIPTION_FORM}
+                    submitButtonText={translate('workspace.editor.save')}
+                    style={[styles.flexGrow1, styles.ph5]}
+                    scrollContextEnabled
+                    onSubmit={submit}
+                    validate={validate}
+                    enabledWhenOffline
+                >
+                    <View style={styles.mb4}>
+                        <InputWrapper
+                            InputComponent={TextInput}
+                            role={CONST.ROLE.PRESENTATION}
+                            inputID="description"
+                            label={translate('workspace.editor.descriptionInputLabel')}
+                            accessibilityLabel={translate('workspace.editor.descriptionInputLabel')}
+                            maxAutoGrowHeight={variables.textInputAutoGrowMaxHeight}
+                            value={description}
+                            maxLength={CONST.REPORT_DESCRIPTION.MAX_LENGTH}
+                            spellCheck={false}
+                            autoFocus
+                            onChangeText={setDescription}
+                            autoGrowHeight
+                            isMarkdownEnabled
+                            ref={(el: BaseTextInputRef | null): void => {
+                                updateMultilineInputRange(el);
+                            }}
+                        />
+                    </View>
+                </FormProvider>
+            </ScreenWrapper>
+        </AdminPolicyAccessOrNotFoundWrapper>
     );
 }