From 09cb61c719f1702685b33ed62cc7998e5ea15c80 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nuno=20G=C3=B3is?= <github@nunogois.com>
Date: Fri, 28 Oct 2022 16:05:27 +0100
Subject: [PATCH] fix: small UI fixes to the clone environment modal (#2290)

fix: small UI fixes to the environment modal
---
 .../EnvironmentCloneModal.tsx                 | 64 ++++++++++---------
 1 file changed, 34 insertions(+), 30 deletions(-)

diff --git a/frontend/src/component/environments/EnvironmentTable/EnvironmentActionCell/EnvironmentCloneModal/EnvironmentCloneModal.tsx b/frontend/src/component/environments/EnvironmentTable/EnvironmentActionCell/EnvironmentCloneModal/EnvironmentCloneModal.tsx
index e6d8ecf817..63e53e7d43 100644
--- a/frontend/src/component/environments/EnvironmentTable/EnvironmentActionCell/EnvironmentCloneModal/EnvironmentCloneModal.tsx
+++ b/frontend/src/component/environments/EnvironmentTable/EnvironmentActionCell/EnvironmentCloneModal/EnvironmentCloneModal.tsx
@@ -320,7 +320,7 @@ export const EnvironmentCloneModal = ({
                                     <FormControlLabel
                                         value={APITokenGeneration.LATER}
                                         control={<Radio />}
-                                        label="Generate an API token later"
+                                        label="I want to generate an API token later"
                                     />
                                     <FormControlLabel
                                         value={APITokenGeneration.NOW}
@@ -329,35 +329,39 @@ export const EnvironmentCloneModal = ({
                                     />
                                 </RadioGroup>
                             </FormControl>
-                            <ConditionallyRender
-                                condition={
-                                    apiTokenGeneration ===
-                                    APITokenGeneration.NOW
-                                }
-                                show={
-                                    <StyledInlineContainer>
-                                        <StyledInputSecondaryDescription>
-                                            A new Server-side SDK (CLIENT) API
-                                            token will be generated for the
-                                            cloned environment, so you can get
-                                            started right away.
-                                        </StyledInputSecondaryDescription>
-                                        <StyledInputDescription>
-                                            Which projects do you want this
-                                            token to give access to?
-                                        </StyledInputDescription>
-                                        <SelectProjectInput
-                                            options={selectableProjects}
-                                            defaultValue={tokenProjects}
-                                            onChange={setTokenProjects}
-                                            error={errors.projects}
-                                            onFocus={() =>
-                                                clearError(ErrorField.PROJECTS)
-                                            }
-                                        />
-                                    </StyledInlineContainer>
-                                }
-                            />
+                            <StyledInlineContainer>
+                                <StyledInputSecondaryDescription>
+                                    A new Server-side SDK (CLIENT) API token
+                                    will be generated for the cloned
+                                    environment, so you can get started right
+                                    away.
+                                </StyledInputSecondaryDescription>
+                                <ConditionallyRender
+                                    condition={
+                                        apiTokenGeneration ===
+                                        APITokenGeneration.NOW
+                                    }
+                                    show={
+                                        <>
+                                            <StyledInputDescription>
+                                                Which projects do you want this
+                                                token to give access to?
+                                            </StyledInputDescription>
+                                            <SelectProjectInput
+                                                options={selectableProjects}
+                                                defaultValue={tokenProjects}
+                                                onChange={setTokenProjects}
+                                                error={errors.projects}
+                                                onFocus={() =>
+                                                    clearError(
+                                                        ErrorField.PROJECTS
+                                                    )
+                                                }
+                                            />
+                                        </>
+                                    }
+                                />
+                            </StyledInlineContainer>
                         </StyledSecondaryContainer>
                     </div>