From 36f59b22908db78f26b12ebb58490e793bca87c4 Mon Sep 17 00:00:00 2001
From: Youssef Khedher <khedher.youssef@hotmail.fr>
Date: Tue, 8 Feb 2022 12:35:43 +0100
Subject: [PATCH] fix: remove projectId from create feature form (#658)

* fix: remove projectId from create feature form

* fix: update link and fix componend header in edit mode

* fix: update url on project change

* fix: conflict

* fix: use shorthand

Co-authored-by: Fredrik Oseberg <fredrik.no@gmail.com>
---
 .../feature/CreateFeature/CreateFeature.tsx   |  2 +-
 .../feature/EditFeature/EditFeature.tsx       |  2 +-
 .../feature/FeatureForm/FeatureForm.tsx       | 19 +++++++++++--------
 .../component/feature/hooks/useFeatureForm.ts |  5 ++---
 4 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/frontend/src/component/feature/CreateFeature/CreateFeature.tsx b/frontend/src/component/feature/CreateFeature/CreateFeature.tsx
index a8d136dc2a..eceaff9c83 100644
--- a/frontend/src/component/feature/CreateFeature/CreateFeature.tsx
+++ b/frontend/src/component/feature/CreateFeature/CreateFeature.tsx
@@ -79,7 +79,7 @@ const CreateFeature = () => {
             title="Create Feature toggle"
             description="Feature toggles support different use cases, each with their own specific needs such as simple static routing or more complex routing.
             The feature toggle is disabled when created and you decide when to enable"
-            documentationLink="https://docs.getunleash.io/"
+            documentationLink="https://docs.getunleash.io/advanced/feature_toggle_types"
             formatApiCode={formatApiCode}
         >
             <FeatureForm
diff --git a/frontend/src/component/feature/EditFeature/EditFeature.tsx b/frontend/src/component/feature/EditFeature/EditFeature.tsx
index 74566c8a80..b1cbeeb4dd 100644
--- a/frontend/src/component/feature/EditFeature/EditFeature.tsx
+++ b/frontend/src/component/feature/EditFeature/EditFeature.tsx
@@ -83,7 +83,7 @@ const EditFeature = () => {
             title="Edit Feature toggle"
             description="Feature toggles support different use cases, each with their own specific needs such as simple static routing or more complex routing.
             The feature toggle is disabled when created and you decide when to enable"
-            documentationLink="https://docs.getunleash.io/"
+            documentationLink="https://docs.getunleash.io/advanced/feature_toggle_types"
             formatApiCode={formatApiCode}
         >
             <FeatureForm
diff --git a/frontend/src/component/feature/FeatureForm/FeatureForm.tsx b/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
index 4d690c4cb8..8affd14eda 100644
--- a/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
+++ b/frontend/src/component/feature/FeatureForm/FeatureForm.tsx
@@ -11,6 +11,7 @@ import ConditionallyRender from '../../common/ConditionallyRender';
 import { trim } from '../../common/util';
 import Input from '../../common/Input/Input';
 import { CREATE_FEATURE } from '../../providers/AccessProvider/permissions';
+import { useHistory } from 'react-router-dom';
 
 interface IFeatureToggleForm {
     type: string;
@@ -22,8 +23,8 @@ interface IFeatureToggleForm {
     setName: React.Dispatch<React.SetStateAction<string>>;
     setDescription: React.Dispatch<React.SetStateAction<string>>;
     setProject: React.Dispatch<React.SetStateAction<string>>;
-    validateToggleName: () => void;
     setImpressionData: React.Dispatch<React.SetStateAction<boolean>>;
+    validateToggleName?: () => void;
     handleSubmit: (e: any) => void;
     handleCancel: () => void;
     errors: { [key: string]: string };
@@ -52,6 +53,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
 }) => {
     const styles = useStyles();
     const { featureTypes } = useFeatureTypes();
+    const history = useHistory();
     const { permissions } = useUser();
     const editable = mode !== 'Edit';
 
@@ -75,9 +77,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                     onFocus={() => clearErrors()}
                     value={name}
                     onChange={e => setName(trim(e.target.value))}
-                    inputProps={{
-                        'data-test': CF_NAME_ID,
-                    }}
+                    data-test={CF_NAME_ID}
                     onBlur={validateToggleName}
                 />
                 <p className={styles.inputDescription}>
@@ -89,9 +89,7 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                     label={'Toggle type'}
                     id="feature-type-select"
                     editable
-                    inputProps={{
-                        'data-test': CF_TYPE_ID,
-                    }}
+                    data-test={CF_TYPE_ID}
                     IconComponent={KeyboardArrowDownOutlined}
                     className={styles.selectInput}
                 />
@@ -108,7 +106,12 @@ const FeatureForm: React.FC<IFeatureToggleForm> = ({
                 />
                 <FeatureProjectSelect
                     value={project}
-                    onChange={e => setProject(e.target.value)}
+                    onChange={e => {
+                        setProject(e.target.value);
+                        history.replace(
+                            `/projects/${e.target.value}/create-toggle`
+                        );
+                    }}
                     enabled={editable}
                     filter={projectFilterGenerator(
                         { permissions },
diff --git a/frontend/src/component/feature/hooks/useFeatureForm.ts b/frontend/src/component/feature/hooks/useFeatureForm.ts
index 828ac0dcae..7389e8bb70 100644
--- a/frontend/src/component/feature/hooks/useFeatureForm.ts
+++ b/frontend/src/component/feature/hooks/useFeatureForm.ts
@@ -50,9 +50,8 @@ const useFeatureForm = (
         return {
             type,
             name,
-            projectId: project,
-            description: description,
-            impressionData
+            description,
+            impressionData,
         };
     };