fix: allow manipulation of screenshots without other permissions (#3190)

tolgee · Apr 4, 2023 · 97815f6 · 97815f6
1 parent 81bbcc4
commit 97815f6
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 16 deletions.
diff --git a/packages/web/src/ui/KeyDialog/ScreenshotGallery/ScreenshotGallery.tsx b/packages/web/src/ui/KeyDialog/ScreenshotGallery/ScreenshotGallery.tsx
@@ -64,16 +64,13 @@ export const ScreenshotGallery: React.FC = () => {
   const screenshots = useDialogContext((c) => c.screenshots);
   const screenshotDetails = useDialogContext((c) => c.screenshotDetail);
   const canTakeScreenshots = useDialogContext((c) => c.canTakeScreenshots);
-  const formDisabled = useDialogContext((c) => c.formDisabled);
   const screenshotsUploading = useDialogContext((c) => c.screenshotsUploading);
   const scopes = useDialogContext((c) => c.scopes);
 
   const [extensionPrompt, setExtensionPrompt] = useState(false);
 
-  const uploadEnabled =
-    isAuthorizedTo('screenshots.upload', scopes) && !formDisabled;
-  const deleteEnabled =
-    isAuthorizedTo('screenshots.delete', scopes) && !formDisabled;
+  const uploadEnabled = isAuthorizedTo('screenshots.upload', scopes);
+  const deleteEnabled = isAuthorizedTo('screenshots.delete', scopes);
 
   function onFileSelected(e: React.SyntheticEvent) {
     const files = (e.target as HTMLInputElement).files;

diff --git a/packages/web/src/ui/KeyDialog/TranslationFields.tsx b/packages/web/src/ui/KeyDialog/TranslationFields.tsx
@@ -7,6 +7,7 @@ import { keyframes } from '@mui/styled-engine';
 import { ScFieldTitle } from '../common/FieldTitle';
 import { isLanguagePermitted } from '../tools/isLanguagePermitted';
 import { getPreferredLanguages } from './dialogContext/tools';
+import { isAuthorizedTo } from './ScreenshotGallery/utils';
 
 const inputLoading = keyframes`
   0%   { background-position: 0%; }
@@ -55,6 +56,7 @@ export const TranslationFields: FunctionComponent = () => {
   const formDisabled = useDialogContext((c) => c.formDisabled);
   const loading = useDialogContext((c) => c.loading);
   const permittedLanguageIds = useDialogContext((c) => c.permittedLanguageIds);
+  const scopes = useDialogContext((c) => c.scopes);
 
   const onChange = (key: string) => (e: any) => {
     onInputChange(key, e.target.value);
@@ -75,11 +77,14 @@ export const TranslationFields: FunctionComponent = () => {
       ) : (
         [...selectedLanguages].map((key) => {
           const lang = availableLanguages?.find((l) => l.tag === key);
-          const languagePermitted = isLanguagePermitted(
-            key,
-            permittedLanguageIds,
-            availableLanguages
-          );
+          const languagePermitted =
+            isAuthorizedTo('keys.edit', scopes) ||
+            (isAuthorizedTo('translations.edit', scopes) &&
+              isLanguagePermitted(
+                key,
+                permittedLanguageIds,
+                availableLanguages
+              ));
 
           return (
             <React.Fragment key={key}>

diff --git a/packages/web/src/ui/KeyDialog/dialogContext/index.ts b/packages/web/src/ui/KeyDialog/dialogContext/index.ts
@@ -345,12 +345,14 @@ export const [DialogProvider, useDialogActions, useDialogContext] =
 
     const scopes = scopesLoadable.data?.scopes;
 
-    const formDisabled =
-      !isPat &&
-      (loading ||
-        (translationsLoadable.data?._embedded?.keys?.length
-          ? !isAuthorizedTo('translations.edit', scopes)
-          : !isAuthorizedTo('keys.edit', scopes)));
+    const canEditSomething =
+      isAuthorizedTo('screenshots.upload', scopes) ||
+      isAuthorizedTo('screenshots.delete', scopes) ||
+      (translationsLoadable.data?._embedded?.keys?.length
+        ? isAuthorizedTo('translations.edit', scopes)
+        : isAuthorizedTo('keys.edit', scopes));
+
+    const formDisabled = !isPat && (loading || !canEditSomething);
 
     const canEditTags = !formDisabled && isAuthorizedTo('keys.edit', scopes);