diff --git a/packages/web/src/ui/KeyDialog/KeyForm.tsx b/packages/web/src/ui/KeyDialog/KeyForm.tsx index e1922e9821..288de9930a 100644 --- a/packages/web/src/ui/KeyDialog/KeyForm.tsx +++ b/packages/web/src/ui/KeyDialog/KeyForm.tsx @@ -78,6 +78,7 @@ const ScRestriction = styled('div')` `; const ScError = styled('div')` + padding-top: 16px; color: red; `; @@ -177,9 +178,10 @@ export const KeyForm = () => { )} {formDisabled && ready && ( - {`Modification is restricted due to missing ${ - keyData?.keyId !== undefined ? 'translations.edit' : 'keys.edit' - } scope in current api key settings.`} + + Modification is restricted due to missing edit permissions in current + api key settings. + )} {error && {error}} diff --git a/packages/web/src/ui/KeyDialog/dialogContext/index.ts b/packages/web/src/ui/KeyDialog/dialogContext/index.ts index cf72e2ffb9..fced5428c0 100644 --- a/packages/web/src/ui/KeyDialog/dialogContext/index.ts +++ b/packages/web/src/ui/KeyDialog/dialogContext/index.ts @@ -14,9 +14,8 @@ import { setPreferredLanguages, isAuthorizedTo, } from './tools'; -import { getApiKeyType } from '../../../tools/decodeApiKey'; import { useGallery } from './useGallery'; -import { requirePlatformVersion } from '../../tools/requirePlatformVersion'; +import { checkPlatformVersion } from '../../tools/checkPlatformVersion'; import { limitSurroundingKeys } from '../../tools/limitSurroundingKeys'; import { StateInType, @@ -24,7 +23,7 @@ import { StateType, } from '../State/translationStates'; -const PLATFORM_SUPPORTING_BIG_META = 'v3.20.0'; +const MINIMAL_PLATFORM_VERSION = 'v3.39.0'; type FormTranslations = { [key: string]: { @@ -116,6 +115,11 @@ export const [DialogProvider, useDialogActions, useDialogContext] = }, }); + const versionError = checkPlatformVersion( + MINIMAL_PLATFORM_VERSION, + languagesLoadable.data?._internal?.version + ); + const createKey = useApiMutation({ url: '/v2/projects/keys/create', method: 'post', @@ -265,28 +269,20 @@ export const [DialogProvider, useDialogActions, useDialogContext] = path: { id: keyData.keyId! }, })); - const version = result._internal?.version; - - if ( - version && - (version === '??' || - requirePlatformVersion(PLATFORM_SUPPORTING_BIG_META, version)) - ) { - const surroundingKeys = limitSurroundingKeys( - props.uiProps.findPositions(), - { keyName: props.keyName, keyNamespace: selectedNs } - ); - await updateMetadata.mutateAsync({ - content: { - 'application/json': { - relatedKeysInOrder: surroundingKeys.map((val) => ({ - keyName: val.keyName, - namespace: val.keyNamespace || undefined, - })), - }, + const surroundingKeys = limitSurroundingKeys( + props.uiProps.findPositions(), + { keyName: props.keyName, keyNamespace: selectedNs } + ); + await updateMetadata.mutateAsync({ + content: { + 'application/json': { + relatedKeysInOrder: surroundingKeys.map((val) => ({ + keyName: val.keyName, + namespace: val.keyNamespace || undefined, + })), }, - }); - } + }, + }); changeInTolgeeCache( props.keyName, @@ -414,6 +410,7 @@ export const [DialogProvider, useDialogActions, useDialogContext] = (translationsLoadable.isLoading && !translationsLoadable.data) || scopesLoadable.isFetching; const error = + versionError || languagesLoadable.error || translationsLoadable.error || scopesLoadable.error || diff --git a/packages/web/src/ui/tools/checkPlatformVersion.ts b/packages/web/src/ui/tools/checkPlatformVersion.ts new file mode 100644 index 0000000000..685664dcac --- /dev/null +++ b/packages/web/src/ui/tools/checkPlatformVersion.ts @@ -0,0 +1,17 @@ +export const checkPlatformVersion = ( + requiredV: string, + currentV: string | undefined +) => { + if (!currentV || currentV === '??') { + return undefined; + } + const result = requiredV.localeCompare(currentV, 'en', { + numeric: true, + sensitivity: 'base', + }); + + if (result > 0) { + return `Requires platform version ${requiredV} (got ${currentV})`; + } + return undefined; +}; diff --git a/packages/web/src/ui/tools/requirePlatformVersion.ts b/packages/web/src/ui/tools/requirePlatformVersion.ts deleted file mode 100644 index 2c41c70e22..0000000000 --- a/packages/web/src/ui/tools/requirePlatformVersion.ts +++ /dev/null @@ -1,8 +0,0 @@ -export const requirePlatformVersion = (requiredV: string, currentV: string) => { - const result = requiredV.localeCompare(currentV, 'en', { - numeric: true, - sensitivity: 'base', - }); - - return result <= 0; -};