Fix handle nullable attribute change (#5179)

* Fix handle nullable attribute change

* Add changeset

.changeset/sour-balloons-clean.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+Removing not required dropdown attribue value no longer cause error

src/attributes/utils/handlers.test.ts

@@ -1,4 +1,5 @@
 import {
+  createAttributeChangeHandler,
   createAttributeMultiChangeHandler,
   prepareAttributesInput,
 } from "@dashboard/attributes/utils/handlers";
@@ -223,6 +224,7 @@ describe("Multiple select change handler", () => {
     expect(trigger).toHaveBeenCalledTimes(1);
   });
 });
+
 describe("Sending only changed attributes", () => {
   // null in expected = attribute not present in output
   describe("works with reference attributes", () => {
@@ -747,3 +749,50 @@ describe("Sending only changed attributes", () => {
     });
   });
 });
+
+describe("createAttributeChangeHandler", () => {
+  it("should return empty array when value is empty string", () => {
+    // Arrange
+    const change = jest.fn();
+    const trigger = jest.fn();
+    const handler = createAttributeChangeHandler(change, trigger);
+
+    // Act
+    handler("attr-1", "");
+
+    // Assert
+    expect(change).toHaveBeenCalledTimes(1);
+    expect(change).toHaveBeenCalledWith("attr-1", []);
+    expect(trigger).toHaveBeenCalledTimes(1);
+  });
+
+  it("should return empty array when value is null", () => {
+    // Arrange
+    const change = jest.fn();
+    const trigger = jest.fn();
+    const handler = createAttributeChangeHandler(change, trigger);
+
+    // Act
+    handler("attr-1", null);
+
+    // Assert
+    expect(change).toHaveBeenCalledTimes(1);
+    expect(change).toHaveBeenCalledWith("attr-1", []);
+    expect(trigger).toHaveBeenCalledTimes(1);
+  });
+
+  it("should return array with value when value not null or undefined or empty string", () => {
+    // Arrange
+    const change = jest.fn();
+    const trigger = jest.fn();
+    const handler = createAttributeChangeHandler(change, trigger);
+
+    // Act
+    handler("attr-1", "val-1");
+
+    // Assert
+    expect(change).toHaveBeenCalledTimes(1);
+    expect(change).toHaveBeenCalledWith("attr-1", ["val-1"]);
+    expect(trigger).toHaveBeenCalledTimes(1);
+  });
+});

src/attributes/utils/handlers.ts

@@ -29,10 +29,10 @@ import { getFileValuesToUploadFromAttributes, isFileValueUnused } from "./data";
 export function createAttributeChangeHandler(
   changeAttributeData: FormsetChange<string[]>,
   triggerChange: () => void,
-): FormsetChange<string> {
-  return (attributeId: string, value: string) => {
+): FormsetChange<string | null | undefined> {
+  return (attributeId: string, value: string | null | undefined) => {
     triggerChange();
-    changeAttributeData(attributeId, value === "" ? [] : [value]);
+    changeAttributeData(attributeId, !value ? [] : [value]);
   };
 }