@burdenoff/microfe-adaptercloud 2026.614.1 → 2026.625.1

package/dist/adaptercloud/pages/common/NotificationCenterPage.js

@@ -172,69 +172,69 @@ var M = [
 ], N = {
 	order_update: {
 		icon: x,
-		color: "text-blue-600 dark:text-blue-400",
-		bg: "bg-blue-500/10",
+		color: "text-accent-blue",
+		bg: "bg-accent-blue-subtle/10",
 		label: "Order"
 	},
 	payment: {
 		icon: h,
-		color: "text-green-600 dark:text-green-400",
-		bg: "bg-green-500/10",
+		color: "text-status-success-text",
+		bg: "bg-status-success-bg-subtle/10",
 		label: "Payment"
 	},
 	promotion: {
 		icon: v,
-		color: "text-orange-600 dark:text-orange-400",
-		bg: "bg-orange-500/10",
+		color: "text-accent-orange",
+		bg: "bg-accent-orange-subtle/10",
 		label: "Promo"
 	},
 	system: {
 		icon: c,
-		color: "text-purple-600 dark:text-purple-400",
-		bg: "bg-purple-500/10",
+		color: "text-accent-purple",
+		bg: "bg-accent-purple-subtle/10",
 		label: "System"
 	},
 	review: {
 		icon: S,
-		color: "text-yellow-600 dark:text-yellow-400",
-		bg: "bg-yellow-500/10",
+		color: "text-status-warning-text",
+		bg: "bg-status-warning-bg-subtle/10",
 		label: "Review"
 	},
 	staff: {
 		icon: D,
-		color: "text-indigo-600 dark:text-indigo-400",
-		bg: "bg-indigo-500/10",
+		color: "text-accent-indigo",
+		bg: "bg-accent-indigo-subtle/10",
 		label: "Staff"
 	},
 	investment: {
 		icon: w,
-		color: "text-emerald-600 dark:text-emerald-400",
-		bg: "bg-emerald-500/10",
+		color: "text-status-success-text",
+		bg: "bg-status-success-bg-subtle/10",
 		label: "Investment"
 	},
 	alert: {
 		icon: l,
-		color: "text-red-600 dark:text-red-400",
-		bg: "bg-red-500/10",
+		color: "text-status-error-text",
+		bg: "bg-status-error-bg-subtle/10",
 		label: "Alert"
 	},
 	delivery: {
 		icon: T,
-		color: "text-cyan-600 dark:text-cyan-400",
-		bg: "bg-cyan-500/10",
+		color: "text-accent-cyan",
+		bg: "bg-accent-cyan-subtle/10",
 		label: "Delivery"
 	},
 	account: {
 		icon: E,
-		color: "text-teal-600 dark:text-teal-400",
-		bg: "bg-teal-500/10",
+		color: "text-accent-teal",
+		bg: "bg-accent-teal-subtle/10",
 		label: "Account"
 	}
 }, P = {
-	urgent: "bg-red-500/20 text-red-600 dark:text-red-400",
-	high: "bg-orange-500/20 text-orange-600 dark:text-orange-400",
-	medium: "bg-blue-500/20 text-blue-600 dark:text-blue-400",
-	low: "bg-muted text-muted-foreground"
+	urgent: "bg-status-error-bg-subtle/20 text-status-error-text",
+	high: "bg-accent-orange-subtle/20 text-accent-orange",
+	medium: "bg-accent-blue-subtle/20 text-accent-blue",
+	low: "bg-bg-sunken text-text-secondary"
 }, F = {
 	urgent: "border-l-red-500",
 	high: "border-l-orange-500",
@@ -371,7 +371,7 @@ function B() {
 			children: [l.length > 0 && /* @__PURE__ */ j("button", {
 				type: "button",
 				onClick: Z,
-				className: "flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 text-sm font-medium text-muted-foreground hover:text-foreground hover:bg-accent transition-colors",
+				className: "flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:bg-accent transition-colors",
 				children: [/* @__PURE__ */ A(C, { className: "h-4 w-4" }), /* @__PURE__ */ A("span", {
 					className: "hidden sm:inline",
 					children: "Clear All"
@@ -379,7 +379,7 @@ function B() {
 			}), B > 0 && /* @__PURE__ */ j("button", {
 				type: "button",
 				onClick: J,
-				className: "flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+				className: "flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
 				children: [/* @__PURE__ */ A(p, { className: "h-4 w-4" }), "Mark All Read"]
 			})]
 		}),
@@ -388,52 +388,52 @@ function B() {
 				className: "grid grid-cols-2 gap-3 sm:grid-cols-5 mb-6",
 				children: [
 					/* @__PURE__ */ j("div", {
-						className: "rounded-lg border border-border bg-card p-3 text-center",
+						className: "rounded-lg border border-border-subtle bg-bg-surface p-3 text-center",
 						children: [/* @__PURE__ */ A("p", {
-							className: "text-2xl font-bold text-foreground",
+							className: "text-2xl font-bold text-text-primary",
 							children: l.length
 						}), /* @__PURE__ */ A("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Total"
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-lg border border-blue-500/30 bg-blue-500/5 p-3 text-center",
+						className: "rounded-lg border border-accent-blue-subtle/30 bg-accent-blue-subtle/5 p-3 text-center",
 						children: [/* @__PURE__ */ A("p", {
-							className: "text-2xl font-bold text-blue-600 dark:text-blue-400",
+							className: "text-2xl font-bold text-accent-blue",
 							children: B
 						}), /* @__PURE__ */ A("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Unread"
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-lg border border-red-500/30 bg-red-500/5 p-3 text-center",
+						className: "rounded-lg border border-status-error-border/30 bg-status-error-bg-subtle/5 p-3 text-center",
 						children: [/* @__PURE__ */ A("p", {
-							className: "text-2xl font-bold text-red-600 dark:text-red-400",
+							className: "text-2xl font-bold text-status-error-text",
 							children: V
 						}), /* @__PURE__ */ A("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Urgent"
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-lg border border-green-500/30 bg-green-500/5 p-3 text-center",
+						className: "rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/5 p-3 text-center",
 						children: [/* @__PURE__ */ A("p", {
-							className: "text-2xl font-bold text-green-600 dark:text-green-400",
+							className: "text-2xl font-bold text-status-success-text",
 							children: H
 						}), /* @__PURE__ */ A("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "Today"
 						})]
 					}),
 					/* @__PURE__ */ j("div", {
-						className: "rounded-lg border border-yellow-500/30 bg-yellow-500/5 p-3 text-center",
+						className: "rounded-lg border border-status-warning-border/30 bg-status-warning-bg-subtle/5 p-3 text-center",
 						children: [/* @__PURE__ */ A("p", {
-							className: "text-2xl font-bold text-yellow-600 dark:text-yellow-400",
+							className: "text-2xl font-bold text-status-warning-text",
 							children: U
 						}), /* @__PURE__ */ A("p", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: "This Week"
 						})]
 					})
@@ -446,12 +446,12 @@ function B() {
 					return /* @__PURE__ */ j("button", {
 						type: "button",
 						onClick: () => v(e.id),
-						className: t("flex items-center gap-1.5 whitespace-nowrap rounded-full border px-3 py-1.5 text-sm font-medium transition-colors", g === e.id ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground hover:border-accent-foreground/20"),
+						className: t("flex items-center gap-1.5 whitespace-nowrap rounded-full border px-3 py-1.5 text-sm font-medium transition-colors", g === e.id ? "border-primary bg-action-primary-bg/10 text-text-primary" : "border-border-subtle text-text-secondary hover:text-text-primary hover:border-accent-foreground/20"),
 						children: [
 							/* @__PURE__ */ A(n, { className: "h-3.5 w-3.5" }),
 							e.label,
 							/* @__PURE__ */ A("span", {
-								className: t("inline-flex h-5 min-w-[20px] items-center justify-center rounded-full px-1 text-xs", g === e.id ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"),
+								className: t("inline-flex h-5 min-w-[20px] items-center justify-center rounded-full px-1 text-xs", g === e.id ? "bg-action-primary-bg text-action-primary-text" : "bg-bg-sunken text-text-secondary"),
 								children: W[e.id]
 							})
 						]
@@ -463,18 +463,18 @@ function B() {
 				children: [/* @__PURE__ */ j("div", {
 					className: "relative flex-1",
 					children: [
-						/* @__PURE__ */ A(b, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+						/* @__PURE__ */ A(b, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }),
 						/* @__PURE__ */ A("input", {
 							type: "text",
 							placeholder: "Search notifications...",
 							value: x,
 							onChange: (e) => S(e.target.value),
-							className: "w-full rounded-lg border border-border bg-card py-2.5 pl-10 pr-9 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+							className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2.5 pl-10 pr-9 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 						}),
 						x && /* @__PURE__ */ A("button", {
 							type: "button",
 							onClick: () => S(""),
-							className: "absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+							className: "absolute right-3 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary",
 							children: /* @__PURE__ */ A(O, { className: "h-4 w-4" })
 						})
 					]
@@ -483,7 +483,7 @@ function B() {
 					children: [/* @__PURE__ */ j("button", {
 						type: "button",
 						onClick: () => D(!E),
-						className: "flex items-center gap-1.5 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+						className: "flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
 						children: [/* @__PURE__ */ A(u, { className: "h-4 w-4" }), /* @__PURE__ */ A("span", {
 							className: "hidden sm:inline",
 							children: "Sort"
@@ -492,7 +492,7 @@ function B() {
 						className: "fixed inset-0 z-10",
 						onClick: () => D(!1)
 					}), /* @__PURE__ */ A("div", {
-						className: "absolute right-0 top-full mt-1 z-20 w-44 rounded-lg border border-border bg-card shadow-lg py-1",
+						className: "absolute right-0 top-full mt-1 z-20 w-44 rounded-lg border border-border-subtle bg-bg-surface shadow-lg py-1",
 						children: [
 							{
 								value: "recent",
@@ -511,25 +511,26 @@ function B() {
 							onClick: () => {
 								T(e.value), D(!1);
 							},
-							className: t("w-full text-left px-3 py-2 text-sm transition-colors", w === e.value ? "bg-primary/10 text-foreground font-medium" : "text-muted-foreground hover:bg-accent hover:text-foreground"),
+							className: t("w-full text-left px-3 py-2 text-sm transition-colors", w === e.value ? "bg-action-primary-bg/10 text-text-primary font-medium" : "text-text-secondary hover:bg-accent hover:text-text-primary"),
 							children: e.label
 						}, e.value))
 					})] })]
 				})]
 			}),
 			G.length === 0 ? /* @__PURE__ */ A(r, {
+				illustration: "empty-notifications",
 				icon: /* @__PURE__ */ A(d, { className: "h-12 w-12" }),
 				title: "No notifications",
 				description: x ? "No notifications match your search. Try different keywords." : g === "unread" ? "You're all caught up! No unread notifications." : "No notifications in this category yet.",
 				action: x ? /* @__PURE__ */ A("button", {
 					type: "button",
 					onClick: () => S(""),
-					className: "rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+					className: "rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
 					children: "Clear Search"
 				}) : g === "all" ? void 0 : /* @__PURE__ */ A("button", {
 					type: "button",
 					onClick: () => v("all"),
-					className: "rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+					className: "rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
 					children: "View All Notifications"
 				})
 			}) : /* @__PURE__ */ A("div", {
@@ -538,12 +539,12 @@ function B() {
 					className: "flex items-center gap-3 mb-2",
 					children: [
 						/* @__PURE__ */ A("h3", {
-							className: "text-xs font-semibold uppercase tracking-wider text-muted-foreground",
+							className: "text-xs font-semibold uppercase tracking-wider text-text-secondary",
 							children: e.label
 						}),
-						/* @__PURE__ */ A("div", { className: "flex-1 border-t border-border" }),
+						/* @__PURE__ */ A("div", { className: "flex-1 border-t border-border-subtle" }),
 						/* @__PURE__ */ j("span", {
-							className: "text-xs text-muted-foreground",
+							className: "text-xs text-text-secondary",
 							children: [
 								e.items.length,
 								" notification",
@@ -552,7 +553,7 @@ function B() {
 						})
 					]
 				}), /* @__PURE__ */ A("div", {
-					className: "rounded-lg border border-border bg-card divide-y divide-border overflow-hidden",
+					className: "rounded-lg border border-border-subtle bg-bg-surface divide-y divide-border overflow-hidden",
 					children: e.items.map((e) => {
 						let n = N[e.type] ?? N.system, r = n.icon;
 						return /* @__PURE__ */ j("div", {
@@ -569,10 +570,10 @@ function B() {
 											className: "flex items-center gap-2 flex-wrap",
 											children: [
 												/* @__PURE__ */ A("h4", {
-													className: t("text-sm text-foreground", e.isRead ? "font-medium" : "font-semibold"),
+													className: t("text-sm text-text-primary", e.isRead ? "font-medium" : "font-semibold"),
 													children: e.title
 												}),
-												!e.isRead && /* @__PURE__ */ A("span", { className: "h-2 w-2 rounded-full bg-primary shrink-0" }),
+												!e.isRead && /* @__PURE__ */ A("span", { className: "h-2 w-2 rounded-full bg-action-primary-bg shrink-0" }),
 												/* @__PURE__ */ A("span", {
 													className: t("inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium", P[e.priority]),
 													children: e.priority
@@ -580,14 +581,14 @@ function B() {
 											]
 										}),
 										/* @__PURE__ */ A("p", {
-											className: "mt-1 text-sm text-muted-foreground leading-relaxed",
+											className: "mt-1 text-sm text-text-secondary leading-relaxed",
 											children: e.message
 										}),
 										/* @__PURE__ */ j("div", {
 											className: "mt-2 flex items-center gap-3 flex-wrap",
 											children: [
 												/* @__PURE__ */ j("span", {
-													className: "flex items-center gap-1 text-xs text-muted-foreground",
+													className: "flex items-center gap-1 text-xs text-text-secondary",
 													children: [/* @__PURE__ */ A(m, { className: "h-3 w-3" }), i(e.createdAt)]
 												}),
 												/* @__PURE__ */ A("span", {
@@ -595,7 +596,7 @@ function B() {
 													children: n.label
 												}),
 												e.metadata?.orderId && /* @__PURE__ */ j("span", {
-													className: "text-xs text-muted-foreground",
+													className: "text-xs text-text-secondary",
 													children: ["#", e.metadata.orderId]
 												})
 											]
@@ -606,21 +607,21 @@ function B() {
 												e.actionUrl && /* @__PURE__ */ A("button", {
 													type: "button",
 													onClick: () => X(e),
-													className: "rounded-lg bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground hover:bg-primary/90 transition-colors",
+													className: "rounded-lg bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors",
 													children: e.actionText ?? "View"
 												}),
 												!e.isRead && /* @__PURE__ */ j("button", {
 													type: "button",
 													onClick: () => q(e.id),
 													title: "Mark as read",
-													className: "flex items-center gap-1 rounded-lg border border-border px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent transition-colors",
+													className: "flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors",
 													children: [/* @__PURE__ */ A(f, { className: "h-3 w-3" }), "Mark Read"]
 												}),
 												/* @__PURE__ */ j("button", {
 													type: "button",
 													onClick: () => Y(e.id),
 													title: "Delete notification",
-													className: "flex items-center gap-1 rounded-lg border border-border px-3 py-1.5 text-xs font-medium text-destructive hover:bg-destructive/10 transition-colors",
+													className: "flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-error-text hover:bg-status-error-bg/10 transition-colors",
 													children: [/* @__PURE__ */ A(C, { className: "h-3 w-3" }), "Delete"]
 												})
 											]
@@ -629,7 +630,7 @@ function B() {
 								}),
 								/* @__PURE__ */ A("div", {
 									className: "shrink-0 pt-1",
-									children: e.isRead ? /* @__PURE__ */ A(_, { className: "h-4 w-4 text-muted-foreground/40" }) : /* @__PURE__ */ A(d, { className: "h-4 w-4 text-primary" })
+									children: e.isRead ? /* @__PURE__ */ A(_, { className: "h-4 w-4 text-text-secondary/40" }) : /* @__PURE__ */ A(d, { className: "h-4 w-4 text-primary" })
 								})
 							]
 						}, e.id);
@@ -637,9 +638,9 @@ function B() {
 				})] }, e.label))
 			}),
 			G.length > 0 && /* @__PURE__ */ j("div", {
-				className: "mt-6 flex items-center justify-between rounded-lg border border-border bg-card px-4 py-3",
+				className: "mt-6 flex items-center justify-between rounded-lg border border-border-subtle bg-bg-surface px-4 py-3",
 				children: [/* @__PURE__ */ j("p", {
-					className: "text-sm text-muted-foreground",
+					className: "text-sm text-text-secondary",
 					children: [
 						"Showing ",
 						G.length,

package/dist/adaptercloud/pages/common/NotificationCenterPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCenterPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/common/NotificationCenterPage.tsx"],"sourcesContent":["/**\n * Notification Center Page\n * @module adaptercloud/pages/common\n *\n * Full-featured notification center with tab filters (All, Orders,\n * Promotions, System, Unread), date grouping (Today, Yesterday, Earlier),\n * mark-as-read / mark-all-as-read, delete notification, search,\n * type/priority badges, action buttons, stats overview, and empty states.\n */\n\nimport { useState, useMemo, useCallback } from 'react';\nimport {\n  Bell,\n  ShoppingBag,\n  TrendingUp,\n  Star,\n  AlertCircle,\n  CheckCircle2,\n  CreditCard,\n  Users,\n  AlertTriangle,\n  Megaphone,\n  Check,\n  CheckCheck,\n  Trash2,\n  Search,\n  X,\n  MailOpen,\n  Clock,\n  Truck,\n  UserCheck,\n  Inbox,\n  RefreshCw,\n  SlidersHorizontal,\n  ArrowUpDown,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { cn } from '../../utils/cn';\nimport { formatRelativeTime } from '../../utils/formatters';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype NotificationType =\n  | 'order_update'\n  | 'payment'\n  | 'promotion'\n  | 'system'\n  | 'review'\n  | 'staff'\n  | 'investment'\n  | 'alert'\n  | 'delivery'\n  | 'account';\n\ntype NotificationPriority = 'low' | 'medium' | 'high' | 'urgent';\n\ntype TabId = 'all' | 'orders' | 'promotions' | 'system' | 'unread';\n\ntype SortOption = 'recent' | 'priority' | 'unread';\n\ninterface Notification {\n  id: string;\n  type: NotificationType;\n  title: string;\n  message: string;\n  priority: NotificationPriority;\n  isRead: boolean;\n  createdAt: string;\n  actionUrl?: string;\n  actionText?: string;\n  metadata?: {\n    orderId?: string;\n    cartId?: string;\n    amount?: number;\n  };\n}\n\n// ---------------------------------------------------------------------------\n// Mock notifications (14 items, rich variety)\n// ---------------------------------------------------------------------------\n\nconst initialNotifications: Notification[] = [\n  {\n    id: 'n-001',\n    type: 'order_update',\n    title: 'Order Delivered Successfully!',\n    message:\n      'Your order #ORD-001 from Dosa Express has been delivered. Rate your experience to help others!',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 8 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/order/ORD-001',\n    actionText: 'Rate Order',\n    metadata: { orderId: 'ORD-001', cartId: 'FOOD-001' },\n  },\n  {\n    id: 'n-002',\n    type: 'payment',\n    title: 'Payment Confirmed',\n    message:\n      'Your payment of \\u20B9495 for order #ORD-002 at Quick Cuts Salon has been processed successfully.',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 35 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-002', amount: 495 },\n  },\n  {\n    id: 'n-003',\n    type: 'promotion',\n    title: '20% Off Beauty Services This Weekend!',\n    message:\n      \"Glow Beauty Services is offering 20% off on all treatments this weekend only. Don't miss out!\",\n    priority: 'low',\n    isRead: false,\n    createdAt: new Date(Date.now() - 2 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/cart/SERV-002',\n    actionText: 'Book Now',\n    metadata: { cartId: 'SERV-002' },\n  },\n  {\n    id: 'n-004',\n    type: 'review',\n    title: 'New Review Response',\n    message:\n      'Dosa Express replied to your review: \"Thank you so much for your kind words! We hope to serve you again soon.\"',\n    priority: 'low',\n    isRead: false,\n    createdAt: new Date(Date.now() - 4 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/reviews',\n    actionText: 'View Reply',\n  },\n  {\n    id: 'n-005',\n    type: 'system',\n    title: 'App Update Available',\n    message:\n      'Version 2.4.0 of AdapterCloud is available with improved performance, new category filters, and bug fixes.',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 7 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/settings',\n    actionText: 'Update Now',\n  },\n  {\n    id: 'n-006',\n    type: 'order_update',\n    title: 'Appointment Confirmed',\n    message:\n      'Your appointment at Quick Cuts Salon has been confirmed for tomorrow at 3:00 PM. The stylist Suresh will be serving you.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/order/ORD-002',\n    actionText: 'View Details',\n    metadata: { orderId: 'ORD-002' },\n  },\n  {\n    id: 'n-007',\n    type: 'investment',\n    title: 'Monthly Returns Credited',\n    message:\n      'You received \\u20B91,250 in monthly returns from your Quick Cuts Salon investment. Total portfolio value: \\u20B92,12,500.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/investor/portfolio',\n    actionText: 'View Portfolio',\n    metadata: { amount: 1250 },\n  },\n  {\n    id: 'n-008',\n    type: 'delivery',\n    title: 'Delivery Worker Assigned',\n    message:\n      'Ravi Kumar (rated 4.8) has been assigned to deliver your order from Biryani Pot. Estimated arrival: 25 minutes.',\n    priority: 'high',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1.5 * 24 * 60 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-003' },\n  },\n  {\n    id: 'n-009',\n    type: 'alert',\n    title: 'Unusual Login Attempt Detected',\n    message:\n      'We detected a login attempt from a new device in Mumbai. If this was not you, please change your password immediately.',\n    priority: 'urgent',\n    isRead: true,\n    createdAt: new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/settings',\n    actionText: 'Review Activity',\n  },\n  {\n    id: 'n-010',\n    type: 'promotion',\n    title: 'Flash Sale: Mobile Accessories',\n    message:\n      'Gadget Zone Brigade is running a flash sale! Up to 30% off on bluetooth headphones, cases, and chargers.',\n    priority: 'low',\n    isRead: true,\n    createdAt: new Date(Date.now() - 3 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/cart/RETAIL-003',\n    actionText: 'Shop Now',\n    metadata: { cartId: 'RETAIL-003' },\n  },\n  {\n    id: 'n-011',\n    type: 'system',\n    title: 'Scheduled Platform Maintenance',\n    message:\n      'Platform maintenance is scheduled for Sunday 2:00 AM - 4:00 AM IST. Some services may be briefly unavailable during this window.',\n    priority: 'high',\n    isRead: true,\n    createdAt: new Date(Date.now() - 4 * 24 * 60 * 60 * 1000).toISOString(),\n  },\n  {\n    id: 'n-012',\n    type: 'account',\n    title: 'KYC Verification Complete',\n    message:\n      'Your KYC verification has been completed successfully. You now have full access to all platform features including investments.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString(),\n  },\n  {\n    id: 'n-013',\n    type: 'staff',\n    title: 'Staff Schedule Updated',\n    message:\n      'Priya Sharma has updated her availability for this week. She will be unavailable on Wednesday and Thursday.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 6 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/owner/staff',\n    actionText: 'View Schedule',\n  },\n  {\n    id: 'n-014',\n    type: 'payment',\n    title: 'Refund Processed',\n    message:\n      'Your refund of \\u20B9280 for order #ORD-005 has been processed. The amount will reflect in your account within 3-5 business days.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-005', amount: 280 },\n  },\n];\n\n// ---------------------------------------------------------------------------\n// Type icon/color configuration\n// ---------------------------------------------------------------------------\n\nconst typeConfig: Record<string, { icon: typeof Bell; color: string; bg: string; label: string }> =\n  {\n    order_update: {\n      icon: ShoppingBag,\n      color: 'text-blue-600 dark:text-blue-400',\n      bg: 'bg-blue-500/10',\n      label: 'Order',\n    },\n    payment: {\n      icon: CreditCard,\n      color: 'text-green-600 dark:text-green-400',\n      bg: 'bg-green-500/10',\n      label: 'Payment',\n    },\n    promotion: {\n      icon: Megaphone,\n      color: 'text-orange-600 dark:text-orange-400',\n      bg: 'bg-orange-500/10',\n      label: 'Promo',\n    },\n    system: {\n      icon: AlertCircle,\n      color: 'text-purple-600 dark:text-purple-400',\n      bg: 'bg-purple-500/10',\n      label: 'System',\n    },\n    review: {\n      icon: Star,\n      color: 'text-yellow-600 dark:text-yellow-400',\n      bg: 'bg-yellow-500/10',\n      label: 'Review',\n    },\n    staff: {\n      icon: Users,\n      color: 'text-indigo-600 dark:text-indigo-400',\n      bg: 'bg-indigo-500/10',\n      label: 'Staff',\n    },\n    investment: {\n      icon: TrendingUp,\n      color: 'text-emerald-600 dark:text-emerald-400',\n      bg: 'bg-emerald-500/10',\n      label: 'Investment',\n    },\n    alert: {\n      icon: AlertTriangle,\n      color: 'text-red-600 dark:text-red-400',\n      bg: 'bg-red-500/10',\n      label: 'Alert',\n    },\n    delivery: {\n      icon: Truck,\n      color: 'text-cyan-600 dark:text-cyan-400',\n      bg: 'bg-cyan-500/10',\n      label: 'Delivery',\n    },\n    account: {\n      icon: UserCheck,\n      color: 'text-teal-600 dark:text-teal-400',\n      bg: 'bg-teal-500/10',\n      label: 'Account',\n    },\n  };\n\n// ---------------------------------------------------------------------------\n// Priority styling\n// ---------------------------------------------------------------------------\n\nconst priorityStyles: Record<NotificationPriority, string> = {\n  urgent: 'bg-red-500/20 text-red-600 dark:text-red-400',\n  high: 'bg-orange-500/20 text-orange-600 dark:text-orange-400',\n  medium: 'bg-blue-500/20 text-blue-600 dark:text-blue-400',\n  low: 'bg-muted text-muted-foreground',\n};\n\nconst priorityBorderColors: Record<NotificationPriority, string> = {\n  urgent: 'border-l-red-500',\n  high: 'border-l-orange-500',\n  medium: 'border-l-blue-500',\n  low: 'border-l-border',\n};\n\nconst priorityOrder: Record<NotificationPriority, number> = {\n  urgent: 4,\n  high: 3,\n  medium: 2,\n  low: 1,\n};\n\n// ---------------------------------------------------------------------------\n// Tab definitions\n// ---------------------------------------------------------------------------\n\nconst tabs: { id: TabId; label: string; icon: typeof Bell }[] = [\n  { id: 'all', label: 'All', icon: Inbox },\n  { id: 'orders', label: 'Orders', icon: ShoppingBag },\n  { id: 'promotions', label: 'Promotions', icon: Megaphone },\n  { id: 'system', label: 'System', icon: AlertCircle },\n  { id: 'unread', label: 'Unread', icon: Bell },\n];\n\n// ---------------------------------------------------------------------------\n// Date grouping helpers\n// ---------------------------------------------------------------------------\n\nfunction getDateGroup(dateStr: string): string {\n  const date = new Date(dateStr);\n  const now = new Date();\n  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());\n  const yesterday = new Date(today.getTime() - 24 * 60 * 60 * 1000);\n\n  if (date >= today) return 'Today';\n  if (date >= yesterday) return 'Yesterday';\n  return 'Earlier';\n}\n\nfunction groupByDate(items: Notification[]): { label: string; items: Notification[] }[] {\n  const groups: { label: string; items: Notification[] }[] = [];\n  const map = new Map<string, Notification[]>();\n  const order = ['Today', 'Yesterday', 'Earlier'];\n\n  for (const n of items) {\n    const group = getDateGroup(n.createdAt);\n    if (!map.has(group)) map.set(group, []);\n    map.get(group)!.push(n);\n  }\n\n  for (const label of order) {\n    const items = map.get(label);\n    if (items && items.length > 0) {\n      groups.push({ label, items });\n    }\n  }\n\n  return groups;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport function NotificationCenterPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [notifications, setNotifications] = useState<Notification[]>(initialNotifications);\n  const [activeTab, setActiveTab] = useState<TabId>('all');\n  const [searchQuery, setSearchQuery] = useState('');\n  const [sortBy, setSortBy] = useState<SortOption>('recent');\n  const [showSortMenu, setShowSortMenu] = useState(false);\n\n  // ---------------------------------------------------------------------------\n  // Derived counts\n  // ---------------------------------------------------------------------------\n\n  const unreadCount = useMemo(() => notifications.filter((n) => !n.isRead).length, [notifications]);\n\n  const urgentCount = useMemo(\n    () => notifications.filter((n) => n.priority === 'urgent').length,\n    [notifications]\n  );\n\n  const todayCount = useMemo(\n    () => notifications.filter((n) => getDateGroup(n.createdAt) === 'Today').length,\n    [notifications]\n  );\n\n  const thisWeekCount = useMemo(() => {\n    const weekAgo = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);\n    return notifications.filter((n) => new Date(n.createdAt) >= weekAgo).length;\n  }, [notifications]);\n\n  const tabCounts = useMemo(() => {\n    const counts: Record<TabId, number> = {\n      all: 0,\n      orders: 0,\n      promotions: 0,\n      system: 0,\n      unread: 0,\n    };\n    for (const n of notifications) {\n      counts.all++;\n      if (!n.isRead) counts.unread++;\n      if (n.type === 'order_update' || n.type === 'delivery') counts.orders++;\n      if (n.type === 'promotion') counts.promotions++;\n      if (n.type === 'system' || n.type === 'alert' || n.type === 'account') counts.system++;\n    }\n    return counts;\n  }, [notifications]);\n\n  // ---------------------------------------------------------------------------\n  // Filtered & sorted list\n  // ---------------------------------------------------------------------------\n\n  const filteredNotifications = useMemo(() => {\n    let list = [...notifications];\n\n    // Tab filter\n    switch (activeTab) {\n      case 'orders':\n        list = list.filter((n) => n.type === 'order_update' || n.type === 'delivery');\n        break;\n      case 'promotions':\n        list = list.filter((n) => n.type === 'promotion');\n        break;\n      case 'system':\n        list = list.filter(\n          (n) => n.type === 'system' || n.type === 'alert' || n.type === 'account'\n        );\n        break;\n      case 'unread':\n        list = list.filter((n) => !n.isRead);\n        break;\n    }\n\n    // Search filter\n    if (searchQuery) {\n      const q = searchQuery.toLowerCase();\n      list = list.filter(\n        (n) => n.title.toLowerCase().includes(q) || n.message.toLowerCase().includes(q)\n      );\n    }\n\n    // Sort\n    switch (sortBy) {\n      case 'recent':\n        list.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());\n        break;\n      case 'priority':\n        list.sort((a, b) => priorityOrder[b.priority] - priorityOrder[a.priority]);\n        break;\n      case 'unread':\n        list.sort((a, b) => (a.isRead === b.isRead ? 0 : a.isRead ? 1 : -1));\n        break;\n    }\n\n    return list;\n  }, [notifications, activeTab, searchQuery, sortBy]);\n\n  // Grouped by date\n  const grouped = useMemo(() => groupByDate(filteredNotifications), [filteredNotifications]);\n\n  // ---------------------------------------------------------------------------\n  // Actions\n  // ---------------------------------------------------------------------------\n\n  const markAsRead = useCallback((id: string) => {\n    setNotifications((prev) => prev.map((n) => (n.id === id ? { ...n, isRead: true } : n)));\n  }, []);\n\n  const markAllAsRead = useCallback(() => {\n    setNotifications((prev) => prev.map((n) => ({ ...n, isRead: true })));\n  }, []);\n\n  const deleteNotification = useCallback((id: string) => {\n    setNotifications((prev) => prev.filter((n) => n.id !== id));\n  }, []);\n\n  const handleAction = useCallback(\n    (notif: Notification) => {\n      if (!notif.isRead) markAsRead(notif.id);\n      if (notif.actionUrl) navigateTo(notif.actionUrl);\n    },\n    [markAsRead, navigateTo]\n  );\n\n  const clearAll = useCallback(() => {\n    if (window.confirm('Are you sure you want to clear all notifications?')) {\n      setNotifications([]);\n    }\n  }, []);\n\n  // ---------------------------------------------------------------------------\n  // Render\n  // ---------------------------------------------------------------------------\n\n  return (\n    <PageLayout\n      title=\"Notifications\"\n      description={\n        unreadCount > 0\n          ? `${unreadCount} unread notification${unreadCount !== 1 ? 's' : ''}`\n          : 'All caught up!'\n      }\n      actions={\n        <div className=\"flex items-center gap-2\">\n          {notifications.length > 0 && (\n            <button\n              type=\"button\"\n              onClick={clearAll}\n              className=\"flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 text-sm font-medium text-muted-foreground hover:text-foreground hover:bg-accent transition-colors\"\n            >\n              <Trash2 className=\"h-4 w-4\" />\n              <span className=\"hidden sm:inline\">Clear All</span>\n            </button>\n          )}\n          {unreadCount > 0 && (\n            <button\n              type=\"button\"\n              onClick={markAllAsRead}\n              className=\"flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n            >\n              <CheckCheck className=\"h-4 w-4\" />\n              Mark All Read\n            </button>\n          )}\n        </div>\n      }\n    >\n      {/* ---- Stats Overview ---- */}\n      <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-5 mb-6\">\n        <div className=\"rounded-lg border border-border bg-card p-3 text-center\">\n          <p className=\"text-2xl font-bold text-foreground\">{notifications.length}</p>\n          <p className=\"text-xs text-muted-foreground\">Total</p>\n        </div>\n        <div className=\"rounded-lg border border-blue-500/30 bg-blue-500/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-blue-600 dark:text-blue-400\">{unreadCount}</p>\n          <p className=\"text-xs text-muted-foreground\">Unread</p>\n        </div>\n        <div className=\"rounded-lg border border-red-500/30 bg-red-500/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-red-600 dark:text-red-400\">{urgentCount}</p>\n          <p className=\"text-xs text-muted-foreground\">Urgent</p>\n        </div>\n        <div className=\"rounded-lg border border-green-500/30 bg-green-500/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-green-600 dark:text-green-400\">{todayCount}</p>\n          <p className=\"text-xs text-muted-foreground\">Today</p>\n        </div>\n        <div className=\"rounded-lg border border-yellow-500/30 bg-yellow-500/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-yellow-600 dark:text-yellow-400\">{thisWeekCount}</p>\n          <p className=\"text-xs text-muted-foreground\">This Week</p>\n        </div>\n      </div>\n\n      {/* ---- Tabs ---- */}\n      <div className=\"flex items-center gap-2 mb-4 overflow-x-auto pb-1\">\n        {tabs.map((tab) => {\n          const TabIcon = tab.icon;\n          return (\n            <button\n              key={tab.id}\n              type=\"button\"\n              onClick={() => setActiveTab(tab.id)}\n              className={cn(\n                'flex items-center gap-1.5 whitespace-nowrap rounded-full border px-3 py-1.5 text-sm font-medium transition-colors',\n                activeTab === tab.id\n                  ? 'border-primary bg-primary/10 text-foreground'\n                  : 'border-border text-muted-foreground hover:text-foreground hover:border-accent-foreground/20'\n              )}\n            >\n              <TabIcon className=\"h-3.5 w-3.5\" />\n              {tab.label}\n              <span\n                className={cn(\n                  'inline-flex h-5 min-w-[20px] items-center justify-center rounded-full px-1 text-xs',\n                  activeTab === tab.id\n                    ? 'bg-primary text-primary-foreground'\n                    : 'bg-muted text-muted-foreground'\n                )}\n              >\n                {tabCounts[tab.id]}\n              </span>\n            </button>\n          );\n        })}\n      </div>\n\n      {/* ---- Search & Sort ---- */}\n      <div className=\"flex items-center gap-3 mb-6\">\n        <div className=\"relative flex-1\">\n          <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground\" />\n          <input\n            type=\"text\"\n            placeholder=\"Search notifications...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            className=\"w-full rounded-lg border border-border bg-card py-2.5 pl-10 pr-9 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n          />\n          {searchQuery && (\n            <button\n              type=\"button\"\n              onClick={() => setSearchQuery('')}\n              className=\"absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground\"\n            >\n              <X className=\"h-4 w-4\" />\n            </button>\n          )}\n        </div>\n\n        {/* Sort dropdown */}\n        <div className=\"relative\">\n          <button\n            type=\"button\"\n            onClick={() => setShowSortMenu(!showSortMenu)}\n            className=\"flex items-center gap-1.5 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n          >\n            <ArrowUpDown className=\"h-4 w-4\" />\n            <span className=\"hidden sm:inline\">Sort</span>\n          </button>\n          {showSortMenu && (\n            <>\n              {/* Backdrop */}\n              <div className=\"fixed inset-0 z-10\" onClick={() => setShowSortMenu(false)} />\n              <div className=\"absolute right-0 top-full mt-1 z-20 w-44 rounded-lg border border-border bg-card shadow-lg py-1\">\n                {(\n                  [\n                    { value: 'recent', label: 'Most Recent' },\n                    { value: 'priority', label: 'By Priority' },\n                    { value: 'unread', label: 'Unread First' },\n                  ] as const\n                ).map((opt) => (\n                  <button\n                    key={opt.value}\n                    type=\"button\"\n                    onClick={() => {\n                      setSortBy(opt.value);\n                      setShowSortMenu(false);\n                    }}\n                    className={cn(\n                      'w-full text-left px-3 py-2 text-sm transition-colors',\n                      sortBy === opt.value\n                        ? 'bg-primary/10 text-foreground font-medium'\n                        : 'text-muted-foreground hover:bg-accent hover:text-foreground'\n                    )}\n                  >\n                    {opt.label}\n                  </button>\n                ))}\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n\n      {/* ---- Notification List ---- */}\n      {filteredNotifications.length === 0 ? (\n        <EmptyState\n          icon={<Bell className=\"h-12 w-12\" />}\n          title=\"No notifications\"\n          description={\n            searchQuery\n              ? 'No notifications match your search. Try different keywords.'\n              : activeTab === 'unread'\n                ? \"You're all caught up! No unread notifications.\"\n                : 'No notifications in this category yet.'\n          }\n          action={\n            searchQuery ? (\n              <button\n                type=\"button\"\n                onClick={() => setSearchQuery('')}\n                className=\"rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n              >\n                Clear Search\n              </button>\n            ) : activeTab !== 'all' ? (\n              <button\n                type=\"button\"\n                onClick={() => setActiveTab('all')}\n                className=\"rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n              >\n                View All Notifications\n              </button>\n            ) : undefined\n          }\n        />\n      ) : (\n        <div className=\"space-y-6\">\n          {grouped.map((group) => (\n            <div key={group.label}>\n              {/* Date group header */}\n              <div className=\"flex items-center gap-3 mb-2\">\n                <h3 className=\"text-xs font-semibold uppercase tracking-wider text-muted-foreground\">\n                  {group.label}\n                </h3>\n                <div className=\"flex-1 border-t border-border\" />\n                <span className=\"text-xs text-muted-foreground\">\n                  {group.items.length} notification{group.items.length !== 1 ? 's' : ''}\n                </span>\n              </div>\n\n              {/* Notification cards */}\n              <div className=\"rounded-lg border border-border bg-card divide-y divide-border overflow-hidden\">\n                {group.items.map((notif) => {\n                  const config = typeConfig[notif.type] ?? typeConfig.system;\n                  const NotifIcon = config.icon;\n\n                  return (\n                    <div\n                      key={notif.id}\n                      className={cn(\n                        'flex items-start gap-3 px-4 py-4 border-l-4 transition-colors',\n                        priorityBorderColors[notif.priority],\n                        !notif.isRead && 'bg-accent/30'\n                      )}\n                    >\n                      {/* Type icon */}\n                      <div\n                        className={cn(\n                          'flex h-10 w-10 shrink-0 items-center justify-center rounded-full',\n                          config.bg\n                        )}\n                      >\n                        <NotifIcon className={cn('h-5 w-5', config.color)} />\n                      </div>\n\n                      {/* Content */}\n                      <div className=\"flex-1 min-w-0\">\n                        {/* Title row */}\n                        <div className=\"flex items-center gap-2 flex-wrap\">\n                          <h4\n                            className={cn(\n                              'text-sm text-foreground',\n                              !notif.isRead ? 'font-semibold' : 'font-medium'\n                            )}\n                          >\n                            {notif.title}\n                          </h4>\n                          {!notif.isRead && (\n                            <span className=\"h-2 w-2 rounded-full bg-primary shrink-0\" />\n                          )}\n                          <span\n                            className={cn(\n                              'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                              priorityStyles[notif.priority]\n                            )}\n                          >\n                            {notif.priority}\n                          </span>\n                        </div>\n\n                        {/* Message */}\n                        <p className=\"mt-1 text-sm text-muted-foreground leading-relaxed\">\n                          {notif.message}\n                        </p>\n\n                        {/* Metadata row */}\n                        <div className=\"mt-2 flex items-center gap-3 flex-wrap\">\n                          <span className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n                            <Clock className=\"h-3 w-3\" />\n                            {formatRelativeTime(notif.createdAt)}\n                          </span>\n                          <span\n                            className={cn(\n                              'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                              config.bg,\n                              config.color\n                            )}\n                          >\n                            {config.label}\n                          </span>\n                          {notif.metadata?.orderId && (\n                            <span className=\"text-xs text-muted-foreground\">\n                              #{notif.metadata.orderId}\n                            </span>\n                          )}\n                        </div>\n\n                        {/* Action buttons row */}\n                        <div className=\"mt-3 flex items-center gap-2 flex-wrap\">\n                          {notif.actionUrl && (\n                            <button\n                              type=\"button\"\n                              onClick={() => handleAction(notif)}\n                              className=\"rounded-lg bg-primary px-3 py-1.5 text-xs font-medium text-primary-foreground hover:bg-primary/90 transition-colors\"\n                            >\n                              {notif.actionText ?? 'View'}\n                            </button>\n                          )}\n                          {!notif.isRead && (\n                            <button\n                              type=\"button\"\n                              onClick={() => markAsRead(notif.id)}\n                              title=\"Mark as read\"\n                              className=\"flex items-center gap-1 rounded-lg border border-border px-3 py-1.5 text-xs font-medium text-foreground hover:bg-accent transition-colors\"\n                            >\n                              <Check className=\"h-3 w-3\" />\n                              Mark Read\n                            </button>\n                          )}\n                          <button\n                            type=\"button\"\n                            onClick={() => deleteNotification(notif.id)}\n                            title=\"Delete notification\"\n                            className=\"flex items-center gap-1 rounded-lg border border-border px-3 py-1.5 text-xs font-medium text-destructive hover:bg-destructive/10 transition-colors\"\n                          >\n                            <Trash2 className=\"h-3 w-3\" />\n                            Delete\n                          </button>\n                        </div>\n                      </div>\n\n                      {/* Read/unread indicator */}\n                      <div className=\"shrink-0 pt-1\">\n                        {notif.isRead ? (\n                          <MailOpen className=\"h-4 w-4 text-muted-foreground/40\" />\n                        ) : (\n                          <Bell className=\"h-4 w-4 text-primary\" />\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* ---- Footer summary ---- */}\n      {filteredNotifications.length > 0 && (\n        <div className=\"mt-6 flex items-center justify-between rounded-lg border border-border bg-card px-4 py-3\">\n          <p className=\"text-sm text-muted-foreground\">\n            Showing {filteredNotifications.length} of {notifications.length} notifications\n          </p>\n          {activeTab !== 'all' && (\n            <button\n              type=\"button\"\n              onClick={() => {\n                setActiveTab('all');\n                setSearchQuery('');\n              }}\n              className=\"flex items-center gap-1.5 text-sm font-medium text-primary hover:underline\"\n            >\n              <RefreshCw className=\"h-3.5 w-3.5\" />\n              Show All\n            </button>\n          )}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"NotificationCenterPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/common/NotificationCenterPage.tsx"],"sourcesContent":["/**\n * Notification Center Page\n * @module adaptercloud/pages/common\n *\n * Full-featured notification center with tab filters (All, Orders,\n * Promotions, System, Unread), date grouping (Today, Yesterday, Earlier),\n * mark-as-read / mark-all-as-read, delete notification, search,\n * type/priority badges, action buttons, stats overview, and empty states.\n */\n\nimport { useState, useMemo, useCallback } from'react';\nimport {\n  Bell,\n  ShoppingBag,\n  TrendingUp,\n  Star,\n  AlertCircle,\n  CheckCircle2,\n  CreditCard,\n  Users,\n  AlertTriangle,\n  Megaphone,\n  Check,\n  CheckCheck,\n  Trash2,\n  Search,\n  X,\n  MailOpen,\n  Clock,\n  Truck,\n  UserCheck,\n  Inbox,\n  RefreshCw,\n  SlidersHorizontal,\n  ArrowUpDown,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { cn } from'../../utils/cn';\nimport { formatRelativeTime } from'../../utils/formatters';\n\n// ---------------------------------------------------------------------------\n// Types\n// ---------------------------------------------------------------------------\n\ntype NotificationType =\n  | 'order_update'\n  | 'payment'\n  | 'promotion'\n  | 'system'\n  | 'review'\n  | 'staff'\n  | 'investment'\n  | 'alert'\n  | 'delivery'\n  | 'account';\n\ntype NotificationPriority = 'low' | 'medium' | 'high' | 'urgent';\n\ntype TabId = 'all' | 'orders' | 'promotions' | 'system' | 'unread';\n\ntype SortOption = 'recent' | 'priority' | 'unread';\n\ninterface Notification {\n  id: string;\n  type: NotificationType;\n  title: string;\n  message: string;\n  priority: NotificationPriority;\n  isRead: boolean;\n  createdAt: string;\n  actionUrl?: string;\n  actionText?: string;\n  metadata?: {\n    orderId?: string;\n    cartId?: string;\n    amount?: number;\n  };\n}\n\n// ---------------------------------------------------------------------------\n// Mock notifications (14 items, rich variety)\n// ---------------------------------------------------------------------------\n\nconst initialNotifications: Notification[] = [\n  {\n    id: 'n-001',\n    type: 'order_update',\n    title: 'Order Delivered Successfully!',\n    message:\n      'Your order #ORD-001 from Dosa Express has been delivered. Rate your experience to help others!',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 8 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/order/ORD-001',\n    actionText: 'Rate Order',\n    metadata: { orderId: 'ORD-001', cartId: 'FOOD-001' },\n  },\n  {\n    id: 'n-002',\n    type: 'payment',\n    title: 'Payment Confirmed',\n    message:\n      'Your payment of \\u20B9495 for order #ORD-002 at Quick Cuts Salon has been processed successfully.',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 35 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-002', amount: 495 },\n  },\n  {\n    id: 'n-003',\n    type: 'promotion',\n    title: '20% Off Beauty Services This Weekend!',\n    message:\n      \"Glow Beauty Services is offering 20% off on all treatments this weekend only. Don't miss out!\",\n    priority: 'low',\n    isRead: false,\n    createdAt: new Date(Date.now() - 2 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/cart/SERV-002',\n    actionText: 'Book Now',\n    metadata: { cartId: 'SERV-002' },\n  },\n  {\n    id: 'n-004',\n    type: 'review',\n    title: 'New Review Response',\n    message:\n      'Dosa Express replied to your review: \"Thank you so much for your kind words! We hope to serve you again soon.\"',\n    priority: 'low',\n    isRead: false,\n    createdAt: new Date(Date.now() - 4 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/reviews',\n    actionText: 'View Reply',\n  },\n  {\n    id: 'n-005',\n    type: 'system',\n    title: 'App Update Available',\n    message:\n      'Version 2.4.0 of AdapterCloud is available with improved performance, new category filters, and bug fixes.',\n    priority: 'medium',\n    isRead: false,\n    createdAt: new Date(Date.now() - 7 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/settings',\n    actionText: 'Update Now',\n  },\n  {\n    id: 'n-006',\n    type: 'order_update',\n    title: 'Appointment Confirmed',\n    message:\n      'Your appointment at Quick Cuts Salon has been confirmed for tomorrow at 3:00 PM. The stylist Suresh will be serving you.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/order/ORD-002',\n    actionText: 'View Details',\n    metadata: { orderId: 'ORD-002' },\n  },\n  {\n    id: 'n-007',\n    type: 'investment',\n    title: 'Monthly Returns Credited',\n    message:\n      'You received \\u20B91,250 in monthly returns from your Quick Cuts Salon investment. Total portfolio value: \\u20B92,12,500.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/investor/portfolio',\n    actionText: 'View Portfolio',\n    metadata: { amount: 1250 },\n  },\n  {\n    id: 'n-008',\n    type: 'delivery',\n    title: 'Delivery Worker Assigned',\n    message:\n      'Ravi Kumar (rated 4.8) has been assigned to deliver your order from Biryani Pot. Estimated arrival: 25 minutes.',\n    priority: 'high',\n    isRead: true,\n    createdAt: new Date(Date.now() - 1.5 * 24 * 60 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-003' },\n  },\n  {\n    id: 'n-009',\n    type: 'alert',\n    title: 'Unusual Login Attempt Detected',\n    message:\n      'We detected a login attempt from a new device in Mumbai. If this was not you, please change your password immediately.',\n    priority: 'urgent',\n    isRead: true,\n    createdAt: new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/settings',\n    actionText: 'Review Activity',\n  },\n  {\n    id: 'n-010',\n    type: 'promotion',\n    title: 'Flash Sale: Mobile Accessories',\n    message:\n      'Gadget Zone Brigade is running a flash sale! Up to 30% off on bluetooth headphones, cases, and chargers.',\n    priority: 'low',\n    isRead: true,\n    createdAt: new Date(Date.now() - 3 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/customer/cart/RETAIL-003',\n    actionText: 'Shop Now',\n    metadata: { cartId: 'RETAIL-003' },\n  },\n  {\n    id: 'n-011',\n    type: 'system',\n    title: 'Scheduled Platform Maintenance',\n    message:\n      'Platform maintenance is scheduled for Sunday 2:00 AM - 4:00 AM IST. Some services may be briefly unavailable during this window.',\n    priority: 'high',\n    isRead: true,\n    createdAt: new Date(Date.now() - 4 * 24 * 60 * 60 * 1000).toISOString(),\n  },\n  {\n    id: 'n-012',\n    type: 'account',\n    title: 'KYC Verification Complete',\n    message:\n      'Your KYC verification has been completed successfully. You now have full access to all platform features including investments.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toISOString(),\n  },\n  {\n    id: 'n-013',\n    type: 'staff',\n    title: 'Staff Schedule Updated',\n    message:\n      'Priya Sharma has updated her availability for this week. She will be unavailable on Wednesday and Thursday.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 6 * 24 * 60 * 60 * 1000).toISOString(),\n    actionUrl: '/owner/staff',\n    actionText: 'View Schedule',\n  },\n  {\n    id: 'n-014',\n    type: 'payment',\n    title: 'Refund Processed',\n    message:\n      'Your refund of \\u20B9280 for order #ORD-005 has been processed. The amount will reflect in your account within 3-5 business days.',\n    priority: 'medium',\n    isRead: true,\n    createdAt: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000).toISOString(),\n    metadata: { orderId: 'ORD-005', amount: 280 },\n  },\n];\n\n// ---------------------------------------------------------------------------\n// Type icon/color configuration\n// ---------------------------------------------------------------------------\n\nconst typeConfig: Record<string, { icon: typeof Bell; color: string; bg: string; label: string }> =\n  {\n    order_update: {\n      icon: ShoppingBag,\n      color: 'text-accent-blue',\n      bg: 'bg-accent-blue-subtle/10',\n      label: 'Order',\n    },\n    payment: {\n      icon: CreditCard,\n      color: 'text-status-success-text',\n      bg: 'bg-status-success-bg-subtle/10',\n      label: 'Payment',\n    },\n    promotion: {\n      icon: Megaphone,\n      color: 'text-accent-orange',\n      bg: 'bg-accent-orange-subtle/10',\n      label: 'Promo',\n    },\n    system: {\n      icon: AlertCircle,\n      color: 'text-accent-purple',\n      bg: 'bg-accent-purple-subtle/10',\n      label: 'System',\n    },\n    review: {\n      icon: Star,\n      color: 'text-status-warning-text',\n      bg: 'bg-status-warning-bg-subtle/10',\n      label: 'Review',\n    },\n    staff: {\n      icon: Users,\n      color: 'text-accent-indigo',\n      bg: 'bg-accent-indigo-subtle/10',\n      label: 'Staff',\n    },\n    investment: {\n      icon: TrendingUp,\n      color: 'text-status-success-text',\n      bg: 'bg-status-success-bg-subtle/10',\n      label: 'Investment',\n    },\n    alert: {\n      icon: AlertTriangle,\n      color: 'text-status-error-text',\n      bg: 'bg-status-error-bg-subtle/10',\n      label: 'Alert',\n    },\n    delivery: {\n      icon: Truck,\n      color: 'text-accent-cyan',\n      bg: 'bg-accent-cyan-subtle/10',\n      label: 'Delivery',\n    },\n    account: {\n      icon: UserCheck,\n      color: 'text-accent-teal',\n      bg: 'bg-accent-teal-subtle/10',\n      label: 'Account',\n    },\n  };\n\n// ---------------------------------------------------------------------------\n// Priority styling\n// ---------------------------------------------------------------------------\n\nconst priorityStyles: Record<NotificationPriority, string> = {\n  urgent: 'bg-status-error-bg-subtle/20 text-status-error-text',\n  high: 'bg-accent-orange-subtle/20 text-accent-orange',\n  medium: 'bg-accent-blue-subtle/20 text-accent-blue',\n  low: 'bg-bg-sunken text-text-secondary',\n};\n\nconst priorityBorderColors: Record<NotificationPriority, string> = {\n  urgent: 'border-l-red-500',\n  high: 'border-l-orange-500',\n  medium: 'border-l-blue-500',\n  low: 'border-l-border',\n};\n\nconst priorityOrder: Record<NotificationPriority, number> = {\n  urgent: 4,\n  high: 3,\n  medium: 2,\n  low: 1,\n};\n\n// ---------------------------------------------------------------------------\n// Tab definitions\n// ---------------------------------------------------------------------------\n\nconst tabs: { id: TabId; label: string; icon: typeof Bell }[] = [\n  { id: 'all', label: 'All', icon: Inbox },\n  { id: 'orders', label: 'Orders', icon: ShoppingBag },\n  { id: 'promotions', label: 'Promotions', icon: Megaphone },\n  { id: 'system', label: 'System', icon: AlertCircle },\n  { id: 'unread', label: 'Unread', icon: Bell },\n];\n\n// ---------------------------------------------------------------------------\n// Date grouping helpers\n// ---------------------------------------------------------------------------\n\nfunction getDateGroup(dateStr: string): string {\n  const date = new Date(dateStr);\n  const now = new Date();\n  const today = new Date(now.getFullYear(), now.getMonth(), now.getDate());\n  const yesterday = new Date(today.getTime() - 24 * 60 * 60 * 1000);\n\n  if (date >= today) return'Today';\n  if (date >= yesterday) return'Yesterday';\n  return'Earlier';\n}\n\nfunction groupByDate(items: Notification[]): { label: string; items: Notification[] }[] {\n  const groups: { label: string; items: Notification[] }[] = [];\n  const map = new Map<string, Notification[]>();\n  const order = ['Today', 'Yesterday', 'Earlier'];\n\n  for (const n of items) {\n    const group = getDateGroup(n.createdAt);\n    if (!map.has(group)) map.set(group, []);\n    map.get(group)!.push(n);\n  }\n\n  for (const label of order) {\n    const items = map.get(label);\n    if (items && items.length > 0) {\n      groups.push({ label, items });\n    }\n  }\n\n  return groups;\n}\n\n// ---------------------------------------------------------------------------\n// Component\n// ---------------------------------------------------------------------------\n\nexport function NotificationCenterPage() {\n  const { navigateTo } = useAdapterCloud();\n  const [notifications, setNotifications] = useState<Notification[]>(initialNotifications);\n  const [activeTab, setActiveTab] = useState<TabId>('all');\n  const [searchQuery, setSearchQuery] = useState('');\n  const [sortBy, setSortBy] = useState<SortOption>('recent');\n  const [showSortMenu, setShowSortMenu] = useState(false);\n\n  // ---------------------------------------------------------------------------\n  // Derived counts\n  // ---------------------------------------------------------------------------\n\n  const unreadCount = useMemo(() => notifications.filter((n) => !n.isRead).length, [notifications]);\n\n  const urgentCount = useMemo(\n    () => notifications.filter((n) => n.priority === 'urgent').length,\n    [notifications]\n  );\n\n  const todayCount = useMemo(\n    () => notifications.filter((n) => getDateGroup(n.createdAt) === 'Today').length,\n    [notifications]\n  );\n\n  const thisWeekCount = useMemo(() => {\n    const weekAgo = new Date(Date.now() - 7 * 24 * 60 * 60 * 1000);\n    return notifications.filter((n) => new Date(n.createdAt) >= weekAgo).length;\n  }, [notifications]);\n\n  const tabCounts = useMemo(() => {\n    const counts: Record<TabId, number> = {\n      all: 0,\n      orders: 0,\n      promotions: 0,\n      system: 0,\n      unread: 0,\n    };\n    for (const n of notifications) {\n      counts.all++;\n      if (!n.isRead) counts.unread++;\n      if (n.type === 'order_update' || n.type === 'delivery') counts.orders++;\n      if (n.type === 'promotion') counts.promotions++;\n      if (n.type === 'system' || n.type === 'alert' || n.type === 'account') counts.system++;\n    }\n    return counts;\n  }, [notifications]);\n\n  // ---------------------------------------------------------------------------\n  // Filtered & sorted list\n  // ---------------------------------------------------------------------------\n\n  const filteredNotifications = useMemo(() => {\n    let list = [...notifications];\n\n    // Tab filter\n    switch (activeTab) {\n      case'orders':\n        list = list.filter((n) => n.type === 'order_update' || n.type === 'delivery');\n        break;\n      case'promotions':\n        list = list.filter((n) => n.type === 'promotion');\n        break;\n      case'system':\n        list = list.filter(\n          (n) => n.type === 'system' || n.type === 'alert' || n.type === 'account'\n        );\n        break;\n      case'unread':\n        list = list.filter((n) => !n.isRead);\n        break;\n    }\n\n    // Search filter\n    if (searchQuery) {\n      const q = searchQuery.toLowerCase();\n      list = list.filter(\n        (n) => n.title.toLowerCase().includes(q) || n.message.toLowerCase().includes(q)\n      );\n    }\n\n    // Sort\n    switch (sortBy) {\n      case'recent':\n        list.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());\n        break;\n      case'priority':\n        list.sort((a, b) => priorityOrder[b.priority] - priorityOrder[a.priority]);\n        break;\n      case'unread':\n        list.sort((a, b) => (a.isRead === b.isRead ? 0 : a.isRead ? 1 : -1));\n        break;\n    }\n\n    return list;\n  }, [notifications, activeTab, searchQuery, sortBy]);\n\n  // Grouped by date\n  const grouped = useMemo(() => groupByDate(filteredNotifications), [filteredNotifications]);\n\n  // ---------------------------------------------------------------------------\n  // Actions\n  // ---------------------------------------------------------------------------\n\n  const markAsRead = useCallback((id: string) => {\n    setNotifications((prev) => prev.map((n) => (n.id === id ? { ...n, isRead: true } : n)));\n  }, []);\n\n  const markAllAsRead = useCallback(() => {\n    setNotifications((prev) => prev.map((n) => ({ ...n, isRead: true })));\n  }, []);\n\n  const deleteNotification = useCallback((id: string) => {\n    setNotifications((prev) => prev.filter((n) => n.id !== id));\n  }, []);\n\n  const handleAction = useCallback(\n    (notif: Notification) => {\n      if (!notif.isRead) markAsRead(notif.id);\n      if (notif.actionUrl) navigateTo(notif.actionUrl);\n    },\n    [markAsRead, navigateTo]\n  );\n\n  const clearAll = useCallback(() => {\n    if (window.confirm('Are you sure you want to clear all notifications?')) {\n      setNotifications([]);\n    }\n  }, []);\n\n  // ---------------------------------------------------------------------------\n  // Render\n  // ---------------------------------------------------------------------------\n\n  return (\n    <PageLayout\n      title=\"Notifications\"\n      description={\n        unreadCount > 0\n          ? `${unreadCount} unread notification${unreadCount !== 1 ? 's' : ''}`\n          : 'All caught up!'\n      }\n      actions={\n        <div className=\"flex items-center gap-2\">\n          {notifications.length > 0 && (\n            <button\n              type=\"button\"\n              onClick={clearAll}\n              className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-secondary hover:text-text-primary hover:bg-accent transition-colors\"\n            >\n              <Trash2 className=\"h-4 w-4\" />\n              <span className=\"hidden sm:inline\">Clear All</span>\n            </button>\n          )}\n          {unreadCount > 0 && (\n            <button\n              type=\"button\"\n              onClick={markAllAsRead}\n              className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n            >\n              <CheckCheck className=\"h-4 w-4\" />\n              Mark All Read\n            </button>\n          )}\n        </div>\n      }\n    >\n      {/* ---- Stats Overview ---- */}\n      <div className=\"grid grid-cols-2 gap-3 sm:grid-cols-5 mb-6\">\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3 text-center\">\n          <p className=\"text-2xl font-bold text-text-primary\">{notifications.length}</p>\n          <p className=\"text-xs text-text-secondary\">Total</p>\n        </div>\n        <div className=\"rounded-lg border border-accent-blue-subtle/30 bg-accent-blue-subtle/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-accent-blue\">{unreadCount}</p>\n          <p className=\"text-xs text-text-secondary\">Unread</p>\n        </div>\n        <div className=\"rounded-lg border border-status-error-border/30 bg-status-error-bg-subtle/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-status-error-text\">{urgentCount}</p>\n          <p className=\"text-xs text-text-secondary\">Urgent</p>\n        </div>\n        <div className=\"rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-status-success-text\">{todayCount}</p>\n          <p className=\"text-xs text-text-secondary\">Today</p>\n        </div>\n        <div className=\"rounded-lg border border-status-warning-border/30 bg-status-warning-bg-subtle/5 p-3 text-center\">\n          <p className=\"text-2xl font-bold text-status-warning-text\">{thisWeekCount}</p>\n          <p className=\"text-xs text-text-secondary\">This Week</p>\n        </div>\n      </div>\n\n      {/* ---- Tabs ---- */}\n      <div className=\"flex items-center gap-2 mb-4 overflow-x-auto pb-1\">\n        {tabs.map((tab) => {\n          const TabIcon = tab.icon;\n          return (\n            <button\n              key={tab.id}\n              type=\"button\"\n              onClick={() => setActiveTab(tab.id)}\n              className={cn(\n                'flex items-center gap-1.5 whitespace-nowrap rounded-full border px-3 py-1.5 text-sm font-medium transition-colors',\n                activeTab === tab.id\n                  ? 'border-primary bg-action-primary-bg/10 text-text-primary'\n                  : 'border-border-subtle text-text-secondary hover:text-text-primary hover:border-accent-foreground/20'\n              )}\n            >\n              <TabIcon className=\"h-3.5 w-3.5\" />\n              {tab.label}\n              <span\n                className={cn(\n                  'inline-flex h-5 min-w-[20px] items-center justify-center rounded-full px-1 text-xs',\n                  activeTab === tab.id\n                    ? 'bg-action-primary-bg text-action-primary-text'\n                    : 'bg-bg-sunken text-text-secondary'\n                )}\n              >\n                {tabCounts[tab.id]}\n              </span>\n            </button>\n          );\n        })}\n      </div>\n\n      {/* ---- Search & Sort ---- */}\n      <div className=\"flex items-center gap-3 mb-6\">\n        <div className=\"relative flex-1\">\n          <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n          <input\n            type=\"text\"\n            placeholder=\"Search notifications...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2.5 pl-10 pr-9 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          />\n          {searchQuery && (\n            <button\n              type=\"button\"\n              onClick={() => setSearchQuery('')}\n              className=\"absolute right-3 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary\"\n            >\n              <X className=\"h-4 w-4\" />\n            </button>\n          )}\n        </div>\n\n        {/* Sort dropdown */}\n        <div className=\"relative\">\n          <button\n            type=\"button\"\n            onClick={() => setShowSortMenu(!showSortMenu)}\n            className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n          >\n            <ArrowUpDown className=\"h-4 w-4\" />\n            <span className=\"hidden sm:inline\">Sort</span>\n          </button>\n          {showSortMenu && (\n            <>\n              {/* Backdrop */}\n              <div className=\"fixed inset-0 z-10\" onClick={() => setShowSortMenu(false)} />\n              <div className=\"absolute right-0 top-full mt-1 z-20 w-44 rounded-lg border border-border-subtle bg-bg-surface shadow-lg py-1\">\n                {(\n                  [\n                    { value: 'recent', label: 'Most Recent' },\n                    { value: 'priority', label: 'By Priority' },\n                    { value: 'unread', label: 'Unread First' },\n                  ] as const\n                ).map((opt) => (\n                  <button\n                    key={opt.value}\n                    type=\"button\"\n                    onClick={() => {\n                      setSortBy(opt.value);\n                      setShowSortMenu(false);\n                    }}\n                    className={cn(\n                      'w-full text-left px-3 py-2 text-sm transition-colors',\n                      sortBy === opt.value\n                        ? 'bg-action-primary-bg/10 text-text-primary font-medium'\n                        : 'text-text-secondary hover:bg-accent hover:text-text-primary'\n                    )}\n                  >\n                    {opt.label}\n                  </button>\n                ))}\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n\n      {/* ---- Notification List ---- */}\n      {filteredNotifications.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-notifications\"\n          icon={<Bell className=\"h-12 w-12\" />}\n          title=\"No notifications\"\n          description={\n            searchQuery\n              ? 'No notifications match your search. Try different keywords.'\n              : activeTab === 'unread'\n                ? \"You're all caught up! No unread notifications.\"\n                : 'No notifications in this category yet.'\n          }\n          action={\n            searchQuery ? (\n              <button\n                type=\"button\"\n                onClick={() => setSearchQuery('')}\n                className=\"rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                Clear Search\n              </button>\n            ) : activeTab !== 'all' ? (\n              <button\n                type=\"button\"\n                onClick={() => setActiveTab('all')}\n                className=\"rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                View All Notifications\n              </button>\n            ) : undefined\n          }\n        />\n      ) : (\n        <div className=\"space-y-6\">\n          {grouped.map((group) => (\n            <div key={group.label}>\n              {/* Date group header */}\n              <div className=\"flex items-center gap-3 mb-2\">\n                <h3 className=\"text-xs font-semibold uppercase tracking-wider text-text-secondary\">\n                  {group.label}\n                </h3>\n                <div className=\"flex-1 border-t border-border-subtle\" />\n                <span className=\"text-xs text-text-secondary\">\n                  {group.items.length} notification{group.items.length !== 1 ? 's' : ''}\n                </span>\n              </div>\n\n              {/* Notification cards */}\n              <div className=\"rounded-lg border border-border-subtle bg-bg-surface divide-y divide-border overflow-hidden\">\n                {group.items.map((notif) => {\n                  const config = typeConfig[notif.type] ?? typeConfig.system;\n                  const NotifIcon = config.icon;\n\n                  return (\n                    <div\n                      key={notif.id}\n                      className={cn(\n                        'flex items-start gap-3 px-4 py-4 border-l-4 transition-colors',\n                        priorityBorderColors[notif.priority],\n                        !notif.isRead && 'bg-accent/30'\n                      )}\n                    >\n                      {/* Type icon */}\n                      <div\n                        className={cn(\n                          'flex h-10 w-10 shrink-0 items-center justify-center rounded-full',\n                          config.bg\n                        )}\n                      >\n                        <NotifIcon className={cn('h-5 w-5', config.color)} />\n                      </div>\n\n                      {/* Content */}\n                      <div className=\"flex-1 min-w-0\">\n                        {/* Title row */}\n                        <div className=\"flex items-center gap-2 flex-wrap\">\n                          <h4\n                            className={cn(\n                              'text-sm text-text-primary',\n                              !notif.isRead ? 'font-semibold' : 'font-medium'\n                            )}\n                          >\n                            {notif.title}\n                          </h4>\n                          {!notif.isRead && (\n                            <span className=\"h-2 w-2 rounded-full bg-action-primary-bg shrink-0\" />\n                          )}\n                          <span\n                            className={cn(\n                              'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                              priorityStyles[notif.priority]\n                            )}\n                          >\n                            {notif.priority}\n                          </span>\n                        </div>\n\n                        {/* Message */}\n                        <p className=\"mt-1 text-sm text-text-secondary leading-relaxed\">\n                          {notif.message}\n                        </p>\n\n                        {/* Metadata row */}\n                        <div className=\"mt-2 flex items-center gap-3 flex-wrap\">\n                          <span className=\"flex items-center gap-1 text-xs text-text-secondary\">\n                            <Clock className=\"h-3 w-3\" />\n                            {formatRelativeTime(notif.createdAt)}\n                          </span>\n                          <span\n                            className={cn(\n                              'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                              config.bg,\n                              config.color\n                            )}\n                          >\n                            {config.label}\n                          </span>\n                          {notif.metadata?.orderId && (\n                            <span className=\"text-xs text-text-secondary\">\n                              #{notif.metadata.orderId}\n                            </span>\n                          )}\n                        </div>\n\n                        {/* Action buttons row */}\n                        <div className=\"mt-3 flex items-center gap-2 flex-wrap\">\n                          {notif.actionUrl && (\n                            <button\n                              type=\"button\"\n                              onClick={() => handleAction(notif)}\n                              className=\"rounded-lg bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bg/90 transition-colors\"\n                            >\n                              {notif.actionText ?? 'View'}\n                            </button>\n                          )}\n                          {!notif.isRead && (\n                            <button\n                              type=\"button\"\n                              onClick={() => markAsRead(notif.id)}\n                              title=\"Mark as read\"\n                              className=\"flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n                            >\n                              <Check className=\"h-3 w-3\" />\n                              Mark Read\n                            </button>\n                          )}\n                          <button\n                            type=\"button\"\n                            onClick={() => deleteNotification(notif.id)}\n                            title=\"Delete notification\"\n                            className=\"flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-error-text hover:bg-status-error-bg/10 transition-colors\"\n                          >\n                            <Trash2 className=\"h-3 w-3\" />\n                            Delete\n                          </button>\n                        </div>\n                      </div>\n\n                      {/* Read/unread indicator */}\n                      <div className=\"shrink-0 pt-1\">\n                        {notif.isRead ? (\n                          <MailOpen className=\"h-4 w-4 text-text-secondary/40\" />\n                        ) : (\n                          <Bell className=\"h-4 w-4 text-primary\" />\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* ---- Footer summary ---- */}\n      {filteredNotifications.length > 0 && (\n        <div className=\"mt-6 flex items-center justify-between rounded-lg border border-border-subtle bg-bg-surface px-4 py-3\">\n          <p className=\"text-sm text-text-secondary\">\n            Showing {filteredNotifications.length} of {notifications.length} notifications\n          </p>\n          {activeTab !== 'all' && (\n            <button\n              type=\"button\"\n              onClick={() => {\n                setActiveTab('all');\n                setSearchQuery('');\n              }}\n              className=\"flex items-center gap-1.5 text-sm font-medium text-primary hover:underline\"\n            >\n              <RefreshCw className=\"h-3.5 w-3.5\" />\n              Show All\n            </button>\n          )}\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}