From f18127dfd6351df8c49c1f527e04fd65ce206a2c Mon Sep 17 00:00:00 2001
From: Himself65 <himself65@outlook.com>
Date: Tue, 28 Mar 2023 14:58:51 -0500
Subject: [PATCH] fix(component): toast duration (#1732)

---
 apps/web/src/components/pure/workspace-slider-bar/style.ts | 3 +++
 packages/component/src/ui/toast/toast.ts                   | 7 ++++---
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/components/pure/workspace-slider-bar/style.ts b/apps/web/src/components/pure/workspace-slider-bar/style.ts
index 0089610dce..6f564d7b18 100644
--- a/apps/web/src/components/pure/workspace-slider-bar/style.ts
+++ b/apps/web/src/components/pure/workspace-slider-bar/style.ts
@@ -17,6 +17,9 @@ export const StyledSliderBar = styled('div')<{ show: boolean }>(
       display: 'flex',
       flexDirection: 'column',
       overflow: 'hidden',
+      [theme.breakpoints.down('sm')]: {
+        position: 'absolute',
+      },
     };
   }
 );
diff --git a/packages/component/src/ui/toast/toast.ts b/packages/component/src/ui/toast/toast.ts
index 3934870490..19696bf8aa 100644
--- a/packages/component/src/ui/toast/toast.ts
+++ b/packages/component/src/ui/toast/toast.ts
@@ -57,7 +57,7 @@ export type ToastOptions = {
  */
 export const toast = (
   message: string,
-  { duration, portal }: ToastOptions = {
+  { duration = 2500, portal }: ToastOptions = {
     duration: 2500,
   }
 ) => {
@@ -107,8 +107,9 @@ export const toast = (
     element.style.margin = '0';
     element.style.padding = '0';
     // wait for transition
-    await sleep(230);
-    element.remove();
+    element.addEventListener('transitionend', () => {
+      element.remove();
+    });
   }, duration);
   return element;
 };