Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Workspace - Name RHP stays open while not found view is loading #40967

Merged
merged 6 commits into from
Apr 26, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 10 additions & 1 deletion src/pages/workspace/AdminPolicyAccessOrNotFoundWrapper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Expand All @@ -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) {
Expand All @@ -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 />;
Expand All @@ -61,6 +68,8 @@ function AdminPolicyAccessOrNotFoundComponent(props: AdminPolicyAccessOrNotFound
shouldShow
shouldForceFullScreen
onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_WORKSPACES)}
onLinkPress={props.onLinkPress}
subtitleKey={props.subtitleKey}
/>
</ScreenWrapper>
);
Expand Down
21 changes: 10 additions & 11 deletions src/pages/workspace/WorkspaceInviteMessagePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Expand Down Expand Up @@ -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';
Expand Down Expand Up @@ -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')}
Expand Down Expand Up @@ -216,8 +215,8 @@ function WorkspaceInviteMessagePage({
/>
</View>
</FormProvider>
</FullPageNotFoundView>
</ScreenWrapper>
</ScreenWrapper>
</AdminPolicyAccessOrNotFoundWrapper>
);
}

Expand Down
29 changes: 14 additions & 15 deletions src/pages/workspace/WorkspaceInvitePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Expand Down Expand Up @@ -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';
Expand All @@ -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('');
Expand Down Expand Up @@ -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')}
Expand Down Expand Up @@ -321,8 +320,8 @@ function WorkspaceInvitePage({route, betas, invitedEmailsToAccountIDsDraft, poli
shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()}
footerContent={footerContent}
/>
</FullPageNotFoundView>
</ScreenWrapper>
</ScreenWrapper>
</AdminPolicyAccessOrNotFoundWrapper>
);
}

Expand Down
67 changes: 35 additions & 32 deletions src/pages/workspace/WorkspaceNamePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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';

Expand Down Expand Up @@ -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>
);
}

Expand Down
23 changes: 11 additions & 12 deletions src/pages/workspace/WorkspaceProfileCurrencyPage.tsx
Original file line number Diff line number Diff line change
@@ -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';
Expand All @@ -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';

Expand All @@ -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();
Expand Down Expand Up @@ -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')}
Expand All @@ -97,8 +96,8 @@ function WorkspaceProfileCurrencyPage({currencyList = {}, policy, isLoadingRepor
initiallyFocusedOptionKey={initiallyFocusedOptionKey}
showScrollIndicator
/>
</FullPageNotFoundView>
</ScreenWrapper>
</ScreenWrapper>
</AdminPolicyAccessOrNotFoundWrapper>
);
}

Expand Down
83 changes: 43 additions & 40 deletions src/pages/workspace/WorkspaceProfileDescriptionPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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';

Expand Down Expand Up @@ -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>
);
}

Expand Down
Loading
Loading