fix(crud): enable next page button when count is unknown COMPASS-6340 (#3916)

Author: mabaasit

packages/compass-crud/src/components/crud-toolbar.spec.tsx

@@ -205,6 +205,24 @@ describe('CrudToolbar Component', function () {
     expect(getPageSpy.calledOnce).to.be.false;
   });
 
+  it('should have the next page button enabled when count is unknown', function () {
+    const getPageSpy = sinon.spy();
+    renderCrudToolbar({
+      getPage: getPageSpy,
+      page: 2,
+      count: undefined,
+    });
+
+    const nextButton = screen.getByTestId('docs-toolbar-next-page-btn');
+    expect(nextButton).to.have.attribute('aria-disabled', 'false');
+
+    expect(getPageSpy.called).to.be.false;
+    fireEvent.click(nextButton);
+
+    expect(getPageSpy.calledOnce).to.be.true;
+    expect(getPageSpy.firstCall.args[0]).to.equal(3);
+  });
+
   it('should render the add data button when it is not readonly', function () {
     renderCrudToolbar({
       readonly: false,

packages/compass-crud/src/components/crud-toolbar.tsx

@@ -155,7 +155,9 @@ const CrudToolbar: React.FunctionComponent<CrudToolbarProps> = ({
   const controlId = useId();
   const prevButtonDisabled = useMemo(() => page === 0, [page]);
   const nextButtonDisabled = useMemo(
-    () => (count ? 20 * (page + 1) >= count : true),
+    // If we don't know the count, we can't know if there are more pages.
+    () =>
+      count === undefined || count === null ? false : 20 * (page + 1) >= count,
     [count, page]
   );