From 4e0fd93a287e230fd816b93511595cb527d66f88 Mon Sep 17 00:00:00 2001
From: Qi <474021214@qq.com>
Date: Sun, 12 Mar 2023 19:51:19 +0800
Subject: [PATCH] fix: error initial style when first in dark mode (#1543)

---
 apps/web/src/providers/ThemeProvider.tsx   | 5 +++--
 packages/component/src/ui/button/styles.ts | 2 +-
 packages/component/src/ui/menu/styles.ts   | 2 +-
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/providers/ThemeProvider.tsx b/apps/web/src/providers/ThemeProvider.tsx
index 2f4b132eb7..e273c070a3 100644
--- a/apps/web/src/providers/ThemeProvider.tsx
+++ b/apps/web/src/providers/ThemeProvider.tsx
@@ -38,7 +38,7 @@ const ThemeInjector = React.memo<{
 
 const ThemeProviderInner = memo<React.PropsWithChildren>(
   function ThemeProviderInner({ children }) {
-    const { theme } = useTheme();
+    const { resolvedTheme: theme } = useTheme();
     const [currentWorkspace] = useCurrentWorkspace();
     const currentPage = useCurrentPage();
     const pageMeta = usePageMeta(currentWorkspace?.blockSuiteWorkspace ?? null);
@@ -71,9 +71,10 @@ const themes = ['dark', 'light'];
 
 export const ThemeProvider = ({
   children,
+  ...props
 }: PropsWithChildren<ThemeProviderProps>) => {
   return (
-    <NextThemeProvider themes={themes}>
+    <NextThemeProvider themes={themes} enableSystem={true} {...props}>
       <ThemeProviderInner>{children}</ThemeProviderInner>
     </NextThemeProvider>
   );
diff --git a/packages/component/src/ui/button/styles.ts b/packages/component/src/ui/button/styles.ts
index 772a6e2e7c..07753e8044 100644
--- a/packages/component/src/ui/button/styles.ts
+++ b/packages/component/src/ui/button/styles.ts
@@ -196,7 +196,7 @@ export const StyledButton = styled('button', {
         ? {
             cursor: 'not-allowed',
             pointerEvents: 'none',
-            color: theme.colors.borderColor,
+            color: theme.colors.disableColor,
           }
         : {}),
       transition: 'background .15s',
diff --git a/packages/component/src/ui/menu/styles.ts b/packages/component/src/ui/menu/styles.ts
index 4049e9cf3e..5b89cdbbf3 100644
--- a/packages/component/src/ui/menu/styles.ts
+++ b/packages/component/src/ui/menu/styles.ts
@@ -39,7 +39,7 @@ export const StyledMenuItem = styled('button')<{
     cursor: isDir ? 'pointer' : '',
     position: 'relative',
     backgroundColor: 'transparent',
-
+    color: theme.colors.textColor,
     ':hover': {
       color: theme.colors.primaryColor,
       backgroundColor: theme.colors.hoverBackground,