fix: machine views should be hidden when using k8s

canonical · Nov 18, 2024 · 55d2ba4 · 55d2ba4
1 parent 89fbf72
commit 55d2ba4
Show file tree

Hide file tree

Showing 6 changed files with 84 additions and 7 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "juju-dashboard",
-  "version": "0.13.2",
+  "version": "0.13.3",
   "description": "A dashboard for Juju and JAAS (Juju as a service)",
   "bugs": {
     "url": "https://github.com/canonical/juju-dashboard/issues"

diff --git a/src/pages/EntityDetails/App/App.tsx b/src/pages/EntityDetails/App/App.tsx
@@ -23,8 +23,10 @@ import {
   getModelMachines,
   getModelUnits,
   getModelUUIDFromList,
+  isKubernetesModel,
 } from "store/juju/selectors";
 import { extractRevisionNumber } from "store/juju/utils/models";
+import { useAppSelector } from "store/store";
 import {
   generateSelectableUnitTableHeaders,
   machineTableHeaders,
@@ -63,6 +65,9 @@ export default function App(): JSX.Element {
   const units = useSelector(getModelUnits(modelUUID));
   const machines = useSelector(getModelMachines(modelUUID));
   const modelData = useSelector(getModelInfo(modelUUID));
+  const hideMachines = useAppSelector((state) =>
+    isKubernetesModel(state, modelUUID),
+  );
   const canConfigureModel = useCanConfigureModel();
 
   const filteredMachineList = useMemo(() => {
@@ -92,8 +97,6 @@ export default function App(): JSX.Element {
     [filteredMachineList, units, modelName, userName],
   );
 
-  const hideMachines = modelData?.type === "kubernetes";
-
   const unitTableHeaders = useMemo(() => {
     const fieldID = "unit-list-select-all";
     return generateSelectableUnitTableHeaders(
@@ -307,6 +310,7 @@ export default function App(): JSX.Element {
                   : "",
             }))}
             buttonComponent={Link}
+            className="u-sv2"
             activeButton={query.tableView}
           />
         )}

diff --git a/src/pages/EntityDetails/EntityDetails.tsx b/src/pages/EntityDetails/EntityDetails.tsx
@@ -21,6 +21,7 @@ import {
   getModelInfo,
   getModelListLoaded,
   getModelUUIDFromList,
+  isKubernetesModel,
 } from "store/juju/selectors";
 import { useAppSelector } from "store/store";
 import urls from "urls";
@@ -51,6 +52,7 @@ const EntityDetails = ({ modelWatcherError }: Props) => {
   const modelsLoaded = useAppSelector(getModelListLoaded);
   const modelUUID = useSelector(getModelUUIDFromList(modelName, userName));
   const modelInfo = useSelector(getModelInfo(modelUUID));
+  const isK8s = useAppSelector((state) => isKubernetesModel(state, modelUUID));
   const { isNestedEntityPage } = useEntityDetailsParams();
 
   const isJuju = useSelector(getIsJuju);
@@ -148,7 +150,7 @@ const EntityDetails = ({ modelWatcherError }: Props) => {
       });
     }
 
-    if (modelInfo?.type !== "kubernetes") {
+    if (!isK8s) {
       items.push({
         active: activeView === ModelTab.MACHINES,
         label: "Machines",

diff --git a/src/pages/EntityDetails/Unit/Unit.tsx b/src/pages/EntityDetails/Unit/Unit.tsx
@@ -10,12 +10,13 @@ import type { ApplicationData, MachineData } from "juju/types";
 import {
   getAllModelApplicationStatus,
   getModelApplications,
-  getModelInfo,
   getModelMachines,
   getModelUnits,
   getModelUUIDFromList,
+  isKubernetesModel,
 } from "store/juju/selectors";
 import { extractRevisionNumber } from "store/juju/utils/models";
+import { useAppSelector } from "store/store";
 import {
   generateLocalApplicationTableHeaders,
   machineTableHeaders,
@@ -35,7 +36,7 @@ export default function Unit() {
   const applications = useSelector(getModelApplications(modelUUID));
   const units = useSelector(getModelUnits(modelUUID));
   const machines = useSelector(getModelMachines(modelUUID));
-  const modelData = useSelector(getModelInfo(modelUUID));
+  const isK8s = useAppSelector((state) => isKubernetesModel(state, modelUUID));
 
   const filteredMachineList = useMemo(() => {
     const filteredMachines: MachineData = {};
@@ -102,7 +103,7 @@ export default function Unit() {
         <EntityInfo data={unitEntityData} />
       </div>
       <div className="entity-details__main">
-        {modelData?.type !== "kubernetes" && (
+        {!isK8s && (
           <MainTable
             headers={machineTableHeaders}
             rows={machineRows}

diff --git a/src/store/juju/selectors.test.ts b/src/store/juju/selectors.test.ts
@@ -35,6 +35,7 @@ import {
   unitAgentStatusFactory,
   unitChangeDeltaFactory,
   workloadStatusFactory,
+  modelWatcherModelInfoFactory,
 } from "testing/factories/juju/model-watcher";
 
 import { modelSecretsContentFactory } from "../../testing/factories/juju/juju";
@@ -111,6 +112,7 @@ import {
   getSecretsContentErrors,
   getSecretsContentLoaded,
   getSecretsContentLoading,
+  isKubernetesModel,
 } from "./selectors";
 
 describe("selectors", () => {
@@ -2031,4 +2033,62 @@ describe("selectors", () => {
       });
     });
   });
+
+  describe("isKubernetesModel", () => {
+    it("handles non-kubernetes models", () => {
+      const modelWatcherData = {
+        abc123: modelWatcherModelDataFactory.build(),
+      };
+      expect(
+        isKubernetesModel(
+          rootStateFactory.build({
+            juju: jujuStateFactory.build({
+              modelWatcherData,
+            }),
+          }),
+          "abc123",
+        ),
+      ).toBe(false);
+    });
+
+    it("handles kubernetes in model watcher info", () => {
+      const modelWatcherData = {
+        abc123: modelWatcherModelDataFactory.build({
+          model: modelWatcherModelInfoFactory.build({
+            type: "kubernetes",
+          }),
+        }),
+      };
+      expect(
+        isKubernetesModel(
+          rootStateFactory.build({
+            juju: jujuStateFactory.build({
+              modelWatcherData,
+            }),
+          }),
+          "abc123",
+        ),
+      ).toBe(true);
+    });
+
+    it("handles kubernetes in model data", () => {
+      const modelData = {
+        abc123: modelDataFactory.build({
+          info: modelDataInfoFactory.build({
+            "provider-type": "kubernetes",
+          }),
+        }),
+      };
+      expect(
+        isKubernetesModel(
+          rootStateFactory.build({
+            juju: jujuStateFactory.build({
+              modelData,
+            }),
+          }),
+          "abc123",
+        ),
+      ).toBe(true);
+    });
+  });
 });
diff --git a/src/store/juju/selectors.ts b/src/store/juju/selectors.ts
@@ -1042,3 +1042,13 @@ export function getSelectedCharm(charmURL: string) {
     return sliceState.charms.find((charm) => charm.url === charmURL);
   });
 }
+
+export const isKubernetesModel = createSelector(
+  [
+    getModelDataByUUID,
+    (state, uuid?: string | null) => (uuid ? getModelInfo(uuid)(state) : null),
+  ],
+  (modelData, modelInfo) =>
+    modelData?.info?.["provider-type"] === "kubernetes" ||
+    modelInfo?.type === "kubernetes",
+);