@mohasinac/appkit 2.7.23 → 2.7.25

package/dist/features/admin/components/DataTable.js

@@ -35,7 +35,7 @@ function SelectableRow({ row, columns, isSelected, onToggle, renderRowActions, o
         }
         : undefined;
     const isInteractive = Boolean(onRowClick ?? rowHref);
-    return (_jsxs("tr", { onClick: handleClick, onKeyDown: handleKeyDown, role: isInteractive ? "link" : undefined, tabIndex: isInteractive ? 0 : undefined, onMouseDown: selectionEnabled && !isSelected ? longPress.onMouseDown : undefined, onMouseUp: selectionEnabled && !isSelected ? longPress.onMouseUp : undefined, onMouseLeave: selectionEnabled && !isSelected ? longPress.onMouseLeave : undefined, onTouchStart: selectionEnabled && !isSelected ? longPress.onTouchStart : undefined, onTouchEnd: selectionEnabled && !isSelected ? longPress.onTouchEnd : undefined, className: `border-b border-neutral-100 dark:border-slate-700 hover:bg-neutral-50 dark:hover:bg-slate-800 ${isInteractive ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5 dark:bg-primary/10" : ""}`, children: [selectionEnabled && (_jsx("td", { className: "relative w-10 px-2 py-3", onClick: (e) => e.stopPropagation(), children: _jsx(BaseListingCard.Checkbox, { selected: isSelected, onSelect: (e) => { e.preventDefault(); onToggle?.(row.id, !isSelected); }, label: isSelected ? "Deselect row" : "Select row", position: "top-1/2 left-2 -translate-y-1/2" }) })), columns.map((col) => (_jsx("td", { className: `px-4 py-3 text-neutral-700 dark:text-zinc-300 ${col.className ?? ""}`, children: col.render
+    return (_jsxs("tr", { "data-testid": "data-table-row", onClick: handleClick, onKeyDown: handleKeyDown, role: isInteractive ? "link" : undefined, tabIndex: isInteractive ? 0 : undefined, onMouseDown: selectionEnabled && !isSelected ? longPress.onMouseDown : undefined, onMouseUp: selectionEnabled && !isSelected ? longPress.onMouseUp : undefined, onMouseLeave: selectionEnabled && !isSelected ? longPress.onMouseLeave : undefined, onTouchStart: selectionEnabled && !isSelected ? longPress.onTouchStart : undefined, onTouchEnd: selectionEnabled && !isSelected ? longPress.onTouchEnd : undefined, className: `border-b border-neutral-100 dark:border-slate-700 hover:bg-neutral-50 dark:hover:bg-slate-800 ${isInteractive ? "cursor-pointer" : ""} ${isSelected ? "bg-primary/5 dark:bg-primary/10" : ""}`, children: [selectionEnabled && (_jsx("td", { className: "relative w-10 px-2 py-3", onClick: (e) => e.stopPropagation(), children: _jsx(BaseListingCard.Checkbox, { selected: isSelected, onSelect: (e) => { e.preventDefault(); onToggle?.(row.id, !isSelected); }, label: isSelected ? "Deselect row" : "Select row", position: "top-1/2 left-2 -translate-y-1/2", "data-testid": "row-checkbox" }) })), columns.map((col) => (_jsx("td", { className: `px-4 py-3 text-neutral-700 dark:text-zinc-300 ${col.className ?? ""}`, children: col.render
                     ? col.render(row)
                     : String(row[col.key] ?? "") }, col.key))), renderRowActions && (_jsx("td", { className: "px-2 py-3", onClick: (e) => e.stopPropagation(), children: renderRowActions(row) }))] }));
 }
@@ -43,5 +43,5 @@ export function DataTable({ columns: columnsProp, rows, isLoading, sortKey, sort
     const columns = (columnsProp ?? DEFAULT_COLUMNS);
     const selectionEnabled = Boolean(onToggleSelect);
     const allRowsSelected = selectionEnabled && rows.length > 0 && rows.every((r) => selectedIds?.has(r.id));
-    return (_jsxs(Div, { className: "overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900", children: [_jsx(Div, { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "border-b border-neutral-200 dark:border-slate-700 bg-neutral-50 dark:bg-slate-800", children: [selectionEnabled && (_jsx("th", { scope: "col", className: "w-10 px-2 py-3", children: onToggleSelectAll && (_jsx("input", { type: "checkbox", "aria-label": allRowsSelected ? "Deselect all" : "Select all", checked: allRowsSelected, onChange: () => onToggleSelectAll(!allRowsSelected), className: "h-4 w-4 rounded border-zinc-300 dark:border-slate-600 accent-zinc-900 dark:accent-zinc-100" })) })), columns.map((col) => (_jsxs("th", { scope: "col", onClick: col.sortable && onSort ? () => onSort(col.key) : undefined, className: `px-4 py-3 text-left font-semibold text-neutral-900 dark:text-zinc-100 ${col.sortable && onSort ? "cursor-pointer select-none hover:text-primary" : ""} ${col.className ?? ""}`, children: [col.header, col.sortable && sortKey === col.key && (_jsx(Span, { className: "ml-1", children: sortDir === "asc" ? "↑" : "↓" }))] }, col.key))), renderRowActions && _jsx("th", { scope: "col", className: "w-12 px-2 py-3" })] }) }), _jsx("tbody", { children: isLoading ? (Array.from({ length: 5 }).map((_, i) => (_jsxs("tr", { className: "border-b border-neutral-100 dark:border-slate-700", children: [selectionEnabled && _jsx("td", { className: "w-10 px-2 py-3" }), columns.map((col) => (_jsx("td", { className: "px-4 py-3", children: _jsx(Div, { className: "h-4 w-full animate-pulse rounded bg-neutral-200 dark:bg-slate-700" }) }, col.key)))] }, i)))) : rows.length === 0 ? (_jsx("tr", { children: _jsx("td", { colSpan: columns.length + (selectionEnabled ? 1 : 0) + (renderRowActions ? 1 : 0), className: "px-4 py-12 text-center text-neutral-500 dark:text-zinc-400", children: emptyLabel }) })) : (rows.map((row) => (_jsx(SelectableRow, { row: row, columns: columns, isSelected: selectedIds?.has(row.id) ?? false, onToggle: onToggleSelect, renderRowActions: renderRowActions, onRowClick: onRowClick, rowHref: getRowHref?.(row), selectionEnabled: selectionEnabled }, row.id)))) })] }) }), totalPages > 1 && onPageChange && (_jsx(Div, { className: "flex items-center justify-end gap-2 border-t border-neutral-200 dark:border-slate-700 px-4 py-3", children: Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (_jsx(Button, { onClick: () => onPageChange(p), variant: p === currentPage ? "primary" : "ghost", size: "sm", className: `h-8 w-8 rounded text-xs font-medium transition ${p === currentPage ? "bg-neutral-900 text-white" : "text-neutral-600 dark:text-zinc-300 hover:bg-neutral-100 dark:hover:bg-slate-800"}`, children: p }, p))) }))] }));
+    return (_jsxs(Div, { className: "overflow-hidden rounded-xl border border-neutral-200 dark:border-slate-700 bg-white dark:bg-slate-900", children: [_jsx(Div, { className: "overflow-x-auto", children: _jsxs("table", { "data-testid": "data-table", className: "w-full text-sm", children: [_jsx("thead", { children: _jsxs("tr", { className: "border-b border-neutral-200 dark:border-slate-700 bg-neutral-50 dark:bg-slate-800", children: [selectionEnabled && (_jsx("th", { scope: "col", className: "w-10 px-2 py-3", children: onToggleSelectAll && (_jsx("input", { type: "checkbox", "data-testid": "select-all-checkbox", "aria-label": allRowsSelected ? "Deselect all" : "Select all", checked: allRowsSelected, onChange: () => onToggleSelectAll(!allRowsSelected), className: "h-4 w-4 rounded border-zinc-300 dark:border-slate-600 accent-zinc-900 dark:accent-zinc-100" })) })), columns.map((col) => (_jsxs("th", { scope: "col", onClick: col.sortable && onSort ? () => onSort(col.key) : undefined, className: `px-4 py-3 text-left font-semibold text-neutral-900 dark:text-zinc-100 ${col.sortable && onSort ? "cursor-pointer select-none hover:text-primary" : ""} ${col.className ?? ""}`, children: [col.header, col.sortable && sortKey === col.key && (_jsx(Span, { className: "ml-1", children: sortDir === "asc" ? "↑" : "↓" }))] }, col.key))), renderRowActions && _jsx("th", { scope: "col", className: "w-12 px-2 py-3" })] }) }), _jsx("tbody", { children: isLoading ? (Array.from({ length: 5 }).map((_, i) => (_jsxs("tr", { className: "border-b border-neutral-100 dark:border-slate-700", children: [selectionEnabled && _jsx("td", { className: "w-10 px-2 py-3" }), columns.map((col) => (_jsx("td", { className: "px-4 py-3", children: _jsx(Div, { className: "h-4 w-full animate-pulse rounded bg-neutral-200 dark:bg-slate-700" }) }, col.key)))] }, i)))) : rows.length === 0 ? (_jsx("tr", { children: _jsx("td", { colSpan: columns.length + (selectionEnabled ? 1 : 0) + (renderRowActions ? 1 : 0), className: "px-4 py-12 text-center text-neutral-500 dark:text-zinc-400", children: emptyLabel }) })) : (rows.map((row) => (_jsx(SelectableRow, { row: row, columns: columns, isSelected: selectedIds?.has(row.id) ?? false, onToggle: onToggleSelect, renderRowActions: renderRowActions, onRowClick: onRowClick, rowHref: getRowHref?.(row), selectionEnabled: selectionEnabled }, row.id)))) })] }) }), totalPages > 1 && onPageChange && (_jsx(Div, { className: "flex items-center justify-end gap-2 border-t border-neutral-200 dark:border-slate-700 px-4 py-3", children: Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (_jsx(Button, { onClick: () => onPageChange(p), variant: p === currentPage ? "primary" : "ghost", size: "sm", className: `h-8 w-8 rounded text-xs font-medium transition ${p === currentPage ? "bg-neutral-900 text-white" : "text-neutral-600 dark:text-zinc-300 hover:bg-neutral-100 dark:hover:bg-slate-800"}`, children: p }, p))) }))] }));
 }

package/dist/features/auth/consent-otp.js

@@ -106,14 +106,14 @@ export async function patchConsentOtp(uid, addressId, data) {
 export function buildConsentOtpEmail(recipientName, code, siteName) {
     return {
         subject: `${siteName}: Consent verification code - shipping to ${recipientName}`,
-        html: `
-      <div style="font-family:sans-serif;max-width:480px;margin:0 auto;padding:24px">
-        <h2 style="margin-bottom:8px">Third-Party Shipping Consent</h2>
-        <p style="color:#555">You are about to place an order that will be shipped to <strong>${escapeHtml(recipientName)}</strong>.</p>
-        <p style="color:#555">Enter this code to confirm your consent:</p>
-        <div style="font-size:36px;font-weight:bold;letter-spacing:8px;text-align:center;margin:24px 0;padding:16px;background:#f3f4f6;border-radius:8px">${code}</div>
-        <p style="color:#888;font-size:12px">This code expires in ${CONSENT_OTP_EXPIRY_MINUTES} minutes. If you did not request this, please ignore this email.</p>
-      </div>
+        html: `
+      <div style="font-family:sans-serif;max-width:480px;margin:0 auto;padding:24px">
+        <h2 style="margin-bottom:8px">Third-Party Shipping Consent</h2>
+        <p style="color:#555">You are about to place an order that will be shipped to <strong>${escapeHtml(recipientName)}</strong>.</p>
+        <p style="color:#555">Enter this code to confirm your consent:</p>
+        <div style="font-size:36px;font-weight:bold;letter-spacing:8px;text-align:center;margin:24px 0;padding:16px;background:#f3f4f6;border-radius:8px">${code}</div>
+        <p style="color:#888;font-size:12px">This code expires in ${CONSENT_OTP_EXPIRY_MINUTES} minutes. If you did not request this, please ignore this email.</p>
+      </div>
     `,
     };
 }

package/dist/features/auth/permissions/constants.d.ts

@@ -11,7 +11,7 @@
  * Permission naming: admin:resource:action
  * Ban action naming: plain verb phrase — write_reviews, place_bids, etc.
  */
-export type Permission = "admin:dashboard:view" | "admin:users:read" | "admin:users:write" | "admin:users:delete" | "admin:user-bans:read" | "admin:user-bans:write" | "admin:products:read" | "admin:products:write" | "admin:products:delete" | "admin:orders:read" | "admin:orders:write" | "admin:returns:read" | "admin:returns:write" | "admin:stores:read" | "admin:stores:write" | "admin:store-addresses:read" | "admin:analytics:view" | "admin:payouts:read" | "admin:payouts:write" | "admin:categories:read" | "admin:categories:write" | "admin:categories:delete" | "admin:brands:read" | "admin:brands:write" | "admin:brands:delete" | "admin:coupons:read" | "admin:coupons:write" | "admin:coupons:delete" | "admin:deals:read" | "admin:deals:write" | "admin:featured:read" | "admin:featured:write" | "admin:reviews:read" | "admin:reviews:write" | "admin:reviews:delete" | "admin:blog:read" | "admin:blog:write" | "admin:blog:delete" | "admin:blog:publish" | "admin:bids:read" | "admin:bids:write" | "admin:media:read" | "admin:media:write" | "admin:media:delete" | "admin:site:read" | "admin:site:write" | "admin:navigation:read" | "admin:navigation:write" | "admin:sections:read" | "admin:sections:write" | "admin:carousel:read" | "admin:carousel:write" | "admin:carousel:delete" | "admin:ads:read" | "admin:ads:write" | "admin:ads:delete" | "admin:faqs:read" | "admin:faqs:write" | "admin:faqs:delete" | "admin:newsletter:read" | "admin:newsletter:write" | "admin:contact:read" | "admin:events:read" | "admin:events:write" | "admin:events:delete" | "admin:event-entries:read" | "admin:event-entries:write" | "admin:support-tickets:read" | "admin:support-tickets:write" | "admin:support-tickets:assign" | "admin:support-tickets:close" | "admin:scammers:read" | "admin:scammers:write" | "admin:scammers:verify" | "admin:scammers:delete" | "admin:sessions:read" | "admin:sessions:delete" | "admin:notifications:read" | "admin:notifications:write" | "admin:carts:read" | "admin:wishlists:read" | "admin:feature-flags:read" | "admin:feature-flags:write" | "admin:copilot:view" | "admin:team:read" | "admin:team:write";
+export type Permission = "admin:dashboard:view" | "admin:users:read" | "admin:users:write" | "admin:users:delete" | "admin:user-bans:read" | "admin:user-bans:write" | "admin:products:read" | "admin:products:write" | "admin:products:delete" | "admin:orders:read" | "admin:orders:write" | "admin:returns:read" | "admin:returns:write" | "admin:stores:read" | "admin:stores:write" | "admin:store-addresses:read" | "admin:analytics:view" | "admin:payouts:read" | "admin:payouts:write" | "admin:categories:read" | "admin:categories:write" | "admin:categories:delete" | "admin:brands:read" | "admin:brands:write" | "admin:brands:delete" | "admin:coupons:read" | "admin:coupons:write" | "admin:coupons:delete" | "admin:deals:read" | "admin:deals:write" | "admin:featured:read" | "admin:featured:write" | "admin:reviews:read" | "admin:reviews:write" | "admin:reviews:delete" | "admin:blog:read" | "admin:blog:write" | "admin:blog:delete" | "admin:blog:publish" | "admin:bids:read" | "admin:bids:write" | "admin:media:read" | "admin:media:write" | "admin:media:delete" | "admin:site:read" | "admin:site:write" | "admin:settings:write" | "admin:navigation:read" | "admin:navigation:write" | "admin:sections:read" | "admin:sections:write" | "admin:carousel:read" | "admin:carousel:write" | "admin:carousel:delete" | "admin:ads:read" | "admin:ads:write" | "admin:ads:delete" | "admin:faqs:read" | "admin:faqs:write" | "admin:faqs:delete" | "admin:newsletter:read" | "admin:newsletter:write" | "admin:contact:read" | "admin:events:read" | "admin:events:write" | "admin:events:delete" | "admin:event-entries:read" | "admin:event-entries:write" | "admin:support-tickets:read" | "admin:support-tickets:write" | "admin:support-tickets:assign" | "admin:support-tickets:close" | "admin:scammers:read" | "admin:scammers:write" | "admin:scammers:verify" | "admin:scammers:delete" | "admin:sessions:read" | "admin:sessions:delete" | "admin:notifications:read" | "admin:notifications:write" | "admin:carts:read" | "admin:wishlists:read" | "admin:feature-flags:read" | "admin:feature-flags:write" | "admin:copilot:view" | "admin:team:read" | "admin:team:write";
 /**
  * Granular user actions that can be soft-banned individually.
  * A user may have multiple simultaneous soft bans of different types.

package/dist/features/auth/permissions/constants.js

@@ -112,6 +112,7 @@ export const PERMISSION_GROUPS = {
         "admin:dashboard:view",
         "admin:site:read",
         "admin:site:write",
+        "admin:settings:write",
         "admin:navigation:read",
         "admin:navigation:write",
         "admin:sections:read",
@@ -268,6 +269,7 @@ export const ROUTE_PERMISSION_MAP = {
     "/admin/bids": "admin:bids:read",
     "/admin/media": "admin:media:read",
     "/admin/site": "admin:site:read",
+    "/admin/settings": "admin:settings:write",
     "/admin/navigation": "admin:navigation:read",
     "/admin/sections": "admin:sections:read",
     "/admin/carousel": "admin:carousel:read",

package/dist/features/before-after/messages/en.json

@@ -1,8 +1,8 @@
-{
-    "title": "Real Results",
-    "subtitle": "See the transformation with our Ayurvedic products",
-    "labelBefore": "Before",
-    "labelAfter": "After",
-    "weeks": "{count} weeks",
-    "noItems": "No transformation stories yet"
+{
+    "title": "Real Results",
+    "subtitle": "See the transformation with our Ayurvedic products",
+    "labelBefore": "Before",
+    "labelAfter": "After",
+    "weeks": "{count} weeks",
+    "noItems": "No transformation stories yet"
 }

package/dist/features/collections/messages/en.json

@@ -1,10 +1,10 @@
-{
-    "collections": {
-        "title": "Collections",
-        "subtitle": "Shop by collection",
-        "viewAll": "View all collections",
-        "items": "{count} items",
-        "empty": "No collections found.",
-        "notFound": "Collection not found."
-    }
+{
+    "collections": {
+        "title": "Collections",
+        "subtitle": "Shop by collection",
+        "viewAll": "View all collections",
+        "items": "{count} items",
+        "empty": "No collections found.",
+        "notFound": "Collection not found."
+    }
 }

package/dist/features/consultation/messages/en.json

@@ -1,25 +1,25 @@
-{
-    "title": "Book a Consultation",
-    "subtitle": "Get personalised Ayurvedic guidance",
-    "form": {
-        "name": "Full name",
-        "email": "Email address",
-        "phone": "Phone number",
-        "preferredDate": "Preferred date",
-        "preferredTime": "Preferred time",
-        "mode": "Consultation mode",
-        "modeRemote": "Remote (Video Call)",
-        "modeInPerson": "In-Person",
-        "message": "Additional notes (optional)",
-        "submit": "Book Consultation",
-        "submitting": "Booking..."
-    },
-    "status": {
-        "pending": "Pending",
-        "confirmed": "Confirmed",
-        "completed": "Completed",
-        "cancelled": "Cancelled"
-    },
-    "success": "Your consultation has been booked. We\u2019ll confirm shortly.",
-    "error": "Failed to book consultation. Please try again."
+{
+    "title": "Book a Consultation",
+    "subtitle": "Get personalised Ayurvedic guidance",
+    "form": {
+        "name": "Full name",
+        "email": "Email address",
+        "phone": "Phone number",
+        "preferredDate": "Preferred date",
+        "preferredTime": "Preferred time",
+        "mode": "Consultation mode",
+        "modeRemote": "Remote (Video Call)",
+        "modeInPerson": "In-Person",
+        "message": "Additional notes (optional)",
+        "submit": "Book Consultation",
+        "submitting": "Booking..."
+    },
+    "status": {
+        "pending": "Pending",
+        "confirmed": "Confirmed",
+        "completed": "Completed",
+        "cancelled": "Cancelled"
+    },
+    "success": "Your consultation has been booked. We\u2019ll confirm shortly.",
+    "error": "Failed to book consultation. Please try again."
 }

package/dist/features/contact/email.js

@@ -81,34 +81,34 @@ export async function sendOrderConfirmationEmail(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>
+        ? `
+        <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>
+            .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>
+            .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>
+          <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 itemsText = items && items.length > 1
         ? items
@@ -119,88 +119,88 @@ export async function sendOrderConfirmationEmail(params) {
         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>
+            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>
+                          <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>
+                : 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>
       `,
             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}`,
         });
@@ -224,27 +224,27 @@ export async function sendContactEmail(params) {
             to: supportEmail,
             replyTo: email,
             subject: `[Contact] ${subject}`,
-            html: `
-        <!DOCTYPE html>
-        <html>
-        <head><meta charset="utf-8"><title>Contact Form</title></head>
-        <body style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; padding: 40px 0;">
-          <table width="600" style="margin: 0 auto; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
-            <tr><td style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 32px; text-align: center;">
-              <h1 style="color: #fff; margin: 0; font-size: 24px;">New Contact Message</h1>
-            </td></tr>
-            <tr><td style="padding: 32px;">
-              <p><strong>From:</strong> ${name} &lt;${email}&gt;</p>
-              <p><strong>Subject:</strong> ${subject}</p>
-              <hr style="border: none; border-top: 1px solid #eee; margin: 16px 0;">
-              <p style="white-space: pre-wrap;">${message}</p>
-            </td></tr>
-            <tr><td style="background: #f9f9f9; padding: 16px; text-align: center; color: #888; font-size: 12px;">
-              © ${currentYear()} ${siteName}
-            </td></tr>
-          </table>
-        </body>
-        </html>
+            html: `
+        <!DOCTYPE html>
+        <html>
+        <head><meta charset="utf-8"><title>Contact Form</title></head>
+        <body style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; padding: 40px 0;">
+          <table width="600" style="margin: 0 auto; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
+            <tr><td style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); padding: 32px; text-align: center;">
+              <h1 style="color: #fff; margin: 0; font-size: 24px;">New Contact Message</h1>
+            </td></tr>
+            <tr><td style="padding: 32px;">
+              <p><strong>From:</strong> ${name} &lt;${email}&gt;</p>
+              <p><strong>Subject:</strong> ${subject}</p>
+              <hr style="border: none; border-top: 1px solid #eee; margin: 16px 0;">
+              <p style="white-space: pre-wrap;">${message}</p>
+            </td></tr>
+            <tr><td style="background: #f9f9f9; padding: 16px; text-align: center; color: #888; font-size: 12px;">
+              © ${currentYear()} ${siteName}
+            </td></tr>
+          </table>
+        </body>
+        </html>
       `,
             text: `From: ${name} <${email}>\nSubject: ${subject}\n\n${message}`,
         });
@@ -271,59 +271,59 @@ export async function sendSiteSettingsChangedEmail(params) {
         const { data, error } = await sendConfiguredEmail({
             to: adminEmails,
             subject: `Site settings updated by ${changedByEmail}`,
-            html: `
-        <!DOCTYPE html>
-        <html>
-        <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"></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:24px;font-weight:600;">Site Settings Changed</h1>
-                    <p style="color:#d1fae5;margin:8px 0 0;font-size:14px;">${timestamp}</p>
-                  </td>
-                </tr>
-                <tr>
-                  <td style="padding:40px;">
-                    <p style="color:#333;font-size:16px;line-height:1.6;margin:0 0 20px;">
-                      <strong>${changedByEmail}</strong> has updated the following site settings:
-                    </p>
-                    <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background:#f8f9fa;border-radius:8px;margin:0 0 24px;">
-                      <tr>
-                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed Fields</td>
-                        <td style="color:#111827;font-size:14px;">${changedFields.map((field) => `<code style="background:#e5e7eb;padding:2px 6px;border-radius:3px;">${field}</code>`).join("&ensp;")}</td>
-                      </tr>
-                      <tr>
-                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed By</td>
-                        <td style="color:#111827;font-size:14px;">${changedByEmail}</td>
-                      </tr>
-                      <tr>
-                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Timestamp</td>
-                        <td style="color:#111827;font-size:14px;">${timestamp}</td>
-                      </tr>
-                    </table>
-                    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin:24px 0;">
-                      <tr><td align="center">
-                        <a href="${settingsUrl}" 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:15px;font-weight:600;">
-                          View Settings
-                        </a>
-                      </td></tr>
-                    </table>
-                  </td>
-                </tr>
-                <tr>
-                  <td style="background-color:#f8f9fa;padding:24px;text-align:center;border-top:1px solid #eeeeee;">
-                    <p style="color:#9ca3af;font-size:12px;margin:0;">© ${currentYear()} ${siteName}. Automated notification — do not reply.</p>
-                  </td>
-                </tr>
-              </table>
-            </td></tr>
-          </table>
-        </body>
-        </html>
+            html: `
+        <!DOCTYPE html>
+        <html>
+        <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1.0"></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:24px;font-weight:600;">Site Settings Changed</h1>
+                    <p style="color:#d1fae5;margin:8px 0 0;font-size:14px;">${timestamp}</p>
+                  </td>
+                </tr>
+                <tr>
+                  <td style="padding:40px;">
+                    <p style="color:#333;font-size:16px;line-height:1.6;margin:0 0 20px;">
+                      <strong>${changedByEmail}</strong> has updated the following site settings:
+                    </p>
+                    <table width="100%" cellpadding="12" cellspacing="0" border="0" style="background:#f8f9fa;border-radius:8px;margin:0 0 24px;">
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed Fields</td>
+                        <td style="color:#111827;font-size:14px;">${changedFields.map((field) => `<code style="background:#e5e7eb;padding:2px 6px;border-radius:3px;">${field}</code>`).join("&ensp;")}</td>
+                      </tr>
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Changed By</td>
+                        <td style="color:#111827;font-size:14px;">${changedByEmail}</td>
+                      </tr>
+                      <tr>
+                        <td style="color:#6b7280;font-size:13px;font-weight:600;text-transform:uppercase;">Timestamp</td>
+                        <td style="color:#111827;font-size:14px;">${timestamp}</td>
+                      </tr>
+                    </table>
+                    <table width="100%" cellpadding="0" cellspacing="0" border="0" style="margin:24px 0;">
+                      <tr><td align="center">
+                        <a href="${settingsUrl}" 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:15px;font-weight:600;">
+                          View Settings
+                        </a>
+                      </td></tr>
+                    </table>
+                  </td>
+                </tr>
+                <tr>
+                  <td style="background-color:#f8f9fa;padding:24px;text-align:center;border-top:1px solid #eeeeee;">
+                    <p style="color:#9ca3af;font-size:12px;margin:0;">© ${currentYear()} ${siteName}. Automated notification — do not reply.</p>
+                  </td>
+                </tr>
+              </table>
+            </td></tr>
+          </table>
+        </body>
+        </html>
       `,
             text: `Site settings updated by ${changedByEmail}\n\nChanged fields: ${changedFields.join(", ")}\n\nView at: ${settingsUrl}`,
         });