0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00

fix(console): hide coming soon features from the downgrade plan modal (#4923)

This commit is contained in:
Xiao Yijun 2023-11-20 17:49:29 +08:00 committed by GitHub
parent 27fc7b9a3b
commit d0828834eb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 31 additions and 11 deletions

View file

@ -2,7 +2,10 @@ import classNames from 'classnames';
import { useMemo } from 'react';
import { planQuotaItemOrder } from '@/consts/plan-quotas';
import { type SubscriptionPlanQuota } from '@/types/subscriptions';
import {
type SubscriptionPlanQuotaEntries,
type SubscriptionPlanQuota,
} from '@/types/subscriptions';
import { sortBy } from '@/utils/sort';
import QuotaItem from './QuotaItem';
@ -27,9 +30,7 @@ function PlanQuotaList({
}: Props) {
const items = useMemo(() => {
// eslint-disable-next-line no-restricted-syntax
const entries = Object.entries(quota) as Array<
[keyof SubscriptionPlanQuota, SubscriptionPlanQuota[keyof SubscriptionPlanQuota]]
>;
const entries = Object.entries(quota) as SubscriptionPlanQuotaEntries;
const featuredEntries = featuredQuotaKeys
? entries.filter(([key]) => featuredQuotaKeys.includes(key))

View file

@ -3,7 +3,12 @@ import { useMemo } from 'react';
import { Trans, useTranslation } from 'react-i18next';
import PlanName from '@/components/PlanName';
import { type SubscriptionPlan } from '@/types/subscriptions';
import { comingSoonQuotaKeys } from '@/consts/plan-quotas';
import {
type SubscriptionPlanQuota,
type SubscriptionPlan,
type SubscriptionPlanQuotaEntries,
} from '@/types/subscriptions';
import PlanQuotaDiffCard from './PlanQuotaDiffCard';
import * as styles from './index.module.scss';
@ -13,6 +18,14 @@ type Props = {
targetPlan: SubscriptionPlan;
};
const excludeComingSoonFeatures = (
quotaDiff: Partial<SubscriptionPlanQuota>
): Partial<SubscriptionPlanQuota> => {
// eslint-disable-next-line no-restricted-syntax
const entries = Object.entries(quotaDiff) as SubscriptionPlanQuotaEntries;
return Object.fromEntries(entries.filter(([key]) => !comingSoonQuotaKeys.includes(key)));
};
function DowngradeConfirmModalContent({ currentPlan, targetPlan }: Props) {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
@ -21,12 +34,12 @@ function DowngradeConfirmModalContent({ currentPlan, targetPlan }: Props) {
const { quota: targetQuota, name: targetPlanName } = targetPlan;
const currentQuotaDiff = useMemo(
() => diff(targetQuota, currentQuota),
() => excludeComingSoonFeatures(diff(targetQuota, currentQuota)),
[currentQuota, targetQuota]
);
const targetQuotaDiff = useMemo(
() => diff(currentQuota, targetQuota),
() => excludeComingSoonFeatures(diff(currentQuota, targetQuota)),
[currentQuota, targetQuota]
);

View file

@ -11,7 +11,11 @@ import {
quotaItemNotEligiblePhrasesMap,
} from '@/consts/quota-item-phrases';
import DynamicT from '@/ds-components/DynamicT';
import { type SubscriptionPlan, type SubscriptionPlanQuota } from '@/types/subscriptions';
import {
type SubscriptionPlanQuotaEntries,
type SubscriptionPlan,
type SubscriptionPlanQuota,
} from '@/types/subscriptions';
import { sortBy } from '@/utils/sort';
import * as styles from './index.module.scss';
@ -36,9 +40,7 @@ function NotEligibleSwitchPlanModalContent({ targetPlan, isDowngrade = false }:
const orderedEntries = useMemo(() => {
// eslint-disable-next-line no-restricted-syntax
const entries = Object.entries(quota) as Array<
[keyof SubscriptionPlanQuota, SubscriptionPlanQuota[keyof SubscriptionPlanQuota]]
>;
const entries = Object.entries(quota) as SubscriptionPlanQuotaEntries;
return entries
.slice()
.sort(([preQuotaKey], [nextQuotaKey]) =>

View file

@ -22,6 +22,10 @@ export type SubscriptionPlanQuota = Omit<
ssoEnabled: boolean;
};
export type SubscriptionPlanQuotaEntries = Array<
[keyof SubscriptionPlanQuota, SubscriptionPlanQuota[keyof SubscriptionPlanQuota]]
>;
export type SubscriptionPlan = Omit<SubscriptionPlanResponse, 'quota'> & {
quota: SubscriptionPlanQuota;
};