From 3621c7282d39b2e49c5d07e2615b19202deb2f5f Mon Sep 17 00:00:00 2001
From: Fredrik Strand Oseberg <fredrik.no@gmail.com>
Date: Mon, 18 Mar 2024 12:38:59 +0100
Subject: [PATCH] feat: setup ff (#6532)

Setup feature flag for the new refactoring of the project overview page

---------

Co-authored-by: sjaanus <sellinjaanus@gmail.com>
---
 frontend/src/component/project/Project/Project.tsx | 14 ++++++++++++++
 frontend/src/interfaces/uiConfig.ts                |  1 +
 src/lib/__snapshots__/create-config.test.ts.snap   |  1 +
 src/lib/types/experimental.ts                      |  7 ++++++-
 src/server-dev.ts                                  |  1 +
 5 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/frontend/src/component/project/Project/Project.tsx b/frontend/src/component/project/Project/Project.tsx
index 2de7cb8451..f0edf72f03 100644
--- a/frontend/src/component/project/Project/Project.tsx
+++ b/frontend/src/component/project/Project/Project.tsx
@@ -43,6 +43,7 @@ import { UiFlags } from 'interfaces/uiConfig';
 import { HiddenProjectIconWithTooltip } from './HiddenProjectIconWithTooltip/HiddenProjectIconWithTooltip';
 import { ChangeRequestPlausibleProvider } from 'component/changeRequest/ChangeRequestContext';
 import { ProjectApplications } from '../ProjectApplications/ProjectApplications';
+import { useUiFlag } from 'hooks/useUiFlag';
 
 const StyledBadge = styled(Badge)(({ theme }) => ({
     position: 'absolute',
@@ -76,6 +77,8 @@ export const Project = () => {
     const projectName = project?.name || projectId;
     const { favorite, unfavorite } = useFavoriteProjectsApi();
 
+    const projectOverviewRefactor = useUiFlag('projectOverviewRefactor');
+
     const [showDelDialog, setShowDelDialog] = useState(false);
 
     const [
@@ -129,6 +132,14 @@ export const Project = () => {
         },
     ];
 
+    if (projectOverviewRefactor) {
+        tabs.splice(1, 0, {
+            title: 'Insights',
+            path: `${basePath}/insights`,
+            name: 'insights',
+        });
+    }
+
     const filteredTabs = tabs
         .filter((tab) => {
             if (tab.flag) {
@@ -299,6 +310,9 @@ export const Project = () => {
                 />
                 <Route path='environments' element={<ProjectEnvironment />} />
                 <Route path='archive' element={<ProjectFeaturesArchive />} />
+                {Boolean(projectOverviewRefactor) && (
+                    <Route path='insights' element={<div>Hello world</div>} />
+                )}
                 <Route path='logs' element={<ProjectLog />} />
                 <Route
                     path='change-requests'
diff --git a/frontend/src/interfaces/uiConfig.ts b/frontend/src/interfaces/uiConfig.ts
index a1a2d3989b..8cf3eb449a 100644
--- a/frontend/src/interfaces/uiConfig.ts
+++ b/frontend/src/interfaces/uiConfig.ts
@@ -79,6 +79,7 @@ export type UiFlags = {
     userAccessUIEnabled?: boolean;
     sdkReporting?: boolean;
     outdatedSdksBanner?: boolean;
+    projectOverviewRefactor?: string;
 };
 
 export interface IVersionInfo {
diff --git a/src/lib/__snapshots__/create-config.test.ts.snap b/src/lib/__snapshots__/create-config.test.ts.snap
index 67c17e68ad..df6078091a 100644
--- a/src/lib/__snapshots__/create-config.test.ts.snap
+++ b/src/lib/__snapshots__/create-config.test.ts.snap
@@ -132,6 +132,7 @@ exports[`should create default config 1`] = `
       "newStrategyConfigurationFeedback": false,
       "outdatedSdksBanner": false,
       "personalAccessTokensKillSwitch": false,
+      "projectOverviewRefactor": false,
       "queryMissingTokens": false,
       "responseTimeMetricsFix": false,
       "responseTimeWithAppNameKillSwitch": false,
diff --git a/src/lib/types/experimental.ts b/src/lib/types/experimental.ts
index 0cea610896..0a99789a0b 100644
--- a/src/lib/types/experimental.ts
+++ b/src/lib/types/experimental.ts
@@ -55,7 +55,8 @@ export type IFlagKey =
     | 'scimApi'
     | 'displayEdgeBanner'
     | 'globalFrontendApiCache'
-    | 'returnGlobalFrontendApiCache';
+    | 'returnGlobalFrontendApiCache'
+    | 'projectOverviewRefactor';
 
 export type IFlags = Partial<{ [key in IFlagKey]: boolean | Variant }>;
 
@@ -272,6 +273,10 @@ const flags: IFlags = {
         process.env.UNLEASH_EXPERIMENTAL_RETURN_GLOBAL_FRONTEND_API_CACHE,
         false,
     ),
+    projectOverviewRefactor: parseEnvVarBoolean(
+        process.env.UNLEASH_EXPERIMENTAL_PROJECT_OVERVIEW_REFACTOR,
+        false,
+    ),
 };
 
 export const defaultExperimentalOptions: IExperimentalOptions = {
diff --git a/src/server-dev.ts b/src/server-dev.ts
index fd3ac55bc3..a76b25b4ef 100644
--- a/src/server-dev.ts
+++ b/src/server-dev.ts
@@ -53,6 +53,7 @@ process.nextTick(async () => {
                         outdatedSdksBanner: true,
                         globalFrontendApiCache: true,
                         returnGlobalFrontendApiCache: false,
+                        projectOverviewRefactor: true,
                     },
                 },
                 authentication: {