mirror of
https://gitee.com/nocobase/nocobase.git
synced 2025-05-07 14:39:25 +08:00
fix: update mobile layout handling and clean up unused context (#6600)
This commit is contained in:
parent
b8b539dbc8
commit
3558fc3ced
@ -8,7 +8,7 @@
|
||||
*/
|
||||
|
||||
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 { css } from '@emotion/css';
|
||||
import { theme as antdTheme, ConfigProvider, Popover, Tooltip } from 'antd';
|
||||
@ -53,6 +53,7 @@ import { KeepAlive } from './KeepAlive';
|
||||
import { NocoBaseDesktopRoute, NocoBaseDesktopRouteType } from './convertRoutesToSchema';
|
||||
import { MenuSchemaToolbar, ResetThemeTokenAndKeepAlgorithm } from './menuItemSettings';
|
||||
import { userCenterSettings } from './userCenterSettings';
|
||||
import { isMobile } from 'react-device-detect';
|
||||
|
||||
export { KeepAlive, NocoBaseDesktopRouteType };
|
||||
|
||||
@ -75,7 +76,7 @@ const AllAccessDesktopRoutesContext = createContext<{
|
||||
refresh: () => void;
|
||||
}>({
|
||||
allAccessRoutes: emptyArray,
|
||||
refresh: () => {},
|
||||
refresh: () => { },
|
||||
});
|
||||
AllAccessDesktopRoutesContext.displayName = 'AllAccessDesktopRoutesContext';
|
||||
|
||||
@ -564,11 +565,11 @@ const IsMobileLayoutContext = React.createContext<{
|
||||
setIsMobileLayout: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
}>({
|
||||
isMobileLayout: false,
|
||||
setIsMobileLayout: () => {},
|
||||
setIsMobileLayout: () => { },
|
||||
});
|
||||
|
||||
const MobileLayoutProvider: FC = (props) => {
|
||||
const [isMobileLayout, setIsMobileLayout] = useState(false);
|
||||
const [isMobileLayout, setIsMobileLayout] = useState(isMobile);
|
||||
const value = useMemo(() => ({ isMobileLayout, setIsMobileLayout }), [isMobileLayout]);
|
||||
|
||||
return <IsMobileLayoutContext.Provider value={value}>{props.children}</IsMobileLayoutContext.Provider>;
|
||||
@ -585,7 +586,7 @@ export const InternalAdminLayout = () => {
|
||||
const location = useLocation();
|
||||
const { onDragEnd } = useMenuDragEnd();
|
||||
const { token } = useToken();
|
||||
const { isMobileLayout, setIsMobileLayout } = useMobileLayout();
|
||||
const { isMobileLayout } = useMobileLayout();
|
||||
const [collapsed, setCollapsed] = useState(isMobileLayout);
|
||||
const doNotChangeCollapsedRef = useRef(false);
|
||||
const { t } = useMenuTranslation();
|
||||
@ -680,21 +681,9 @@ export const InternalAdminLayout = () => {
|
||||
onPageChange={onPageChange}
|
||||
menuProps={menuProps}
|
||||
>
|
||||
<RouteContext.Consumer>
|
||||
{(value: RouteContextType) => {
|
||||
const { isMobile: _isMobile } = value;
|
||||
|
||||
if (_isMobile !== isMobileLayout) {
|
||||
setIsMobileLayout(_isMobile);
|
||||
}
|
||||
|
||||
return (
|
||||
<ConfigProvider theme={_isMobile ? mobileTheme : theme}>
|
||||
<LayoutContent />
|
||||
</ConfigProvider>
|
||||
);
|
||||
}}
|
||||
</RouteContext.Consumer>
|
||||
<ConfigProvider theme={isMobileLayout ? mobileTheme : theme}>
|
||||
<LayoutContent />
|
||||
</ConfigProvider>
|
||||
</ProLayout>
|
||||
</DndContext>
|
||||
);
|
||||
|
Loading…
x
Reference in New Issue
Block a user