diff --git a/packages/storage-ui/cypress/support/page-objects/cidsPage.ts b/packages/storage-ui/cypress/support/page-objects/cidsPage.ts index 3d17b8143b..b921632b54 100644 --- a/packages/storage-ui/cypress/support/page-objects/cidsPage.ts +++ b/packages/storage-ui/cypress/support/page-objects/cidsPage.ts @@ -13,10 +13,11 @@ export const cidsPage = { // cid browser row elements searchCidInput: () => cy.get("[data-testid=input-search-cid]"), - cidTableHeader: () => cy.get("[data-cy=table-header-cid]"), - createdTableHeader: () => cy.get("[data-cy=table-header-created]"), - sizeTableHeader: () => cy.get("[data-cy=table-header-size]"), - statusTableHeader: () => cy.get("[data-cy=table-header-status]"), + cidsTableHeaderName: () => cy.get("[data-cy=cids-table-header-name]"), + cidsTableHeaderCid: () => cy.get("[data-cy=cids-table-header-cid]"), + cidsTableHeaderCreated: () => cy.get("[data-cy=cids-table-header-created]"), + cidsTableHeaderSize: () => cy.get("[data-cy=cids-table-header-size]"), + cidsTableHeaderStatus: () => cy.get("[data-cy=cids-table-header-status]"), cidItemRow: () => cy.get("[data-cy=row-cid-item]", { timeout: 20000 }), cidNameCell: () => cy.get("[data-cy=cell-pin-name]"), cidCell: () => cy.get("[data-cy=cell-pin-cid]"), diff --git a/packages/storage-ui/cypress/tests/cid-management.cy.ts b/packages/storage-ui/cypress/tests/cid-management.cy.ts index 794f36c0cf..c7080ff414 100644 --- a/packages/storage-ui/cypress/tests/cid-management.cy.ts +++ b/packages/storage-ui/cypress/tests/cid-management.cy.ts @@ -103,5 +103,35 @@ describe("CID management", () => { cidsPage.searchCidInput().clear() cidsPage.cidItemRow().should("have.length", 2) }) + + it("can sort by name or created at in cids table", () => { + cy.web3Login({ withNewSession: true }) + navigationMenu.cidsNavButton().click() + + const pin1 = "Pin 1" + const pin2 = "Pin 2" + cidsPage.addPinnedCid({ name: pin1 }) + cidsPage.addPinnedCid({ name: pin2, cid: testCidAlternative }) + cidsPage.cidItemRow().should("have.length", 2) + + // by default should be sort by date uploading in descending order (newest first) + cidsPage.cidNameCell().eq(0).should("have.text", pin2) + cidsPage.cidNameCell().eq(1).should("have.text", pin1) + + // ensure sort by created in descending order (oldest first) + cidsPage.cidsTableHeaderCreated().click() + cidsPage.cidNameCell().eq(0).should("have.text", pin1) + cidsPage.cidNameCell().eq(1).should("have.text", pin2) + + // ensure sort by name in descending order (Z-A) + cidsPage.cidsTableHeaderName().click() + cidsPage.cidNameCell().eq(0).should("have.text", pin2) + cidsPage.cidNameCell().eq(1).should("have.text", pin1) + + // ensure sort by name in ascending order (A-Z) + cidsPage.cidsTableHeaderName().click() + cidsPage.cidNameCell().eq(0).should("have.text", pin1) + cidsPage.cidNameCell().eq(1).should("have.text", pin2) + }) }) }) \ No newline at end of file diff --git a/packages/storage-ui/src/Components/Pages/CidsPage.tsx b/packages/storage-ui/src/Components/Pages/CidsPage.tsx index e41df0ebe3..bd6ba5c990 100644 --- a/packages/storage-ui/src/Components/Pages/CidsPage.tsx +++ b/packages/storage-ui/src/Components/Pages/CidsPage.tsx @@ -216,7 +216,7 @@ const CidsPage = () => { className={classes.tableRow} > handleSortToggle("name")} @@ -226,7 +226,7 @@ const CidsPage = () => { Name @@ -234,7 +234,7 @@ const CidsPage = () => { {desktop && <> handleSortToggle("date_uploaded")} sortDirection={sortColumn === "date_uploaded" ? sortDirection : undefined} @@ -244,7 +244,7 @@ const CidsPage = () => { Created handleSortToggle("size")} sortDirection={sortColumn === "size" ? sortDirection : undefined} @@ -254,7 +254,7 @@ const CidsPage = () => { Size