diff --git a/packages/console/src/components/PlanQuotaList/index.tsx b/packages/console/src/components/PlanQuotaList/index.tsx index d7487e3d2..98562e8fc 100644 --- a/packages/console/src/components/PlanQuotaList/index.tsx +++ b/packages/console/src/components/PlanQuotaList/index.tsx @@ -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)) diff --git a/packages/console/src/pages/TenantSettings/Subscription/DowngradeConfirmModalContent/index.tsx b/packages/console/src/pages/TenantSettings/Subscription/DowngradeConfirmModalContent/index.tsx index 3a36df960..1dd925855 100644 --- a/packages/console/src/pages/TenantSettings/Subscription/DowngradeConfirmModalContent/index.tsx +++ b/packages/console/src/pages/TenantSettings/Subscription/DowngradeConfirmModalContent/index.tsx @@ -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 +): Partial => { + // 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] ); diff --git a/packages/console/src/pages/TenantSettings/components/NotEligibleSwitchPlanModalContent/index.tsx b/packages/console/src/pages/TenantSettings/components/NotEligibleSwitchPlanModalContent/index.tsx index 7e51188ee..ab15a75b1 100644 --- a/packages/console/src/pages/TenantSettings/components/NotEligibleSwitchPlanModalContent/index.tsx +++ b/packages/console/src/pages/TenantSettings/components/NotEligibleSwitchPlanModalContent/index.tsx @@ -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]) => diff --git a/packages/console/src/types/subscriptions.ts b/packages/console/src/types/subscriptions.ts index ea4fa2679..af9d3fe83 100644 --- a/packages/console/src/types/subscriptions.ts +++ b/packages/console/src/types/subscriptions.ts @@ -22,6 +22,10 @@ export type SubscriptionPlanQuota = Omit< ssoEnabled: boolean; }; +export type SubscriptionPlanQuotaEntries = Array< + [keyof SubscriptionPlanQuota, SubscriptionPlanQuota[keyof SubscriptionPlanQuota]] +>; + export type SubscriptionPlan = Omit & { quota: SubscriptionPlanQuota; };