From 8958992e55005a44093d6a3a76d4351402cfb317 Mon Sep 17 00:00:00 2001
From: Zeke Zhang <958414905@qq.com>
Date: Mon, 4 Nov 2024 21:43:13 +0800
Subject: [PATCH] perf(CurrentUserProvider): remove loading

---
 .../route-switch/antd/admin-layout/index.tsx  |  7 +----
 .../client/src/user/CurrentUserProvider.tsx   |  8 +----
 .../user/CurrentUserSettingsMenuProvider.tsx  |  8 ++---
 .../src/client/components/InitializeTheme.tsx | 30 +++++++------------
 .../src/client/hooks/useThemeSettings.tsx     | 12 +-------
 .../client/hooks/useUpdateThemeSettings.tsx   |  3 +-
 6 files changed, 17 insertions(+), 51 deletions(-)

diff --git a/packages/core/client/src/route-switch/antd/admin-layout/index.tsx b/packages/core/client/src/route-switch/antd/admin-layout/index.tsx
index 42b7c9ac29..fddb0c0495 100644
--- a/packages/core/client/src/route-switch/antd/admin-layout/index.tsx
+++ b/packages/core/client/src/route-switch/antd/admin-layout/index.tsx
@@ -296,12 +296,7 @@ const SetThemeOfHeaderSubmenu = ({ children }) => {
     };
   }, []);
 
-  return (
-    <>
-      <GlobalStyleForAdminLayout />
-      <ConfigProvider getPopupContainer={() => containerRef.current}>{children}</ConfigProvider>
-    </>
-  );
+  return <ConfigProvider getPopupContainer={() => containerRef.current}>{children}</ConfigProvider>;
 };
 
 const sideClass = css`
diff --git a/packages/core/client/src/user/CurrentUserProvider.tsx b/packages/core/client/src/user/CurrentUserProvider.tsx
index 6aec3556c8..786417c38e 100644
--- a/packages/core/client/src/user/CurrentUserProvider.tsx
+++ b/packages/core/client/src/user/CurrentUserProvider.tsx
@@ -12,7 +12,6 @@ import { Navigate } from 'react-router-dom';
 import { useACLRoleContext } from '../acl';
 import { ReturnTypeOfUseRequest, useRequest } from '../api-client';
 import { useLocationNoUpdate } from '../application';
-import { useAppSpin } from '../application/hooks/useAppSpin';
 import { useCompile } from '../schema-component';
 
 export const CurrentUserContext = createContext<ReturnTypeOfUseRequest>(null);
@@ -40,15 +39,10 @@ export const useCurrentRoles = () => {
 };
 
 export const CurrentUserProvider = (props) => {
-  const { render } = useAppSpin();
   const result = useRequest<any>({
     url: 'auth:check',
   });
 
-  if (result.loading) {
-    return render();
-  }
-
   return <CurrentUserContext.Provider value={result}>{props.children}</CurrentUserContext.Provider>;
 };
 
@@ -56,7 +50,7 @@ export const NavigateIfNotSignIn = ({ children }) => {
   const result = useCurrentUserContext();
   const { pathname, search } = useLocationNoUpdate();
   const redirect = `?redirect=${pathname}${search}`;
-  if (!result?.data?.data?.id) {
+  if (result.loading === false && !result.data?.data?.id) {
     return <Navigate replace to={`/signin${redirect}`} />;
   }
   return <>{children}</>;
diff --git a/packages/core/client/src/user/CurrentUserSettingsMenuProvider.tsx b/packages/core/client/src/user/CurrentUserSettingsMenuProvider.tsx
index 4a4a41eb4f..a7ef32baf6 100644
--- a/packages/core/client/src/user/CurrentUserSettingsMenuProvider.tsx
+++ b/packages/core/client/src/user/CurrentUserSettingsMenuProvider.tsx
@@ -9,7 +9,7 @@
 
 import { error } from '@nocobase/utils/client';
 import { ItemType } from 'antd/es/menu/hooks/useItems';
-import React, { createContext, useCallback, useContext, useRef } from 'react';
+import React, { createContext, useCallback, useContext, useMemo, useRef } from 'react';
 
 type menuItemsKey =
   | 'version'
@@ -92,8 +92,6 @@ export const useCurrentUserSettingsMenu = () => {
  */
 export const CurrentUserSettingsMenuProvider = ({ children }) => {
   const menuItems = useRef<ItemType[]>([]);
-
-  return (
-    <CurrentUserSettingsMenuContext.Provider value={{ menuItems }}>{children}</CurrentUserSettingsMenuContext.Provider>
-  );
+  const value = useMemo(() => ({ menuItems }), [menuItems]);
+  return <CurrentUserSettingsMenuContext.Provider value={value}>{children}</CurrentUserSettingsMenuContext.Provider>;
 };
diff --git a/packages/plugins/@nocobase/plugin-theme-editor/src/client/components/InitializeTheme.tsx b/packages/plugins/@nocobase/plugin-theme-editor/src/client/components/InitializeTheme.tsx
index 8949fb09de..ca18848ccd 100644
--- a/packages/plugins/@nocobase/plugin-theme-editor/src/client/components/InitializeTheme.tsx
+++ b/packages/plugins/@nocobase/plugin-theme-editor/src/client/components/InitializeTheme.tsx
@@ -9,15 +9,14 @@
 
 import { defaultTheme as presetTheme, useAPIClient, useCurrentUserContext, useGlobalTheme } from '@nocobase/client';
 import { error } from '@nocobase/utils/client';
-import { Spin } from 'antd';
 import React, { useEffect, useMemo, useRef } from 'react';
 import { changeAlgorithmFromFunctionToString } from '../utils/changeAlgorithmFromFunctionToString';
 import { changeAlgorithmFromStringToFunction } from '../utils/changeAlgorithmFromStringToFunction';
 import { useThemeListContext } from './ThemeListProvider';
 
 const ThemeIdContext = React.createContext<{
-  currentThemeId: number;
-  defaultThemeId: number;
+  currentThemeId?: number;
+  defaultThemeId?: number;
 }>({} as any);
 
 export const useThemeId = () => {
@@ -75,24 +74,15 @@ const InitializeTheme: React.FC = ({ children }) => {
     }
   }, [api.auth, currentUser?.data?.data?.systemSettings?.themeId, data, run, setTheme, defaultTheme]);
 
-  if (loading && !data) {
-    return (
-      <div style={{ textAlign: 'center', marginTop: 20 }}>
-        <Spin />
-      </div>
-    );
-  }
+  const value =
+    (loading && !data) || currentUser.loading
+      ? {}
+      : {
+          currentThemeId: themeId.current,
+          defaultThemeId: defaultTheme?.id,
+        };
 
-  return (
-    <ThemeIdContext.Provider
-      value={{
-        currentThemeId: themeId.current,
-        defaultThemeId: defaultTheme?.id,
-      }}
-    >
-      {children}
-    </ThemeIdContext.Provider>
-  );
+  return <ThemeIdContext.Provider value={value}>{children}</ThemeIdContext.Provider>;
 };
 
 InitializeTheme.displayName = 'InitializeTheme';
diff --git a/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useThemeSettings.tsx b/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useThemeSettings.tsx
index abb1331bf2..6cd6b726ab 100644
--- a/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useThemeSettings.tsx
+++ b/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useThemeSettings.tsx
@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { SelectWithTitle, useCurrentUserContext, useSystemSettings } from '@nocobase/client';
+import { SelectWithTitle } from '@nocobase/client';
 import { error } from '@nocobase/utils/client';
 import { MenuProps } from 'antd';
 import React, { useEffect, useMemo } from 'react';
@@ -28,8 +28,6 @@ export const useThemeSettings = () => {
 
 function Label() {
   const { t } = useTranslation();
-  const currentUser = useCurrentUserContext();
-  const systemSettings = useSystemSettings();
   const { run, error: err, data } = useThemeListContext();
   const { updateUserThemeSettings } = useUpdateThemeSettings();
   const { currentThemeId } = useThemeId();
@@ -56,14 +54,6 @@ function Label() {
     return null;
   }
 
-  if (process.env.NODE_ENV !== 'production' && !currentUser) {
-    throw new Error('Please check if provide `CurrentUserProvider` in your app.');
-  }
-
-  if (process.env.NODE_ENV !== 'production' && !systemSettings) {
-    throw new Error('Please check if provide `SystemSettingsProvider` in your app.');
-  }
-
   return (
     <SelectWithTitle
       title={t('Theme')}
diff --git a/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useUpdateThemeSettings.tsx b/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useUpdateThemeSettings.tsx
index a77dd00cb4..fdba6f7209 100644
--- a/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useUpdateThemeSettings.tsx
+++ b/packages/plugins/@nocobase/plugin-theme-editor/src/client/hooks/useUpdateThemeSettings.tsx
@@ -7,14 +7,13 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { useAPIClient, useCurrentUserContext, useSystemSettings } from '@nocobase/client';
+import { useAPIClient, useCurrentUserContext } from '@nocobase/client';
 import { error } from '@nocobase/utils/client';
 import { useCallback } from 'react';
 
 export function useUpdateThemeSettings() {
   const api = useAPIClient();
   const currentUser = useCurrentUserContext();
-  const systemSettings = useSystemSettings();
 
   const updateUserThemeSettings = useCallback(
     async (themeId: number | null) => {