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:
parent
27fc7b9a3b
commit
d0828834eb
4 changed files with 31 additions and 11 deletions
|
@ -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))
|
||||
|
|
|
@ -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]
|
||||
);
|
||||
|
||||
|
|
|
@ -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]) =>
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue