diff --git a/web/src/components/core/Sidebar.jsx b/web/src/components/core/Sidebar.jsx index 8bd0edf95a..249538de5a 100644 --- a/web/src/components/core/Sidebar.jsx +++ b/web/src/components/core/Sidebar.jsx @@ -22,7 +22,6 @@ import React, { useEffect, useRef, useState } from "react"; import { Icon, PageActions, PageOptionsSlot } from "~/components/layout"; import { About, Disclosure, LogsButton, ShowLogButton, ShowTerminalButton } from "~/components/core"; -import { ChangeProductLink } from "~/components/software"; import { TargetIpsPopup } from "~/components/network"; /** @@ -54,7 +53,6 @@ import { TargetIpsPopup } from "~/components/network"; const FixedLinks = React.memo(() => (

Other options

- diff --git a/web/src/components/core/Sidebar.test.jsx b/web/src/components/core/Sidebar.test.jsx index fba5bd6945..ac9f0e6004 100644 --- a/web/src/components/core/Sidebar.test.jsx +++ b/web/src/components/core/Sidebar.test.jsx @@ -25,9 +25,9 @@ import { plainRender, mockComponent, mockLayout } from "~/test-utils"; import { Sidebar } from "~/components/core"; jest.mock("~/components/layout/Layout", () => mockLayout()); -jest.mock("~/components/core/About", () => mockComponent()); -jest.mock("~/components/core/LogsButton", () => mockComponent(Download logs mock)); -jest.mock("~/components/software/ChangeProductLink", () => mockComponent(Change product mock)); +jest.mock("~/components/core/About", () => mockComponent(About link mock)); +jest.mock("~/components/core/LogsButton", () => mockComponent()); +jest.mock("~/components/core/ShowLogButton", () => mockComponent()); jest.mock("~/components/network/TargetIpsPopup", () => mockComponent("Host Ips Mock")); it("renders the sidebar initially hidden", async () => { @@ -84,14 +84,14 @@ describe("onClick bubbling", () => { await user.click(nav); expect(nav).toHaveAttribute("data-state", "visible"); - // user clicks on a link set for keeping the sidebar open - const downloadLink = within(nav).getByRole("link", { name: "Download logs mock" }); - await user.click(downloadLink); + // user clicks on a button set for keeping the sidebar open + const downloadButton = within(nav).getByRole("button", { name: "Download logs mock" }); + await user.click(downloadButton); expect(nav).toHaveAttribute("data-state", "visible"); - // user clicks a link NOT set for keeping the sidebar open - const changeProductLink = within(nav).getByRole("link", { name: "Change product mock" }); - await user.click(changeProductLink); + // user clicks a button NOT set for keeping the sidebar open + const showLogsButton = within(nav).getByRole("button", { name: "Show logs mock" }); + await user.click(showLogsButton); expect(nav).toHaveAttribute("data-state", "hidden"); // open it again @@ -99,8 +99,8 @@ describe("onClick bubbling", () => { expect(nav).toHaveAttribute("data-state", "visible"); // user clicks on a button - const aboutButton = within(nav).getByRole("button", { name: "About button mock" }); - await user.click(aboutButton); + const aboutLink = within(nav).getByRole("link", { name: "About link mock" }); + await user.click(aboutLink); expect(nav).toHaveAttribute("data-state", "hidden"); }); }); diff --git a/web/src/components/overview/Overview.jsx b/web/src/components/overview/Overview.jsx index 24e8d33185..657c37c0e4 100644 --- a/web/src/components/overview/Overview.jsx +++ b/web/src/components/overview/Overview.jsx @@ -1,5 +1,5 @@ /* - * Copyright (c) [2022] SUSE LLC + * Copyright (c) [2022-2023] SUSE LLC * * All Rights Reserved. * @@ -23,7 +23,8 @@ import React, { useState } from "react"; import { useSoftware } from "~/context/software"; import { Navigate } from "react-router-dom"; -import { Page, InstallButton } from "~/components/core"; +import { Page, PageOptions, InstallButton } from "~/components/core"; +import { ChangeProductLink } from "~/components/software"; import { L10nSection, NetworkSection, @@ -46,6 +47,10 @@ function Overview() { icon="inventory_2" action={ setShowErrors(true)} />} > + + + + diff --git a/web/src/components/overview/Overview.test.jsx b/web/src/components/overview/Overview.test.jsx index fb4da63b92..790d2b5e3c 100644 --- a/web/src/components/overview/Overview.test.jsx +++ b/web/src/components/overview/Overview.test.jsx @@ -1,5 +1,5 @@ /* - * Copyright (c) [2022] SUSE LLC + * Copyright (c) [2022-2023] SUSE LLC * * All Rights Reserved. * @@ -26,7 +26,7 @@ import Overview from "./Overview"; import { createClient } from "~/client"; let mockProduct; -let mockProducts = [ +const mockProducts = [ { id: "openSUSE", name: "openSUSE Tumbleweed" }, { id: "Leap Micro", name: "openSUSE Micro" } ]; @@ -50,21 +50,9 @@ jest.mock("~/components/overview/StorageSection", () => mockComponent("Storage S jest.mock("~/components/overview/NetworkSection", () => mockComponent("Network Section")); jest.mock("~/components/overview/UsersSection", () => mockComponent("Users Section")); jest.mock("~/components/overview/SoftwareSection", () => mockComponent("Software Section")); +jest.mock("~/components/core/PageOptions", () => mockComponent("PageOptions")); jest.mock("~/components/core/InstallButton", () => mockComponent("Install Button")); -it("renders the Overview and the Install button", async () => { - installerRender(); - const title = screen.getByText(/openSUSE Tumbleweed/i); - expect(title).toBeInTheDocument(); - - await screen.findByText("Localization Section"); - await screen.findByText("Network Section"); - await screen.findByText("Storage Section"); - await screen.findByText("Users Section"); - await screen.findByText("Software Section"); - await screen.findByText("Install Button"); -}); - beforeEach(() => { mockProduct = { id: "openSUSE", name: "openSUSE Tumbleweed" }; createClient.mockImplementation(() => { @@ -79,28 +67,30 @@ beforeEach(() => { }); }); -describe("when no product is selected", () => { - beforeEach(() => { - mockProduct = null; - }); - - it("redirects to the product selection page", async () => { +describe("when product is selected", () => { + it("renders the Overview and the Install button", async () => { installerRender(); + const title = screen.getByText(/openSUSE Tumbleweed/i); + expect(title).toBeInTheDocument(); - // react-router-dom Navigate is mocked. See test-utils for more details. - await screen.findByText("Navigating to /products"); + await screen.findByText("Localization Section"); + await screen.findByText("Network Section"); + await screen.findByText("Storage Section"); + await screen.findByText("Users Section"); + await screen.findByText("Software Section"); + await screen.findByText("Install Button"); }); }); -describe("if there is only one product", () => { +describe("when no product is selected", () => { beforeEach(() => { - mockProducts = [mockProduct]; + mockProduct = null; }); - it("does not show the action for changing the selected product", async () => { + it("redirects to the product selection page", async () => { installerRender(); - await screen.findByText("openSUSE Tumbleweed"); - expect(screen.queryByLabelText("Change selected product")).not.toBeInTheDocument(); + // react-router-dom Navigate is mocked. See test-utils for more details. + await screen.findByText("Navigating to /products"); }); });