fm453/nocobase
1
0
Fork 0
mirror of https://gitee.com/nocobase/nocobase.git synced 2025-05-08 06:59:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: update mobile layout handling and clean up unused context (#6600)

Browse Source
This commit is contained in:
Zeke Zhang 2025-04-01 11:36:37 +08:00 committed by GitHub
parent b8b539dbc8
commit 3558fc3ced
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 9 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
packages/core/client/src/route-switch/antd/admin-layout/index.tsx
View File

@ -8,7 +8,7 @@
*/ */
import { EllipsisOutlined } from '@ant-design/icons'; import { EllipsisOutlined } from '@ant-design/icons';
import ProLayout, { RouteContext, RouteContextType } from '@ant-design/pro-layout'; import ProLayout, { RouteContext } from '@ant-design/pro-layout';
import { HeaderViewProps } from '@ant-design/pro-layout/es/components/Header'; import { HeaderViewProps } from '@ant-design/pro-layout/es/components/Header';
import { css } from '@emotion/css'; import { css } from '@emotion/css';
import { theme as antdTheme, ConfigProvider, Popover, Tooltip } from 'antd'; import { theme as antdTheme, ConfigProvider, Popover, Tooltip } from 'antd';
@ -53,6 +53,7 @@ import { KeepAlive } from './KeepAlive';
import { NocoBaseDesktopRoute, NocoBaseDesktopRouteType } from './convertRoutesToSchema'; import { NocoBaseDesktopRoute, NocoBaseDesktopRouteType } from './convertRoutesToSchema';
import { MenuSchemaToolbar, ResetThemeTokenAndKeepAlgorithm } from './menuItemSettings'; import { MenuSchemaToolbar, ResetThemeTokenAndKeepAlgorithm } from './menuItemSettings';
import { userCenterSettings } from './userCenterSettings'; import { userCenterSettings } from './userCenterSettings';
import { isMobile } from 'react-device-detect';
export { KeepAlive, NocoBaseDesktopRouteType }; export { KeepAlive, NocoBaseDesktopRouteType };
@ -75,7 +76,7 @@ const AllAccessDesktopRoutesContext = createContext<{
refresh: () => void; refresh: () => void;
}>({ }>({
allAccessRoutes: emptyArray, allAccessRoutes: emptyArray,
refresh: () => {}, refresh: () => { },
}); });
AllAccessDesktopRoutesContext.displayName = 'AllAccessDesktopRoutesContext'; AllAccessDesktopRoutesContext.displayName = 'AllAccessDesktopRoutesContext';
@ -564,11 +565,11 @@ const IsMobileLayoutContext = React.createContext<{
setIsMobileLayout: React.Dispatch<React.SetStateAction<boolean>>; setIsMobileLayout: React.Dispatch<React.SetStateAction<boolean>>;
}>({ }>({
isMobileLayout: false, isMobileLayout: false,
setIsMobileLayout: () => {}, setIsMobileLayout: () => { },
}); });
const MobileLayoutProvider: FC = (props) => { const MobileLayoutProvider: FC = (props) => {
const [isMobileLayout, setIsMobileLayout] = useState(false); const [isMobileLayout, setIsMobileLayout] = useState(isMobile);
const value = useMemo(() => ({ isMobileLayout, setIsMobileLayout }), [isMobileLayout]); const value = useMemo(() => ({ isMobileLayout, setIsMobileLayout }), [isMobileLayout]);
return <IsMobileLayoutContext.Provider value={value}>{props.children}</IsMobileLayoutContext.Provider>; return <IsMobileLayoutContext.Provider value={value}>{props.children}</IsMobileLayoutContext.Provider>;
@ -585,7 +586,7 @@ export const InternalAdminLayout = () => {
const location = useLocation(); const location = useLocation();
const { onDragEnd } = useMenuDragEnd(); const { onDragEnd } = useMenuDragEnd();
const { token } = useToken(); const { token } = useToken();
const { isMobileLayout, setIsMobileLayout } = useMobileLayout(); const { isMobileLayout } = useMobileLayout();
const [collapsed, setCollapsed] = useState(isMobileLayout); const [collapsed, setCollapsed] = useState(isMobileLayout);
const doNotChangeCollapsedRef = useRef(false); const doNotChangeCollapsedRef = useRef(false);
const { t } = useMenuTranslation(); const { t } = useMenuTranslation();
@ -680,21 +681,9 @@ export const InternalAdminLayout = () => {
onPageChange={onPageChange} onPageChange={onPageChange}
menuProps={menuProps} menuProps={menuProps}
> >
<RouteContext.Consumer> <ConfigProvider theme={isMobileLayout ? mobileTheme : theme}>
{(value: RouteContextType) => { <LayoutContent />
const { isMobile: _isMobile } = value; </ConfigProvider>
if (_isMobile !== isMobileLayout) {
setIsMobileLayout(_isMobile);
}
return (
<ConfigProvider theme={_isMobile ? mobileTheme : theme}>
<LayoutContent />
</ConfigProvider>
);
}}
</RouteContext.Consumer>
</ProLayout> </ProLayout>
</DndContext> </DndContext>
); );