explorer: don't disable archive button

disabled buttons are bad for accessability

src/explorer/Explorer.test.tsx

@@ -29,7 +29,7 @@ const testFile: ExplorerFileInfo = {
 };
 
 describe('archive button', () => {
-    it('should be enabled if there are files', () => {
+    it('should dispatch action when clicked', () => {
         const [explorer, dispatch] = testRender(<Explorer />, {
             explorer: { files: [testFile] },
         });
@@ -40,18 +40,6 @@ describe('archive button', () => {
         userEvent.click(button);
         expect(dispatch).toHaveBeenCalledWith(explorerArchiveAllFiles());
     });
-
-    it('should be disabled if there are no files', () => {
-        const [explorer, dispatch] = testRender(<Explorer />, {
-            explorer: { files: [] },
-        });
-
-        const button = explorer.getByTitle('Backup all files');
-        expect(button).toBeDisabled();
-
-        userEvent.click(button);
-        expect(dispatch).not.toHaveBeenCalled();
-    });
 });
 
 describe('import file button', () => {

src/explorer/Explorer.tsx

@@ -46,8 +46,6 @@ type ActionButtonProps = {
     icon: IconName;
     /** The tooltip/title text. */
     tooltip: string;
-    /** If provided, controls button disabled state. */
-    disabled?: boolean;
     /** If false, prevent focus. Default is true. */
     focusable?: boolean;
     /** Callback for button click event. */
@@ -57,7 +55,6 @@ type ActionButtonProps = {
 const ActionButton: React.VoidFunctionComponent<ActionButtonProps> = ({
     icon,
     tooltip,
-    disabled,
     focusable,
     onClick,
 }) => {
@@ -74,7 +71,6 @@ const ActionButton: React.VoidFunctionComponent<ActionButtonProps> = ({
         <Button
             icon={icon}
             title={tooltip}
-            disabled={disabled}
             tabIndex={focusable === false ? -1 : undefined}
             onFocus={focusable === false ? (e) => e.preventDefault() : undefined}
             onClick={handleClick}
@@ -142,7 +138,6 @@ type HeaderProps = {
 
 const Header: React.VoidFunctionComponent<HeaderProps> = ({ i18n }) => {
     const dispatch = useDispatch();
-    const files = useSelector((s) => s.explorer.files);
 
     return (
         <div className="pb-explorer-header">
@@ -154,7 +149,6 @@ const Header: React.VoidFunctionComponent<HeaderProps> = ({ i18n }) => {
                 <ActionButton
                     icon="archive"
                     tooltip={i18n.translate(I18nId.HeaderToolbarExportAll)}
-                    disabled={files.length === 0}
                     onClick={() => dispatch(explorerArchiveAllFiles())}
                 />
                 <ActionButton

src/explorer/sagas.test.ts

@@ -97,6 +97,14 @@ describe('handleExplorerArchiveAllFiles', () => {
             );
         });
 
+        it('should fail if there are no files in storage', async () => {
+            saga.put(fileStorageDidDumpAllFiles([]));
+
+            await expect(saga.take()).resolves.toEqual(
+                explorerDidFailToArchiveAllFiles(new Error('no files')),
+            );
+        });
+
         describe('should continue when fileStorage succeeds', () => {
             beforeEach(async () => {
                 saga.put(

src/explorer/sagas.ts

@@ -93,6 +93,10 @@ function* handleExplorerArchiveAllFiles(): Generator {
 
         defined(didDump);
 
+        if (didDump.files.length === 0) {
+            throw new Error('no files');
+        }
+
         const zip = new JSZip();
 
         for (const f of didDump.files) {