diff --git a/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.test.tsx b/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.test.tsx index 648fb1e89e..643e3e821e 100644 --- a/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.test.tsx +++ b/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.test.tsx @@ -1,10 +1,7 @@ -import configureStore from "redux-mock-store"; - import KVMResourcesCard from "./KVMResourcesCard"; -import { actions as machineActions } from "app/store/machine"; +import urls from "app/base/urls"; import { PodType } from "app/store/pod/constants"; -import type { RootState } from "app/store/root/types"; import { podState as podStateFactory, rootState as rootStateFactory, @@ -12,44 +9,60 @@ import { } from "testing/factories"; import { renderWithBrowserRouter, screen } from "testing/utils"; -const mockStore = configureStore(); - describe("KVMResourcesCard", () => { afterEach(() => { jest.restoreAllMocks(); }); - it("fetches machines on load", () => { + it("shows a spinner if pods have not loaded yet", () => { + const state = rootStateFactory({ + pod: podStateFactory({ + items: [], + loaded: false, + }), + }); + renderWithBrowserRouter(, { + state, + route: "/kvm/1/project", + }); + + expect(screen.getByText(/Loading/i)).toBeInTheDocument(); + }); + + it("links to the VMs tab for a LXD pod", () => { const state = rootStateFactory({ pod: podStateFactory({ items: [podFactory({ id: 1, type: PodType.LXD })], loaded: true, }), }); - const store = mockStore(state); + renderWithBrowserRouter(, { - store, + state, route: "/kvm/1/project", }); - const expectedAction = machineActions.fetch("mocked-nanoid"); - expect( - store.getActions().some((action) => action.type === expectedAction.type) - ).toBe(true); + expect(screen.getByRole("link", { name: /Total VMs/ })).toHaveAttribute( + "href", + urls.kvm.lxd.single.vms({ id: 1 }) + ); }); - it("shows a spinner if pods have not loaded yet", () => { + it("displays VmResources for a Virsh pod", () => { const state = rootStateFactory({ pod: podStateFactory({ - items: [], - loaded: false, + items: [podFactory({ id: 1, type: PodType.VIRSH })], + loaded: true, }), }); + renderWithBrowserRouter(, { state, route: "/kvm/1/project", }); - expect(screen.getByText(/Loading/i)).toBeInTheDocument(); + expect( + screen.getByRole("button", { name: /Resource VMs/ }) + ).toBeInTheDocument(); }); }); diff --git a/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.tsx b/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.tsx index 7a5b926196..b460eba3a2 100644 --- a/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.tsx +++ b/src/app/kvm/components/KVMResourcesCard/KVMResourcesCard.tsx @@ -1,11 +1,16 @@ import { Spinner } from "@canonical/react-components"; import { useSelector } from "react-redux"; +import { Link } from "react-router-dom"; import CoreResources from "../CoreResources"; import RamResources from "../RamResources"; import VfResources from "../VfResources"; import VmResources from "../VmResources"; +import urls from "app/base/urls"; +import { FilterGroupKey } from "app/store/machine/types"; +import { useFetchMachineCount } from "app/store/machine/utils/hooks"; +import { PodType } from "app/store/pod/constants"; import podSelectors from "app/store/pod/selectors"; import type { Pod } from "app/store/pod/types"; import { resourceWithOverCommit } from "app/store/pod/utils"; @@ -18,6 +23,10 @@ const KVMResourcesCard = ({ id }: Props): JSX.Element => { podSelectors.getById(state, id) ); + const { machineCount } = useFetchMachineCount({ + [FilterGroupKey.Pod]: pod ? [pod.name] : [], + }); + if (pod) { const { cpu_over_commit_ratio, @@ -33,6 +42,7 @@ const KVMResourcesCard = ({ id }: Props): JSX.Element => { general, memory_over_commit_ratio ); + return ( <>
@@ -53,7 +63,15 @@ const KVMResourcesCard = ({ id }: Props): JSX.Element => { />
- + {pod.type === PodType.LXD ? ( +
+ + Total VMs: {machineCount ?? 0} + +
+ ) : ( + + )} ); } diff --git a/src/app/kvm/components/KVMResourcesCard/_index.scss b/src/app/kvm/components/KVMResourcesCard/_index.scss index 507175fc09..464b04ad18 100644 --- a/src/app/kvm/components/KVMResourcesCard/_index.scss +++ b/src/app/kvm/components/KVMResourcesCard/_index.scss @@ -43,4 +43,8 @@ } } } + + .vms-link { + padding: $spv--large; + } }