feat(dashboard, medusa, types): orders list on customer details page (#9790)

**What**
- display orders list on customer details

---

CLOSES CC-625

packages/admin/dashboard/src/routes/customers/customer-detail/components/customer-group-section/customer-group-section.tsx

@@ -35,6 +35,7 @@ type CustomerGroupSectionProps = {
 }
 
 const PAGE_SIZE = 10
+const PREFIX = "cusgr"
 
 export const CustomerGroupSection = ({
   customer,
@@ -44,6 +45,7 @@ export const CustomerGroupSection = ({
   const [rowSelection, setRowSelection] = useState<RowSelectionState>({})
   const { raw, searchParams } = useCustomerGroupTableQuery({
     pageSize: PAGE_SIZE,
+    prefix: PREFIX,
   })
 
   const { customer_groups, count, isLoading, isError, error } =
@@ -72,6 +74,7 @@ export const CustomerGroupSection = ({
     enablePagination: true,
     enableRowSelection: true,
     pageSize: PAGE_SIZE,
+    prefix: PREFIX,
     rowSelection: {
       state: rowSelection,
       updater: setRowSelection,
@@ -132,6 +135,7 @@ export const CustomerGroupSection = ({
         pageSize={PAGE_SIZE}
         isLoading={isLoading}
         count={count}
+        prefix={PREFIX}
         navigateTo={(row) => `/customer-groups/${row.id}`}
         filters={filters}
         search

packages/admin/dashboard/src/routes/customers/customer-detail/components/customer-order-section/customer-order-section.tsx

@@ -1,6 +1,6 @@
 import { ArrowPath } from "@medusajs/icons"
 import { HttpTypes } from "@medusajs/types"
-import { Button, Container, Heading } from "@medusajs/ui"
+import { Container, Heading } from "@medusajs/ui"
 import { keepPreviousData } from "@tanstack/react-query"
 import { createColumnHelper } from "@tanstack/react-table"
 import { useMemo } from "react"
@@ -17,6 +17,7 @@ type CustomerGeneralSectionProps = {
   customer: HttpTypes.AdminCustomer
 }
 
+const PREFIX = "cusord"
 const PAGE_SIZE = 10
 const DEFAULT_RELATIONS = "*customer,*items,*sales_channel"
 const DEFAULT_FIELDS =
@@ -29,6 +30,7 @@ export const CustomerOrderSection = ({
 
   const { searchParams, raw } = useOrderTableQuery({
     pageSize: PAGE_SIZE,
+    prefix: PREFIX,
   })
   const { orders, count, isLoading, isError, error } = useOrders(
     {
@@ -50,6 +52,7 @@ export const CustomerOrderSection = ({
     enablePagination: true,
     count,
     pageSize: PAGE_SIZE,
+    prefix: PREFIX,
   })
 
   if (isError) {
@@ -60,11 +63,12 @@ export const CustomerOrderSection = ({
     <Container className="divide-y p-0">
       <div className="flex items-center justify-between px-6 py-4">
         <Heading level="h2">{t("orders.domain")}</Heading>
-        <div className="flex items-center gap-x-2">
+        {/*TODO: ENABLE WHEN DRAFT ORDERS ARE DONE*/}
-          <Button size="small" variant="secondary">
+        {/*<div className="flex items-center gap-x-2">*/}
-            {t("actions.create")}
+        {/*  <Button size="small" variant="secondary">*/}
-          </Button>
+        {/*    {t("actions.create")}*/}
-        </div>
+        {/*  </Button>*/}
+        {/*</div>*/}
       </div>
       <DataTable
         columns={columns}
@@ -82,6 +86,7 @@ export const CustomerOrderSection = ({
         ]}
         search={true}
         queryObject={raw}
+        prefix={PREFIX}
       />
     </Container>
   )
@@ -115,10 +120,11 @@ const useColumns = () => {
   return useMemo(
     () => [
       ...base,
-      columnHelper.display({
+      // TODO: REENABLE WHEN TRANSFER OWNERSHIP IS IMPLEMENTED
-        id: "actions",
+      // columnHelper.display({
-        cell: ({ row }) => <CustomerOrderActions order={row.original} />,
+      //   id: "actions",
-      }),
+      //   cell: ({ row }) => <CustomerOrderActions order={row.original} />,
+      // }),
     ],
     [base]
   )

packages/admin/dashboard/src/routes/customers/customer-detail/customer-detail.tsx

@@ -7,6 +7,7 @@ import { useCustomer } from "../../../hooks/api/customers"
 import { CustomerGeneralSection } from "./components/customer-general-section"
 import { CustomerGroupSection } from "./components/customer-group-section"
 import { customerLoader } from "./loader"
+import { CustomerOrderSection } from "./components/customer-order-section"
 
 export const CustomerDetail = () => {
   const { id } = useParams()
@@ -40,9 +41,7 @@ export const CustomerDetail = () => {
       showMetadata
     >
       <CustomerGeneralSection customer={customer} />
-      {/* <CustomerOrderSection customer={customer} />
+      <CustomerOrderSection customer={customer} />
-      // TODO: re-add when order endpoints are added to api-v2
-      */}
       <CustomerGroupSection customer={customer} />
     </SingleColumnPage>
   )

packages/core/types/src/http/order/admin/queries.ts

@@ -8,7 +8,8 @@ export interface AdminOrderFilters extends FindParams, BaseOrderFilters {
   sales_channel_id?: string[]
   fulfillment_status?: FulfillmentStatus[]
   payment_status?: PaymentStatus[]
-  region_id?: string[]
+  region_id?: string[] | string
+  customer_id?: string[] | string
   q?: string
   created_at?: OperatorMap<string>
   updated_at?: OperatorMap<string>

packages/medusa/src/api/admin/orders/validators.ts

@@ -51,7 +51,8 @@ export const AdminGetOrdersParams = createFindParams({
     sales_channel_id: z.array(z.string()).optional(),
     fulfillment_status: z.array(z.string()).optional(),
     payment_status: z.array(z.string()).optional(),
-    region_id: z.array(z.string()).optional(),
+    region_id: z.union([z.string(), z.array(z.string())]).optional(),
+    customer_id: z.union([z.string(), z.array(z.string())]).optional(),
     q: z.string().optional(),
     created_at: createOperatorMap().optional(),
     updated_at: createOperatorMap().optional(),