diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx
index c8f193a4fb99..7e452d988a79 100644
--- a/frontend/src/component/project/Project/Project.tsx
+++ b/frontend/src/component/project/Project/Project.tsx
@@ -93,6 +93,15 @@ export const Project = () => {
path: basePath,
name: 'overview',
},
+ ...(projectOverviewRefactor
+ ? [
+ {
+ title: 'Insights',
+ path: `${basePath}/insights`,
+ name: 'insights',
+ },
+ ]
+ : []),
{
title: 'Health',
path: `${basePath}/health`,
@@ -109,12 +118,16 @@ export const Project = () => {
name: 'change-request',
isEnterprise: true,
},
- {
- title: 'Metrics',
- path: `${basePath}/metrics`,
- name: 'dora',
- isEnterprise: true,
- },
+ ...(!projectOverviewRefactor
+ ? [
+ {
+ title: 'Metrics',
+ path: `${basePath}/metrics`,
+ name: 'dora',
+ isEnterprise: true,
+ },
+ ]
+ : []),
{
title: 'Applications',
path: `${basePath}/applications`,
@@ -133,14 +146,6 @@ export const Project = () => {
},
];
- if (projectOverviewRefactor) {
- tabs.splice(1, 0, {
- title: 'Insights',
- path: `${basePath}/insights`,
- name: 'insights',
- });
- }
-
const filteredTabs = tabs
.filter((tab) => {
if (tab.flag) {
@@ -335,7 +340,9 @@ export const Project = () => {
}
/>
} />
- } />
+ {Boolean(!projectOverviewRefactor) && (
+ } />
+ )}
} />
} />
diff --git a/frontend/src/component/project/Project/ProjectOverview.tsx b/frontend/src/component/project/Project/ProjectOverview.tsx
index 4f2d1434180e..bea86baf8426 100644
--- a/frontend/src/component/project/Project/ProjectOverview.tsx
+++ b/frontend/src/component/project/Project/ProjectOverview.tsx
@@ -9,6 +9,8 @@ import useProjectOverview, {
} from 'hooks/api/getters/useProjectOverview/useProjectOverview';
import { usePageTitle } from 'hooks/usePageTitle';
import { useLastViewedProject } from 'hooks/useLastViewedProject';
+import { useUiFlag } from 'hooks/useUiFlag';
+import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
const refreshInterval = 15 * 1000;
@@ -36,6 +38,7 @@ const StyledContentContainer = styled(Box)(({ theme }) => ({
const ProjectOverview: FC<{
storageKey?: string;
}> = ({ storageKey = 'project-overview-v2' }) => {
+ const projectOverviewRefactor = useUiFlag('projectOverviewRefactor');
const projectId = useRequiredPathParam('projectId');
const projectName = useProjectOverviewNameOrId(projectId);
const { project } = useProjectOverview(projectId, {
@@ -58,16 +61,26 @@ const ProjectOverview: FC<{
return (
-
+ }
/>
+
-
+ }
+ />
+