From bff2ba7cc2ad7706582abeb68eb90c74d53e5460 Mon Sep 17 00:00:00 2001 From: miloschwartz Date: Sun, 29 Mar 2026 11:34:07 -0700 Subject: [PATCH] add learn more link --- .../(private)/idp/[idpId]/general/page.tsx | 3 +- .../settings/(private)/idp/create/page.tsx | 3 +- src/app/admin/idp/[idpId]/general/page.tsx | 6 +- src/app/admin/idp/create/page.tsx | 749 +++++++++--------- src/components/AutoProvisionConfigWidget.tsx | 9 +- .../IdpAutoProvisionUsersDescription.tsx | 29 + src/components/IdpCreateWizard.tsx | 4 +- 7 files changed, 420 insertions(+), 383 deletions(-) create mode 100644 src/components/IdpAutoProvisionUsersDescription.tsx diff --git a/src/app/[orgId]/settings/(private)/idp/[idpId]/general/page.tsx b/src/app/[orgId]/settings/(private)/idp/[idpId]/general/page.tsx index 37cf400a5..37334e342 100644 --- a/src/app/[orgId]/settings/(private)/idp/[idpId]/general/page.tsx +++ b/src/app/[orgId]/settings/(private)/idp/[idpId]/general/page.tsx @@ -45,6 +45,7 @@ import { useTranslations } from "next-intl"; import { AxiosResponse } from "axios"; import { ListRolesResponse } from "@server/routers/role"; import AutoProvisionConfigWidget from "@app/components/AutoProvisionConfigWidget"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { PaidFeaturesAlert } from "@app/components/PaidFeaturesAlert"; import { tierMatrix } from "@server/lib/billing/tierMatrix"; import { @@ -493,7 +494,7 @@ export default function GeneralPage() { {t("idpAutoProvisionUsers")} - {t("idpAutoProvisionUsersDescription")} + diff --git a/src/app/[orgId]/settings/(private)/idp/create/page.tsx b/src/app/[orgId]/settings/(private)/idp/create/page.tsx index c0fc30a8f..10d86b976 100644 --- a/src/app/[orgId]/settings/(private)/idp/create/page.tsx +++ b/src/app/[orgId]/settings/(private)/idp/create/page.tsx @@ -1,6 +1,7 @@ "use client"; import AutoProvisionConfigWidget from "@app/components/AutoProvisionConfigWidget"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { PaidFeaturesAlert } from "@app/components/PaidFeaturesAlert"; import { SettingsContainer, @@ -296,7 +297,7 @@ export default function Page() { {t("idpAutoProvisionUsers")} - {t("idpAutoProvisionUsersDescription")} + diff --git a/src/app/admin/idp/[idpId]/general/page.tsx b/src/app/admin/idp/[idpId]/general/page.tsx index d02925976..c9506b027 100644 --- a/src/app/admin/idp/[idpId]/general/page.tsx +++ b/src/app/admin/idp/[idpId]/general/page.tsx @@ -31,6 +31,7 @@ import { formatAxiosError } from "@app/lib/api"; import { createApiClient } from "@app/lib/api"; import { useEnvContext } from "@app/hooks/useEnvContext"; import { useState, useEffect } from "react"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { SwitchInput } from "@app/components/SwitchInput"; import { InfoSection, @@ -349,7 +350,7 @@ export default function GeneralPage() { {t("idpAutoProvisionUsers")} - {t("idpAutoProvisionUsersDescription")} + @@ -375,9 +376,6 @@ export default function GeneralPage() { />
- - {t("idpAutoProvisionUsersDescription")} - {form.watch("autoProvision") && ( {t.rich( diff --git a/src/app/admin/idp/create/page.tsx b/src/app/admin/idp/create/page.tsx index 5039d255c..82036c510 100644 --- a/src/app/admin/idp/create/page.tsx +++ b/src/app/admin/idp/create/page.tsx @@ -22,6 +22,7 @@ import { FormMessage } from "@app/components/ui/form"; import HeaderTitle from "@app/components/SettingsSectionTitle"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { SwitchInput } from "@app/components/SwitchInput"; import { Alert, AlertDescription, AlertTitle } from "@app/components/ui/alert"; import { Button } from "@app/components/ui/button"; @@ -94,8 +95,7 @@ export default function Page() { const watchedType = form.watch("type"); const templatesLocked = - !templatesPaid && - (watchedType === "google" || watchedType === "azure"); + !templatesPaid && (watchedType === "google" || watchedType === "azure"); async function onSubmit(data: CreateIdpFormValues) { if ( @@ -223,7 +223,9 @@ export default function Page() {
- - {t( - "idpAutoProvisionUsersDescription" - )} - @@ -251,391 +248,409 @@ export default function Page() { disabled={templatesLocked} className="min-w-0 border-0 p-0 m-0 disabled:pointer-events-none disabled:opacity-60" > - {watchedType === "google" && ( - - - - {t("idpGoogleConfigurationTitle")} - - - {t("idpGoogleConfigurationDescription")} - - - - -
- - ( - - - {t("idpClientId")} - - - - - - {t( - "idpGoogleClientIdDescription" - )} - - - - )} - /> - - ( - - - {t("idpClientSecret")} - - - - - - {t( - "idpGoogleClientSecretDescription" - )} - - - - )} - /> - - -
- - - )} - - {watchedType === "azure" && ( - - - - {t("idpAzureConfigurationTitle")} - - - {t("idpAzureConfigurationDescription")} - - - - -
- - ( - - - {t("idpTenantIdLabel")} - - - - - - {t( - "idpAzureTenantIdDescription" - )} - - - - )} - /> - - ( - - - {t("idpClientId")} - - - - - - {t( - "idpAzureClientIdDescription2" - )} - - - - )} - /> - - ( - - - {t("idpClientSecret")} - - - - - - {t( - "idpAzureClientSecretDescription2" - )} - - - - )} - /> - - -
- - - )} - - {watchedType === "oidc" && ( - + {watchedType === "google" && ( - {t("idpOidcConfigure")} + {t("idpGoogleConfigurationTitle")} - {t("idpOidcConfigureDescription")} + {t("idpGoogleConfigurationDescription")} -
- - ( - - - {t("idpClientId")} - - - - - - {t( - "idpClientIdDescription" - )} - - - + + + + > + ( + + + {t("idpClientId")} + + + + + + {t( + "idpGoogleClientIdDescription" + )} + + + + )} + /> - ( - - - {t("idpClientSecret")} - - - - - - {t( - "idpClientSecretDescription" - )} - - - - )} - /> - - ( - - - {t("idpAuthUrl")} - - - - - - {t( - "idpAuthUrlDescription" - )} - - - - )} - /> - - ( - - - {t("idpTokenUrl")} - - - - - - {t( - "idpTokenUrlDescription" - )} - - - - )} - /> - - + ( + + + {t( + "idpClientSecret" + )} + + + + + + {t( + "idpGoogleClientSecretDescription" + )} + + + + )} + /> + + +
+ )} + {watchedType === "azure" && ( - {t("idpToken")} + {t("idpAzureConfigurationTitle")} - {t("idpTokenDescription")} + {t("idpAzureConfigurationDescription")} -
- - ( - - - {t("idpJmespathLabel")} - - - - - - {t( - "idpJmespathLabelDescription" - )} - - - + + + + > + ( + + + {t( + "idpTenantIdLabel" + )} + + + + + + {t( + "idpAzureTenantIdDescription" + )} + + + + )} + /> - ( - - - {t( - "idpJmespathEmailPathOptional" - )} - - - - - - {t( - "idpJmespathEmailPathOptionalDescription" - )} - - - - )} - /> + ( + + + {t("idpClientId")} + + + + + + {t( + "idpAzureClientIdDescription2" + )} + + + + )} + /> - ( - - - {t( - "idpJmespathNamePathOptional" - )} - - - - - - {t( - "idpJmespathNamePathOptionalDescription" - )} - - - - )} - /> - - ( - - - {t( - "idpOidcConfigureScopes" - )} - - - - - - {t( - "idpOidcConfigureScopesDescription" - )} - - - - )} - /> - - + ( + + + {t( + "idpClientSecret" + )} + + + + + + {t( + "idpAzureClientSecretDescription2" + )} + + + + )} + /> + + +
- - )} + )} + + {watchedType === "oidc" && ( + + + + + {t("idpOidcConfigure")} + + + {t("idpOidcConfigureDescription")} + + + +
+ + ( + + + {t("idpClientId")} + + + + + + {t( + "idpClientIdDescription" + )} + + + + )} + /> + + ( + + + {t( + "idpClientSecret" + )} + + + + + + {t( + "idpClientSecretDescription" + )} + + + + )} + /> + + ( + + + {t("idpAuthUrl")} + + + + + + {t( + "idpAuthUrlDescription" + )} + + + + )} + /> + + ( + + + {t("idpTokenUrl")} + + + + + + {t( + "idpTokenUrlDescription" + )} + + + + )} + /> + + +
+ + + + + + {t("idpToken")} + + + {t("idpTokenDescription")} + + + +
+ + ( + + + {t( + "idpJmespathLabel" + )} + + + + + + {t( + "idpJmespathLabelDescription" + )} + + + + )} + /> + + ( + + + {t( + "idpJmespathEmailPathOptional" + )} + + + + + + {t( + "idpJmespathEmailPathOptionalDescription" + )} + + + + )} + /> + + ( + + + {t( + "idpJmespathNamePathOptional" + )} + + + + + + {t( + "idpJmespathNamePathOptionalDescription" + )} + + + + )} + /> + + ( + + + {t( + "idpOidcConfigureScopes" + )} + + + + + + {t( + "idpOidcConfigureScopesDescription" + )} + + + + )} + /> + + +
+ + + )} diff --git a/src/components/AutoProvisionConfigWidget.tsx b/src/components/AutoProvisionConfigWidget.tsx index 59849989a..d4df3f50d 100644 --- a/src/components/AutoProvisionConfigWidget.tsx +++ b/src/components/AutoProvisionConfigWidget.tsx @@ -1,14 +1,12 @@ "use client"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { FormDescription } from "@app/components/ui/form"; import { SwitchInput } from "@app/components/SwitchInput"; import { useTranslations } from "next-intl"; import { usePaidStatus } from "@app/hooks/usePaidStatus"; import { tierMatrix } from "@server/lib/billing/tierMatrix"; -import { - MappingBuilderRule, - RoleMappingMode -} from "@app/lib/idpRoleMapping"; +import { MappingBuilderRule, RoleMappingMode } from "@app/lib/idpRoleMapping"; import RoleMappingConfigFields from "@app/components/RoleMappingConfigFields"; type Role = { @@ -60,9 +58,6 @@ export default function AutoProvisionConfigWidget({ onCheckedChange={onAutoProvisionChange} disabled={!isPaidUser(tierMatrix.autoProvisioning)} /> - - {t("idpAutoProvisionUsersDescription")} -
{autoProvision && ( diff --git a/src/components/IdpAutoProvisionUsersDescription.tsx b/src/components/IdpAutoProvisionUsersDescription.tsx new file mode 100644 index 000000000..6839ff245 --- /dev/null +++ b/src/components/IdpAutoProvisionUsersDescription.tsx @@ -0,0 +1,29 @@ +"use client"; + +import { useTranslations } from "next-intl"; + +const AUTO_PROVISION_DOCS_URL = + "https://docs.pangolin.net/manage/identity-providers/auto-provisioning"; + +type IdpAutoProvisionUsersDescriptionProps = { + className?: string; +}; + +export default function IdpAutoProvisionUsersDescription({ + className +}: IdpAutoProvisionUsersDescriptionProps) { + const t = useTranslations(); + return ( + + {t("idpAutoProvisionUsersDescription")}{" "} + + {t("learnMore")} + + + ); +} diff --git a/src/components/IdpCreateWizard.tsx b/src/components/IdpCreateWizard.tsx index 3fe7e174f..cddad3287 100644 --- a/src/components/IdpCreateWizard.tsx +++ b/src/components/IdpCreateWizard.tsx @@ -27,6 +27,7 @@ import { Checkbox } from "@app/components/ui/checkbox"; import { Alert, AlertDescription, AlertTitle } from "@app/components/ui/alert"; import { InfoIcon, ExternalLink } from "lucide-react"; import { StrategySelect } from "@app/components/StrategySelect"; +import IdpAutoProvisionUsersDescription from "@app/components/IdpAutoProvisionUsersDescription"; import { SwitchInput } from "@app/components/SwitchInput"; import { Badge } from "@app/components/ui/badge"; import { useTranslations } from "next-intl"; @@ -163,9 +164,6 @@ export function IdpCreateWizard({ disabled={loading} /> - - {t("idpAutoProvisionUsersDescription")} -