fixup! fixup! Feat(web-react): Add autoclose feature to Toast component

lmc-eu · May 21, 2024 · fdc5f37 · fdc5f37
1 parent 754bdcd
commit fdc5f37
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 0 deletions.
diff --git a/packages/web-react/src/components/Toast/stories/ToastBar.stories.tsx b/packages/web-react/src/components/Toast/stories/ToastBar.stories.tsx
@@ -20,6 +20,9 @@ const meta: Meta<typeof ToastBar> = {
     },
     closeLabel: {
       control: 'text',
+      table: {
+        defaultValue: { summary: 'Close' },
+      },
     },
     color: {
       control: 'select',

diff --git a/packages/web-react/src/components/Toast/stories/UncontrolledToast.stories.tsx b/packages/web-react/src/components/Toast/stories/UncontrolledToast.stories.tsx
@@ -40,12 +40,21 @@ const meta: Meta<UncontrolledToastPlaygroundProps> = {
     },
     closeLabel: {
       control: 'text',
+      table: {
+        defaultValue: { summary: 'Close' },
+      },
     },
     hasIcon: {
       control: 'boolean',
+      table: {
+        defaultValue: { summary: false },
+      },
     },
     isDismissible: {
       control: 'boolean',
+      table: {
+        defaultValue: { summary: false },
+      },
     },
     color: {
       control: 'select',
@@ -59,12 +68,21 @@ const meta: Meta<UncontrolledToastPlaygroundProps> = {
     },
     isCollapsible: {
       control: 'boolean',
+      table: {
+        defaultValue: { summary: true },
+      },
     },
     enableAutoClose: {
       control: 'boolean',
+      table: {
+        defaultValue: { summary: true },
+      },
     },
     autoCloseInterval: {
       control: 'number',
+      table: {
+        defaultValue: { summary: TOAST_AUTO_CLOSE_INTERVAL },
+      },
     },
   },
   args: {

diff --git a/packages/web-react/src/components/Toast/withAutoClose.ts b/packages/web-react/src/components/Toast/withAutoClose.ts
@@ -0,0 +1,8 @@
+import { TOAST_AUTOCLOSE_TIMEOUT } from './constants';
+
+export const withAutoclose = (callback: () => void, interval: number = TOAST_AUTOCLOSE_TIMEOUT) => {
+  const timeoutId = setTimeout(() => {
+    callback();
+    clearTimeout(timeoutId);
+  }, interval);
+};