fix: show out of credits error at machine translations and batch oper…

…ations (#2830)
tolgee · Jan 10, 2025 · 0eb095d · 0eb095d
1 parent 6d20a7d
commit 0eb095d
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 1 deletion.
diff --git a/webapp/src/views/projects/BaseProjectView.tsx b/webapp/src/views/projects/BaseProjectView.tsx
@@ -42,7 +42,7 @@ export const BaseProjectView: React.FC<Props> = ({
       {...otherProps}
       navigation={[...prefixNavigation, ...(navigation || [])]}
       navigationRight={
-        <Box display="grid">
+        <Box display="grid" gridAutoFlow="column" gap={1}>
           <BatchOperationsSummary />
           <Usage />
         </Box>

diff --git a/...rc/views/projects/translations/BatchOperations/OperationsSummary/BatchOperationDialog.tsx b/...rc/views/projects/translations/BatchOperations/OperationsSummary/BatchOperationDialog.tsx
@@ -22,6 +22,7 @@ import { useBatchOperationTypeTranslate } from 'tg.translationTools/useBatchOper
 import { useOperationCancel } from './useOperationCancel';
 import LoadingButton from 'tg.component/common/form/LoadingButton';
 import { useLoadingRegister } from 'tg.component/GlobalLoading';
+import { useGlobalActions } from 'tg.globalContext/GlobalContext';
 
 type Props = {
   operation: BatchJobModel;
@@ -36,6 +37,7 @@ export const BatchOperationDialog = ({
 }: Props) => {
   const { t } = useTranslate();
   const project = useProject();
+  const { incrementPlanLimitErrors } = useGlobalActions();
 
   const liveBatch = useProjectContext((c) =>
     c.batchOperations?.find((o) => o.id === operation.id)
@@ -72,6 +74,12 @@ export const BatchOperationDialog = ({
     }
   }, [isFinished]);
 
+  useEffect(() => {
+    if (data.errorMessage === 'out_of_credits') {
+      incrementPlanLimitErrors();
+    }
+  }, [data.errorMessage]);
+
   return (
     <Dialog open>
       <DialogTitle sx={{ width: 'min(80vw, 400px)' }}>{typeLabel}</DialogTitle>

diff --git a/...c/views/projects/translations/ToolsPanel/panels/MachineTranslation/MachineTranslation.tsx b/...c/views/projects/translations/ToolsPanel/panels/MachineTranslation/MachineTranslation.tsx
@@ -9,6 +9,7 @@ import { useMTStreamed } from './useMTStreamed';
 import { TabMessage } from '../../common/TabMessage';
 import { PanelContentProps } from '../../common/types';
 import { MachineTranslationItem } from './MachineTranslationItem';
+import { useGlobalActions } from 'tg.globalContext/GlobalContext';
 
 const StyledContainer = styled('div')`
   display: flex;
@@ -41,6 +42,7 @@ export const MachineTranslation: React.FC<PanelContentProps> = ({
   activeVariant,
 }) => {
   const { t } = useTranslate();
+  const { incrementPlanLimitErrors } = useGlobalActions();
 
   const deps = {
     keyId: keyData.keyId,
@@ -81,6 +83,12 @@ export const MachineTranslation: React.FC<PanelContentProps> = ({
     Boolean(arrayResults.length);
   const contextPresent = keyData.contextPresent;
 
+  useEffect(() => {
+    if (outOfCredit) {
+      incrementPlanLimitErrors();
+    }
+  }, [outOfCredit]);
+
   useEffect(() => {
     setItemsCount(arrayResults.length);
   }, [arrayResults.length]);