diff --git a/src/features/environmentCreate/components/EnvironmentCreate.tsx b/src/features/environmentCreate/components/EnvironmentCreate.tsx index d5127047..f369202c 100644 --- a/src/features/environmentCreate/components/EnvironmentCreate.tsx +++ b/src/features/environmentCreate/components/EnvironmentCreate.tsx @@ -106,6 +106,7 @@ export const EnvironmentCreate = ({ environmentNotification }: IEnvCreate) => { return ( diff --git a/src/features/environmentDetails/components/EnvironmentDetailsHeader.tsx b/src/features/environmentDetails/components/EnvironmentDetailsHeader.tsx index b1f20e7c..9f449fe8 100644 --- a/src/features/environmentDetails/components/EnvironmentDetailsHeader.tsx +++ b/src/features/environmentDetails/components/EnvironmentDetailsHeader.tsx @@ -13,15 +13,18 @@ import { interface IEnvironmentDetailsHeaderProps { /** * @param envName name of the selected environment + * @param namespace namespace of the environment * @param onUpdateName change environment name */ envName?: string; + namespace?: string; showEditButton: boolean | undefined; onUpdateName: (value: string) => void; } export const EnvironmentDetailsHeader = ({ envName = "", + namespace, onUpdateName, showEditButton = true }: IEnvironmentDetailsHeaderProps) => { @@ -34,7 +37,8 @@ export const EnvironmentDetailsHeader = ({ sx={{ display: "flex", alignItems: "center", - justifyContent: "space-between", + justifyContent: + mode === EnvironmentDetailsModes.CREATE ? "start" : "space-between", marginBottom: "15px" }} > @@ -64,9 +68,28 @@ export const EnvironmentDetailsHeader = ({ )} {mode === EnvironmentDetailsModes.CREATE && ( <> + {namespace && ( + <> + +
+ + )} onUpdateName(e.target.value)} /> {/* Archive */} diff --git a/test/environmentDetails/EnvironmentDetailsHeader.test.tsx b/test/environmentDetails/EnvironmentDetailsHeader.test.tsx index 1f91a5a4..f7b7469d 100644 --- a/test/environmentDetails/EnvironmentDetailsHeader.test.tsx +++ b/test/environmentDetails/EnvironmentDetailsHeader.test.tsx @@ -53,7 +53,7 @@ describe("", () => { }); }); - it("should render component in create mode", () => { + it("should render component in create mode without namespace", () => { const mockOnUpdateName = jest.fn(); const component = render( mockTheme( @@ -70,9 +70,30 @@ describe("", () => { store.dispatch(modeChanged(EnvironmentDetailsModes.CREATE)); }); - const input = component.getByPlaceholderText("Environment name"); + const input = component.getByLabelText("Environment name"); const newEnvName = "My new environment name"; fireEvent.change(input, { target: { value: newEnvName } }); expect(mockOnUpdateName).toHaveBeenCalledWith(newEnvName); + expect(component.queryByText("Namespace")).not.toBeInTheDocument(); + }); + + it("should render component in create mode with namespace", () => { + const mockOnUpdateName = jest.fn(); + const component = render( + mockTheme( + + + + ) + ); + act(() => { + store.dispatch(modeChanged(EnvironmentDetailsModes.CREATE)); + }); + expect(component.getByLabelText("Namespace")).toBeInTheDocument(); }); }); diff --git a/test/playwright/test_ux.py b/test/playwright/test_ux.py index dcf0782f..8bb88a35 100644 --- a/test/playwright/test_ux.py +++ b/test/playwright/test_ux.py @@ -97,7 +97,7 @@ def _create_new_environment(page, screenshot=False): if screenshot: page.screenshot(path="test-results/conda-store-new-env.png") # fill in the env name - page.get_by_placeholder("Environment name").fill(new_env_name) + page.get_by_label("Environment name").fill(new_env_name) # fill in the description page.get_by_placeholder("Enter here the description of your environment").fill("description") # click the + to add a package