diff --git a/CHANGELOG.md b/CHANGELOG.md index a3cdf5a2a..f85795e8e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -12,6 +12,10 @@ and this project adheres to - Do not update OpenEdX enrollment if this one is already up-to-date on the remote lms +- +### Added + +- Add `created_on` column to the `Order` list view in the backoffice ## [2.4.0] - 2024-06-21 diff --git a/src/frontend/admin/src/components/templates/orders/list/OrdersList.tsx b/src/frontend/admin/src/components/templates/orders/list/OrdersList.tsx index 8b003e93d..8cb430053 100644 --- a/src/frontend/admin/src/components/templates/orders/list/OrdersList.tsx +++ b/src/frontend/admin/src/components/templates/orders/list/OrdersList.tsx @@ -13,6 +13,7 @@ import { CustomLink } from "@/components/presentational/link/CustomLink"; import { PATH_ADMIN } from "@/utils/routes/path"; import { commonTranslations } from "@/translations/common/commonTranslations"; import { OrderFilters } from "@/components/templates/orders/filters/OrderFilters"; +import { formatShortDate } from "@/utils/dates"; const messages = defineMessages({ id: { @@ -40,6 +41,11 @@ const messages = defineMessages({ defaultMessage: "State", description: "Label for the state header inside the table", }, + createdOn: { + id: "components.templates.orders.list.createdOn", + defaultMessage: "Created on", + description: "Label for the created on header inside the table", + }, }); type Props = DefaultTableProps; @@ -86,6 +92,12 @@ export function OrdersList(props: Props) { headerName: intl.formatMessage(messages.state), flex: 1, }, + { + field: "created_on", + headerName: intl.formatMessage(messages.createdOn), + flex: 1, + valueGetter: (value, row) => formatShortDate(row.created_on), + }, ]; return ( diff --git a/src/frontend/admin/src/tests/orders/orders.test.e2e.ts b/src/frontend/admin/src/tests/orders/orders.test.e2e.ts index 4e0a02f2b..613a1d4d4 100644 --- a/src/frontend/admin/src/tests/orders/orders.test.e2e.ts +++ b/src/frontend/admin/src/tests/orders/orders.test.e2e.ts @@ -19,6 +19,7 @@ import { } from "@/services/api/models/Organization"; import { ORGANIZATION_OPTIONS_REQUEST_RESULT } from "@/tests/mocks/organizations/organization-mock"; import { closeAllNotification, delay } from "@/components/testing/utils"; +import { formatShortDateTest } from "@/tests/utils"; const url = "http://localhost:8071/api/v1.0/admin/orders/"; const catchIdRegex = getUrlCatchIdRegex(url); @@ -438,6 +439,9 @@ test.describe("Order list", () => { await expect( page.getByRole("columnheader", { name: "State" }), ).toBeVisible(); + await expect( + page.getByRole("columnheader", { name: "Created on" }), + ).toBeVisible(); }); test("Check all the orders are presents", async ({ page }) => { @@ -459,6 +463,11 @@ test.describe("Order list", () => { await expect( rowLocator.getByRole("gridcell", { name: order.state }), ).toBeVisible(); + await expect( + rowLocator.getByRole("gridcell", { + name: await formatShortDateTest(page, order.created_on), + }), + ).toBeVisible(); }), ); });