diff --git a/.changeset/fix-api-keys-revoke-localization.md b/.changeset/fix-api-keys-revoke-localization.md new file mode 100644 index 00000000000..e5d42db3cfd --- /dev/null +++ b/.changeset/fix-api-keys-revoke-localization.md @@ -0,0 +1,7 @@ +--- +'@clerk/localizations': patch +'@clerk/shared': patch +'@clerk/clerk-js': patch +--- + +Fixed API keys "Revoke" confirmation modal being stuck disabled when using a localization. diff --git a/packages/localizations/src/en-US.ts b/packages/localizations/src/en-US.ts index bb5ca6fb42e..130d121b173 100644 --- a/packages/localizations/src/en-US.ts +++ b/packages/localizations/src/en-US.ts @@ -36,6 +36,7 @@ export const enUS: LocalizationResource = { menuAction__revoke: 'Revoke key', revokeConfirmation: { confirmationText: 'Revoke', + inputLabel: 'Type "Revoke" to confirm', formButtonPrimary__revoke: 'Revoke key', formHint: 'Are you sure you want to delete this Secret key?', formTitle: 'Revoke "{{apiKeyName}}" secret key?', diff --git a/packages/shared/src/types/localization.ts b/packages/shared/src/types/localization.ts index 6a2656c2b61..b1142118f42 100644 --- a/packages/shared/src/types/localization.ts +++ b/packages/shared/src/types/localization.ts @@ -1287,6 +1287,7 @@ export type __internal_LocalizationResource = { formHint: LocalizationValue; formButtonPrimary__revoke: LocalizationValue; confirmationText: LocalizationValue; + inputLabel: LocalizationValue; }; lastUsed__seconds: LocalizationValue<'seconds'>; lastUsed__minutes: LocalizationValue<'minutes'>; diff --git a/packages/ui/src/components/APIKeys/RevokeAPIKeyConfirmationModal.tsx b/packages/ui/src/components/APIKeys/RevokeAPIKeyConfirmationModal.tsx index c21e709931b..b15c716b806 100644 --- a/packages/ui/src/components/APIKeys/RevokeAPIKeyConfirmationModal.tsx +++ b/packages/ui/src/components/APIKeys/RevokeAPIKeyConfirmationModal.tsx @@ -34,12 +34,13 @@ export const RevokeAPIKeyConfirmationModal = ({ const revokeField = useFormControl('apiKeyRevokeConfirmation', '', { type: 'text', - label: `Type "Revoke" to confirm`, - placeholder: 'Revoke', + label: localizationKeys('apiKeys.revokeConfirmation.inputLabel'), + placeholder: localizationKeys('apiKeys.revokeConfirmation.confirmationText'), isRequired: true, }); - const canSubmit = revokeField.value === t(localizationKeys('apiKeys.revokeConfirmation.confirmationText')); + const canSubmit = + revokeField.value === (t(localizationKeys('apiKeys.revokeConfirmation.confirmationText')) || 'Revoke'); const handleClose = () => { onClose();