From 5758f84f5e56c4df4d782f482ce2efc35235eb98 Mon Sep 17 00:00:00 2001 From: Xiao Yijun Date: Wed, 27 Mar 2024 16:52:40 +0800 Subject: [PATCH] feat(console): support signing-key rotation for oss version (#5559) --- .changeset/curvy-paws-breathe.md | 6 ++ packages/console/src/assets/icons/key.svg | 3 + packages/console/src/consts/external-links.ts | 1 + .../ConsoleContent/Sidebar/hook.tsx | 5 ++ .../src/containers/ConsoleContent/index.tsx | 2 + .../SigningKeyFormCard}/index.module.scss | 0 .../SigningKeyFormCard}/index.tsx | 58 +++++++------------ .../src/pages/SigningKeys/index.module.scss | 14 +++++ .../console/src/pages/SigningKeys/index.tsx | 30 ++++++++++ .../TenantBasicSettings/index.tsx | 2 - .../de/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 44 ++++++++++++++ .../de/translation/admin-console/tabs.ts | 1 + .../de/translation/admin-console/tenants.ts | 42 -------------- .../en/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../en/translation/admin-console/tabs.ts | 1 + .../en/translation/admin-console/tenants.ts | 41 ------------- .../es/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../es/translation/admin-console/tabs.ts | 1 + .../es/translation/admin-console/tenants.ts | 41 ------------- .../fr/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 44 ++++++++++++++ .../fr/translation/admin-console/tabs.ts | 1 + .../fr/translation/admin-console/tenants.ts | 42 -------------- .../it/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../it/translation/admin-console/tabs.ts | 1 + .../it/translation/admin-console/tenants.ts | 41 ------------- .../ja/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../ja/translation/admin-console/tabs.ts | 1 + .../ja/translation/admin-console/tenants.ts | 41 ------------- .../ko/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../ko/translation/admin-console/tabs.ts | 1 + .../ko/translation/admin-console/tenants.ts | 41 ------------- .../pl-pl/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../pl-pl/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 42 -------------- .../pt-br/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../pt-br/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- .../pt-pt/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../pt-pt/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- .../ru/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../ru/translation/admin-console/tabs.ts | 1 + .../ru/translation/admin-console/tenants.ts | 41 ------------- .../tr-tr/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 44 ++++++++++++++ .../tr-tr/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- .../zh-cn/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../zh-cn/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- .../zh-hk/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../zh-hk/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- .../zh-tw/translation/admin-console/index.ts | 2 + .../translation/admin-console/signing-keys.ts | 43 ++++++++++++++ .../zh-tw/translation/admin-console/tabs.ts | 1 + .../translation/admin-console/tenants.ts | 41 ------------- 70 files changed, 775 insertions(+), 657 deletions(-) create mode 100644 .changeset/curvy-paws-breathe.md create mode 100644 packages/console/src/assets/icons/key.svg rename packages/console/src/pages/{TenantSettings/TenantBasicSettings/SigningKeys => SigningKeys/SigningKeyFormCard}/index.module.scss (100%) rename packages/console/src/pages/{TenantSettings/TenantBasicSettings/SigningKeys => SigningKeys/SigningKeyFormCard}/index.tsx (75%) create mode 100644 packages/console/src/pages/SigningKeys/index.module.scss create mode 100644 packages/console/src/pages/SigningKeys/index.tsx create mode 100644 packages/phrases/src/locales/de/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/en/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/es/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/fr/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/it/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/ja/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/ko/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/pl-pl/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/pt-br/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/pt-pt/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/ru/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/tr-tr/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/zh-cn/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/zh-hk/translation/admin-console/signing-keys.ts create mode 100644 packages/phrases/src/locales/zh-tw/translation/admin-console/signing-keys.ts diff --git a/.changeset/curvy-paws-breathe.md b/.changeset/curvy-paws-breathe.md new file mode 100644 index 000000000..0294f1e19 --- /dev/null +++ b/.changeset/curvy-paws-breathe.md @@ -0,0 +1,6 @@ +--- +"@logto/console": minor +"@logto/phrases": minor +--- + +feat(console): support signing-key rotation diff --git a/packages/console/src/assets/icons/key.svg b/packages/console/src/assets/icons/key.svg new file mode 100644 index 000000000..821b2ce86 --- /dev/null +++ b/packages/console/src/assets/icons/key.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/console/src/consts/external-links.ts b/packages/console/src/consts/external-links.ts index f86437c5c..bfd69f3e2 100644 --- a/packages/console/src/consts/external-links.ts +++ b/packages/console/src/consts/external-links.ts @@ -23,3 +23,4 @@ export const logtoThirdPartyGuideLink = '/docs/recipes/logto-as-idp/'; export const logtoThirdPartyAppPermissionsLink = '/docs/recipes/logto-as-idp/permissions-management/'; export const logtoThirdPartyAppBrandingLink = '/docs/recipes/logto-as-idp/branding-customization/'; +export const signingKeysLink = '/docs/recipes/openid-connect/signing-keys-rotation/'; diff --git a/packages/console/src/containers/ConsoleContent/Sidebar/hook.tsx b/packages/console/src/containers/ConsoleContent/Sidebar/hook.tsx index 5ea3954bc..e85ef4af1 100644 --- a/packages/console/src/containers/ConsoleContent/Sidebar/hook.tsx +++ b/packages/console/src/containers/ConsoleContent/Sidebar/hook.tsx @@ -9,6 +9,7 @@ import Connection from '@/assets/icons/connection.svg'; import Gear from '@/assets/icons/gear.svg'; import Hook from '@/assets/icons/hook.svg'; import JwtClaims from '@/assets/icons/jwt-claims.svg'; +import Key from '@/assets/icons/key.svg'; import List from '@/assets/icons/list.svg'; import Organization from '@/assets/icons/organization.svg'; import UserProfile from '@/assets/icons/profile.svg'; @@ -116,6 +117,10 @@ export const useSidebarMenuItems = (): { { title: 'developer', items: [ + { + Icon: Key, + title: 'signing_keys', + }, { Icon: JwtClaims, title: 'jwt_customizer', diff --git a/packages/console/src/containers/ConsoleContent/index.tsx b/packages/console/src/containers/ConsoleContent/index.tsx index eea7da055..323bac321 100644 --- a/packages/console/src/containers/ConsoleContent/index.tsx +++ b/packages/console/src/containers/ConsoleContent/index.tsx @@ -48,6 +48,7 @@ import RoleUsers from '@/pages/RoleDetails/RoleUsers'; import Roles from '@/pages/Roles'; import SignInExperience from '@/pages/SignInExperience'; import { SignInExperienceTab } from '@/pages/SignInExperience/types'; +import SigningKeys from '@/pages/SigningKeys'; import TenantSettings from '@/pages/TenantSettings'; import BillingHistory from '@/pages/TenantSettings/BillingHistory'; import Subscription from '@/pages/TenantSettings/Subscription'; @@ -193,6 +194,7 @@ function ConsoleContent() { } /> } /> + } /> {isCloud && ( }> } /> diff --git a/packages/console/src/pages/TenantSettings/TenantBasicSettings/SigningKeys/index.module.scss b/packages/console/src/pages/SigningKeys/SigningKeyFormCard/index.module.scss similarity index 100% rename from packages/console/src/pages/TenantSettings/TenantBasicSettings/SigningKeys/index.module.scss rename to packages/console/src/pages/SigningKeys/SigningKeyFormCard/index.module.scss diff --git a/packages/console/src/pages/TenantSettings/TenantBasicSettings/SigningKeys/index.tsx b/packages/console/src/pages/SigningKeys/SigningKeyFormCard/index.tsx similarity index 75% rename from packages/console/src/pages/TenantSettings/TenantBasicSettings/SigningKeys/index.tsx rename to packages/console/src/pages/SigningKeys/SigningKeyFormCard/index.tsx index 14e47b956..180279fdb 100644 --- a/packages/console/src/pages/TenantSettings/TenantBasicSettings/SigningKeys/index.tsx +++ b/packages/console/src/pages/SigningKeys/SigningKeyFormCard/index.tsx @@ -13,24 +13,25 @@ import Delete from '@/assets/icons/delete.svg'; import FormCard from '@/components/FormCard'; import Button from '@/ds-components/Button'; import DangerConfirmModal from '@/ds-components/DeleteConfirmModal'; -import DynamicT from '@/ds-components/DynamicT'; import FormField from '@/ds-components/FormField'; import IconButton from '@/ds-components/IconButton'; import Select from '@/ds-components/Select'; -import TabNav, { TabNavItem } from '@/ds-components/TabNav'; import Table from '@/ds-components/Table'; import Tag from '@/ds-components/Tag'; import useApi, { type RequestError } from '@/hooks/use-api'; import * as styles from './index.module.scss'; -function SigningKeys() { +type Props = { + keyType: LogtoOidcConfigKeyType; +}; + +function SigningKeyFormCard({ keyType }: Props) { const api = useApi(); - const { t } = useTranslation(undefined, { keyPrefix: 'admin_console.tenants.signing_keys' }); - const [keyType, setKeyType] = useState( - LogtoOidcConfigKeyType.PrivateKeys - ); + const { t } = useTranslation(undefined, { keyPrefix: 'admin_console.signing_keys' }); + const isPrivateKey = keyType === LogtoOidcConfigKeyType.PrivateKeys; + const keyTypePhrase = isPrivateKey ? 'private' : 'cookie'; const { data, error, mutate } = useSWR( `api/configs/oidc/${keyType}` @@ -96,26 +97,11 @@ function SigningKeys() { ); return ( - - - { - setKeyType(LogtoOidcConfigKeyType.PrivateKeys); - }} - > - - - { - setKeyType(LogtoOidcConfigKeyType.CookieKeys); - }} - > - - - - + + - +
-
- {t(`rotate_${isPrivateKey ? 'private' : 'cookie'}_keys_description`)} -
+
{t(`rotate_${keyTypePhrase}_keys_description`)}
{ setShowRotateConfirmModal(false); @@ -164,11 +148,11 @@ function SigningKeys() { > }}> - {t(`reminder.rotate_${isPrivateKey ? 'private' : 'cookie'}_key`)} + {t(`reminder.rotate_${keyTypePhrase}_key`)} {isPrivateKey && ( - +