Skip to content

Commit 1e7d022

Browse files
authored
chore: remove flag sideMenuCleanup (#10093)
- remove flag - remove unused components - adjust e2e test snapshots
1 parent ffe40ca commit 1e7d022

File tree

12 files changed

+39
-282
lines changed

12 files changed

+39
-282
lines changed

frontend/src/component/layout/MainLayout/NavigationSidebar/ConfigurationNavigationList.tsx

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,6 @@ import type { INavigationMenuItem } from 'interfaces/route';
33
import type { NavigationMode } from './NavigationMode.ts';
44
import { MenuListItem } from './ListItems.tsx';
55
import { List } from '@mui/material';
6-
import { IconRenderer } from './IconRenderer.tsx';
7-
import { useUiFlag } from 'hooks/useUiFlag.ts';
86
import StopRoundedIcon from '@mui/icons-material/StopRounded';
97
import { useShowBadge } from 'component/layout/components/EnterprisePlanBadge/useShowBadge';
108
import { EnterprisePlanBadge } from 'component/layout/components/EnterprisePlanBadge/EnterprisePlanBadge';
@@ -16,7 +14,6 @@ export const ConfigurationNavigationList: FC<{
1614
activeItem?: string;
1715
}> = ({ routes, mode, onClick, activeItem }) => {
1816
const showBadge = useShowBadge();
19-
const sideMenuCleanup = useUiFlag('sideMenuCleanup');
2017

2118
return (
2219
<List>
@@ -33,14 +30,8 @@ export const ConfigurationNavigationList: FC<{
3330
) : null
3431
}
3532
mode={mode}
36-
icon={
37-
sideMenuCleanup ? (
38-
<StopRoundedIcon fontSize='small' color='primary' />
39-
) : (
40-
<IconRenderer path={route.path} />
41-
)
42-
}
43-
secondary={sideMenuCleanup}
33+
icon={<StopRoundedIcon fontSize='small' color='primary' />}
34+
secondary={true}
4435
/>
4536
))}
4637
</List>

frontend/src/component/layout/MainLayout/NavigationSidebar/ListItems.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -204,11 +204,13 @@ export const MenuListAccordion: FC<{
204204
sx={{ padding: 0 }}
205205
expandIcon={mode === 'full' ? <ExpandMoreIcon /> : null}
206206
>
207+
{/* biome-ignore lint/a11y/useValidAriaRole: remove button role - accordion already has it */}
207208
<ListItemButton
208209
dense
209210
sx={listItemButtonStyle}
210211
selected={active && mode === 'mini'}
211212
disableRipple
213+
role={undefined}
212214
>
213215
{mode === 'mini' ? (
214216
<Tooltip title={title} placement='right'>

frontend/src/component/layout/MainLayout/NavigationSidebar/MobileNavigationSidebar.tsx

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,11 @@ import {
55
OtherLinksList,
66
} from './NavigationList.tsx';
77
import type { NewInUnleash } from './NewInUnleash/NewInUnleash.tsx';
8-
import { ConfigurationNavigationList } from './ConfigurationNavigationList.tsx';
9-
import { useRoutes } from './useRoutes.ts';
10-
import { useUiFlag } from 'hooks/useUiFlag.ts';
118

129
export const MobileNavigationSidebar: FC<{
1310
onClick: () => void;
1411
NewInUnleash?: typeof NewInUnleash;
1512
}> = ({ onClick, NewInUnleash }) => {
16-
const { routes } = useRoutes();
17-
const sideMenuCleanup = useUiFlag('sideMenuCleanup');
18-
1913
return (
2014
<>
2115
{NewInUnleash ? <NewInUnleash /> : null}
@@ -24,13 +18,6 @@ export const MobileNavigationSidebar: FC<{
2418
onClick={onClick}
2519
setMode={() => {}}
2620
/>
27-
{!sideMenuCleanup ? (
28-
<ConfigurationNavigationList
29-
routes={routes.mainNavRoutes}
30-
mode='full'
31-
onClick={onClick}
32-
/>
33-
) : null}
3421
<AdminSettingsLink mode={'full'} onClick={onClick} />
3522
<OtherLinksList />
3623
</>

frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationList.tsx

Lines changed: 8 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,11 @@ import {
66
MenuListItem,
77
SignOutItem,
88
} from './ListItems.tsx';
9-
import { Box, List, Typography } from '@mui/material';
9+
import { Box, List } from '@mui/material';
1010
import { IconRenderer } from './IconRenderer.tsx';
1111
import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
12-
import FlagIcon from '@mui/icons-material/OutlinedFlag';
13-
import { ProjectIcon } from 'component/common/ProjectIcon/ProjectIcon';
14-
import useProjectOverview from 'hooks/api/getters/useProjectOverview/useProjectOverview';
1512
import { useNewAdminMenu } from 'hooks/useNewAdminMenu';
1613
import { AdminMenuNavigation } from '../AdminMenu/AdminNavigationItems.tsx';
17-
import { useUiFlag } from 'hooks/useUiFlag.ts';
1814
import { ConfigurationAccordion } from './ConfigurationAccordion.tsx';
1915

2016
export const OtherLinksList = () => {
@@ -36,50 +32,6 @@ export const OtherLinksList = () => {
3632
);
3733
};
3834

39-
/**
40-
* @deprecated remove with `sideMenuCleanup` flag
41-
*/
42-
export const RecentProjectsList: FC<{
43-
projectId: string;
44-
projectName: string;
45-
mode: NavigationMode;
46-
onClick: () => void;
47-
}> = ({ projectId, projectName, mode, onClick }) => (
48-
<List>
49-
<MenuListItem
50-
href={`/projects/${projectId}`}
51-
text={projectName}
52-
onClick={onClick}
53-
selected={false}
54-
mode={mode}
55-
icon={<ProjectIcon />}
56-
/>
57-
</List>
58-
);
59-
60-
/**
61-
* @deprecated remove with `sideMenuCleanup` flag
62-
*/
63-
export const RecentFlagsList: FC<{
64-
flags: { featureId: string; projectId: string }[];
65-
mode: NavigationMode;
66-
onClick: () => void;
67-
}> = ({ flags, mode, onClick }) => (
68-
<List>
69-
{flags.map((flag) => (
70-
<MenuListItem
71-
href={`/projects/${flag.projectId}/features/${flag.featureId}`}
72-
text={flag.featureId}
73-
onClick={onClick}
74-
selected={false}
75-
key={flag.featureId}
76-
mode={mode}
77-
icon={<FlagIcon />}
78-
/>
79-
))}
80-
</List>
81-
);
82-
8335
export const PrimaryNavigationList: FC<{
8436
mode: NavigationMode;
8537
setMode: (mode: NavigationMode) => void;
@@ -101,7 +53,6 @@ export const PrimaryNavigationList: FC<{
10153
);
10254

10355
const { isOss } = useUiConfig();
104-
const sideMenuCleanup = useUiFlag('sideMenuCleanup');
10556

10657
return (
10758
<List>
@@ -110,19 +61,14 @@ export const PrimaryNavigationList: FC<{
11061
<PrimaryListItem href='/search' text='Flags overview' />
11162
<PrimaryListItem href='/playground' text='Playground' />
11263
{!isOss() ? (
113-
<PrimaryListItem
114-
href='/insights'
115-
text={sideMenuCleanup ? 'Analytics' : 'Insights'}
116-
/>
117-
) : null}
118-
{sideMenuCleanup ? (
119-
<ConfigurationAccordion
120-
mode={mode}
121-
setMode={setMode}
122-
activeItem={activeItem}
123-
onClick={() => onClick('configure')}
124-
/>
64+
<PrimaryListItem href='/insights' text='Analytics' />
12565
) : null}
66+
<ConfigurationAccordion
67+
mode={mode}
68+
setMode={setMode}
69+
activeItem={activeItem}
70+
onClick={() => onClick('configure')}
71+
/>
12672
</List>
12773
);
12874
};
@@ -173,55 +119,3 @@ export const AdminSettingsLink: FC<{
173119
</List>
174120
</Box>
175121
);
176-
177-
export const RecentProjectsNavigation: FC<{
178-
mode: NavigationMode;
179-
projectId: string;
180-
onClick: () => void;
181-
}> = ({ mode, onClick, projectId }) => {
182-
const { project, loading } = useProjectOverview(projectId);
183-
const projectDeleted = !project.name && !loading;
184-
185-
if (projectDeleted) return null;
186-
return (
187-
<Box>
188-
{mode === 'full' && (
189-
<Typography
190-
sx={{
191-
fontWeight: 'bold',
192-
fontSize: 'small',
193-
ml: 2,
194-
mt: 1.5,
195-
}}
196-
>
197-
Recent project
198-
</Typography>
199-
)}
200-
<RecentProjectsList
201-
projectId={projectId}
202-
projectName={project.name}
203-
mode={mode}
204-
onClick={onClick}
205-
/>
206-
</Box>
207-
);
208-
};
209-
210-
export const RecentFlagsNavigation: FC<{
211-
mode: NavigationMode;
212-
flags: { featureId: string; projectId: string }[];
213-
onClick: () => void;
214-
}> = ({ mode, onClick, flags }) => {
215-
return (
216-
<Box>
217-
{mode === 'full' && (
218-
<Typography
219-
sx={{ fontWeight: 'bold', fontSize: 'small', ml: 2 }}
220-
>
221-
Recent flags
222-
</Typography>
223-
)}
224-
<RecentFlagsList flags={flags} mode={mode} onClick={onClick} />
225-
</Box>
226-
);
227-
};

frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.test.tsx

Lines changed: 0 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,6 @@ import { screen, fireEvent, waitFor } from '@testing-library/react';
44
import { createLocalStorage } from 'utils/createLocalStorage';
55
import { Route, Routes } from 'react-router-dom';
66
import { listItemButtonClasses as classes } from '@mui/material/ListItemButton';
7-
import {
8-
type LastViewedFlag,
9-
useLastViewedFlags,
10-
} from 'hooks/useLastViewedFlags';
11-
import { type FC, useEffect } from 'react';
12-
import { useLastViewedProject } from 'hooks/useLastViewedProject';
137
import { testServerRoute, testServerSetup } from 'utils/testServer';
148

159
const server = testServerSetup();
@@ -74,39 +68,6 @@ test('select active item', async () => {
7468
expect(searchLink).toHaveClass(classes.selected);
7569
});
7670

77-
test('print recent projects and flags', async () => {
78-
testServerRoute(server, `/api/admin/projects/projectA/overview`, {
79-
name: 'projectNameA',
80-
});
81-
82-
const TestNavigationSidebar: FC<{
83-
project?: string;
84-
flags?: LastViewedFlag[];
85-
}> = ({ project, flags }) => {
86-
const { setLastViewed: setProject } = useLastViewedProject();
87-
const { setLastViewed: setFlag } = useLastViewedFlags();
88-
89-
useEffect(() => {
90-
setProject(project);
91-
flags?.forEach((flag) => {
92-
setFlag(flag);
93-
});
94-
}, []);
95-
96-
return <NavigationSidebar />;
97-
};
98-
99-
render(
100-
<TestNavigationSidebar
101-
project={'projectA'}
102-
flags={[{ featureId: 'featureA', projectId: 'projectB' }]}
103-
/>,
104-
);
105-
106-
await screen.findByText('projectNameA');
107-
await screen.findByText('featureA');
108-
});
109-
11071
describe('order of items in navigation', () => {
11172
const getLinks = async () => {
11273
const configureButton = await screen.findByRole('button', {

frontend/src/component/layout/MainLayout/NavigationSidebar/NavigationSidebar.tsx

Lines changed: 0 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,9 @@ import { useRoutes } from './useRoutes.ts';
66
import { useExpanded } from './useExpanded.ts';
77
import {
88
PrimaryNavigationList,
9-
RecentFlagsNavigation,
10-
RecentProjectsNavigation,
119
AdminSettingsNavigation,
1210
} from './NavigationList.tsx';
13-
import { ConfigurationNavigationList } from './ConfigurationNavigationList.tsx';
14-
import { ConfigurationNavigation } from './ConfigurationNavigation.tsx';
1511
import { useInitialPathname } from './useInitialPathname.ts';
16-
import { useLastViewedProject } from 'hooks/useLastViewedProject';
17-
import { useLastViewedFlags } from 'hooks/useLastViewedFlags';
1812
import type { NewInUnleash } from './NewInUnleash/NewInUnleash.tsx';
1913
import { ThemeMode } from 'component/common/ThemeMode/ThemeMode';
2014
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
@@ -28,7 +22,6 @@ import { ReactComponent as LogoOnly } from 'assets/img/logoDark.svg';
2822
import { Link } from 'react-router-dom';
2923
import { useFlag } from '@unleash/proxy-client-react';
3024
import { useNewAdminMenu } from 'hooks/useNewAdminMenu';
31-
import { useUiFlag } from 'hooks/useUiFlag.ts';
3225

3326
export const StretchContainer = styled(Box, {
3427
shouldForwardProp: (propName) =>
@@ -95,15 +88,6 @@ export const NavigationSidebar: FC<{ NewInUnleash?: typeof NewInUnleash }> = ({
9588
const initialPathname = useInitialPathname();
9689

9790
const [activeItem, setActiveItem] = useState(initialPathname);
98-
const sideMenuCleanup = useUiFlag('sideMenuCleanup');
99-
100-
const { lastViewed: lastViewedProject } = useLastViewedProject();
101-
const showRecentProject =
102-
!sideMenuCleanup && mode === 'full' && lastViewedProject;
103-
104-
const { lastViewed: lastViewedFlags } = useLastViewedFlags();
105-
const showRecentFlags =
106-
!sideMenuCleanup && mode === 'full' && lastViewedFlags.length > 0;
10791

10892
useEffect(() => {
10993
setActiveItem(initialPathname);
@@ -157,23 +141,6 @@ export const NavigationSidebar: FC<{ NewInUnleash?: typeof NewInUnleash }> = ({
157141
onClick={setActiveItem}
158142
activeItem={activeItem}
159143
/>
160-
{!sideMenuCleanup ? (
161-
<ConfigurationNavigation
162-
expanded={expanded.includes('configure')}
163-
onExpandChange={(expand) => {
164-
changeExpanded('configure', expand);
165-
}}
166-
mode={mode}
167-
title='Configure'
168-
>
169-
<ConfigurationNavigationList
170-
routes={routes.mainNavRoutes}
171-
mode={mode}
172-
onClick={setActiveItem}
173-
activeItem={activeItem}
174-
/>
175-
</ConfigurationNavigation>
176-
) : null}
177144

178145
<AdminSettingsNavigation
179146
onClick={setActiveItem}
@@ -187,22 +154,6 @@ export const NavigationSidebar: FC<{ NewInUnleash?: typeof NewInUnleash }> = ({
187154
routes={routes.adminRoutes}
188155
/>
189156

190-
{showRecentProject && (
191-
<RecentProjectsNavigation
192-
mode={mode}
193-
projectId={lastViewedProject}
194-
onClick={() => setActiveItem('/projects')}
195-
/>
196-
)}
197-
198-
{showRecentFlags && (
199-
<RecentFlagsNavigation
200-
mode={mode}
201-
flags={lastViewedFlags}
202-
onClick={() => setActiveItem('/projects')}
203-
/>
204-
)}
205-
206157
{/* this will push the show/hide to the bottom on short nav list */}
207158
<Box sx={{ flex: 1 }} />
208159

0 commit comments

Comments
 (0)