first commit

src/app.tsx

@@ -0,0 +1,135 @@
+import { history, RunTimeLayoutConfig, useIntl } from '@umijs/max';
+import { Dropdown } from 'antd';
+import { handleRequestConfig as devRequestConfig } from '../config/request_dev';
+import { handleRequestConfig as prodRequestConfig } from '../config/request_prod';
+import UnAccessPage from './components/403/403Page';
+
+import { ROUTE_LOGIN } from './constants';
+import { parseJwt } from './utils/jwtTokenUtils';
+import { getToken, removeToken } from './utils/localStorageUtils';
+
+// Avatar component with i18n support
+const AvatarDropdown = () => {
+  const intl = useIntl();
+  return (
+    <Dropdown
+      menu={{
+        items: [
+          {
+            key: 'logout',
+            label: intl.formatMessage({ id: 'common.logout' }),
+            onClick: () => {
+              removeToken();
+              history.push(ROUTE_LOGIN);
+            },
+          },
+        ],
+      }}
+    >
+      <div
+        style={{
+          width: 32,
+          height: 32,
+          borderRadius: '50%',
+          cursor: 'pointer',
+          backgroundColor: '#1890ff',
+          color: 'white',
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center',
+          fontWeight: 'bold',
+        }}
+      >
+        {intl.formatMessage({ id: 'common.user' })}
+      </div>
+    </Dropdown>
+  );
+};
+
+export async function getInitialState() {
+  const token: string = getToken();
+  const { pathname } = history.location;
+
+  if (!token) {
+    if (pathname !== ROUTE_LOGIN) {
+      history.push(`${ROUTE_LOGIN}?redirect=${pathname}`);
+    } else {
+      history.push(ROUTE_LOGIN);
+    }
+    return {};
+  }
+
+  const parsed = parseJwt(token);
+  if (!parsed) {
+    removeToken();
+    if (pathname !== ROUTE_LOGIN) {
+      history.push(`${ROUTE_LOGIN}?redirect=${pathname}`);
+    } else {
+      history.push(ROUTE_LOGIN);
+    }
+    return {};
+  }
+
+  const { sub, exp } = parsed;
+  const now = Math.floor(Date.now() / 1000);
+  const oneHour = 60 * 60;
+
+  if (exp - now < oneHour) {
+    console.warn('Token expired or nearly expired, redirecting...');
+    removeToken();
+    if (pathname !== ROUTE_LOGIN) {
+      history.push(`${ROUTE_LOGIN}?redirect=${pathname}`);
+    } else {
+      history.push(ROUTE_LOGIN);
+    }
+    return {};
+  }
+
+  return {
+    currentUser: sub,
+    exp,
+  };
+}
+
+export const layout: RunTimeLayoutConfig = (initialState) => {
+  return {
+    title: 'SMT Production Management',
+    fixedHeader: true,
+    contentWidth: 'Fluid',
+    navTheme: 'light',
+    splitMenus: true,
+    menu: {
+      locale: true,
+    },
+    contentStyle: {
+      padding: 0,
+      margin: 0,
+      paddingInline: 0,
+    },
+    avatarProps: {
+      size: 'small',
+      render: () => <AvatarDropdown />,
+    },
+    layout: 'top',
+    logout: () => {
+      removeToken();
+      history.push(ROUTE_LOGIN);
+    },
+    onPageChange: () => {
+      if (!initialState.initialState) {
+        history.push(ROUTE_LOGIN);
+      }
+    },
+    menuHeaderRender: undefined,
+    unAccessible: <UnAccessPage />,
+    token: {
+      pageContainer: {
+        paddingInlinePageContainerContent: 0,
+        paddingBlockPageContainerContent: 0,
+      },
+    },
+  };
+};
+
+const isProdBuild = process.env.NODE_ENV === 'production';
+export const request = isProdBuild ? prodRequestConfig : devRequestConfig;