Fix modal for deauthorizing provisioned hosts (#251)

Author: vigneshintel

apps/cluster-orch/VERSION

@@ -1 +1 @@
-2.0.26-dev
+2.0.26

apps/cluster-orch/deploy/Chart.yaml

@@ -4,10 +4,10 @@ apiVersion: v2
 name: orch-ui-cluster-orch
 description: Deploy the Edge Orchestrator cluster-orch pod
 type: application
-version: 2.0.26-dev
+version: 2.0.26
 # Default appVersion will be overwritten by a the build to use the version from package.json.
 
 # This value is supplied only to enable local unbuilt deployment of released content.
-appVersion: "2.0.26-dev"
+appVersion: "2.0.26"
 annotations: {}
 dependencies: []

apps/cluster-orch/src/components/organism/DeauthorizeNodeConfirmationDialog/DeauthorizeNodeConfirmationDialog.cy.tsx

@@ -34,6 +34,7 @@ describe("<DeauthorizeNodeConfirmationDialog/>", () => {
       );
 
       pom.interceptApis([pom.api.putClusterNode]);
+      pom.el.reason.type("sample-deauthorize-reason");
       cy.get(".spark-modal-footer").contains("Deauthorize").click();
 
       cy.get(`@${pom.api.putClusterNode}`)
@@ -46,6 +47,12 @@ describe("<DeauthorizeNodeConfirmationDialog/>", () => {
 
       cy.get("#pathname").contains("/infrastructure/hosts");
     });
+
+    it("should enable the Deauthorize button only if a valid deauthorization reason is provided", () => {
+      cyGet("confirmBtn").should("have.attr", "aria-disabled", "true");
+      pom.el.reason.type("sample-deauthorize-reason");
+      cyGet("confirmBtn").should("have.attr", "aria-disabled", "false");
+    });
   });
 
   describe("calls deathorize host function", () => {
@@ -62,6 +69,9 @@ describe("<DeauthorizeNodeConfirmationDialog/>", () => {
           setErrorInfo={() => {}}
         />,
       );
+
+      pom.el.reason.type("sample-deauthorize-reason");
+
       cyGet("confirmBtn").click();
       cy.get("@deauthorizeHostStub").should("have.been.called");
     });

apps/cluster-orch/src/components/organism/DeauthorizeNodeConfirmationDialog/DeauthorizeNodeConfirmationDialog.pom.ts

@@ -6,7 +6,7 @@
 import { cm } from "@orch-ui/apis";
 import { CyApiDetails, CyPom } from "@orch-ui/tests";
 
-const dataCySelectors = [] as const;
+const dataCySelectors = ["reason"] as const;
 type Selectors = (typeof dataCySelectors)[number];
 
 type ApiAliases = "putClusterNode";

apps/cluster-orch/src/components/organism/DeauthorizeNodeConfirmationDialog/DeauthorizeNodeConfirmationDialog.tsx

@@ -117,10 +117,12 @@ const DeauthorizeNodeConfirmationDialog = ({
         render={({ field }) => (
           <TextField
             {...field}
-            label="Deauthorize reason (Optional)"
+            label="Reason for deauthorization"
             data-cy="reason"
             onInput={(e) => {
-              setDeauthorizeReason(e.currentTarget.value);
+              const value = e.currentTarget.value;
+              setDeauthorizeReason(value);
+              field.onChange(value);
             }}
             size={InputSize.Large}
             className="text-field-align"
@@ -151,6 +153,9 @@ const DeauthorizeNodeConfirmationDialog = ({
       cancelCb={() => setDeauthorizeConfirmationOpen(false)}
       buttonPlacement="left-reverse"
       size={ModalSize.Medium}
+      confirmBtnDisabled={
+        !deauthorizeReason || deauthorizeReason.trim().length === 0
+      }
     />
   ) : (
     <></>