diff --git a/packages/console/src/components/Guide/hooks.ts b/packages/console/src/components/Guide/hooks.ts index 13fe41bac..6c59e326d 100644 --- a/packages/console/src/components/Guide/hooks.ts +++ b/packages/console/src/components/Guide/hooks.ts @@ -1,8 +1,10 @@ -import { useCallback, useMemo } from 'react'; +import { ApplicationType } from '@logto/schemas'; +import { useCallback, useMemo, useContext } from 'react'; import { guides } from '@/assets/docs/guides'; import { type Guide } from '@/assets/docs/guides/types'; import { isCloud as isCloudEnv, isDevFeaturesEnabled } from '@/consts/env'; +import { SubscriptionDataContext } from '@/contexts/SubscriptionDataProvider'; import { thirdPartyAppCategory, type AppGuideCategory, @@ -34,12 +36,28 @@ export const useAppGuideMetadata = (): { filters?: FilterOptions ) => Record; } => { + const { currentSubscriptionQuota } = useContext(SubscriptionDataContext); + const appGuides = useMemo( () => - guides.filter( - ({ metadata: { target, isCloud, isDevFeature } }) => - target !== 'API' && (isCloudEnv || !isCloud) && (isDevFeaturesEnabled || !isDevFeature) - ), + guides + .filter( + ({ metadata: { target, isCloud, isDevFeature } }) => + target !== 'API' && (isCloudEnv || !isCloud) && (isDevFeaturesEnabled || !isDevFeature) + /** + * Show SAML guides when it is: + * 1. Cloud env + * 2. `isDevFeatureEnabled` is true + * 3. `quota.samlApplicationsLimit` is not 0. + */ + ) + .filter( + ({ metadata: { target } }) => + target !== ApplicationType.SAML || + (isCloudEnv && + isDevFeaturesEnabled && + currentSubscriptionQuota.samlApplicationsLimit !== 0) + ), [] ); diff --git a/packages/console/src/pages/Applications/components/GuideLibrary/index.tsx b/packages/console/src/pages/Applications/components/GuideLibrary/index.tsx index 97314b84f..a76bf8f0a 100644 --- a/packages/console/src/pages/Applications/components/GuideLibrary/index.tsx +++ b/packages/console/src/pages/Applications/components/GuideLibrary/index.tsx @@ -10,7 +10,7 @@ import FeatureTag from '@/components/FeatureTag'; import { type SelectedGuide } from '@/components/Guide/GuideCard'; import GuideCardGroup from '@/components/Guide/GuideCardGroup'; import { useAppGuideMetadata } from '@/components/Guide/hooks'; -import { isCloud } from '@/consts/env'; +import { isDevFeaturesEnabled, isCloud } from '@/consts/env'; import { latestProPlanId } from '@/consts/subscriptions'; import { SubscriptionDataContext } from '@/contexts/SubscriptionDataProvider'; import { CheckboxGroup } from '@/ds-components/Checkbox'; @@ -93,6 +93,19 @@ function GuideLibrary({ className, hasCardBorder, hasCardButton, onSelectGuide } + category !== 'SAML' || + (isCloud && + isDevFeaturesEnabled && + currentSubscriptionQuota.samlApplicationsLimit !== 0) + ) .filter((category) => isCloud || category !== 'Protected') .map((category) => ({ title: `guide.categories.${category}`,