fixup! Feat(web-react): Add Message and Link for ToastBar #DS-1213

lmc-eu · May 24, 2024 · ba5b9bf · ba5b9bf
1 parent eb1971d
commit ba5b9bf
Showing 1 changed file with 17 additions and 40 deletions.
diff --git a/packages/web-react/src/components/Toast/ToastContext.tsx b/packages/web-react/src/components/Toast/ToastContext.tsx
@@ -19,22 +19,20 @@ export interface ToastItem {
   content: ReactNode;
 }
 
+type ShowPayloadOptions = {
+  autoCloseInterval?: number;
+  color?: ToastColorType;
+  enableAutoClose?: boolean;
+  hasIcon?: boolean;
+  iconName?: string;
+  isDismissible?: boolean;
+};
+
 export interface ToastContextType extends ToastState {
   clear: () => void;
   hide: (id: string) => void;
   setQueue: (newQueue: ToastItem[]) => void;
-  show: (
-    content: ReactNode,
-    id: string,
-    options?: {
-      autoCloseInterval?: number;
-      color?: ToastColorType;
-      enableAutoClose?: boolean;
-      hasIcon?: boolean;
-      iconName?: string;
-      isDismissible?: boolean;
-    },
-  ) => void;
+  show: (content: ReactNode, id: string, options?: ShowPayloadOptions) => void;
 }
 
 const defaultToastContext: ToastContextType = {
@@ -53,14 +51,7 @@ type ActionType =
       payload: {
         content: ReactNode;
         toastId: string;
-        options?: {
-          autoCloseInterval?: number;
-          color?: ToastColorType;
-          enableAutoClose?: boolean;
-          hasIcon?: boolean;
-          iconName?: string;
-          isDismissible?: boolean;
-        };
+        options?: ShowPayloadOptions;
       };
     }
   | { type: 'hide'; payload: { id: string } }
@@ -123,26 +114,12 @@ export const ToastProvider: FC<ToastProviderProps> = ({ children }) => {
     dispatch({ type: 'clear', payload: null });
   }, []);
 
-  const show = useCallback(
-    (
-      content: string | JSX.Element,
-      toastId: string,
-      options?: {
-        autoCloseInterval?: number;
-        color?: ToastColorType;
-        enableAutoClose?: boolean;
-        hasIcon?: boolean;
-        iconName?: string;
-        isDismissible?: boolean;
-      },
-    ) => {
-      dispatch({ type: 'show', payload: { content, toastId, options } });
-
-      options?.enableAutoClose &&
-        delayedCallback(() => hide(toastId), options?.autoCloseInterval || DEFAULT_TOAST_AUTO_CLOSE_INTERVAL);
-    },
-    [],
-  );
+  const show = useCallback((content: ReactNode, toastId: string, options?: ShowPayloadOptions) => {
+    dispatch({ type: 'show', payload: { content, toastId, options } });
+
+    options?.enableAutoClose &&
+      delayedCallback(() => hide(toastId), options?.autoCloseInterval || DEFAULT_TOAST_AUTO_CLOSE_INTERVAL);
+  }, []);
   const setQueue = useCallback((newQueue: ToastItem[]) => {
     dispatch({ type: 'clear', payload: null });