diff --git a/src/Dropzone/components/DropzoneButtons/DropzoneButtons.tsx b/src/Dropzone/components/DropzoneButtons/DropzoneButtons.tsx index a8c787a00ccd025a8b8251c2f69180e7e1587b13..0a2f9636cce516cb942e79d7cf32798afffc0e3f 100644 --- a/src/Dropzone/components/DropzoneButtons/DropzoneButtons.tsx +++ b/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} diff --git a/tests/Dropone.test.tsx b/tests/Dropone.test.tsx index 0f2558b34888f9d94f20ff84d6706776fc873737..e0e2143763aa9642477c76822d5ed49b5d14d9e2 100644 --- a/tests/Dropone.test.tsx +++ b/tests/Dropone.test.tsx @@ -11,23 +11,24 @@ test("Validate label text must be 'Drop yor files here...'", () => { describe("Dropzone actionButtons", () => { test.each([ - [{ uploadButton: { onClick: console.log } }, "Upload"], - [{ uploadButton: { label: undefined, onClick: console.log } }, "Upload"], - [{ uploadButton: { label: null, onClick: console.log } }, "Upload"], - [{ uploadButton: { label: "my label", onClick: console.log } }, "my label"], - [{ deleteButton: { label: null, onClick: console.log } }, "Delete"], - [ - { deleteButton: { label: "my delete label", onClick: console.log } }, - "my delete label", - ], + [{ 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 - ])("label %s -> %s", (config, expected) => { + ])("disabled %s -> %s", (config, expected) => { const { container } = render( <Dropzone actionButtons={{ position: "after", ...config }} />, ); expect( - container.querySelector(".files-ui-buttons-container button").textContent, + ( + container.querySelector( + ".files-ui-buttons-container button", + ) as HTMLInputElement + ).disabled, ).toBe(expected); }); });