mirror of
https://github.com/Unleash/unleash.git
synced 2025-07-21 13:47:39 +02:00
task: added a hook for cleanly deciding new or old admin menu (#9645)
This commit is contained in:
parent
5da9f75014
commit
14c8b97441
@ -1,9 +1,8 @@
|
||||
import { Grid, styled, Paper, useMediaQuery, useTheme } from '@mui/material';
|
||||
import { useUiFlag } from 'hooks/useUiFlag';
|
||||
import type { ReactNode } from 'react';
|
||||
import { Sticky } from 'component/common/Sticky/Sticky';
|
||||
import { AdminMenuNavigation } from './AdminNavigationItems';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { useNewAdminMenu } from '../../../../hooks/useNewAdminMenu';
|
||||
|
||||
const breakpointLgMinusPadding = 1250;
|
||||
const breakpointLgMinusPaddingAdmin = 1550;
|
||||
@ -118,14 +117,10 @@ interface IWrapIfAdminSubpageProps {
|
||||
}
|
||||
|
||||
export const WrapIfAdminSubpage = ({ children }: IWrapIfAdminSubpageProps) => {
|
||||
const newAdminUIEnabled = useUiFlag('adminNavUI');
|
||||
const showOnlyAdminMenu = useNewAdminMenu();
|
||||
const theme = useTheme();
|
||||
const location = useLocation();
|
||||
const isSmallScreen = useMediaQuery(theme.breakpoints.down('lg'));
|
||||
const showAdminMenu =
|
||||
!isSmallScreen &&
|
||||
newAdminUIEnabled &&
|
||||
location.pathname.indexOf('/admin') === 0;
|
||||
const showAdminMenu = !isSmallScreen && showOnlyAdminMenu;
|
||||
|
||||
if (showAdminMenu) {
|
||||
return (
|
||||
|
@ -1,6 +1,5 @@
|
||||
import { forwardRef, type ReactNode } from 'react';
|
||||
import { Box, Grid, styled, useMediaQuery, useTheme } from '@mui/material';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import Header from 'component/menu/Header/Header';
|
||||
import Footer from 'component/menu/Footer/Footer';
|
||||
import Proclamation from 'component/common/Proclamation/Proclamation';
|
||||
@ -18,8 +17,9 @@ import { ThemeMode } from 'component/common/ThemeMode/ThemeMode';
|
||||
import { NavigationSidebar } from './NavigationSidebar/NavigationSidebar';
|
||||
import { EventTimelineProvider } from 'component/events/EventTimeline/EventTimelineProvider';
|
||||
import { NewInUnleash } from './NavigationSidebar/NewInUnleash/NewInUnleash';
|
||||
import { useUiFlag } from 'hooks/useUiFlag';
|
||||
|
||||
import { WrapIfAdminSubpage } from './AdminMenu/AdminMenu';
|
||||
import { useNewAdminMenu } from '../../../hooks/useNewAdminMenu';
|
||||
|
||||
interface IMainLayoutProps {
|
||||
children: ReactNode;
|
||||
@ -65,18 +65,15 @@ const MainLayoutContentContainer = styled('main')(({ theme }) => ({
|
||||
|
||||
export const MainLayout = forwardRef<HTMLDivElement, IMainLayoutProps>(
|
||||
({ children }, ref) => {
|
||||
const newAdminUIEnabled = useUiFlag('adminNavUI');
|
||||
const showOnlyAdminMenu = useNewAdminMenu();
|
||||
const { uiConfig } = useUiConfig();
|
||||
const location = useLocation();
|
||||
const projectId = useOptionalPathParam('projectId');
|
||||
const { isChangeRequestConfiguredInAnyEnv } = useChangeRequestsEnabled(
|
||||
projectId || '',
|
||||
);
|
||||
|
||||
const theme = useTheme();
|
||||
const isSmallScreen = useMediaQuery(theme.breakpoints.down('lg'));
|
||||
const showOnlyAdminMenu =
|
||||
newAdminUIEnabled && location.pathname.indexOf('/admin') === 0;
|
||||
|
||||
const showRegularNavigationSideBar =
|
||||
!isSmallScreen && !showOnlyAdminMenu;
|
||||
|
||||
|
12
frontend/src/hooks/useNewAdminMenu.ts
Normal file
12
frontend/src/hooks/useNewAdminMenu.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { useUiFlag } from './useUiFlag';
|
||||
import { useLocation } from 'react-router';
|
||||
|
||||
export const useNewAdminMenu = () => {
|
||||
const newAdminUIEnabled = useUiFlag('adminNavUI');
|
||||
const location = useLocation();
|
||||
return (
|
||||
newAdminUIEnabled &&
|
||||
(location.pathname.indexOf('/admin') === 0 ||
|
||||
location.pathname.indexOf('/history') === 0)
|
||||
);
|
||||
};
|
@ -57,7 +57,7 @@ process.nextTick(async () => {
|
||||
filterExistingFlagNames: true,
|
||||
teamsIntegrationChangeRequests: true,
|
||||
simplifyDisableFeature: true,
|
||||
adminNavUI: false,
|
||||
adminNavUI: true,
|
||||
tagTypeColor: true,
|
||||
},
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user