fix: machine status in the header lp#2044399 (#5221) 3.4 backport (#5222

)
canonical · Nov 24, 2023 · 2289a6c · 2289a6c
1 parent 25758c3
commit 2289a6c
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/src/app/machines/views/MachineDetails/MachineHeader/MachineHeader.test.tsx b/src/app/machines/views/MachineDetails/MachineHeader/MachineHeader.test.tsx
@@ -7,7 +7,7 @@ import { MachineHeaderViews } from "app/machines/constants";
 import { actions as machineActions } from "app/store/machine";
 import type { RootState } from "app/store/root/types";
 import { PowerState } from "app/store/types/enum";
-import { NodeActions } from "app/store/types/node";
+import { NodeActions, NodeStatus } from "app/store/types/node";
 import {
   generalState as generalStateFactory,
   machine as machineFactory,
@@ -127,6 +127,21 @@ describe("MachineHeader", () => {
     expect(screen.getByText(/power on/i)).toBeInTheDocument();
   });
 
+  it("displays machine status", () => {
+    state.machine.items[0].status = NodeStatus.DEPLOYED;
+
+    renderWithBrowserRouter(
+      <MachineHeader
+        setSidePanelContent={jest.fn()}
+        sidePanelContent={null}
+        systemId="abc123"
+      />,
+      { state, route: "/machine/abc123" }
+    );
+
+    expect(screen.getByText(/deployed/i)).toBeInTheDocument();
+  });
+
   it("displays power status when checking power", () => {
     state.machine.statuses["abc123"] = machineStatusFactory({
       checkingPower: true,

diff --git a/src/app/machines/views/MachineDetails/MachineHeader/MachineHeader.tsx b/src/app/machines/views/MachineDetails/MachineHeader/MachineHeader.tsx
@@ -105,7 +105,7 @@ const MachineHeader = ({
       subtitle={
         editingName ? null : (
           <div className="u-flex--wrap u-flex--align-center">
-            <div className="u-nudge-left">
+            <div className="u-nudge-left u-nudge-right">
               {machine.locked ? (
                 <TooltipButton
                   aria-label="locked"
@@ -115,6 +115,7 @@ const MachineHeader = ({
                   position="btm-left"
                 />
               ) : null}
+              {machine.status}
             </div>
             <div>
               <PowerIcon