Disable toggle fields unselect (#2557)

* fix: prevent unselecting value * task: update tests
zesty-io · Feb 20, 2024 · f092322 · f092322
1 parent d787814
commit f092322
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 14 deletions.
diff --git a/cypress/e2e/content/content.spec.js b/cypress/e2e/content/content.spec.js
@@ -150,26 +150,17 @@ describe("Content Specs", () => {
         .contains("Yes")
         .should("have.class", "Mui-selected");
 
-      // Click the "Yes" button again to deselect it
-      cy.get("#12-575f7c-trw1w3 button").contains("Yes").click();
-
-      // Check if neither "Yes" nor "No" buttons have the ".Mui-selected" class
-      cy.get("#12-575f7c-trw1w3 button")
-        .contains("Yes")
-        .should("not.have.class", "Mui-selected");
-      cy.get("#12-575f7c-trw1w3 button")
-        .contains("No")
-        .should("not.have.class", "Mui-selected");
-
       // Click the "No" button to select it
       cy.get("#12-575f7c-trw1w3 button").contains("No").click();
 
       // Check if the "No" button has the ".Mui-selected" class
       cy.get("#12-575f7c-trw1w3 button")
         .contains("No")
         .should("have.class", "Mui-selected");
+    });
 
-      // Click the "No" button again to deselect it
+    it("Yes/No Field: Does not allow user to deselect value", () => {
+      // Click the "No" button to deselect it
       cy.get("#12-575f7c-trw1w3 button").contains("No").click();
 
       // Check again if neither "Yes" nor "No" buttons have the ".Mui-selected" class
@@ -178,7 +169,7 @@ describe("Content Specs", () => {
         .should("not.have.class", "Mui-selected");
       cy.get("#12-575f7c-trw1w3 button")
         .contains("No")
-        .should("not.have.class", "Mui-selected");
+        .should("have.class", "Mui-selected");
     });
 
     // TODO: Need to confirm toggling of value

diff --git a/src/apps/content-editor/src/app/components/Editor/Field/Field.tsx b/src/apps/content-editor/src/app/components/Editor/Field/Field.tsx
@@ -545,7 +545,11 @@ export const Field = ({
               size="small"
               value={value}
               exclusive
-              onChange={(_, val) => onChange(val, name)}
+              onChange={(_, val) => {
+                if (val !== null) {
+                  onChange(val, name);
+                }
+              }}
             >
               <ToggleButton
                 value={0}