diff --git a/containers/ecr-viewer/src/app/components/EcrPaginationWrapper.tsx b/containers/ecr-viewer/src/app/components/EcrPaginationWrapper.tsx
index 1d5d440159..f9c2a3c3bc 100644
--- a/containers/ecr-viewer/src/app/components/EcrPaginationWrapper.tsx
+++ b/containers/ecr-viewer/src/app/components/EcrPaginationWrapper.tsx
@@ -52,9 +52,12 @@ const EcrPaginationWrapper = ({
router.push(`${pathname}${query}`);
}, [userPreferences]);
- const totalPages = Math.ceil(totalCount / userPreferences.itemsPerPage);
+ const totalPages =
+ totalCount > 0 ? Math.ceil(totalCount / userPreferences.itemsPerPage) : 1;
+
+ const startIndex =
+ totalCount > 0 ? (currentPage - 1) * userPreferences.itemsPerPage + 1 : 0;
- const startIndex = (currentPage - 1) * userPreferences.itemsPerPage + 1;
const endIndex = Math.min(
currentPage * userPreferences.itemsPerPage,
totalCount,
diff --git a/containers/ecr-viewer/src/app/tests/components/EcrPaginationWrapper.test.tsx b/containers/ecr-viewer/src/app/tests/components/EcrPaginationWrapper.test.tsx
index 20f7efe03b..187d02341e 100644
--- a/containers/ecr-viewer/src/app/tests/components/EcrPaginationWrapper.test.tsx
+++ b/containers/ecr-viewer/src/app/tests/components/EcrPaginationWrapper.test.tsx
@@ -38,6 +38,7 @@ describe("Pagination for EcrPaginationWrapper", () => {
beforeEach(() => {
user = userEvent.setup();
jest.resetAllMocks();
+ mockSearchParams.delete("page");
});
it("should have 4 pages when there are 100 and default page length is used", async () => {
@@ -121,4 +122,25 @@ describe("Pagination for EcrPaginationWrapper", () => {
expect(screen.getByText("Showing 51-51 of 51 eCRs")).toBeInTheDocument();
});
+
+ it("should display 1 page when totalCount is 0", async () => {
+ render(
+
+
+ ,
+ );
+
+ expect(screen.getByText("1"));
+ expect(screen.queryByText("2")).not.toBeInTheDocument();
+ });
+
+ it("should display 0-0 when totalCount is 0", async () => {
+ render(
+
+
+ ,
+ );
+
+ expect(screen.getByText("Showing 0-0 of 0 eCRs")).toBeInTheDocument();
+ });
});