From 9930efdc84c9c8a20e76bac6b100d152411ac8d6 Mon Sep 17 00:00:00 2001
From: "Kilu.He" <108015703+qinluhe@users.noreply.github.com>
Date: Fri, 6 Sep 2024 12:27:08 +0800
Subject: [PATCH] fix: toast issues (#6209)

---
 .../src/components/app/AppConfig.tsx          |  3 +--
 .../src/components/app/withAppWrapper.tsx     | 27 ++++++-------------
 .../src/styles/variables/light.variables.css  |  6 ++---
 .../appflowy_web_app/tailwind/box-shadow.cjs  |  2 +-
 frontend/appflowy_web_app/tailwind/colors.cjs |  6 ++---
 5 files changed, 16 insertions(+), 28 deletions(-)

diff --git a/frontend/appflowy_web_app/src/components/app/AppConfig.tsx b/frontend/appflowy_web_app/src/components/app/AppConfig.tsx
index e7cb3cce62..40b6acabbe 100644
--- a/frontend/appflowy_web_app/src/components/app/AppConfig.tsx
+++ b/frontend/appflowy_web_app/src/components/app/AppConfig.tsx
@@ -81,11 +81,10 @@ function AppConfig ({ children }: { children: React.ReactNode }) {
         enqueueSnackbar(message, { variant: 'success' });
       },
       error: (message: string) => {
-        console.log('error', message);
         enqueueSnackbar(message, { variant: 'error' });
       },
       warning: (message: string) => {
-        enqueueSnackbar(message, { variant: 'warning' });
+        enqueueSnackbar(message, { variant: 'warning', autoHideDuration: 500000000000 });
       },
       default: (message: string) => {
         enqueueSnackbar(message, { variant: 'default' });
diff --git a/frontend/appflowy_web_app/src/components/app/withAppWrapper.tsx b/frontend/appflowy_web_app/src/components/app/withAppWrapper.tsx
index e296637a0f..8aa93ee5eb 100644
--- a/frontend/appflowy_web_app/src/components/app/withAppWrapper.tsx
+++ b/frontend/appflowy_web_app/src/components/app/withAppWrapper.tsx
@@ -8,29 +8,18 @@ import { styled } from '@mui/material';
 import { InfoSnackbar } from '../_shared/notify';
 
 const StyledSnackbarProvider = styled(SnackbarProvider)`
-  &.notistack-MuiContent-default {
-    background-color: var(--fill-toolbar);
-  }
+    &.notistack-MuiContent-default {
+        background-color: var(--fill-toolbar);
+    }
 
-  &.notistack-MuiContent-info {
-    background-color: var(--function-info);
-  }
+    &.notistack-MuiContent-info {
+        background-color: var(--function-info);
+    }
 
-  &.notistack-MuiContent-success {
-    background-color: var(--function-success);
-  }
-
-  &.notistack-MuiContent-error {
-    background-color: var(--function-error);
-  }
-
-  &.notistack-MuiContent-warning {
-    background-color: var(--function-warning);
-  }
 `;
 
-export default function withAppWrapper(Component: React.FC): React.FC {
-  return function AppWrapper(): JSX.Element {
+export default function withAppWrapper (Component: React.FC): React.FC {
+  return function AppWrapper (): JSX.Element {
     return (
       <AppTheme>
         <ErrorBoundary FallbackComponent={ErrorHandlerPage}>
diff --git a/frontend/appflowy_web_app/src/styles/variables/light.variables.css b/frontend/appflowy_web_app/src/styles/variables/light.variables.css
index b486df56a8..c894d9ad8d 100644
--- a/frontend/appflowy_web_app/src/styles/variables/light.variables.css
+++ b/frontend/appflowy_web_app/src/styles/variables/light.variables.css
@@ -38,9 +38,9 @@
     --function-error: #fb006d;
     --function-error-hover: #ff4f8a;
     --function-error-opacity: rgba(251, 0, 109, 0.1);
-    --function-waring: #ffd667;
-    --function-waring-hover: #ffdf8f;
-    --function-waring-opacity: rgba(255, 214, 103, 0.1);
+    --function-warning: #ffd667;
+    --function-warning-hover: #ffdf8f;
+    --function-warning-opacity: rgba(255, 214, 103, 0.1);
     --function-success: #66cf80;
     --function-success-hover: #66cf00;
     --function-success-opacity: rgba(102, 207, 128, 0.1);
diff --git a/frontend/appflowy_web_app/tailwind/box-shadow.cjs b/frontend/appflowy_web_app/tailwind/box-shadow.cjs
index 1ab72c8764..a17283e6c0 100644
--- a/frontend/appflowy_web_app/tailwind/box-shadow.cjs
+++ b/frontend/appflowy_web_app/tailwind/box-shadow.cjs
@@ -1,7 +1,7 @@
 
 /**
 * Do not edit directly
-* Generated on Fri, 06 Sep 2024 02:15:53 GMT
+* Generated on Fri, 06 Sep 2024 04:24:51 GMT
 * Generated from $pnpm css:variables 
 */
 
diff --git a/frontend/appflowy_web_app/tailwind/colors.cjs b/frontend/appflowy_web_app/tailwind/colors.cjs
index f954297ae3..6c4ac1d6fb 100644
--- a/frontend/appflowy_web_app/tailwind/colors.cjs
+++ b/frontend/appflowy_web_app/tailwind/colors.cjs
@@ -1,7 +1,7 @@
 
 /**
 * Do not edit directly
-* Generated on Fri, 06 Sep 2024 02:15:53 GMT
+* Generated on Fri, 06 Sep 2024 04:24:51 GMT
 * Generated from $pnpm css:variables 
 */
 
@@ -59,8 +59,8 @@ module.exports = {
   "function": {
     "error": "var(--function-error)",
     "error-hover": "var(--function-error-hover)",
-    "waring": "var(--function-waring)",
-    "waring-hover": "var(--function-waring-hover)",
+    "warning": "var(--function-warning)",
+    "warning-hover": "var(--function-warning-hover)",
     "success": "var(--function-success)",
     "success-hover": "var(--function-success-hover)",
     "info": "var(--function-info)"