diff --git a/packages/datagateway-download/src/downloadCart/downloadCartTable.component.test.tsx b/packages/datagateway-download/src/downloadCart/downloadCartTable.component.test.tsx index b49e29d33..601d58660 100644 --- a/packages/datagateway-download/src/downloadCart/downloadCartTable.component.test.tsx +++ b/packages/datagateway-download/src/downloadCart/downloadCartTable.component.test.tsx @@ -245,6 +245,37 @@ describe('Download cart table component', () => { expect(wrapper.exists('[data-testid="no-selections-message"]')).toBe(true); }); + it('disables remove all button while request is processing', async () => { + (removeAllDownloadCartItems as jest.Mock).mockImplementation(() => { + return new Promise((resolve) => setTimeout(resolve, 2000)); + }); + + const wrapper = createWrapper(); + + await act(async () => { + await flushPromises(); + wrapper.update(); + await flushPromises(); + wrapper.update(); + }); + + await act(async () => { + wrapper.find('button#removeAllButton').simulate('click'); + await flushPromises(); + wrapper.update(); + }); + expect( + wrapper.find('button#removeAllButton').prop('disabled') + ).toBeTruthy(); + + await act(async () => { + await new Promise((r) => setTimeout(r, 2001)); + wrapper.update(); + }); + + expect(wrapper.exists('[data-testid="no-selections-message"]')).toBe(true); + }); + it("removes an item when said item's remove button is clicked", async () => { const wrapper = createWrapper(); diff --git a/packages/datagateway-download/src/downloadCart/downloadCartTable.component.tsx b/packages/datagateway-download/src/downloadCart/downloadCartTable.component.tsx index b3fcd77a4..473352c52 100644 --- a/packages/datagateway-download/src/downloadCart/downloadCartTable.component.tsx +++ b/packages/datagateway-download/src/downloadCart/downloadCartTable.component.tsx @@ -20,6 +20,7 @@ import { makeStyles, Theme, Link, + CircularProgress, } from '@material-ui/core'; import { RemoveCircle } from '@material-ui/icons'; import { @@ -66,6 +67,7 @@ const DownloadCartTable: React.FC = ( const [dataLoaded, setDataLoaded] = React.useState(false); const [sizesLoaded, setSizesLoaded] = React.useState(true); const [sizesFinished, setSizesFinished] = React.useState(true); + const [removingAll, setRemovingAll] = React.useState(false); const fileCountMax = settings.fileCountMax; const totalSizeMax = settings.totalSizeMax; @@ -416,17 +418,24 @@ const DownloadCartTable: React.FC = ( style={{ marginRight: '1em' }} > + {/* Request to remove all selections is in progress. To prevent excessive requests, disable button during request */}