fix: add missing snackbars on flow status update

packages/backend/src/models/flow.js

@@ -125,7 +125,13 @@ class Flow extends Base {
 
   get IncompleteStepsError() {
     return new ValidationError({
-      message: 'All steps should be completed before updating flow status!',
+      data: {
+        flow: [
+          {
+            message: 'All steps should be completed before updating flow status!'
+          }
+        ],
+      },
       type: 'incompleteStepsError',
     });
   }
@@ -366,8 +372,13 @@ class Flow extends Base {
 
     if (allSteps.length < 2) {
       throw new ValidationError({
-        message:
+        data: {
-          'There should be at least one trigger and one action steps in the flow!',
+          flow: [
+            {
+              message: 'There should be at least one trigger and one action steps in the flow!'
+            }
+          ],
+        },
         type: 'insufficientStepsError',
       });
     }

packages/web/src/hooks/useUpdateFlowStatus.js

@@ -1,8 +1,10 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import api from 'helpers/api';
+import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
 
 export default function useUpdateFlowStatus(flowId) {
   const queryClient = useQueryClient();
+  const enqueueSnackbar = useEnqueueSnackbar();
 
   const query = useMutation({
     mutationFn: async (active) => {
@@ -17,6 +19,20 @@ export default function useUpdateFlowStatus(flowId) {
         queryKey: ['flows', flowId],
       });
     },
+    onError: (error) => {
+      const errors = Object.values(
+        error.response.data.errors || [['Failed while updating flow status!']],
+      );
+
+      for (const [error] of errors) {
+        enqueueSnackbar(error, {
+          variant: 'error',
+          SnackbarProps: {
+            'data-test': 'snackbar-error',
+          },
+        });
+      }
+    }
   });
 
   return query;