feat : limit each session to 1 hours when checkout

app/commission/pay/[id]/page.tsx

@@ -13,6 +13,7 @@ import { getCustomerSession } from "@/lib/auth/server";
 import { promptPayConfig } from "@/lib/commission/payment";
 import { generatePromptPayPayload } from "@/lib/commission/promptpay";
 import { getCommissionLabels } from "@/lib/commission/catalog";
+import { checkoutExpiresAt, checkoutNow } from "@/lib/commission/checkout-expiration";
 
 export const instant = false;
 
@@ -27,21 +28,21 @@ export default async function CommissionPayPage({ params }: PageProps<"/commissi
   const [ticket] = await getDb().select({ id: commissionTickets.id }).from(commissionTickets)
     .where(eq(commissionTickets.checkoutId, id)).limit(1);
   if (ticket) redirect(`/commission/tickets/${ticket.id}`);
-  const { identifier } = promptPayConfig();
-  const payload = generatePromptPayPayload({ identifier, amount: checkout.amountBaht });
-  const qr = await QRCode.toDataURL(payload, { margin: 2, width: 300 });
+  const expiresAt = checkoutExpiresAt(checkout.createdAt);
+  const serverNow = checkoutNow();
+  let qr: string | null = null;
+  if (serverNow < expiresAt) {
+    const { identifier } = promptPayConfig();
+    const payload = generatePromptPayPayload({ identifier, amount: checkout.amountBaht });
+    qr = await QRCode.toDataURL(payload, { margin: 2, width: 300 });
+  }
   const catalog = await getCommissionLabels(checkout.request);
   return <div className="min-h-svh"><SiteHeader /><main className="mx-auto flex max-w-3xl flex-col gap-6 p-4 py-10 sm:p-8">
     <Link href="/commission" className="text-sm underline">กลับไป Commission</Link>
     <h1 className="font-heading text-3xl font-semibold">ชำระเงิน</h1>
     <Card><CardHeader><CardTitle>รายการคำขอ - ฿{checkout.amountBaht}</CardTitle></CardHeader>
       <CardContent>{catalog && <CommissionRequestSummary request={checkout.request} catalog={catalog} amountBaht={checkout.amountBaht} />}</CardContent></Card>
-    <Card><CardHeader><CardTitle>สแกน PromptPay</CardTitle></CardHeader><CardContent className="flex flex-col items-center gap-4">
-      {/* Generated locally from the fixed checkout amount and configured recipient. */}
-      {/* eslint-disable-next-line @next/next/no-img-element */}
-      <img src={qr} alt={`PromptPay QR สำหรับชำระเงิน ${checkout.amountBaht} บาท`} width={300} height={300} />
-      <strong>฿{checkout.amountBaht}</strong><p className="text-sm text-muted-foreground">โอนเงินแล้วอัปโหลดรูปสลิปเพื่อยืนยัน</p>
-    </CardContent></Card>
-    <CommissionPaymentForm checkoutId={id} />
+    <CommissionPaymentForm checkoutId={id} amountBaht={checkout.amountBaht} qr={qr}
+      expiresAt={expiresAt} serverNow={serverNow} />
   </main></div>;
 }

app/commission/tickets/page.tsx

@@ -1,5 +1,5 @@
 import Link from "next/link";
-import { and, desc, eq, isNull } from "drizzle-orm";
+import { and, desc, eq, gt, isNull } from "drizzle-orm";
 import { redirect } from "next/navigation";
 import { connection } from "next/server";
 import { getDb } from "@/db";
@@ -10,6 +10,7 @@ import { SiteHeader } from "@/components/public/site-header";
 import { Badge } from "@/components/ui/badge";
 import { Card, CardAction, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { getCustomerSession } from "@/lib/auth/server";
+import { CHECKOUT_DURATION_MS, checkoutNow } from "@/lib/commission/checkout-expiration";
 
 export const instant = false;
 export default async function CommissionTicketsPage() {
@@ -23,7 +24,8 @@ export default async function CommissionTicketsPage() {
     getDb().select({ id: commissionCheckouts.id, amount: commissionCheckouts.amountBaht,
       createdAt: commissionCheckouts.createdAt }).from(commissionCheckouts)
       .leftJoin(commissionTickets, eq(commissionTickets.checkoutId, commissionCheckouts.id))
-      .where(and(eq(commissionCheckouts.userId, session.user.id), isNull(commissionTickets.id)))
+      .where(and(eq(commissionCheckouts.userId, session.user.id), isNull(commissionTickets.id),
+        gt(commissionCheckouts.createdAt, new Date(checkoutNow() - CHECKOUT_DURATION_MS))))
       .orderBy(desc(commissionCheckouts.createdAt)).limit(20),
   ]);
   return <div className="min-h-svh"><SiteHeader /><CommissionLiveRefresh endpoint="/api/commission/events" />