FIX: ActionButtonItem.disabled not working #28

Author: TimmFitschen

src/Dropzone/components/DropzoneButtons/DropzoneButtons.tsx

@@ -79,8 +79,15 @@ const DropzoneButtons: React.FC<DropzoneButtonsProps> = (
 
 
         (actionButtonProps: ActionButtonItem, index: number) => {
-          const { children, label, resetStyles, className, style, onClick } =
-            actionButtonProps;
+          const {
+            disabled,
+            children,
+            label,
+            resetStyles,
+            className,
+            style,
+            onClick,
+          } = actionButtonProps;
           return (
             <MaterialButton
               key={index}

tests/Dropone.test.tsx

@@ -8,3 +8,27 @@ test("Validate label text must be 'Drop yor files here...'", () => {
   render(<Dropzone> Drop yor files here...</Dropzone>);
   expect(screen.getByText("Drop yor files here...")).toBeInTheDocument();
 });
+
+describe("Dropzone actionButtons", () => {
+  test.each([
+    [{ uploadButton: { onClick: console.log } }, false],
+    [{ uploadButton: { onClick: console.log, disabled: false } }, false],
+    [{ uploadButton: { onClick: console.log, disabled: true } }, true],
+    [{ deleteButton: { onClick: console.log } }, false],
+    [{ deleteButton: { onClick: console.log, disabled: false } }, false],
+    [{ deleteButton: { onClick: console.log, disabled: true } }, true],
+
+    // abortButton and cleanButton need more interaction
+  ])("disabled %s -> %s", (config, expected) => {
+    const { container } = render(
+      <Dropzone actionButtons={{ position: "after", ...config }} />,
+    );
+    expect(
+      (
+        container.querySelector(
+          ".files-ui-buttons-container button",
+        ) as HTMLInputElement
+      ).disabled,
+    ).toBe(expected);
+  });
+});