feat(MED-105): update order details redirect and shown page

app/home/(user)/(dashboard)/order/[orderId]/confirmed/page.tsx

@@ -1,13 +1,16 @@
-import { notFound } from 'next/navigation';
+import { redirect } from 'next/navigation';
+import { PageBody, PageHeader } from '@kit/ui/page';
 
-import { retrieveOrder } from '~/medusa/lib/data/orders';
 import { createI18nServerInstance } from '@/lib/i18n/i18n.server';
-import OrderCompleted from '@/app/home/(user)/_components/order/order-completed';
 import { withI18n } from '~/lib/i18n/with-i18n';
-
-type Props = {
-  params: Promise<{ orderId: string }>;
-};
+import { getOrder } from '~/lib/services/order.service';
+import { retrieveOrder } from '@lib/data/orders';
+import pathsConfig from '~/config/paths.config';
+import Divider from "@modules/common/components/divider"
+import OrderDetails from '@/app/home/(user)/_components/order/order-details';
+import OrderItems from '@/app/home/(user)/_components/order/order-items';
+import CartTotals from '@/app/home/(user)/_components/order/cart-totals';
+import { Trans } from '@kit/ui/trans';
 
 export async function generateMetadata() {
   const { t } = await createI18nServerInstance();
@@ -17,15 +20,33 @@ export async function generateMetadata() {
   };
 }
 
-async function OrderConfirmedPage(props: Props) {
+async function OrderConfirmedPage(props: {
+  params: Promise<{ orderId: string }>;
+}) {
   const params = await props.params;
-  const order = await retrieveOrder(params.orderId).catch(() => null);
 
+  const order = await getOrder({ orderId: Number(params.orderId) }).catch(() => null);
   if (!order) {
-    return notFound();
+    redirect(pathsConfig.app.myOrders);
   }
 
-  return <OrderCompleted order={order} />;
+  const medusaOrder = await retrieveOrder(order.medusa_order_id).catch(() => null);
+  if (!medusaOrder) {
+    redirect(pathsConfig.app.myOrders);
+  }
+
+  return (
+    <PageBody>
+      <PageHeader title={<Trans i18nKey="cart:orderConfirmed.title" />} />
+      <Divider />
+      <div className="grid grid-cols-1 small:grid-cols-[1fr_360px] gap-x-40 lg:px-4 gap-y-6">
+        <OrderDetails order={order} />
+        <Divider />
+        <OrderItems medusaOrder={medusaOrder} />
+        <CartTotals medusaOrder={medusaOrder} />
+      </div>
+    </PageBody>
+  );
 }
 
 export default withI18n(OrderConfirmedPage);

app/home/(user)/(dashboard)/order/[orderId]/page.tsx

@@ -0,0 +1,52 @@
+import { redirect } from 'next/navigation';
+import { PageBody, PageHeader } from '@kit/ui/page';
+
+import { createI18nServerInstance } from '@/lib/i18n/i18n.server';
+import { withI18n } from '~/lib/i18n/with-i18n';
+import { getOrder } from '~/lib/services/order.service';
+import { retrieveOrder } from '@lib/data/orders';
+import pathsConfig from '~/config/paths.config';
+import Divider from "@modules/common/components/divider"
+import OrderDetails from '@/app/home/(user)/_components/order/order-details';
+import OrderItems from '@/app/home/(user)/_components/order/order-items';
+import CartTotals from '@/app/home/(user)/_components/order/cart-totals';
+import { Trans } from '@kit/ui/trans';
+
+export async function generateMetadata() {
+  const { t } = await createI18nServerInstance();
+
+  return {
+    title: t('cart:order.title'),
+  };
+}
+
+async function OrderConfirmedPage(props: {
+  params: Promise<{ orderId: string }>;
+}) {
+  const params = await props.params;
+
+  const order = await getOrder({ orderId: Number(params.orderId) }).catch(() => null);
+  if (!order) {
+    redirect(pathsConfig.app.myOrders);
+  }
+
+  const medusaOrder = await retrieveOrder(order.medusa_order_id).catch(() => null);
+  if (!medusaOrder) {
+    redirect(pathsConfig.app.myOrders);
+  }
+
+  return (
+    <PageBody>
+      <PageHeader title={<Trans i18nKey="cart:order.title" />} />
+      <Divider />
+      <div className="grid grid-cols-1 small:grid-cols-[1fr_360px] gap-x-40 lg:px-4 gap-y-6">
+        <OrderDetails order={order} />
+        <Divider />
+        <OrderItems medusaOrder={medusaOrder} />
+        <CartTotals medusaOrder={medusaOrder} />
+      </div>
+    </PageBody>
+  );
+}
+
+export default withI18n(OrderConfirmedPage);

app/home/(user)/(dashboard)/order/page.tsx

@@ -10,6 +10,7 @@ import { HomeLayoutPageHeader } from '../../_components/home-page-header';
 import OrdersTable from '../../_components/orders/orders-table';
 import { withI18n } from '~/lib/i18n/with-i18n';
 import type { IOrderLineItem } from '../../_components/orders/types';
+import { getOrders } from '~/lib/services/order.service';
 
 export async function generateMetadata() {
   const { t } = await createI18nServerInstance();
@@ -20,7 +21,8 @@ export async function generateMetadata() {
 }
 
 async function OrdersPage() {
-  const orders = await listOrders().catch(() => null);
+  const orders = await listOrders();
+  const localOrders = await getOrders();
   const { productTypes } = await listProductTypes();
 
   if (!orders || !productTypes) {
@@ -30,13 +32,38 @@ async function OrdersPage() {
   const analysisPackagesType = productTypes.find(({ metadata }) => metadata?.handle === 'analysis-packages');
   const analysisPackageOrders: IOrderLineItem[] = orders.flatMap(({ id, items, payment_status, fulfillment_status }) => items
     ?.filter((item) => item.product_type_id === analysisPackagesType?.id)
-    .map((item) => ({ item, orderId: id, orderStatus: `${payment_status}/${fulfillment_status}` }))
+    .map((item) => {
+      const localOrder = localOrders.find((order) => order.medusa_order_id === id);
+      if (!localOrder) {
+        return null;
+      }
+      return {
+        item,
+        medusaOrderId: id,
+        orderId: localOrder?.id,
+        orderStatus: localOrder.status,
+        analysis_element_ids: localOrder.analysis_element_ids,
+      }
+    })
+    .filter((order) => order !== null)
   || []);
 
   const otherOrders: IOrderLineItem[] = orders
     .filter(({ items }) => items?.some((item) => item.product_type_id !== analysisPackagesType?.id))
     .flatMap(({ id, items, payment_status, fulfillment_status }) => items
-      ?.map((item) => ({ item, orderId: id, orderStatus: `${payment_status}/${fulfillment_status}` }))
+      ?.map((item) => {
+        const localOrder = localOrders.find((order) => order.medusa_order_id === id);
+        if (!localOrder) {
+          return null;
+        }
+        return {
+          item,
+          medusaOrderId: id,
+          orderId: localOrder.id,
+          orderStatus: localOrder.status,
+        }
+      })
+      .filter((order) => order !== null)
     || []);
 
   return (