From 17eaee373c6f4a0927c8f0211767ef276e5afe91 Mon Sep 17 00:00:00 2001 From: Zeke Zhang <958414905@qq.com> Date: Sun, 27 Apr 2025 12:38:53 +0800 Subject: [PATCH] refactor: unify 404 page components (#6778) --- .../core/client/src/common/AppNotFound.tsx | 30 +++++++++++++++++++ packages/core/client/src/common/index.ts | 1 + .../src/nocobase-buildin-plugin/index.tsx | 19 ++---------- packages/core/client/src/pm/PluginManager.tsx | 5 ++-- packages/core/client/src/pm/PluginSetting.tsx | 11 ++----- .../route-switch/antd/admin-layout/index.tsx | 2 +- .../src/schema-component/antd/page/Page.tsx | 2 +- .../schema-component/antd/page/PagePopups.tsx | 8 ++--- 8 files changed, 43 insertions(+), 35 deletions(-) create mode 100644 packages/core/client/src/common/AppNotFound.tsx diff --git a/packages/core/client/src/common/AppNotFound.tsx b/packages/core/client/src/common/AppNotFound.tsx new file mode 100644 index 0000000000..1b5f84c7d5 --- /dev/null +++ b/packages/core/client/src/common/AppNotFound.tsx @@ -0,0 +1,30 @@ +/** + * This file is part of the NocoBase (R) project. + * Copyright (c) 2020-2024 NocoBase Co., Ltd. + * Authors: NocoBase Team. + * + * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License. + * For more information, please refer to: https://www.nocobase.com/agreement. + */ + +import { Button, Result } from 'antd'; +import React from 'react'; +import { useTranslation } from 'react-i18next'; +import { useNavigate } from 'react-router-dom'; + +export const AppNotFound = () => { + const navigate = useNavigate(); + const { t } = useTranslation(); + return ( + navigate('/', { replace: true })} type="primary"> + Back Home + + } + /> + ); +}; diff --git a/packages/core/client/src/common/index.ts b/packages/core/client/src/common/index.ts index dbc0e2243b..c581b3be5e 100644 --- a/packages/core/client/src/common/index.ts +++ b/packages/core/client/src/common/index.ts @@ -7,5 +7,6 @@ * For more information, please refer to: https://www.nocobase.com/agreement. */ +export * from './AppNotFound'; export * from './SelectWithTitle'; export * from './useFieldComponentName'; diff --git a/packages/core/client/src/nocobase-buildin-plugin/index.tsx b/packages/core/client/src/nocobase-buildin-plugin/index.tsx index c53173b30a..0332a71153 100644 --- a/packages/core/client/src/nocobase-buildin-plugin/index.tsx +++ b/packages/core/client/src/nocobase-buildin-plugin/index.tsx @@ -14,12 +14,13 @@ import { getSubAppName } from '@nocobase/sdk'; import { tval } from '@nocobase/utils/client'; import { Button, Modal, Result, Spin } from 'antd'; import React, { FC } from 'react'; -import { Navigate, useNavigate } from 'react-router-dom'; +import { Navigate } from 'react-router-dom'; import { ACLPlugin } from '../acl'; import { Application } from '../application'; import { Plugin } from '../application/Plugin'; import { BlockSchemaComponentPlugin } from '../block-provider'; import { CollectionPlugin } from '../collection-manager'; +import { AppNotFound } from '../common/AppNotFound'; import { RemoteDocumentTitlePlugin } from '../document-title'; import { PinnedListPlugin } from '../plugin-manager'; import { PMPlugin } from '../pm'; @@ -260,22 +261,6 @@ const AppMaintainingDialog: FC<{ app: Application; error: Error }> = observer( { displayName: 'AppMaintainingDialog' }, ); -export const AppNotFound = () => { - const navigate = useNavigate(); - return ( - navigate('/', { replace: true })} type="primary"> - Back Home - - } - /> - ); -}; - export class NocoBaseBuildInPlugin extends Plugin { async afterAdd() { this.app.addComponents({ diff --git a/packages/core/client/src/pm/PluginManager.tsx b/packages/core/client/src/pm/PluginManager.tsx index 76365d1537..2625544e2a 100644 --- a/packages/core/client/src/pm/PluginManager.tsx +++ b/packages/core/client/src/pm/PluginManager.tsx @@ -10,7 +10,7 @@ export * from './PluginManagerLink'; import { PageHeader } from '@ant-design/pro-layout'; import { useDebounce } from 'ahooks'; -import { Button, Col, Divider, Input, List, Modal, Result, Row, Space, Spin, Table, Tabs } from 'antd'; +import { Button, Col, Divider, Input, List, Modal, Row, Space, Spin, Table, Tabs } from 'antd'; import _ from 'lodash'; import React, { useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; @@ -19,6 +19,7 @@ import { useNavigate, useParams } from 'react-router-dom'; import { css } from '@emotion/css'; import { useACLRoleContext } from '../acl/ACLProvider'; import { useAPIClient, useRequest } from '../api-client'; +import { AppNotFound } from '../common/AppNotFound'; import { useDocumentTitle } from '../document-title'; import { useToken } from '../style'; import { PluginCard } from './PluginCard'; @@ -407,6 +408,6 @@ export const PluginManager = () => { ) : ( - + ); }; diff --git a/packages/core/client/src/pm/PluginSetting.tsx b/packages/core/client/src/pm/PluginSetting.tsx index 2c7b2f3d31..60260a1448 100644 --- a/packages/core/client/src/pm/PluginSetting.tsx +++ b/packages/core/client/src/pm/PluginSetting.tsx @@ -9,11 +9,12 @@ import { PageHeader } from '@ant-design/pro-layout'; import { css } from '@emotion/css'; -import { Layout, Menu, Result } from 'antd'; +import { Layout, Menu } from 'antd'; import _ from 'lodash'; import React, { createContext, useCallback, useEffect, useMemo } from 'react'; import { Navigate, Outlet, useLocation, useNavigate, useParams } from 'react-router-dom'; import { ADMIN_SETTINGS_PATH, PluginSettingsPageType, useApp } from '../application'; +import { AppNotFound } from '../common/AppNotFound'; import { useDocumentTitle } from '../document-title'; import { useCompile } from '../schema-component'; import { useStyles } from './style'; @@ -223,13 +224,7 @@ export const AdminSettingsLayout = () => { } /> )} -
- {currentSetting ? ( - - ) : ( - - )} -
+
{currentSetting ? : }
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 bc3fe20fb4..7f5413b938 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 @@ -18,7 +18,6 @@ import { useTranslation } from 'react-i18next'; import { Link, Navigate, Outlet, useLocation, useNavigate } from 'react-router-dom'; import { ACLRolesCheckProvider, - AppNotFound, CurrentAppInfoProvider, DndContext, Icon, @@ -45,6 +44,7 @@ import { useLocationNoUpdate, } from '../../../application/CustomRouterContextProvider'; import { Plugin } from '../../../application/Plugin'; +import { AppNotFound } from '../../../common/AppNotFound'; import { withTooltipComponent } from '../../../hoc/withTooltipComponent'; import { menuItemInitializer } from '../../../modules/menu/menuItemInitializer'; import { useMenuTranslation } from '../../../schema-component/antd/menu/locale'; diff --git a/packages/core/client/src/schema-component/antd/page/Page.tsx b/packages/core/client/src/schema-component/antd/page/Page.tsx index accee83a06..f0e1aa0779 100644 --- a/packages/core/client/src/schema-component/antd/page/Page.tsx +++ b/packages/core/client/src/schema-component/antd/page/Page.tsx @@ -29,10 +29,10 @@ import { useNavigateNoUpdate, useRouterBasename, } from '../../../application/CustomRouterContextProvider'; +import { AppNotFound } from '../../../common/AppNotFound'; import { useDocumentTitle } from '../../../document-title'; import { useGlobalTheme } from '../../../global-theme'; import { Icon } from '../../../icon'; -import { AppNotFound } from '../../../nocobase-buildin-plugin'; import { NocoBaseDesktopRouteType, NocoBaseRouteContext, diff --git a/packages/core/client/src/schema-component/antd/page/PagePopups.tsx b/packages/core/client/src/schema-component/antd/page/PagePopups.tsx index 818cf75460..ff4396cace 100644 --- a/packages/core/client/src/schema-component/antd/page/PagePopups.tsx +++ b/packages/core/client/src/schema-component/antd/page/PagePopups.tsx @@ -10,12 +10,11 @@ import { ISchema, Schema } from '@formily/json-schema'; import { useFieldSchema } from '@formily/react'; import { uid } from '@formily/shared'; -import { Result } from 'antd'; import _ from 'lodash'; import { FC, default as React, useCallback, useEffect, useMemo, useRef, useState } from 'react'; -import { useTranslation } from 'react-i18next'; import { Location, useLocation } from 'react-router-dom'; import { useAPIClient } from '../../../api-client'; +import { AppNotFound } from '../../../common/AppNotFound'; import { DataBlockProvider } from '../../../data-source/data-block/DataBlockProvider'; import { BlockRequestContextProvider } from '../../../data-source/data-block/DataBlockRequestProvider'; import { useKeepAlive } from '../../../route-switch/antd/admin-layout/KeepAlive'; @@ -475,10 +474,7 @@ function get404Schema() { version: '2.0', type: 'void', 'x-component': function Com() { - const { t } = useTranslation(); - return ( - - ); + return ; }, 'x-uid': uid(), 'x-async': false,