Merge branch 'develop' into MED-102

app/home/(user)/(dashboard)/order/[orderId]/confirmed/order-confirmed-loading-wrapper.tsx

@@ -0,0 +1,83 @@
+'use client';
+
+import { useEffect, useRef, useState } from 'react';
+
+import CartTotals from '@/app/home/(user)/_components/order/cart-totals';
+import OrderDetails from '@/app/home/(user)/_components/order/order-details';
+import OrderItems from '@/app/home/(user)/_components/order/order-items';
+import { retrieveOrder } from '@lib/data/orders';
+import { StoreOrder } from '@medusajs/types';
+import Divider from '@modules/common/components/divider';
+
+import { GlobalLoader } from '@kit/ui/makerkit/global-loader';
+import { PageBody, PageHeader } from '@kit/ui/page';
+import { Trans } from '@kit/ui/trans';
+
+import { AnalysisOrder } from '~/lib/types/analysis-order';
+
+function OrderConfirmedLoadingWrapper({
+  medusaOrder: initialMedusaOrder,
+  order,
+}: {
+  medusaOrder: StoreOrder;
+  order: AnalysisOrder;
+}) {
+  const [medusaOrder, setMedusaOrder] =
+    useState<StoreOrder>(initialMedusaOrder);
+  const fetchingRef = useRef(false);
+
+  const paymentStatus = medusaOrder.payment_status;
+  const medusaOrderId = order.medusa_order_id;
+
+  useEffect(() => {
+    if (paymentStatus === 'captured') {
+      return;
+    }
+
+    const interval = setInterval(async () => {
+      if (fetchingRef.current) {
+        return;
+      }
+
+      fetchingRef.current = true;
+      const medusaOrder = await retrieveOrder(medusaOrderId, false);
+      fetchingRef.current = false;
+
+      setMedusaOrder(medusaOrder);
+    }, 2_000);
+
+    return () => clearInterval(interval);
+  }, [paymentStatus, medusaOrderId]);
+
+  const isPaid = paymentStatus === 'captured';
+
+  if (!isPaid) {
+    return (
+      <PageBody>
+        <div className="flex h-full flex-col items-center justify-start pt-[10vh]">
+          <div>
+            <GlobalLoader />
+          </div>
+          <h4 className="text-center">
+            <Trans i18nKey="cart:orderConfirmed.paymentConfirmationLoading" />
+          </h4>
+        </div>
+      </PageBody>
+    );
+  }
+
+  return (
+    <PageBody>
+      <PageHeader title={<Trans i18nKey="cart:orderConfirmed.title" />} />
+      <Divider />
+      <div className="small:grid-cols-[1fr_360px] grid grid-cols-1 gap-x-40 gap-y-6 lg:px-4">
+        <OrderDetails order={order} />
+        <Divider />
+        <OrderItems medusaOrder={medusaOrder} />
+        <CartTotals medusaOrder={medusaOrder} />
+      </div>
+    </PageBody>
+  );
+}
+
+export default OrderConfirmedLoadingWrapper;

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

@@ -1,19 +1,15 @@
 import { redirect } from 'next/navigation';
 
-import CartTotals from '@/app/home/(user)/_components/order/cart-totals';
-import OrderDetails from '@/app/home/(user)/_components/order/order-details';
-import OrderItems from '@/app/home/(user)/_components/order/order-items';
 import { createI18nServerInstance } from '@/lib/i18n/i18n.server';
 import { retrieveOrder } from '@lib/data/orders';
-import Divider from '@modules/common/components/divider';
 
 import { pathsConfig } from '@kit/shared/config';
-import { PageBody, PageHeader } from '@kit/ui/page';
-import { Trans } from '@kit/ui/trans';
 
 import { withI18n } from '~/lib/i18n/with-i18n';
 import { getAnalysisOrder } from '~/lib/services/order.service';
 
+import OrderConfirmedLoadingWrapper from './order-confirmed-loading-wrapper';
+
 export async function generateMetadata() {
   const { t } = await createI18nServerInstance();
 
@@ -42,16 +38,7 @@ async function OrderConfirmedPage(props: {
   }
 
   return (
-    <PageBody>
-      <PageHeader title={<Trans i18nKey="cart:orderConfirmed.title" />} />
-      <Divider />
-      <div className="small:grid-cols-[1fr_360px] grid grid-cols-1 gap-x-40 gap-y-6 lg:px-4">
-        <OrderDetails order={order} />
-        <Divider />
-        <OrderItems medusaOrder={medusaOrder} />
-        <CartTotals medusaOrder={medusaOrder} />
-      </div>
-    </PageBody>
+    <OrderConfirmedLoadingWrapper medusaOrder={medusaOrder} order={order} />
   );
 }
 

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

@@ -18,6 +18,8 @@ import { listOrders } from '~/medusa/lib/data/orders';
 import { HomeLayoutPageHeader } from '../../_components/home-page-header';
 import OrderBlock from '../../_components/orders/order-block';
 
+const ORDERS_LIMIT = 50;
+
 export async function generateMetadata() {
   const { t } = await createI18nServerInstance();
 
@@ -27,10 +29,13 @@ export async function generateMetadata() {
 }
 
 async function OrdersPage() {
-  const medusaOrders = await listOrders();
-  const analysisOrders = await getAnalysisOrders();
-  const ttoOrders = await getTtoOrders();
-  const { productTypes } = await listProductTypes();
+  const [medusaOrders, analysisOrders, ttoOrders, { productTypes }] =
+    await Promise.all([
+      listOrders(ORDERS_LIMIT),
+      getAnalysisOrders(),
+      getTtoOrders(),
+      listProductTypes(),
+    ]);
 
   if (!medusaOrders || !productTypes || !ttoOrders) {
     redirect(pathsConfig.auth.signIn);