chore(platform): optimize platform

DevCloudFE · May 26, 2023 · e0626c1 · e0626c1
1 parent 4f4f31b
commit e0626c1
Show file tree

Hide file tree

Showing 9 changed files with 51 additions and 112 deletions.
diff --git a/packages/platform/src/app/App.tsx b/packages/platform/src/app/App.tsx
@@ -54,10 +54,6 @@ export function App() {
     }
   });
 
-  useEffect(() => {
-    document.documentElement.lang = languageStorage.value;
-  }, [languageStorage.value]);
-
   useEffect(() => {
     if (loading === false) {
       const loader = document.querySelector('.fp-loader') as HTMLElement;
@@ -68,6 +64,10 @@ export function App() {
     }
   }, [async, loading]);
 
+  useEffect(() => {
+    document.documentElement.lang = languageStorage.value;
+  }, [languageStorage.value]);
+
   useEffect(() => {
     for (const t of ['light', 'dark']) {
       document.body.classList.toggle(t, themeStorage.value === t);

diff --git a/packages/platform/src/app/core/http/useHttp.ts b/packages/platform/src/app/core/http/useHttp.ts
@@ -105,6 +105,7 @@ export function useHttp() {
     for (const abort of dataRef.current.abortFns) {
       abort();
     }
+    dataRef.current.abortFns = new Set();
   };
 
   useUnmount(() => {

diff --git a/packages/platform/src/app/core/index.ts b/packages/platform/src/app/core/index.ts
@@ -1,5 +1,5 @@
 export { useHttp } from './http';
-export { TOKEN, useRefreshToken } from './token';
+export { TOKEN } from './token';
 export { GlobalStore } from './store';
 export { useInit } from './useInit';
 export { useMenu } from './useMenu';
diff --git a/...ages/platform/src/app/core/token/token.ts → packages/platform/src/app/core/token.ts b/...ages/platform/src/app/core/token/token.ts → packages/platform/src/app/core/token.ts
@@ -2,8 +2,8 @@ import { isNull } from 'lodash';
 
 import { useStorage } from '@react-devui/hooks';
 
-import { environment } from '../../../environments';
-import { base64url } from '../../utils';
+import { environment } from '../../environments';
+import { base64url } from '../utils';
 
 export const TOKEN_KEY = 'token';
 export const TOKEN_TYPE: 'JWT' | 'CUSTOM' = 'JWT';

diff --git a/packages/platform/src/app/core/token/index.ts b/packages/platform/src/app/core/token/index.ts
diff --git a/packages/platform/src/app/core/token/useRefreshToken.ts b/packages/platform/src/app/core/token/useRefreshToken.ts
diff --git a/packages/platform/src/app/core/useInit.ts b/packages/platform/src/app/core/useInit.ts
@@ -1,30 +1,31 @@
 import type { AppNotification, AppUser } from './store';
 
+import { isNull } from 'lodash';
+
 import { useACL } from '@react-devui/hooks';
 
 import { ROLE_ACL } from '../config/acl';
 import { useHttp } from './http';
 import { GlobalStore } from './store';
-import { useRefreshToken } from './token';
+import { TOKEN, TOKEN_REFRESH, TOKEN_REFRESH_OFFSET } from './token';
+
+let CLEAR_TOKEN_REFRESH: (() => void) | undefined;
 
 export function useInit() {
   const http = useHttp();
   const acl = useACL();
 
-  const refreshToken = useRefreshToken();
+  return (user: AppUser) => {
+    acl.setFull(user.permission.includes(ROLE_ACL.super_admin));
+    acl.set(user.permission);
 
-  const handleUser = (user: AppUser) => {
     GlobalStore.set('appUser', user);
 
-    //#region ACL
-    acl.setFull(user.permission.includes(ROLE_ACL.super_admin));
-    acl.set(user.permission);
-    //#endregion
-  };
+    GlobalStore.set('appMenu', (draft) => {
+      draft.expands = undefined;
+    });
 
-  const getNotification = () => {
     GlobalStore.set('appNotifications', undefined);
-
     http<AppNotification[]>(
       {
         url: '/notification',
@@ -36,18 +37,37 @@ export function useInit() {
         GlobalStore.set('appNotifications', res);
       },
     });
-  };
 
-  const resetMenu = () => {
-    GlobalStore.set('appMenu', (draft) => {
-      draft.expands = undefined;
-    });
-  };
+    CLEAR_TOKEN_REFRESH?.();
+    if (TOKEN_REFRESH) {
+      const refresh = () => {
+        const expiration = TOKEN.expiration;
+        if (!isNull(expiration) && !TOKEN.expired) {
+          const tid = window.setTimeout(() => {
+            const refreshTokenReq = http<string>(
+              {
+                url: '/auth/refresh',
+                method: 'post',
+              },
+              { unmount: false }
+            );
+            refreshTokenReq.subscribe({
+              next: (res) => {
+                TOKEN.set(res);
 
-  return (user: AppUser) => {
-    refreshToken();
-    handleUser(user);
-    getNotification();
-    resetMenu();
+                refresh();
+              },
+            });
+            CLEAR_TOKEN_REFRESH = () => {
+              refreshTokenReq.abort();
+            };
+          }, expiration - Date.now() - TOKEN_REFRESH_OFFSET);
+          CLEAR_TOKEN_REFRESH = () => {
+            clearTimeout(tid);
+          };
+        }
+      };
+      refresh();
+    }
   };
 }
diff --git a/packages/platform/src/app/hooks/useTable.ts b/packages/platform/src/app/hooks/useTable.ts
diff --git a/packages/platform/src/app/routes/login/Login.tsx b/packages/platform/src/app/routes/login/Login.tsx
@@ -72,8 +72,9 @@ export default AppRoute(() => {
       { authorization: false }
     ).subscribe({
       next: (res) => {
-        setLoginLoading(false);
         TOKEN.set(res.token);
+
+        setLoginLoading(false);
         init(res.user);
         navigate(isString(from) && from !== LOGIN_PATH ? from : '/', { replace: true });
       },