fix: initialState refresh

src/app.tsx

@@ -8,7 +8,6 @@ import {
 import { RequestConfig, history } from '@umijs/max';
 
 const loginPath = '/login';
-let currentUserInfo: any = {};
 
 // 运行时配置
 export async function getInitialState(): Promise<{
@@ -42,9 +41,7 @@ export async function getInitialState(): Promise<{
 
   if (![loginPath].includes(location.pathname)) {
     const userInfo = await fetchUserInfo();
-    currentUserInfo = {
-      ...userInfo
-    };
+
     return {
       fetchUserInfo,
       currentUser: userInfo
@@ -55,8 +52,6 @@ export async function getInitialState(): Promise<{
   };
 }
 
-console.log('app.tsx');
-
 export const request: RequestConfig = {
   baseURL: ' /v1',
   ...requestConfig

src/layouts/Exception.tsx

@@ -14,6 +14,7 @@ const Exception: React.FC<{
 }> = (props) => {
   const intl = useIntl();
   // render custom 404
+  console.log('exception====', props.route);
   return (
     (!props.route && (props.noFound || props.notFound)) ||
     // render custom 403

src/layouts/index.tsx

@@ -30,6 +30,11 @@ import { getRightRenderContent } from './rightRender';
 import { patchRoutes } from './runtime';
 const loginPath = '/login';
 
+type InitialStateType = {
+  fetchUserInfo: () => Promise<Global.UserInfo>;
+  currentUser?: Global.UserInfo;
+};
+
 // 过滤出需要显示的路由, 这里的filterFn 指 不希望显示的层级
 const filterRoutes = (
   routes: IRoute[],
@@ -93,6 +98,9 @@ export default (props: any) => {
     loading: false,
     setInitialState: null
   };
+
+  // initialState: InitialStateType
+
   const { initialState, loading, setInitialState } = initialInfo;
 
   const userConfig = {
@@ -121,7 +129,6 @@ export default (props: any) => {
   const runtimeConfig = {
     ...initialInfo,
     logout: async (userInfo) => {
-      console.log('logout', userInfo);
       await logout();
       navigate(loginPath);
     },
@@ -181,8 +188,7 @@ export default (props: any) => {
         onPageChange={(route) => {
           const { location } = history;
 
-          // 如果没有修改密码，重定向到修改密码
-          console.log('onPageChange', initialState);
+          console.log('onPageChange', userInfo, initialState);
           if (
             location.pathname !== loginPath &&
             userInfo?.require_password_change

src/layouts/rightRender.tsx

@@ -144,11 +144,9 @@ export function getRightRenderContent(opts: {
           ),
           onClick() {
             if (item.key === 'version') {
-              // opts.runtimeConfig.showVersion();
               opts.runtimeConfig.showVersion();
             }
             if (item.key === 'shortcuts') {
-              // opts.runtimeConfig.showShortcuts();
               opts.runtimeConfig.showShortcuts();
             }
           }

src/pages/login/components/login-form.tsx

@@ -12,52 +12,13 @@ import { history, useIntl, useModel } from '@umijs/max';
 import { Button, Checkbox, Form } from 'antd';
 import CryptoJS from 'crypto-js';
 import { useAtom } from 'jotai';
+import { memo, useEffect, useMemo } from 'react';
 import { flushSync } from 'react-dom';
 import { login } from '../apis';
 
 const REMEMBER_ME_KEY = 'r_m';
 const CRYPT_TEXT = 'seal';
 
-const renderLogo = () => {
-  return (
-    <div
-      style={{
-        display: 'flex',
-        marginBottom: 0,
-        padding: '15px 0',
-        justifyContent: 'center',
-        alignItems: 'center'
-      }}
-    >
-      <img src={LogoIcon} alt="logo" style={{ height: '26px' }} />
-    </div>
-  );
-};
-
-const renderWelCome = (intl: any) => {
-  return (
-    <div
-      style={{
-        display: 'flex',
-        marginBottom: 32,
-        fontSize: 20,
-        justifyContent: 'center',
-        alignItems: 'center'
-      }}
-    >
-      <div className="flex-center">
-        <span>
-          {intl?.formatMessage({ id: 'users.login.title' }, { name: '' })}
-        </span>
-        <img
-          src={LogoIcon}
-          alt="logo"
-          style={{ height: '24px', marginLeft: 10 }}
-        />
-      </div>
-    </div>
-  );
-};
 const LoginForm = () => {
   const [userInfo, setUserInfo] = useAtom(userAtom);
   const [initialPassword, setInitialPassword] = useAtom(initialPasswordAtom);
@@ -65,6 +26,32 @@ const LoginForm = () => {
   const intl = useIntl();
   const [form] = Form.useForm();
 
+  console.log('initialState+++++++=login', userInfo, initialState);
+  const renderWelCome = useMemo(() => {
+    return (
+      <div
+        style={{
+          display: 'flex',
+          marginBottom: 32,
+          fontSize: 20,
+          justifyContent: 'center',
+          alignItems: 'center'
+        }}
+      >
+        <div className="flex-center">
+          <span>
+            {intl?.formatMessage({ id: 'users.login.title' }, { name: '' })}
+          </span>
+          <img
+            src={LogoIcon}
+            alt="logo"
+            style={{ height: '24px', marginLeft: 10 }}
+          />
+        </div>
+      </div>
+    );
+  }, []);
+
   const gotoDefaultPage = (userInfo: any) => {
     const pathname =
       userInfo && userInfo?.is_admin ? '/dashboard' : '/playground';
@@ -140,7 +127,9 @@ const LoginForm = () => {
     }
   };
 
-  callGetRememberMe();
+  useEffect(() => {
+    callGetRememberMe();
+  }, []);
 
   return (
     <div>
@@ -160,7 +149,7 @@ const LoginForm = () => {
           style={{ width: '400px', margin: '0 auto' }}
           onFinish={handleLogin}
         >
-          {renderWelCome(intl)}
+          {renderWelCome}
           <Form.Item
             name="username"
             rules={[
@@ -218,4 +207,4 @@ const LoginForm = () => {
   );
 };
 
-export default LoginForm;
+export default memo(LoginForm);

src/pages/login/index.tsx

@@ -1,6 +1,6 @@
 import { userAtom } from '@/atoms/user';
 import Footer from '@/components/footer';
-import { history } from '@umijs/max';
+import { history, useModel } from '@umijs/max';
 import { useAtom } from 'jotai';
 import { useEffect } from 'react';
 import LoginForm from './components/login-form';
@@ -9,11 +9,18 @@ import styles from './components/styles.less';
 
 const Login = () => {
   const [userInfo, setUserInfo] = useAtom(userAtom);
+  const { initialState, setInitialState } = useModel('@@initialState') || {};
 
   const gotoDefaultPage = (userInfo: any) => {
     if (!userInfo || userInfo?.require_password_change) {
       return;
     }
+    if (!initialState?.currentUser) {
+      setInitialState((s: any) => ({
+        ...s,
+        currentUser: userInfo
+      }));
+    }
     const pathname = userInfo?.is_admin ? '/dashboard' : '/playground';
 
     history.push(pathname, { replace: true });