From 2698ddf7043e928f7bab7e279518e42fc0bba72e Mon Sep 17 00:00:00 2001
From: Thomas Heartman <thomas@getunleash.io>
Date: Tue, 28 May 2024 08:40:58 +0200
Subject: [PATCH] fix: change request environment selector button label (#7176)

This change makes it so that the button for change request
environments reads correctly when:
1. You have no envs configured: "Configure change requests"
2. One env configured: "1 environment configured"
3. More than one env configured: "`n` environments configured"
---
 .../Project/CreateProject/NewProjectForm.tsx  | 23 +++++++++++--------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/frontend/src/component/project/Project/CreateProject/NewProjectForm.tsx b/frontend/src/component/project/Project/CreateProject/NewProjectForm.tsx
index b90396a0a8..c10664969a 100644
--- a/frontend/src/component/project/Project/CreateProject/NewProjectForm.tsx
+++ b/frontend/src/component/project/Project/CreateProject/NewProjectForm.tsx
@@ -174,6 +174,15 @@ export const NewProjectForm: React.FC<FormProps> = ({
         },
     };
 
+    const numberOfConfiguredChangeRequestEnvironments = Object.keys(
+        projectChangeRequestConfiguration,
+    ).length;
+    const changeRequestSelectorLabel =
+        numberOfConfiguredChangeRequestEnvironments > 1
+            ? `${numberOfConfiguredChangeRequestEnvironments} environments configured`
+            : numberOfConfiguredChangeRequestEnvironments === 1
+              ? `1 environment  configured`
+              : 'Configure change requests';
     return (
         <StyledForm
             onSubmit={(submitEvent) => {
@@ -320,17 +329,11 @@ export const NewProjectForm: React.FC<FormProps> = ({
                                 updateProjectChangeRequestConfig
                             }
                             button={{
-                                label:
-                                    Object.keys(
-                                        projectChangeRequestConfiguration,
-                                    ).length > 0
-                                        ? `${
-                                              Object.keys(
-                                                  projectChangeRequestConfiguration,
-                                              ).length
-                                          } environment configured`
-                                        : 'Configure change requests',
+                                label: changeRequestSelectorLabel,
                                 icon: <ChangeRequestIcon />,
+                                labelWidth: `${
+                                    'nn environments configured'.length
+                                }ch`,
                             }}
                             search={{
                                 label: 'Filter environments',