From 816d7893159528bbe4ffc51c3958c806b81b58b0 Mon Sep 17 00:00:00 2001
From: Laurens Franken <laurens@reachdigital.nl>
Date: Thu, 25 Jan 2024 10:22:44 +0100
Subject: [PATCH] feat(GCOM-1316): change customer order sorting in Descending
 order from Created at date

---
 .changeset/dry-mice-cover.md                       |  5 +++++
 .../components/AccountOrders/AccountOrders.graphql |  2 +-
 .../components/AccountOrders/AccountOrders.tsx     | 14 ++++++--------
 .../graphql/AccountDashboardOrders.graphql         |  5 ++++-
 4 files changed, 16 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/dry-mice-cover.md

diff --git a/.changeset/dry-mice-cover.md b/.changeset/dry-mice-cover.md
new file mode 100644
index 0000000000..f62354aa31
--- /dev/null
+++ b/.changeset/dry-mice-cover.md
@@ -0,0 +1,5 @@
+---
+"@graphcommerce/magento-customer": patch
+---
+
+Change sorting for customer orders in Descending Created at order
diff --git a/packages/magento-customer/components/AccountOrders/AccountOrders.graphql b/packages/magento-customer/components/AccountOrders/AccountOrders.graphql
index 78a7c25a9a..392f45fce9 100644
--- a/packages/magento-customer/components/AccountOrders/AccountOrders.graphql
+++ b/packages/magento-customer/components/AccountOrders/AccountOrders.graphql
@@ -1,5 +1,5 @@
 fragment AccountOrders on Customer {
-  orders(filter: {}, pageSize: $pageSize, currentPage: $currentPage) {
+  orders(filter: {}, pageSize: $pageSize, currentPage: $currentPage, sort: $sort) {
     items {
       ...OrderCard
     }
diff --git a/packages/magento-customer/components/AccountOrders/AccountOrders.tsx b/packages/magento-customer/components/AccountOrders/AccountOrders.tsx
index c42a032269..4acc84c0ad 100644
--- a/packages/magento-customer/components/AccountOrders/AccountOrders.tsx
+++ b/packages/magento-customer/components/AccountOrders/AccountOrders.tsx
@@ -20,16 +20,14 @@ export function AccountOrders(props: AccountOrdersProps) {
   const pageInfo = orders?.page_info
   const isFirstPage = pageInfo?.current_page === 1
 
-  // whenever it's possible, pick last {amountLatestOrders} items, then reverse the resulting array,
-  // because we want to render the latest order first,
-  // but the API returns the orders in ASC order...
-  const latestOrders = orders?.items
-    .slice(Math.max((orders?.items?.length ?? 0) - 2, 0), orders?.items?.length)
-    .reverse()
+  const endLatestIndex = Math.min(2, orders?.items?.length || 2)
+  const latestOrders = orders?.items?.slice(0, endLatestIndex)
 
+  const startOlderIndex = Math.min(2, orders?.items?.length || 0)
+  const endOlderIndex = orders?.items?.length || 0
   const olderOrders = isFirstPage
-    ? orders?.items.slice(0, Math.max((orders?.items?.length ?? 0) - 2, 0)).reverse()
-    : orders?.items
+  ? orders?.items?.slice(startOlderIndex, endOlderIndex)
+  : orders?.items
 
   return (
     <Box
diff --git a/packages/magento-customer/graphql/AccountDashboardOrders.graphql b/packages/magento-customer/graphql/AccountDashboardOrders.graphql
index 7b76a253a3..987c4a6166 100644
--- a/packages/magento-customer/graphql/AccountDashboardOrders.graphql
+++ b/packages/magento-customer/graphql/AccountDashboardOrders.graphql
@@ -1,4 +1,7 @@
-query AccountDashboardOrders($currentPage: Int!, $pageSize: Int!) {
+query AccountDashboardOrders(
+  $currentPage: Int!,
+  $pageSize: Int!,
+  $sort: CustomerOrderSortInput = { sort_direction: DESC, sort_field: CREATED_AT }) {
   customer {
     ...AccountOrders
   }