Skip to content

Commit ce82a83

Browse files
dangrousdangrous
authored
Merge pull request Expensify#66708 from twilight2294/downgradeBlock
2 parents b2a8875 + 9514d93 commit ce82a83

9 files changed

Lines changed: 129 additions & 40 deletions

File tree

‎src/ROUTES.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -213,6 +213,10 @@ const ROUTES = {
213213
SETTINGS_SUBSCRIPTION_CHANGE_PAYMENT_CURRENCY: 'settings/subscription/add-payment-card/change-payment-currency',
214214
SETTINGS_SUBSCRIPTION_DISABLE_AUTO_RENEW_SURVEY: 'settings/subscription/disable-auto-renew-survey',
215215
SETTINGS_SUBSCRIPTION_REQUEST_EARLY_CANCELLATION: 'settings/subscription/request-early-cancellation-survey',
216+
SETTINGS_SUBSCRIPTION_DOWNGRADE_BLOCKED: {
217+
route: 'settings/subscription/downgrade-blocked',
218+
getRoute: (backTo?: string) => getUrlWithBackToParam('settings/subscription/downgrade-blocked', backTo),
219+
},
216220
SETTINGS_PRIORITY_MODE: 'settings/preferences/priority-mode',
217221
SETTINGS_LANGUAGE: 'settings/preferences/language',
218222
SETTINGS_PAYMENT_CURRENCY: 'setting/preferences/payment-currency',

‎src/SCREENS.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -168,6 +168,7 @@ const SCREENS = {
168168
CHANGE_BILLING_CURRENCY: 'Settings_Subscription_Change_Billing_Currency',
169169
CHANGE_PAYMENT_CURRENCY: 'Settings_Subscription_Change_Payment_Currency',
170170
REQUEST_EARLY_CANCELLATION: 'Settings_Subscription_RequestEarlyCancellation',
171+
SUBSCRIPTION_DOWNGRADE_BLOCKED: 'Settings_Subscription_DowngradeBlocked',
171172
},
172173
},
173174
TWO_FACTOR_AUTH: {

‎src/components/SubscriptionPlanDowngradeBlocked.tsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import React from 'react';
2+
import {View} from 'react-native';
3+
import type {OnyxEntry} from 'react-native-onyx';
4+
import useLocalize from '@hooks/useLocalize';
5+
import useThemeStyles from '@hooks/useThemeStyles';
6+
import type {PrivateSubscription} from '@src/types/onyx';
7+
import Button from './Button';
8+
import FixedFooter from './FixedFooter';
9+
import Text from './Text';
10+
11+
type SubscriptionPlanDowngradeBlockedProps = {
12+
privateSubscription: OnyxEntry<PrivateSubscription>;
13+
formattedSubscriptionEndDate: string;
14+
onClosePress: () => void;
15+
};
16+
17+
function SubscriptionPlanDowngradeBlocked({privateSubscription, formattedSubscriptionEndDate, onClosePress}: SubscriptionPlanDowngradeBlockedProps) {
18+
const {translate} = useLocalize();
19+
const styles = useThemeStyles();
20+
return (
21+
<View style={[styles.flexGrow1]}>
22+
<Text style={[styles.ph5, styles.pb5, styles.textNormalThemeText]}>{translate('subscription.subscriptionSize.youCantDowngrade')}</Text>
23+
<Text style={[styles.ph5, styles.textNormalThemeText]}>
24+
{translate('subscription.subscriptionSize.youAlreadyCommitted', {
25+
size: privateSubscription?.userCount ?? 0,
26+
date: formattedSubscriptionEndDate,
27+
})}
28+
</Text>
29+
<FixedFooter style={[styles.mtAuto]}>
30+
<Button
31+
success
32+
large
33+
onPress={onClosePress}
34+
text={translate('common.close')}
35+
/>
36+
</FixedFooter>
37+
</View>
38+
);
39+
}
40+
41+
SubscriptionPlanDowngradeBlocked.displayName = 'SubscriptionPlanDowngradeBlocked';
42+
export default SubscriptionPlanDowngradeBlocked;

‎src/libs/Navigation/AppNavigator/ModalStackNavigators/index.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -310,6 +310,8 @@ const SettingsModalStackNavigator = createModalStackNavigator<SettingsNavigatorP
310310
[SCREENS.SETTINGS.SUBSCRIPTION.SETTINGS_DETAILS]: () => require<ReactComponentModule>('../../../../pages/settings/Subscription/SubscriptionSettings').default,
311311
[SCREENS.SETTINGS.SUBSCRIPTION.DISABLE_AUTO_RENEW_SURVEY]: () => require<ReactComponentModule>('../../../../pages/settings/Subscription/DisableAutoRenewSurveyPage').default,
312312
[SCREENS.SETTINGS.SUBSCRIPTION.REQUEST_EARLY_CANCELLATION]: () => require<ReactComponentModule>('../../../../pages/settings/Subscription/RequestEarlyCancellationPage').default,
313+
[SCREENS.SETTINGS.SUBSCRIPTION.SUBSCRIPTION_DOWNGRADE_BLOCKED]: () =>
314+
require<ReactComponentModule>('../../../../pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanDowngradeBlockedPage').default,
313315
[SCREENS.WORKSPACE.INVITE]: () => require<ReactComponentModule>('../../../../pages/workspace/WorkspaceInvitePage').default,
314316
[SCREENS.WORKSPACE.MEMBERS_IMPORT]: () => require<ReactComponentModule>('../../../../pages/workspace/members/ImportMembersPage').default,
315317
[SCREENS.WORKSPACE.MEMBERS_IMPORTED]: () => require<ReactComponentModule>('../../../../pages/workspace/members/ImportedMembersPage').default,

‎src/libs/Navigation/linkingConfig/RELATIONS/SETTINGS_TO_RHP.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ const SETTINGS_TO_RHP: Partial<Record<keyof SettingsSplitNavigatorParamList, str
7272
SCREENS.SETTINGS.SUBSCRIPTION.CHANGE_BILLING_CURRENCY,
7373
SCREENS.SETTINGS.SUBSCRIPTION.CHANGE_PAYMENT_CURRENCY,
7474
SCREENS.SETTINGS.SUBSCRIPTION.SETTINGS_DETAILS,
75+
SCREENS.SETTINGS.SUBSCRIPTION.SUBSCRIPTION_DOWNGRADE_BLOCKED,
7576
],
7677
};
7778

‎src/libs/Navigation/linkingConfig/config.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -381,6 +381,9 @@ const config: LinkingOptions<RootNavigatorParamList>['config'] = {
381381
[SCREENS.SETTINGS.SUBSCRIPTION.REQUEST_EARLY_CANCELLATION]: {
382382
path: ROUTES.SETTINGS_SUBSCRIPTION_REQUEST_EARLY_CANCELLATION,
383383
},
384+
[SCREENS.SETTINGS.SUBSCRIPTION.SUBSCRIPTION_DOWNGRADE_BLOCKED]: {
385+
path: ROUTES.SETTINGS_SUBSCRIPTION_DOWNGRADE_BLOCKED.route,
386+
},
384387
[SCREENS.WORKSPACE.CURRENCY]: {
385388
path: ROUTES.WORKSPACE_OVERVIEW_CURRENCY.route,
386389
},

‎src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanCardActionButton.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ function SubscriptionPlanCardActionButton({subscriptionPlan, isFromComparisonMod
4242
const hasTeam2025Pricing = useHasTeam2025Pricing();
4343
const currentUserAccountID = getCurrentUserAccountID();
4444
const [policies] = useOnyx(ONYXKEYS.COLLECTION.POLICY, {canBeMissing: false});
45+
const [account] = useOnyx(ONYXKEYS.ACCOUNT, {canBeMissing: false});
4546
const privateSubscription = usePrivateSubscription();
4647
const isAnnual = privateSubscription?.type === CONST.SUBSCRIPTION.TYPE.ANNUAL;
4748
const ownerPolicies = useMemo(() => getOwnedPaidPolicies(policies, currentUserAccountID), [policies, currentUserAccountID]);
@@ -61,6 +62,10 @@ function SubscriptionPlanCardActionButton({subscriptionPlan, isFromComparisonMod
6162
if (!ownerPolicies.length) {
6263
return;
6364
}
65+
if (planType === CONST.POLICY.TYPE.TEAM && privateSubscription?.type === CONST.SUBSCRIPTION.TYPE.ANNUAL && !account?.canDowngrade) {
66+
Navigation.navigate(ROUTES.SETTINGS_SUBSCRIPTION_DOWNGRADE_BLOCKED.getRoute(Navigation.getActiveRoute()));
67+
return;
68+
}
6469

6570
if (planType === CONST.POLICY.TYPE.TEAM) {
6671
Navigation.navigate(ROUTES.WORKSPACE_DOWNGRADE.getRoute(policy?.id, Navigation.getActiveRoute()));

‎src/pages/settings/Subscription/SubscriptionPlan/SubscriptionPlanDowngradeBlockedPage.tsx‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import React from 'react';
2+
import DelegateNoAccessWrapper from '@components/DelegateNoAccessWrapper';
3+
import HeaderWithBackButton from '@components/HeaderWithBackButton';
4+
import ScreenWrapper from '@components/ScreenWrapper';
5+
import SubscriptionPlanDowngradeBlocked from '@components/SubscriptionPlanDowngradeBlocked';
6+
import useLocalize from '@hooks/useLocalize';
7+
import useOnyx from '@hooks/useOnyx';
8+
import Navigation from '@navigation/Navigation';
9+
import {formatSubscriptionEndDate} from '@pages/settings/Subscription/utils';
10+
import CONST from '@src/CONST';
11+
import ONYXKEYS from '@src/ONYXKEYS';
12+
13+
function SubscriptionPlanDowngradeBlockedPage() {
14+
const {translate} = useLocalize();
15+
const [privateSubscription] = useOnyx(ONYXKEYS.NVP_PRIVATE_SUBSCRIPTION, {canBeMissing: false});
16+
const formattedSubscriptionEndDate = formatSubscriptionEndDate(privateSubscription?.endDate);
17+
const onClosePress = () => {
18+
Navigation.goBack();
19+
};
20+
return (
21+
<ScreenWrapper
22+
testID={SubscriptionPlanDowngradeBlockedPage.displayName}
23+
includeSafeAreaPaddingBottom
24+
shouldEnableMaxHeight
25+
>
26+
<DelegateNoAccessWrapper accessDeniedVariants={[CONST.DELEGATE.DENIED_ACCESS_VARIANTS.DELEGATE]}>
27+
<HeaderWithBackButton
28+
title={translate('workspace.common.planType')}
29+
onBackButtonPress={onClosePress}
30+
/>
31+
<SubscriptionPlanDowngradeBlocked
32+
privateSubscription={privateSubscription}
33+
formattedSubscriptionEndDate={formattedSubscriptionEndDate}
34+
onClosePress={onClosePress}
35+
/>
36+
</DelegateNoAccessWrapper>
37+
</ScreenWrapper>
38+
);
39+
}
40+
41+
SubscriptionPlanDowngradeBlockedPage.displayName = 'SubscriptionPlanDowngradeBlockedPage';
42+
43+
export default SubscriptionPlanDowngradeBlockedPage;

‎src/pages/settings/Subscription/SubscriptionSize/substeps/Confirmation.tsx‎

Lines changed: 28 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {View} from 'react-native';
33
import Button from '@components/Button';
44
import FixedFooter from '@components/FixedFooter';
55
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
6+
import SubscriptionPlanDowngradeBlocked from '@components/SubscriptionPlanDowngradeBlocked';
67
import Text from '@components/Text';
78
import useLocalize from '@hooks/useLocalize';
89
import useOnyx from '@hooks/useOnyx';
@@ -34,49 +35,36 @@ function Confirmation({onNext, isEditing}: ConfirmationProps) {
3435
Navigation.goBack();
3536
};
3637

38+
if (!canChangeSubscriptionSize) {
39+
return (
40+
<SubscriptionPlanDowngradeBlocked
41+
privateSubscription={privateSubscription}
42+
formattedSubscriptionEndDate={formattedSubscriptionEndDate}
43+
onClosePress={onClosePress}
44+
/>
45+
);
46+
}
47+
3748
return (
3849
<View style={[styles.flexGrow1]}>
39-
{canChangeSubscriptionSize ? (
40-
<>
41-
<Text style={[styles.ph5, styles.pb3]}>{translate('subscription.subscriptionSize.confirmDetails')}</Text>
42-
<MenuItemWithTopDescription
43-
interactive={false}
44-
description={translate('subscription.subscriptionSize.subscriptionSize')}
45-
title={translate('subscription.subscriptionSize.activeMembers', {size: subscriptionSize})}
46-
/>
47-
<MenuItemWithTopDescription
48-
interactive={false}
49-
description={translate('subscription.subscriptionSize.subscriptionRenews')}
50-
title={subscriptionRenewalDate}
51-
/>
52-
</>
53-
) : (
54-
<>
55-
<Text style={[styles.ph5, styles.pb5, styles.textNormalThemeText]}>{translate('subscription.subscriptionSize.youCantDowngrade')}</Text>
56-
<Text style={[styles.ph5, styles.textNormalThemeText]}>
57-
{translate('subscription.subscriptionSize.youAlreadyCommitted', {
58-
size: privateSubscription?.userCount ?? 0,
59-
date: formattedSubscriptionEndDate,
60-
})}
61-
</Text>
62-
</>
63-
)}
50+
<Text style={[styles.ph5, styles.pb3]}>{translate('subscription.subscriptionSize.confirmDetails')}</Text>
51+
<MenuItemWithTopDescription
52+
interactive={false}
53+
description={translate('subscription.subscriptionSize.subscriptionSize')}
54+
title={translate('subscription.subscriptionSize.activeMembers', {size: subscriptionSize})}
55+
/>
56+
<MenuItemWithTopDescription
57+
interactive={false}
58+
description={translate('subscription.subscriptionSize.subscriptionRenews')}
59+
title={subscriptionRenewalDate}
60+
/>
6461
<FixedFooter style={[styles.mtAuto]}>
65-
{canChangeSubscriptionSize ? (
66-
<Button
67-
success
68-
large
69-
onPress={onNext}
70-
text={translate('common.save')}
71-
/>
72-
) : (
73-
<Button
74-
success
75-
large
76-
onPress={onClosePress}
77-
text={translate('common.close')}
78-
/>
79-
)}
62+
<Button
63+
success
64+
large
65+
onPress={onNext}
66+
text={translate('common.save')}
67+
/>
8068
</FixedFooter>
8169
</View>
8270
);

0 commit comments

Comments
 (0)