From 4df8fd381057044f8b4e5532c1dfb3059b79e710 Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Fri, 26 Jul 2024 14:27:02 +0300
Subject: [PATCH] feat: redirect to new feature flag creation (#7679)

Currently found only one instance that is using `create-toggle`. So
changed behaviour for that.
---
 .../ApplicationIssues/ApplicationIssues.tsx   | 27 ++++++++++++++-----
 .../common/BreadcrumbNav/BreadcrumbNav.tsx    |  1 +
 .../feature/FeatureForm/FeatureForm.tsx       |  2 +-
 3 files changed, 23 insertions(+), 7 deletions(-)

diff --git a/frontend/src/component/application/ApplicationIssues/ApplicationIssues.tsx b/frontend/src/component/application/ApplicationIssues/ApplicationIssues.tsx
index 66837f629d..8d747a0b7d 100644
--- a/frontend/src/component/application/ApplicationIssues/ApplicationIssues.tsx
+++ b/frontend/src/component/application/ApplicationIssues/ApplicationIssues.tsx
@@ -9,6 +9,7 @@ import {
 } from 'component/providers/AccessProvider/permissions';
 import { useContext } from 'react';
 import AccessContext from 'contexts/AccessContext';
+import { useUiFlag } from 'hooks/useUiFlag';
 
 const WarningContainer = styled(Box)(({ theme }) => ({
     display: 'flex',
@@ -108,6 +109,7 @@ type ApplicationIssues =
 
 const FeaturesMissing = ({ features }: IFeaturesMissingProps) => {
     const { hasAccess } = useContext(AccessContext);
+    const improveCreateFlagFlow = useUiFlag('improveCreateFlagFlow');
     const length = features.length;
 
     if (length === 0) {
@@ -128,12 +130,25 @@ const FeaturesMissing = ({ features }: IFeaturesMissingProps) => {
                         <ConditionallyRender
                             condition={hasAccess(CREATE_FEATURE)}
                             show={
-                                <StyledLink
-                                    key={feature}
-                                    to={`/projects/default/create-toggle?name=${feature}`}
-                                >
-                                    Create feature flag
-                                </StyledLink>
+                                <ConditionallyRender
+                                    condition={improveCreateFlagFlow}
+                                    show={
+                                        <StyledLink
+                                            key={feature}
+                                            to={`/projects/default?create=true&name=${feature}`}
+                                        >
+                                            Create feature flag
+                                        </StyledLink>
+                                    }
+                                    elseShow={
+                                        <StyledLink
+                                            key={feature}
+                                            to={`/projects/default/create-toggle?name=${feature}`}
+                                        >
+                                            Create feature flag
+                                        </StyledLink>
+                                    }
+                                />
                             }
                         />
                     </IssueRowContainer>
diff --git a/frontend/src/component/common/BreadcrumbNav/BreadcrumbNav.tsx b/frontend/src/component/common/BreadcrumbNav/BreadcrumbNav.tsx
index d18a4e84a4..1eaf61e7a8 100644
--- a/frontend/src/component/common/BreadcrumbNav/BreadcrumbNav.tsx
+++ b/frontend/src/component/common/BreadcrumbNav/BreadcrumbNav.tsx
@@ -46,6 +46,7 @@ const BreadcrumbNav = () => {
                 item !== 'copy' &&
                 item !== 'features' &&
                 item !== 'features2' &&
+                // TODO: this can be removed after new create flag flow goes live
                 item !== 'create-toggle' &&
                 item !== 'settings' &&
                 item !== 'profile' &&
diff --git a/frontend/src/component/feature/FeatureForm/FeatureForm.tsx b/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
index 38ca5b3acd..c3d1dd9827 100644
--- a/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
+++ b/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
@@ -197,6 +197,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                     </StyledInputDescription>
                 }
             />
+            // TODO: this can be removed after new create flag flow goes live
             <FeatureProjectSelect
                 value={project}
                 onChange={(projectId) => {
@@ -213,7 +214,6 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                 IconComponent={KeyboardArrowDownOutlined}
                 sx={styledSelectInput}
             />
-
             <StyledInputDescription>
                 How would you describe your feature flag?
             </StyledInputDescription>