Adapt mutation error handling (#2019)

<!--
Ensure the title clearly reflects what was changed.
Provide a clear and concise description of the changes made. The PR
should only contain the changes related to the issue, and no other
unrelated changes.
-->

Part of OPS-3673

Author: alexandrudanpop

packages/react-ui/src/app/features/ai/lib/ai-model-selector-hook.ts

@@ -1,4 +1,5 @@
 import { aiAssistantChatApi } from '@/app/features/ai/lib/ai-assistant-chat-api';
+import { isForbiddenMutationError } from '@/app/interceptors/interceptor-utils';
 import { toast } from '@openops/components/ui';
 import { useMutation } from '@tanstack/react-query';
 import { AxiosError } from 'axios';
@@ -33,12 +34,14 @@ export const useAiModelSelector = ({
       setSelectedModel(data.model);
     },
     onError: (error: AxiosError) => {
-      toast({
-        title: t('Error'),
-        variant: 'destructive',
-        description: error.message,
-        duration: 3000,
-      });
+      if (!isForbiddenMutationError(error)) {
+        toast({
+          title: t('Error'),
+          variant: 'destructive',
+          description: error.message,
+          duration: 3000,
+        });
+      }
     },
   });
 

packages/react-ui/src/app/features/benchmark/use-benchmark-wizard-navigation.ts

@@ -1,4 +1,4 @@
-import { INTERNAL_ERROR_TOAST, toast } from '@openops/components/ui';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import {
   BenchmarkCreationResult,
   BenchmarkWizardRequest,
@@ -63,9 +63,7 @@ export const useBenchmarkWizardNavigation = (
         provider: string;
         request: BenchmarkWizardRequest;
       }) => benchmarkApi.getWizardStep(provider, request),
-      onError: () => {
-        toast(INTERNAL_ERROR_TOAST);
-      },
+      onError: handleMutationError,
     });
 
   const { mutateAsync: runCreateBenchmark, isPending: isCreatingBenchmark } =
@@ -82,9 +80,7 @@ export const useBenchmarkWizardNavigation = (
         setWizardPhase('benchmark-ready');
         onBenchmarkCreated?.(result);
       },
-      onError: () => {
-        toast(INTERNAL_ERROR_TOAST);
-      },
+      onError: handleMutationError,
     });
 
   const handleNextFromInitial = async () => {

packages/react-ui/src/app/features/builder/blocks-selector/index.tsx

@@ -7,7 +7,6 @@ import {
   CardListItem,
   CardListItemSkeleton,
   Input,
-  INTERNAL_ERROR_TOAST,
   ItemListMetadata,
   Popover,
   PopoverContent,
@@ -37,6 +36,7 @@ import {
 } from '@/app/features/builder/blocks-selector/block-tag-group';
 import { useBuilderStateContext } from '@/app/features/builder/builder-hooks';
 import { useApplyOperationAndPushToHistory } from '@/app/features/builder/flow-version-undo-redo/hooks/apply-operation-and-push-to-history';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import {
   Action,
   ActionType,
@@ -246,7 +246,7 @@ const BlockSelector = ({
     },
     onError: (e) => {
       console.error(e);
-      toast(INTERNAL_ERROR_TOAST);
+      handleMutationError(e);
     },
   });
 

packages/react-ui/src/app/features/builder/builder-header/hooks/lock-and-publish.ts

@@ -1,6 +1,7 @@
 import { useFlowVersionUndoRedo } from '@/app/features/builder/flow-version-undo-redo/hooks/flow-version-undo-redo';
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
-import { INTERNAL_ERROR_TOAST, toast } from '@openops/components/ui';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
+import { toast } from '@openops/components/ui';
 import { FlowOperationType } from '@openops/shared';
 import { useMutation } from '@tanstack/react-query';
 import { t } from 'i18next';
@@ -33,9 +34,7 @@ const useLockAndPublish = () => {
         setFlow(flow);
         setVersion(flow.version);
       },
-      onError: () => {
-        toast(INTERNAL_ERROR_TOAST);
-      },
+      onError: handleMutationError,
     },
   );
 

packages/react-ui/src/app/features/builder/builder-hooks.ts

@@ -1,14 +1,11 @@
-import {
-  AI_CHAT_CONTAINER_SIZES,
-  INTERNAL_ERROR_TOAST,
-  toast,
-} from '@openops/components/ui';
+import { AI_CHAT_CONTAINER_SIZES } from '@openops/components/ui';
 import { useMutation } from '@tanstack/react-query';
 import { createContext, useContext } from 'react';
 import { create, StateCreator, useStore } from 'zustand';
 import { devtools } from 'zustand/middleware';
 
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import {
   Flow,
   FlowOperationRequest,
@@ -418,9 +415,7 @@ export const useSwitchToDraft = () => {
         setVersion(flow.version);
         exitRun();
       },
-      onError: () => {
-        toast(INTERNAL_ERROR_TOAST);
-      },
+      onError: handleMutationError,
     });
   return {
     switchToDraft,

packages/react-ui/src/app/features/builder/flow-canvas/widgets/test-flow-widget.tsx

@@ -1,9 +1,7 @@
 import {
   Button,
   cn,
-  INTERNAL_ERROR_TOAST,
   isMacUserAgent,
-  toast,
   Tooltip,
   TooltipContent,
   TooltipTrigger,
@@ -21,6 +19,7 @@ import {
   useExecuteRiskyFlowDialog,
 } from '@/app/features/flows/components/execute-risky-flow-dialog/execute-risky-flow-dialog';
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import { FlowRun, FlowVersion, isNil, TriggerType } from '@openops/shared';
 import { Settings } from 'lucide-react';
 import { stepTestOutputHooks } from '../../test-step/step-test-output-hooks';
@@ -57,7 +56,7 @@ const TestFlowWidget = ({ flowVersion, setRun }: TestFlowWidgetProps) => {
       ),
     onError: (error) => {
       console.error(error);
-      toast(INTERNAL_ERROR_TOAST);
+      handleMutationError(error);
     },
   });
 

packages/react-ui/src/app/features/builder/flow-versions/flow-versions-card.tsx

@@ -14,9 +14,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
-  INTERNAL_ERROR_TOAST,
   LoadingSpinner,
-  toast,
   Tooltip,
   TooltipContent,
   TooltipTrigger,
@@ -42,6 +40,7 @@ import { useBuilderStateContext } from '@/app/features/builder/builder-hooks';
 import { LeftSideBarType } from '@/app/features/builder/builder-types';
 import { FlowVersionStateDot } from '@/app/features/flows/components/flow-version-state-dot';
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import { formatUtils } from '@/app/lib/utils';
 
 type UseAsDraftOptionProps = {
@@ -144,8 +143,8 @@ const FlowVersionDetailsCard = React.memo(
         );
       },
       onError: (error) => {
-        toast(INTERNAL_ERROR_TOAST);
         console.error(error);
+        handleMutationError(error);
       },
     });
 
@@ -175,8 +174,8 @@ const FlowVersionDetailsCard = React.memo(
           );
         },
         onError: (error) => {
-          toast(INTERNAL_ERROR_TOAST);
           console.error(error);
+          handleMutationError(error);
         },
       });
 

packages/react-ui/src/app/features/builder/run-list/flow-run-card.tsx

@@ -2,9 +2,7 @@ import {
   Button,
   CardListItem,
   cn,
-  INTERNAL_ERROR_TOAST,
   LoadingSpinner,
-  toast,
 } from '@openops/components/ui';
 import { StopwatchIcon } from '@radix-ui/react-icons';
 import { useMutation } from '@tanstack/react-query';
@@ -16,6 +14,7 @@ import { useBuilderStateContext } from '@/app/features/builder/builder-hooks';
 import { flowRunUtils } from '@/app/features/flow-runs/lib/flow-run-utils';
 import { flowRunsApi } from '@/app/features/flow-runs/lib/flow-runs-api';
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import { formatUtils } from '@/app/lib/utils';
 import { FlowRun, isNil, PopulatedFlow } from '@openops/shared';
 import { LeftSideBarType } from '../builder-types';
@@ -54,8 +53,8 @@ const FlowRunCard = React.memo((params: FlowRunCardProps) => {
       setLeftSidebar(LeftSideBarType.RUN_DETAILS);
     },
     onError: (error) => {
-      toast(INTERNAL_ERROR_TOAST);
       console.error(error);
+      handleMutationError(error);
     },
   });
 

packages/react-ui/src/app/features/builder/test-step/test-action-section.tsx

@@ -1,9 +1,4 @@
-import {
-  Button,
-  Dot,
-  INTERNAL_ERROR_TOAST,
-  useToast,
-} from '@openops/components/ui';
+import { Button, Dot } from '@openops/components/ui';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { t } from 'i18next';
 import React, { useEffect, useState } from 'react';
@@ -17,6 +12,7 @@ import {
   RiskyStepConfirmationMessages,
 } from '@/app/features/builder/test-step/test-risky-step-confirmation-messages';
 import { flowsApi } from '@/app/features/flows/lib/flows-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import { formatUtils } from '@/app/lib/utils';
 import {
   Action,
@@ -47,7 +43,6 @@ const TestActionSection = React.memo(
     onTestCallback,
     readOnly,
   }: TestActionComponentProps) => {
-    const { toast } = useToast();
     const [errorMessage, setErrorMessage] = useState<string | undefined>(
       undefined,
     );
@@ -107,7 +102,7 @@ const TestActionSection = React.memo(
       },
       onError: (error) => {
         console.error(error);
-        toast(INTERNAL_ERROR_TOAST);
+        handleMutationError(error);
       },
     });
 

packages/react-ui/src/app/features/builder/test-step/test-trigger-section.tsx

@@ -4,14 +4,12 @@ import {
   AlertTitle,
   Button,
   Dot,
-  INTERNAL_ERROR_TOAST,
   LoadingSpinner,
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue,
-  toast,
 } from '@openops/components/ui';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import dayjs from 'dayjs';
@@ -24,6 +22,7 @@ import { useFormContext } from 'react-hook-form';
 import { QueryKeys } from '@/app/constants/query-keys';
 import { blocksHooks } from '@/app/features/blocks/lib/blocks-hook';
 import { triggerEventsApi } from '@/app/features/flows/lib/trigger-events-api';
+import { handleMutationError } from '@/app/interceptors/interceptor-utils';
 import { formatUtils } from '@/app/lib/utils';
 import {
   CATCH_WEBHOOK,
@@ -110,9 +109,7 @@ const TestTriggerSection = React.memo(
       mutationFn: (data: unknown) => {
         return triggerEventsApi.saveTriggerMockdata(flowId, data);
       },
-      onError: () => {
-        toast(INTERNAL_ERROR_TOAST);
-      },
+      onError: handleMutationError,
       onSuccess: async (result) => {
         updateSelectedData(result);
       },