fix refactor error-messages generation

Author: pd-redis

redisinsight/ui/src/components/notifications/components/infinite-messages/InfiniteMessages.tsx

@@ -74,6 +74,7 @@ export const INFINITE_MESSAGES: InfiniteMessagesType = {
   PENDING_CREATE_DB: (step?: CloudJobStep) => ({
     id: InfiniteMessagesIds.oAuthProgress,
     customIcon: LoaderLargeIcon,
+    variation: step,
     message: (
       <>
         {(step === CloudJobStep.Credentials || !step) &&

redisinsight/ui/src/components/notifications/error-messages.tsx

@@ -1,58 +1,34 @@
 import React from 'react'
 
-import { riToast } from 'uiSrc/components/base/display/toast'
 import { InfoIcon, ToastDangerIcon } from 'uiSrc/components/base/icons'
 
 import RdiDeployErrorContent from './components/rdi-deploy-error-content'
 import { EncryptionErrorContent, DefaultErrorContent } from './components'
 import CloudCapiUnAuthorizedErrorContent from './components/cloud-capi-unauthorized'
-import { defaultContainerId } from './constants'
 
-// TODO: use i18n file for texts
 export default {
-  DEFAULT: (
-    text: any,
-    onClose = () => {},
-    title: string = 'Error',
-    toastId?: string,
-  ) =>
-    riToast(
-      {
-        'data-testid': 'toast-error',
-        customIcon: ToastDangerIcon,
-        message: title,
-        description: <DefaultErrorContent text={text} />,
-        actions: {
-          primary: {
-            label: 'OK',
-            closes: true,
-            onClick: onClose,
-          },
-        },
-      },
-      {
-        variant: riToast.Variant.Danger,
-        toastId,
-        containerId: defaultContainerId,
-      },
-    ),
-  ENCRYPTION: (onClose = () => {}, instanceId = '', toastId?: string) =>
-    riToast(
-      {
-        'data-testid': 'toast-error-encryption',
-        customIcon: InfoIcon,
-        message: 'Unable to decrypt',
-        description: (
-          <EncryptionErrorContent instanceId={instanceId} onClose={onClose} />
-        ),
-        showCloseButton: false,
-      },
-      {
-        variant: riToast.Variant.Danger,
-        toastId,
-        containerId: defaultContainerId,
+  DEFAULT: (text: any, onClose = () => {}, title: string = 'Error') => ({
+    'data-testid': 'toast-error',
+    customIcon: ToastDangerIcon,
+    message: title,
+    description: <DefaultErrorContent text={text} />,
+    actions: {
+      primary: {
+        label: 'OK',
+        closes: true,
+        onClick: onClose,
       },
+    },
+  }),
+  ENCRYPTION: (onClose = () => {}, instanceId = '') => ({
+    'data-testid': 'toast-error-encryption',
+    customIcon: InfoIcon,
+    message: 'Unable to decrypt',
+    description: (
+      <EncryptionErrorContent instanceId={instanceId} onClose={onClose} />
     ),
+    showCloseButton: false,
+  }),
   CLOUD_CAPI_KEY_UNAUTHORIZED: (
     {
       message,
@@ -63,47 +39,27 @@ export default {
     },
     additionalInfo: Record<string, any>,
     onClose: () => void,
-    toastId?: string,
-  ) =>
-    riToast(
-      {
-        'data-testid': 'toast-error-cloud-capi-key-unauthorized',
-        customIcon: ToastDangerIcon,
-        message: title,
-        showCloseButton: false,
-        description: (
-          <CloudCapiUnAuthorizedErrorContent
-            text={message}
-            resourceId={additionalInfo.resourceId}
-            onClose={onClose}
-          />
-        ),
-      },
-      {
-        variant: riToast.Variant.Danger,
-        toastId,
-        containerId: defaultContainerId,
-      },
+  ) => ({
+    'data-testid': 'toast-error-cloud-capi-key-unauthorized',
+    customIcon: ToastDangerIcon,
+    message: title,
+    showCloseButton: false,
+    description: (
+      <CloudCapiUnAuthorizedErrorContent
+        text={message}
+        resourceId={additionalInfo.resourceId}
+        onClose={onClose}
+      />
     ),
+  }),
   RDI_DEPLOY_PIPELINE: (
     { title, message }: { title?: string; message: string },
     onClose: () => void,
-    toastId?: string,
-  ) =>
-    riToast(
-      {
-        'data-testid': 'toast-error-deploy',
-        customIcon: ToastDangerIcon,
-        onClose,
-        message: title,
-        description: (
-          <RdiDeployErrorContent message={message} onClose={onClose} />
-        ),
-      },
-      {
-        variant: riToast.Variant.Danger,
-        toastId,
-        containerId: defaultContainerId,
-      },
-    ),
+  ) => ({
+    'data-testid': 'toast-error-deploy',
+    customIcon: ToastDangerIcon,
+    onClose,
+    message: title,
+    description: <RdiDeployErrorContent message={message} onClose={onClose} />,
+  }),
 }

redisinsight/ui/src/components/notifications/hooks/useErrorNotifications.ts

@@ -8,6 +8,8 @@ import { ApiEncryptionErrors } from 'uiSrc/constants/apiErrors'
 import errorMessages from 'uiSrc/components/notifications/error-messages'
 import { CustomErrorCodes } from 'uiSrc/constants'
 import { errorsSelector, removeMessage } from 'uiSrc/slices/app/notifications'
+import { defaultContainerId } from 'uiSrc/components/notifications/constants'
+import { RiToastType } from 'uiSrc/components/base/display/toast/RiToast'
 
 const DEFAULT_ERROR_TITLE = 'Error'
 
@@ -36,41 +38,42 @@ export const useErrorNotifications = () => {
           removeToast(id)
           return
         }
-        let toastId: ReturnType<typeof riToast>
+
+        let errorMessage: RiToastType
         if (ApiEncryptionErrors.includes(name)) {
-          toastId = errorMessages.ENCRYPTION(
+          errorMessage = errorMessages.ENCRYPTION(
             () => removeToast(id),
             instanceId,
-            id,
           )
         } else if (
           additionalInfo?.errorCode ===
           CustomErrorCodes.CloudCapiKeyUnauthorized
         ) {
-          toastId = errorMessages.CLOUD_CAPI_KEY_UNAUTHORIZED(
+          errorMessage = errorMessages.CLOUD_CAPI_KEY_UNAUTHORIZED(
             { message, title },
             additionalInfo,
             () => removeToast(id),
-            id,
           )
         } else if (
           additionalInfo?.errorCode ===
           CustomErrorCodes.RdiDeployPipelineFailure
         ) {
-          toastId = errorMessages.RDI_DEPLOY_PIPELINE(
+          errorMessage = errorMessages.RDI_DEPLOY_PIPELINE(
             { title, message },
             () => removeToast(id),
-            id,
           )
         } else {
-          toastId = errorMessages.DEFAULT(
+          errorMessage = errorMessages.DEFAULT(
             message,
             () => removeToast(id),
             title,
-            id,
           )
         }
-
+        const toastId: ReturnType<typeof riToast> = riToast(errorMessage, {
+          variant: riToast.Variant.Danger,
+          toastId: id,
+          containerId: defaultContainerId,
+        })
         toastIdsRef.current.set(id, toastId)
       },
     )

redisinsight/ui/src/slices/app/notifications.ts

@@ -168,6 +168,14 @@ const notificationsSlice = createSlice({
       if (index === -1) {
         state.infiniteMessages.push(payload)
       } else {
+        const currentNotification = state.infiniteMessages[index]
+        // check if existing notification is exactly the same as the new one, if yes, do not update
+        if (
+          currentNotification.variation &&
+          payload.variation === currentNotification.variation
+        ) {
+          return
+        }
         state.infiniteMessages[index] = payload
       }
     },

redisinsight/ui/src/slices/interfaces/app.ts

@@ -247,6 +247,7 @@ export interface IGlobalNotification {
 
 export interface InfiniteMessage {
   id: string
+  variation?: string
   variant?: ToastVariant
   className?: string
   message?: RiToastType['message']