@mohasinac/appkit 2.7.27 → 2.7.30

package/dist/features/collections/api/[slug]/route.js

@@ -10,22 +10,26 @@
  */
 import { NextResponse } from "next/server.js";
 import { getProviders } from "../../../../contracts";
+const ERR_COLLECTION_SLUG_REQUIRED = "Collection slug is required";
+const ERR_DB_NOT_CONFIGURED = "Database provider not configured";
+const ERR_COLLECTION_NOT_FOUND = "Collection not found";
+const ERR_INTERNAL_SERVER_ERROR = "Internal server error";
 export async function GET(request, { params }) {
     try {
         const { slug } = await params;
         if (!slug) {
-            return NextResponse.json({ success: false, error: "Collection slug required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_SLUG_REQUIRED }, { status: 400 });
         }
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("collections");
         const result = await repo.findAll({
             filters: `slug==${slug}`,
             perPage: 1,
         });
         if (!result.data[0]) {
-            return NextResponse.json({ success: false, error: "Collection not found" }, { status: 404 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_NOT_FOUND }, { status: 404 });
         }
         return NextResponse.json({
             success: true,
@@ -35,7 +39,7 @@ export async function GET(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }
@@ -43,19 +47,19 @@ export async function PATCH(request, { params }) {
     try {
         const { slug } = await params;
         if (!slug) {
-            return NextResponse.json({ success: false, error: "Collection slug required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_SLUG_REQUIRED }, { status: 400 });
         }
         const body = await request.json();
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("collections");
         const result = await repo.findAll({
             filters: `slug==${slug}`,
             perPage: 1,
         });
         if (!result.data[0]) {
-            return NextResponse.json({ success: false, error: "Collection not found" }, { status: 404 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_NOT_FOUND }, { status: 404 });
         }
         const updated = await repo.update(result.data[0].id, body);
         return NextResponse.json({
@@ -66,7 +70,7 @@ export async function PATCH(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }
@@ -74,18 +78,18 @@ export async function DELETE(request, { params }) {
     try {
         const { slug } = await params;
         if (!slug) {
-            return NextResponse.json({ success: false, error: "Collection slug required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_SLUG_REQUIRED }, { status: 400 });
         }
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("collections");
         const result = await repo.findAll({
             filters: `slug==${slug}`,
             perPage: 1,
         });
         if (!result.data[0]) {
-            return NextResponse.json({ success: false, error: "Collection not found" }, { status: 404 });
+            return NextResponse.json({ success: false, error: ERR_COLLECTION_NOT_FOUND }, { status: 404 });
         }
         await repo.delete(result.data[0].id);
         return NextResponse.json({
@@ -96,7 +100,7 @@ export async function DELETE(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }

package/dist/features/collections/schemas/index.d.ts

@@ -26,13 +26,13 @@ export declare const collectionItemSchema: z.ZodObject<{
 }, "strip", z.ZodTypeAny, {
     sortOrder: number;
     title: string;
-    active: boolean;
     slug: string;
+    active: boolean;
     createdAt?: string | undefined;
     image?: string | undefined;
-    subtitle?: string | undefined;
     description?: string | undefined;
     brandSlug?: string | undefined;
+    subtitle?: string | undefined;
     productCount?: number | undefined;
     bannerImage?: string | undefined;
     franchiseSlug?: string | undefined;
@@ -43,10 +43,10 @@ export declare const collectionItemSchema: z.ZodObject<{
     createdAt?: string | undefined;
     sortOrder?: number | undefined;
     image?: string | undefined;
-    active?: boolean | undefined;
-    subtitle?: string | undefined;
     description?: string | undefined;
     brandSlug?: string | undefined;
+    active?: boolean | undefined;
+    subtitle?: string | undefined;
     productCount?: number | undefined;
     bannerImage?: string | undefined;
     franchiseSlug?: string | undefined;
@@ -61,8 +61,8 @@ export declare const collectionListItemSchema: z.ZodObject<{
     active: z.ZodDefault<z.ZodBoolean>;
 }, "strip", z.ZodTypeAny, {
     title: string;
-    active: boolean;
     slug: string;
+    active: boolean;
     image?: string | undefined;
     subtitle?: string | undefined;
     productCount?: number | undefined;

package/dist/features/consultation/api/[id]/route.js

@@ -10,15 +10,18 @@
  */
 import { NextResponse } from "next/server.js";
 import { getProviders } from "../../../../contracts";
+const ERR_CONSULTATION_ID_REQUIRED = "Consultation ID is required";
+const ERR_DB_NOT_CONFIGURED = "Database provider not configured";
+const ERR_INTERNAL_SERVER_ERROR = "Internal server error";
 export async function GET(request, { params }) {
     try {
         const { id } = await params;
         if (!id) {
-            return NextResponse.json({ success: false, error: "Consultation ID required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_CONSULTATION_ID_REQUIRED }, { status: 400 });
         }
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("consultations");
         const consultation = await repo.findById(id);
         if (!consultation) {
@@ -32,7 +35,7 @@ export async function GET(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }
@@ -40,12 +43,12 @@ export async function PATCH(request, { params }) {
     try {
         const { id } = await params;
         if (!id) {
-            return NextResponse.json({ success: false, error: "Consultation ID required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_CONSULTATION_ID_REQUIRED }, { status: 400 });
         }
         const body = await request.json();
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("consultations");
         const updated = await repo.update(id, body);
         if (!updated) {
@@ -59,7 +62,7 @@ export async function PATCH(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }
@@ -67,11 +70,11 @@ export async function DELETE(request, { params }) {
     try {
         const { id } = await params;
         if (!id) {
-            return NextResponse.json({ success: false, error: "Consultation ID required" }, { status: 400 });
+            return NextResponse.json({ success: false, error: ERR_CONSULTATION_ID_REQUIRED }, { status: 400 });
         }
         const { db } = getProviders();
         if (!db)
-            return NextResponse.json({ success: false, error: "DB not configured" }, { status: 503 });
+            return NextResponse.json({ success: false, error: ERR_DB_NOT_CONFIGURED }, { status: 503 });
         const repo = db.getRepository("consultations");
         await repo.delete(id);
         return NextResponse.json({
@@ -82,7 +85,7 @@ export async function DELETE(request, { params }) {
     catch (error) {
         return NextResponse.json({
             success: false,
-            error: error instanceof Error ? error.message : "Internal server error",
+            error: error instanceof Error ? error.message : ERR_INTERNAL_SERVER_ERROR,
         }, { status: 500 });
     }
 }

package/dist/features/consultation/components/ConsultationForm.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { Button, Div, Input, Row, Select, Textarea } from "../../../ui";
+const CLS_INPUT = "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm";
 const TIME_SLOTS = [
     "9:00 AM",
     "10:00 AM",
@@ -42,10 +43,10 @@ export function ConsultationForm({ onSubmit, isPending, concerns = [], }) {
         e.preventDefault();
         await onSubmit(form);
     }
-    return (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [_jsx(Input, { name: "name", type: "text", placeholder: "Full name", value: form.name, onChange: handleChange, required: true, className: "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm" }), _jsx(Input, { name: "email", type: "email", placeholder: "Email address", value: form.email, onChange: handleChange, required: true, className: "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm" }), _jsx(Input, { name: "phone", type: "tel", placeholder: "Phone number", value: form.phone, onChange: handleChange, required: true, className: "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm" }), concerns.length > 0 && (_jsx(Row, { wrap: true, gap: "sm", children: concerns.map((c) => (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => toggleConcern(c), className: `rounded-full border px-3 py-1 text-xs transition ${form.concern.includes(c)
+    return (_jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [_jsx(Input, { name: "name", type: "text", placeholder: "Full name", value: form.name, onChange: handleChange, required: true, className: CLS_INPUT }), _jsx(Input, { name: "email", type: "email", placeholder: "Email address", value: form.email, onChange: handleChange, required: true, className: CLS_INPUT }), _jsx(Input, { name: "phone", type: "tel", placeholder: "Phone number", value: form.phone, onChange: handleChange, required: true, className: CLS_INPUT }), concerns.length > 0 && (_jsx(Row, { wrap: true, gap: "sm", children: concerns.map((c) => (_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => toggleConcern(c), className: `rounded-full border px-3 py-1 text-xs transition ${form.concern.includes(c)
                         ? "border-primary bg-primary text-white"
                         : "border-neutral-300 text-neutral-700 hover:border-primary"}`, children: c }, c))) })), _jsxs(Div, { className: "flex gap-3", children: [_jsx(Input, { name: "preferredDate", type: "date", value: form.preferredDate, onChange: handleChange, required: true, className: "flex-1 rounded-md border border-neutral-300 px-3 py-2 text-sm" }), _jsx(Select, { value: form.preferredTime, onValueChange: (value) => handleValueChange("preferredTime", value), options: TIME_SLOTS.map((t) => ({ value: t, label: t })), className: "flex-1 rounded-md border border-neutral-300 px-3 py-2 text-sm" })] }), _jsx(Select, { value: form.mode, onValueChange: (value) => handleValueChange("mode", value), options: [
                     { value: "remote", label: "Remote (Video Call)" },
                     { value: "in-person", label: "In-Person" },
-                ], className: "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm" }), _jsx(Textarea, { name: "message", placeholder: "Any additional notes (optional)", value: form.message, onChange: handleChange, rows: 3, className: "w-full rounded-md border border-neutral-300 px-3 py-2 text-sm" }), _jsx(Button, { type: "submit", disabled: isPending, variant: "primary", className: "w-full rounded-md bg-primary px-4 py-2 text-sm font-medium text-white transition hover:bg-primary/90 disabled:opacity-60", children: isPending ? "Booking..." : "Book Consultation" })] }));
+                ], className: CLS_INPUT }), _jsx(Textarea, { name: "message", placeholder: "Any additional notes (optional)", value: form.message, onChange: handleChange, rows: 3, className: CLS_INPUT }), _jsx(Button, { type: "submit", disabled: isPending, variant: "primary", className: "w-full rounded-md bg-primary px-4 py-2 text-sm font-medium text-white transition hover:bg-primary/90 disabled:opacity-60", children: isPending ? "Booking..." : "Book Consultation" })] }));
 }

package/dist/features/consultation/schemas/index.d.ts

@@ -33,9 +33,9 @@ export declare const consultationBookingSchema: z.ZodObject<{
     createdAt?: string | undefined;
     adminNote?: string | undefined;
     message?: string | undefined;
-    mode?: "online" | "phone" | "in_person" | undefined;
-    userId?: string | undefined;
     phone?: string | undefined;
+    mode?: "phone" | "online" | "in_person" | undefined;
+    userId?: string | undefined;
     concern?: string[] | undefined;
     preferredDate?: string | undefined;
     preferredTime?: string | undefined;
@@ -47,9 +47,9 @@ export declare const consultationBookingSchema: z.ZodObject<{
     status?: "pending" | "completed" | "confirmed" | "cancelled" | "no_show" | undefined;
     adminNote?: string | undefined;
     message?: string | undefined;
-    mode?: "online" | "phone" | "in_person" | undefined;
-    userId?: string | undefined;
     phone?: string | undefined;
+    mode?: "phone" | "online" | "in_person" | undefined;
+    userId?: string | undefined;
     concern?: string[] | undefined;
     preferredDate?: string | undefined;
     preferredTime?: string | undefined;
@@ -71,8 +71,8 @@ export declare const bookConsultationSchema: z.ZodObject<{
     name: string;
     concern: string[];
     message?: string | undefined;
-    mode?: "online" | "phone" | "in_person" | undefined;
     phone?: string | undefined;
+    mode?: "phone" | "online" | "in_person" | undefined;
     preferredDate?: string | undefined;
     preferredTime?: string | undefined;
 }, {
@@ -80,8 +80,8 @@ export declare const bookConsultationSchema: z.ZodObject<{
     name: string;
     concern: string[];
     message?: string | undefined;
-    mode?: "online" | "phone" | "in_person" | undefined;
     phone?: string | undefined;
+    mode?: "phone" | "online" | "in_person" | undefined;
     preferredDate?: string | undefined;
     preferredTime?: string | undefined;
 }>;

package/dist/features/contact/email.js

@@ -1,6 +1,8 @@
 import { getProviders } from "../../contracts";
 import { serverLogger } from "../../monitoring";
 import { currentYear, formatCurrency, formatDateTime, nowMs, } from "../../utils";
+const EMAIL_STYLE_MUTED = "color: #666; font-size: 14px;";
+const EMAIL_STYLE_BODY = "color: #333; font-size: 14px;";
 function getSiteName() {
     return process.env.NEXT_PUBLIC_SITE_NAME?.trim() || "App";
 }
@@ -74,134 +76,93 @@ export async function sendPasswordResetEmailWithLink(email, resetLink) {
         throw error;
     }
 }
+function buildOrderItemsHtml(items, productTitle, quantity, currency) {
+    if (items && items.length > 1) {
+        return `
+      <table width="100%" cellpadding="8" cellspacing="0" border="0" style="border-collapse: collapse; margin-bottom: 8px;">
+        <thead>
+          <tr style="background-color: #e9ecef;">
+            <th style="text-align: left; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Product</th>
+            <th style="text-align: center; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Qty</th>
+            <th style="text-align: right; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Amount</th>
+          </tr>
+        </thead>
+        <tbody>
+          ${items.map((item, index) => `
+            <tr style="background-color: ${index % 2 === 0 ? "#ffffff" : "#f8f9fa"}; border-top: 1px solid #e9ecef;">
+              <td style="font-size: 14px; color: #333; padding: 8px 12px;">${item.productTitle}</td>
+              <td style="font-size: 14px; color: #333; text-align: center; padding: 8px 12px;">${item.quantity}</td>
+              <td style="font-size: 14px; color: #333; text-align: right; padding: 8px 12px;">${formatCurrency(item.totalPrice, currency)}</td>
+            </tr>`).join("")}
+        </tbody>
+      </table>`;
+    }
+    return `
+    <tr>
+      <td style="${EMAIL_STYLE_MUTED}">Product</td>
+      <td style="${EMAIL_STYLE_BODY}">${productTitle}</td>
+    </tr>
+    <tr>
+      <td style="${EMAIL_STYLE_MUTED}">Quantity</td>
+      <td style="${EMAIL_STYLE_BODY}">${quantity}</td>
+    </tr>`;
+}
+function buildOrderConfirmationHtml(params) {
+    const { userName, orderId, formattedTotal, shippingAddress, paymentMethod, orderUrl, itemsHtml, siteName, items } = params;
+    return `
+    <!DOCTYPE html><html>
+    <head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Order Confirmation</title></head>
+    <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background-color: #f5f5f5;">
+      <table width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color: #f5f5f5; padding: 40px 0;">
+        <tr><td align="center">
+          <table width="600" cellpadding="0" cellspacing="0" border="0" style="background-color: #ffffff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
+            <tr><td style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); padding: 40px; text-align: center;">
+              <p style="font-size: 48px; margin: 0 0 12px;">✅</p>
+              <h1 style="color: #ffffff; margin: 0; font-size: 28px; font-weight: 600;">Order Confirmed!</h1>
+            </td></tr>
+            <tr><td style="padding: 40px;">
+              <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 20px;">Hi ${userName},</p>
+              <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 24px;">Thank you for your order! We've received it and will process it shortly.</p>
+              <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background-color: #f8f9fa; border-radius: 8px; margin-bottom: 24px;">
+                <tr><td style="color: #666; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid #e9ecef;" colspan="2">Order Details</td></tr>
+                <tr><td style="color: #666; font-size: 14px; width: 40%;">Order ID</td><td style="color: #333; font-size: 14px; font-weight: 600;">${orderId}</td></tr>
+                ${items && items.length > 1
+        ? `<tr><td style="color: #666; font-size: 14px; vertical-align: top;" colspan="2"><div style="font-weight: 600; margin-bottom: 8px;">Items (${items.length})</div>${itemsHtml}</td></tr>`
+        : itemsHtml}
+                <tr><td style="${EMAIL_STYLE_MUTED}">Total</td><td style="color: #333; font-size: 14px; font-weight: 700;">${formattedTotal}</td></tr>
+                <tr><td style="${EMAIL_STYLE_MUTED}">Payment</td><td style="${EMAIL_STYLE_BODY}">${paymentMethod === "cod" ? "Cash on Delivery" : "Online Payment"}</td></tr>
+                <tr><td style="color: #666; font-size: 14px; vertical-align: top;">Ship to</td><td style="${EMAIL_STYLE_BODY}">${shippingAddress}</td></tr>
+              </table>
+              <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 30px 0;">
+                <tr><td align="center">
+                  <a href="${orderUrl}" style="display: inline-block; padding: 14px 40px; background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: #ffffff; text-decoration: none; border-radius: 6px; font-size: 16px; font-weight: 600;">View Order</a>
+                </td></tr>
+              </table>
+              <p style="color: #999; font-size: 13px; line-height: 1.6; margin: 0;">We'll send you another email when your order is shipped.</p>
+            </td></tr>
+            <tr><td style="background-color: #f8f9fa; padding: 24px; text-align: center; border-top: 1px solid #eee;">
+              <p style="color: #999; font-size: 12px; margin: 0;">© ${currentYear()} ${siteName}. All rights reserved.</p>
+            </td></tr>
+          </table>
+        </td></tr>
+      </table>
+    </body></html>`;
+}
 export async function sendOrderConfirmationEmail(params) {
     const siteName = getSiteName();
     const siteUrl = getSiteUrl();
     const { to, userName, orderId, productTitle, quantity, totalPrice, currency, shippingAddress, paymentMethod, items, } = params;
     const orderUrl = `${siteUrl}/user/orders/view/${orderId}`;
     const formattedTotal = formatCurrency(totalPrice, currency);
-    const itemsHtml = items && items.length > 1
-        ? `
-        <table width="100%" cellpadding="8" cellspacing="0" border="0" style="border-collapse: collapse; margin-bottom: 8px;">
-          <thead>
-            <tr style="background-color: #e9ecef;">
-              <th style="text-align: left; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Product</th>
-              <th style="text-align: center; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Qty</th>
-              <th style="text-align: right; font-size: 12px; font-weight: 600; color: #666; text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 12px;">Amount</th>
-            </tr>
-          </thead>
-          <tbody>
-            ${items
-            .map((item, index) => `
-              <tr style="background-color: ${index % 2 === 0 ? "#ffffff" : "#f8f9fa"}; border-top: 1px solid #e9ecef;">
-                <td style="font-size: 14px; color: #333; padding: 8px 12px;">${item.productTitle}</td>
-                <td style="font-size: 14px; color: #333; text-align: center; padding: 8px 12px;">${item.quantity}</td>
-                <td style="font-size: 14px; color: #333; text-align: right; padding: 8px 12px;">${formatCurrency(item.totalPrice, currency)}</td>
-              </tr>`)
-            .join("")}
-          </tbody>
-        </table>`
-        : `
-        <tr>
-          <td style="color: #666; font-size: 14px;">Product</td>
-          <td style="color: #333; font-size: 14px;">${productTitle}</td>
-        </tr>
-        <tr>
-          <td style="color: #666; font-size: 14px;">Quantity</td>
-          <td style="color: #333; font-size: 14px;">${quantity}</td>
-        </tr>`;
+    const itemsHtml = buildOrderItemsHtml(items, productTitle, quantity, currency);
     const itemsText = items && items.length > 1
-        ? items
-            .map((item) => `  • ${item.productTitle} × ${item.quantity} — ${formatCurrency(item.totalPrice, currency)}`)
-            .join("\n")
+        ? items.map((item) => `  • ${item.productTitle} × ${item.quantity} — ${formatCurrency(item.totalPrice, currency)}`).join("\n")
         : `  Product: ${productTitle}\n  Quantity: ${quantity}`;
     try {
         const { data, error } = await sendConfiguredEmail({
             to,
             subject: `Order Confirmed — ${orderId}`,
-            html: `
-        <!DOCTYPE html>
-        <html>
-        <head>
-          <meta charset="utf-8">
-          <meta name="viewport" content="width=device-width, initial-scale=1.0">
-          <title>Order Confirmation</title>
-        </head>
-        <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background-color: #f5f5f5;">
-          <table width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color: #f5f5f5; padding: 40px 0;">
-            <tr>
-              <td align="center">
-                <table width="600" cellpadding="0" cellspacing="0" border="0" style="background-color: #ffffff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
-                  <tr>
-                    <td style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); padding: 40px; text-align: center;">
-                      <p style="font-size: 48px; margin: 0 0 12px;">✅</p>
-                      <h1 style="color: #ffffff; margin: 0; font-size: 28px; font-weight: 600;">Order Confirmed!</h1>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td style="padding: 40px;">
-                      <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 20px;">Hi ${userName},</p>
-                      <p style="color: #333; font-size: 16px; line-height: 1.6; margin: 0 0 24px;">
-                        Thank you for your order! We've received it and will process it shortly.
-                      </p>
-                      <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background-color: #f8f9fa; border-radius: 8px; margin-bottom: 24px;">
-                        <tr>
-                          <td style="color: #666; font-size: 13px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid #e9ecef;" colspan="2">Order Details</td>
-                        </tr>
-                        <tr>
-                          <td style="color: #666; font-size: 14px; width: 40%;">Order ID</td>
-                          <td style="color: #333; font-size: 14px; font-weight: 600;">${orderId}</td>
-                        </tr>
-                        ${items && items.length > 1
-                ? `
-                        <tr>
-                          <td style="color: #666; font-size: 14px; vertical-align: top;" colspan="2">
-                            <div style="font-weight: 600; margin-bottom: 8px;">Items (${items.length})</div>
-                            ${itemsHtml}
-                          </td>
-                        </tr>`
-                : itemsHtml}
-                        <tr>
-                          <td style="color: #666; font-size: 14px;">Total</td>
-                          <td style="color: #333; font-size: 14px; font-weight: 700;">${formattedTotal}</td>
-                        </tr>
-                        <tr>
-                          <td style="color: #666; font-size: 14px;">Payment</td>
-                          <td style="color: #333; font-size: 14px;">${paymentMethod === "cod" ? "Cash on Delivery" : "Online Payment"}</td>
-                        </tr>
-                        <tr>
-                          <td style="color: #666; font-size: 14px; vertical-align: top;">Ship to</td>
-                          <td style="color: #333; font-size: 14px;">${shippingAddress}</td>
-                        </tr>
-                      </table>
-                      <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 30px 0;">
-                        <tr>
-                          <td align="center">
-                            <a href="${orderUrl}" style="display: inline-block; padding: 14px 40px; background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: #ffffff; text-decoration: none; border-radius: 6px; font-size: 16px; font-weight: 600;">
-                              View Order
-                            </a>
-                          </td>
-                        </tr>
-                      </table>
-                      <p style="color: #999; font-size: 13px; line-height: 1.6; margin: 0;">
-                        We'll send you another email when your order is shipped.
-                      </p>
-                    </td>
-                  </tr>
-                  <tr>
-                    <td style="background-color: #f8f9fa; padding: 24px; text-align: center; border-top: 1px solid #eee;">
-                      <p style="color: #999; font-size: 12px; margin: 0;">
-                        © ${currentYear()} ${siteName}. All rights reserved.
-                      </p>
-                    </td>
-                  </tr>
-                </table>
-              </td>
-            </tr>
-          </table>
-        </body>
-        </html>
-      `,
+            html: buildOrderConfirmationHtml({ userName, orderId, formattedTotal, shippingAddress, paymentMethod, orderUrl, itemsHtml, siteName, items }),
             text: `Hi ${userName},\n\nYour order ${orderId} has been confirmed!\n\n${itemsText}\nTotal: ${formattedTotal}\nPayment: ${paymentMethod === "cod" ? "Cash on Delivery" : "Online Payment"}\nShip to: ${shippingAddress}\n\nView your order: ${orderUrl}\n\n© ${currentYear()} ${siteName}`,
         });
         if (error) {

package/dist/features/copilot/components/AdminCopilotView.js

@@ -6,12 +6,22 @@ import { Alert, Button, Div, Heading, Input, Span, StackedViewShell, Text, } fro
 import { apiClient } from "../../../http";
 import { useCopilotChat } from "../hooks/useCopilotChat";
 import { THEME_CONSTANTS } from "../../../tokens";
+const LBL_CONVERSATION_ID = "Conversation ID";
 function MessageBubble({ msg }) {
     const isUser = msg.role === "user";
     return (_jsx(Div, { className: `flex ${isUser ? "justify-end" : "justify-start"}`, children: _jsxs(Div, { className: `max-w-[80%] rounded-2xl px-4 py-2.5 text-sm ${isUser
                 ? "bg-primary text-white rounded-tr-sm"
                 : "bg-neutral-100 dark:bg-slate-700 text-neutral-900 dark:text-neutral-100 rounded-tl-sm"}`, children: [_jsx(Text, { className: "whitespace-pre-wrap text-sm leading-relaxed", children: msg.content }), msg.durationMs ? (_jsxs(Span, { className: "mt-1 block text-xs opacity-60", children: [(msg.durationMs / 1000).toFixed(1), "s"] })) : null] }) }));
 }
+function renderCopilotChatPanel(props) {
+    const { messages, conversationId, isLoading, error, input, setInput, labels, messagesEndRef, handleSubmit } = props;
+    return (_jsxs(Div, { className: "flex flex-col rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-800/60 h-[calc(100vh-300px)]", children: [_jsx(Div, { className: "border-b border-neutral-200 dark:border-slate-700 p-3", children: _jsxs(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: [labels?.conversationId ?? LBL_CONVERSATION_ID, ": ", conversationId] }) }), _jsxs(Div, { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [messages.length === 0 ? (_jsxs(Div, { className: "flex flex-col items-center justify-center h-full text-center", children: [_jsx(Text, { className: "font-medium", children: labels?.noMessages ?? "No messages yet" }), _jsx(Text, { variant: "secondary", className: "text-sm mt-1", children: labels?.noMessagesDesc ?? "Ask anything to get started" })] })) : null, messages.map((msg) => _jsx(MessageBubble, { msg: msg }, msg.id)), isLoading ? (_jsx(Div, { className: "flex justify-start", children: _jsx(Div, { className: "rounded-2xl rounded-tl-sm bg-neutral-100 dark:bg-slate-700 px-4 py-2.5", children: _jsx(Span, { className: "text-sm opacity-60 animate-pulse", children: "Thinking..." }) }) })) : null, error ? _jsx(Text, { className: "text-center text-sm text-red-500", children: labels?.errorLabel ?? "An error occurred. Please try again." }) : null, _jsx("div", { ref: messagesEndRef })] }), _jsx(Div, { className: "border-t border-neutral-200 dark:border-slate-700 p-3", children: _jsxs("form", { onSubmit: handleSubmit, className: "flex gap-2", children: [_jsx("input", { type: "text", value: input, onChange: (e) => setInput(e.target.value), placeholder: labels?.inputPlaceholder ?? "Ask anything...", disabled: isLoading, className: "flex-1 h-10 rounded-lg border border-neutral-200 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 text-sm outline-none focus:ring-2 ring-primary/20 transition disabled:opacity-60" }), _jsx(Button, { type: "submit", variant: "primary", disabled: isLoading || !input.trim(), className: "shrink-0", children: isLoading ? labels?.sendingButton ?? "Sending..." : labels?.sendButton ?? "Send" })] }) })] }));
+}
+function renderCopilotHistoryPanel(props) {
+    const { historyQuery, conversationInput, setConversationInput, loadConversation, labels } = props;
+    return (_jsxs(Div, { className: "rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-4 space-y-3", children: [_jsx(Heading, { level: 3, className: "text-sm font-semibold", children: labels?.historyTitle ?? "Conversation History" }), _jsxs("form", { className: "space-y-2", onSubmit: (e) => { e.preventDefault(); if (!conversationInput.trim())
+                    return; loadConversation(conversationInput.trim()); }, children: [_jsx(Input, { label: labels?.conversationId ?? LBL_CONVERSATION_ID, value: conversationInput, onChange: (e) => setConversationInput(e.target.value), placeholder: "conv_..." }), _jsx(Button, { type: "submit", variant: "secondary", size: "sm", className: "w-full", children: labels?.loadConversation ?? "Load conversation" })] }), historyQuery.error ? (_jsx(Alert, { variant: "warning", title: "History unavailable", children: historyQuery.error instanceof Error ? historyQuery.error.message : "Could not load history" })) : null, _jsxs(Div, { className: "max-h-72 overflow-y-auto space-y-2", children: [(historyQuery.data?.messages ?? []).map((log, index) => (_jsxs(Div, { className: "rounded-lg border border-neutral-200 dark:border-slate-700 p-2", children: [_jsx(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: new Date(log.createdAt).toLocaleString() }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3}`, children: ["Q: ", log.prompt] }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3} text-neutral-600 dark:text-zinc-300`, children: ["A: ", log.response] })] }, `${log.createdAt}-${index}`))), !historyQuery.isLoading && (historyQuery.data?.messages?.length ?? 0) === 0 ? (_jsx(Text, { variant: "secondary", className: "text-sm", children: "No server history found for this conversation yet." })) : null] })] }));
+}
 export function AdminCopilotView({ endpoint, historyEndpoint = "/api/copilot/history", renderHeader, labels = {}, className = "", }) {
     const [input, setInput] = useState("");
     const [conversationInput, setConversationInput] = useState("");
@@ -34,11 +44,11 @@ export function AdminCopilotView({ endpoint, historyEndpoint = "/api/copilot/his
     };
     return (_jsx(StackedViewShell, { portal: "admin", title: labels.title ?? "AI Copilot", className: className, sections: [
             renderHeader ? (renderHeader(startNewConversation)) : (_jsxs(Div, { className: "flex items-center justify-between gap-3", children: [_jsx(Heading, { level: 2, children: labels.title ?? "AI Copilot" }), _jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: startNewConversation, children: labels.newConversation ?? "New Conversation" })] })),
-            _jsxs(Div, { className: "grid grid-cols-1 lg:grid-cols-[2fr,1fr] gap-4", children: [_jsxs(Div, { className: "flex flex-col rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-800/60 h-[calc(100vh-300px)]", children: [_jsx(Div, { className: "border-b border-neutral-200 dark:border-slate-700 p-3", children: _jsxs(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: [labels.conversationId ?? "Conversation ID", ": ", conversationId] }) }), _jsxs(Div, { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [messages.length === 0 ? (_jsxs(Div, { className: "flex flex-col items-center justify-center h-full text-center", children: [_jsx(Text, { className: "font-medium", children: labels.noMessages ?? "No messages yet" }), _jsx(Text, { variant: "secondary", className: "text-sm mt-1", children: labels.noMessagesDesc ?? "Ask anything to get started" })] })) : null, messages.map((msg) => (_jsx(MessageBubble, { msg: msg }, msg.id))), isLoading ? (_jsx(Div, { className: "flex justify-start", children: _jsx(Div, { className: "rounded-2xl rounded-tl-sm bg-neutral-100 dark:bg-slate-700 px-4 py-2.5", children: _jsx(Span, { className: "text-sm opacity-60 animate-pulse", children: "Thinking..." }) }) })) : null, error ? (_jsx(Text, { className: "text-center text-sm text-red-500", children: labels.errorLabel ?? "An error occurred. Please try again." })) : null, _jsx("div", { ref: messagesEndRef })] }), _jsx(Div, { className: "border-t border-neutral-200 dark:border-slate-700 p-3", children: _jsxs("form", { onSubmit: handleSubmit, className: "flex gap-2", children: [_jsx("input", { type: "text", value: input, onChange: (event) => setInput(event.target.value), placeholder: labels.inputPlaceholder ?? "Ask anything...", disabled: isLoading, className: "flex-1 h-10 rounded-lg border border-neutral-200 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 text-sm outline-none focus:ring-2 ring-primary/20 transition disabled:opacity-60" }), _jsx(Button, { type: "submit", variant: "primary", disabled: isLoading || !input.trim(), className: "shrink-0", children: isLoading ? labels.sendingButton ?? "Sending..." : labels.sendButton ?? "Send" })] }) })] }), _jsxs(Div, { className: "rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-4 space-y-3", children: [_jsx(Heading, { level: 3, className: "text-sm font-semibold", children: labels.historyTitle ?? "Conversation History" }), _jsxs("form", { className: "space-y-2", onSubmit: (event) => {
+            _jsxs(Div, { className: "grid grid-cols-1 lg:grid-cols-[2fr,1fr] gap-4", children: [_jsxs(Div, { className: "flex flex-col rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-800/60 h-[calc(100vh-300px)]", children: [_jsx(Div, { className: "border-b border-neutral-200 dark:border-slate-700 p-3", children: _jsxs(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: [labels.conversationId ?? LBL_CONVERSATION_ID, ": ", conversationId] }) }), _jsxs(Div, { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [messages.length === 0 ? (_jsxs(Div, { className: "flex flex-col items-center justify-center h-full text-center", children: [_jsx(Text, { className: "font-medium", children: labels.noMessages ?? "No messages yet" }), _jsx(Text, { variant: "secondary", className: "text-sm mt-1", children: labels.noMessagesDesc ?? "Ask anything to get started" })] })) : null, messages.map((msg) => (_jsx(MessageBubble, { msg: msg }, msg.id))), isLoading ? (_jsx(Div, { className: "flex justify-start", children: _jsx(Div, { className: "rounded-2xl rounded-tl-sm bg-neutral-100 dark:bg-slate-700 px-4 py-2.5", children: _jsx(Span, { className: "text-sm opacity-60 animate-pulse", children: "Thinking..." }) }) })) : null, error ? (_jsx(Text, { className: "text-center text-sm text-red-500", children: labels.errorLabel ?? "An error occurred. Please try again." })) : null, _jsx("div", { ref: messagesEndRef })] }), _jsx(Div, { className: "border-t border-neutral-200 dark:border-slate-700 p-3", children: _jsxs("form", { onSubmit: handleSubmit, className: "flex gap-2", children: [_jsx("input", { type: "text", value: input, onChange: (event) => setInput(event.target.value), placeholder: labels.inputPlaceholder ?? "Ask anything...", disabled: isLoading, className: "flex-1 h-10 rounded-lg border border-neutral-200 dark:border-slate-600 bg-white dark:bg-slate-800 px-3 text-sm outline-none focus:ring-2 ring-primary/20 transition disabled:opacity-60" }), _jsx(Button, { type: "submit", variant: "primary", disabled: isLoading || !input.trim(), className: "shrink-0", children: isLoading ? labels.sendingButton ?? "Sending..." : labels.sendButton ?? "Send" })] }) })] }), _jsxs(Div, { className: "rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900 p-4 space-y-3", children: [_jsx(Heading, { level: 3, className: "text-sm font-semibold", children: labels.historyTitle ?? "Conversation History" }), _jsxs("form", { className: "space-y-2", onSubmit: (event) => {
                                     event.preventDefault();
                                     if (!conversationInput.trim())
                                         return;
                                     loadConversation(conversationInput.trim());
-                                }, children: [_jsx(Input, { label: labels.conversationId ?? "Conversation ID", value: conversationInput, onChange: (event) => setConversationInput(event.target.value), placeholder: "conv_..." }), _jsx(Button, { type: "submit", variant: "secondary", size: "sm", className: "w-full", children: labels.loadConversation ?? "Load conversation" })] }), historyQuery.error ? (_jsx(Alert, { variant: "warning", title: "History unavailable", children: historyQuery.error instanceof Error ? historyQuery.error.message : "Could not load history" })) : null, _jsxs(Div, { className: "max-h-72 overflow-y-auto space-y-2", children: [(historyQuery.data?.messages ?? []).map((log, index) => (_jsxs(Div, { className: "rounded-lg border border-neutral-200 dark:border-slate-700 p-2", children: [_jsx(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: new Date(log.createdAt).toLocaleString() }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3}`, children: ["Q: ", log.prompt] }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3} text-neutral-600 dark:text-zinc-300`, children: ["A: ", log.response] })] }, `${log.createdAt}-${index}`))), !historyQuery.isLoading && (historyQuery.data?.messages?.length ?? 0) === 0 ? (_jsx(Text, { variant: "secondary", className: "text-sm", children: "No server history found for this conversation yet." })) : null] })] })] }),
+                                }, children: [_jsx(Input, { label: labels.conversationId ?? LBL_CONVERSATION_ID, value: conversationInput, onChange: (event) => setConversationInput(event.target.value), placeholder: "conv_..." }), _jsx(Button, { type: "submit", variant: "secondary", size: "sm", className: "w-full", children: labels.loadConversation ?? "Load conversation" })] }), historyQuery.error ? (_jsx(Alert, { variant: "warning", title: "History unavailable", children: historyQuery.error instanceof Error ? historyQuery.error.message : "Could not load history" })) : null, _jsxs(Div, { className: "max-h-72 overflow-y-auto space-y-2", children: [(historyQuery.data?.messages ?? []).map((log, index) => (_jsxs(Div, { className: "rounded-lg border border-neutral-200 dark:border-slate-700 p-2", children: [_jsx(Text, { className: "text-xs font-medium text-neutral-500 dark:text-zinc-400", children: new Date(log.createdAt).toLocaleString() }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3}`, children: ["Q: ", log.prompt] }), _jsxs(Text, { className: `text-sm mt-1 ${THEME_CONSTANTS.utilities.textClamp3} text-neutral-600 dark:text-zinc-300`, children: ["A: ", log.response] })] }, `${log.createdAt}-${index}`))), !historyQuery.isLoading && (historyQuery.data?.messages?.length ?? 0) === 0 ? (_jsx(Text, { variant: "secondary", className: "text-sm", children: "No server history found for this conversation yet." })) : null] })] })] }),
         ] }));
 }