@burdenoff/microfe-adaptercloud 2026.624.1 → 2026.625.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (103) hide show
  1. package/dist/adaptercloud/components/EmptyState.js +17 -21
  2. package/dist/adaptercloud/components/EmptyState.js.map +1 -1
  3. package/dist/adaptercloud/components/InvestmentCard.js +25 -23
  4. package/dist/adaptercloud/components/InvestmentCard.js.map +1 -1
  5. package/dist/adaptercloud/components/MetricsCard.js +18 -12
  6. package/dist/adaptercloud/components/MetricsCard.js.map +1 -1
  7. package/dist/adaptercloud/components/PageLayout.js +38 -19
  8. package/dist/adaptercloud/components/PageLayout.js.map +1 -1
  9. package/dist/adaptercloud/components/RatingDisplay.js +3 -3
  10. package/dist/adaptercloud/components/RatingDisplay.js.map +1 -1
  11. package/dist/adaptercloud/components/StatusBadge.js +36 -16
  12. package/dist/adaptercloud/components/StatusBadge.js.map +1 -1
  13. package/dist/adaptercloud/pages/HomePage.js +242 -231
  14. package/dist/adaptercloud/pages/HomePage.js.map +1 -1
  15. package/dist/adaptercloud/pages/admin/AdminAnalyticsPage.js +33 -33
  16. package/dist/adaptercloud/pages/admin/AdminAnalyticsPage.js.map +1 -1
  17. package/dist/adaptercloud/pages/admin/AdminDashboard.js +32 -32
  18. package/dist/adaptercloud/pages/admin/AdminDashboard.js.map +1 -1
  19. package/dist/adaptercloud/pages/admin/AdminFinancialPage.js +11 -11
  20. package/dist/adaptercloud/pages/admin/AdminFinancialPage.js.map +1 -1
  21. package/dist/adaptercloud/pages/admin/AdminOrdersPage.js +11 -11
  22. package/dist/adaptercloud/pages/admin/AdminOrdersPage.js.map +1 -1
  23. package/dist/adaptercloud/pages/admin/AdminProfilePage.js +3 -3
  24. package/dist/adaptercloud/pages/admin/AdminProfilePage.js.map +1 -1
  25. package/dist/adaptercloud/pages/admin/AdminSettingsPage.js +1 -1
  26. package/dist/adaptercloud/pages/admin/AdminSettingsPage.js.map +1 -1
  27. package/dist/adaptercloud/pages/admin/CartManagementPage.js +28 -28
  28. package/dist/adaptercloud/pages/admin/CartManagementPage.js.map +1 -1
  29. package/dist/adaptercloud/pages/admin/UserManagementPage.js +25 -25
  30. package/dist/adaptercloud/pages/admin/UserManagementPage.js.map +1 -1
  31. package/dist/adaptercloud/pages/cart-owner/AnalyticsDashboard.js +19 -19
  32. package/dist/adaptercloud/pages/cart-owner/AnalyticsDashboard.js.map +1 -1
  33. package/dist/adaptercloud/pages/cart-owner/BusinessSettingsPage.js +7 -7
  34. package/dist/adaptercloud/pages/cart-owner/BusinessSettingsPage.js.map +1 -1
  35. package/dist/adaptercloud/pages/cart-owner/CartOwnerDashboard.js +40 -37
  36. package/dist/adaptercloud/pages/cart-owner/CartOwnerDashboard.js.map +1 -1
  37. package/dist/adaptercloud/pages/cart-owner/CartOwnerProfilePage.js +21 -21
  38. package/dist/adaptercloud/pages/cart-owner/CartOwnerProfilePage.js.map +1 -1
  39. package/dist/adaptercloud/pages/cart-owner/CartServiceConfigPage.js +24 -24
  40. package/dist/adaptercloud/pages/cart-owner/CartServiceConfigPage.js.map +1 -1
  41. package/dist/adaptercloud/pages/cart-owner/InventoryManagementPage.js +20 -20
  42. package/dist/adaptercloud/pages/cart-owner/InventoryManagementPage.js.map +1 -1
  43. package/dist/adaptercloud/pages/cart-owner/OrderManagementPage.js +36 -36
  44. package/dist/adaptercloud/pages/cart-owner/OrderManagementPage.js.map +1 -1
  45. package/dist/adaptercloud/pages/cart-owner/StaffManagementPage.js +25 -25
  46. package/dist/adaptercloud/pages/cart-owner/StaffManagementPage.js.map +1 -1
  47. package/dist/adaptercloud/pages/common/HelpSupportPage.js +43 -43
  48. package/dist/adaptercloud/pages/common/HelpSupportPage.js.map +1 -1
  49. package/dist/adaptercloud/pages/common/NotificationCenterPage.js +32 -31
  50. package/dist/adaptercloud/pages/common/NotificationCenterPage.js.map +1 -1
  51. package/dist/adaptercloud/pages/common/SettingsPage.js +8 -8
  52. package/dist/adaptercloud/pages/common/SettingsPage.js.map +1 -1
  53. package/dist/adaptercloud/pages/customer/BookingDetailsPage.js +22 -21
  54. package/dist/adaptercloud/pages/customer/BookingDetailsPage.js.map +1 -1
  55. package/dist/adaptercloud/pages/customer/CartDetailPage.js +18 -17
  56. package/dist/adaptercloud/pages/customer/CartDetailPage.js.map +1 -1
  57. package/dist/adaptercloud/pages/customer/CartDiscoveryPage.js +12 -11
  58. package/dist/adaptercloud/pages/customer/CartDiscoveryPage.js.map +1 -1
  59. package/dist/adaptercloud/pages/customer/CheckoutPage.js +9 -9
  60. package/dist/adaptercloud/pages/customer/CheckoutPage.js.map +1 -1
  61. package/dist/adaptercloud/pages/customer/CustomerDashboard.js +30 -30
  62. package/dist/adaptercloud/pages/customer/CustomerDashboard.js.map +1 -1
  63. package/dist/adaptercloud/pages/customer/CustomerProfilePage.js +19 -19
  64. package/dist/adaptercloud/pages/customer/CustomerProfilePage.js.map +1 -1
  65. package/dist/adaptercloud/pages/customer/DirectServiceBookingPage.js +24 -23
  66. package/dist/adaptercloud/pages/customer/DirectServiceBookingPage.js.map +1 -1
  67. package/dist/adaptercloud/pages/customer/FavoritesPage.js +9 -8
  68. package/dist/adaptercloud/pages/customer/FavoritesPage.js.map +1 -1
  69. package/dist/adaptercloud/pages/customer/OrderHistoryPage.js +4 -3
  70. package/dist/adaptercloud/pages/customer/OrderHistoryPage.js.map +1 -1
  71. package/dist/adaptercloud/pages/customer/OrderTrackingPage.js +15 -14
  72. package/dist/adaptercloud/pages/customer/OrderTrackingPage.js.map +1 -1
  73. package/dist/adaptercloud/pages/customer/PaymentMethodsPage.js +10 -9
  74. package/dist/adaptercloud/pages/customer/PaymentMethodsPage.js.map +1 -1
  75. package/dist/adaptercloud/pages/customer/ReviewsPage.js +18 -17
  76. package/dist/adaptercloud/pages/customer/ReviewsPage.js.map +1 -1
  77. package/dist/adaptercloud/pages/customer/SavedAddressesPage.js +14 -13
  78. package/dist/adaptercloud/pages/customer/SavedAddressesPage.js.map +1 -1
  79. package/dist/adaptercloud/pages/investor/InvestmentDetailsPage.js +32 -32
  80. package/dist/adaptercloud/pages/investor/InvestmentDetailsPage.js.map +1 -1
  81. package/dist/adaptercloud/pages/investor/InvestmentOpportunitiesPage.js +14 -13
  82. package/dist/adaptercloud/pages/investor/InvestmentOpportunitiesPage.js.map +1 -1
  83. package/dist/adaptercloud/pages/investor/InvestorAnalyticsPage.js +27 -27
  84. package/dist/adaptercloud/pages/investor/InvestorAnalyticsPage.js.map +1 -1
  85. package/dist/adaptercloud/pages/investor/InvestorDashboard.js +16 -16
  86. package/dist/adaptercloud/pages/investor/InvestorDashboard.js.map +1 -1
  87. package/dist/adaptercloud/pages/investor/InvestorInvestmentsPage.js +9 -8
  88. package/dist/adaptercloud/pages/investor/InvestorInvestmentsPage.js.map +1 -1
  89. package/dist/adaptercloud/pages/investor/InvestorPortfolioPage.js +12 -12
  90. package/dist/adaptercloud/pages/investor/InvestorPortfolioPage.js.map +1 -1
  91. package/dist/adaptercloud/pages/investor/InvestorProfilePage.js +19 -19
  92. package/dist/adaptercloud/pages/investor/InvestorProfilePage.js.map +1 -1
  93. package/dist/adaptercloud/pages/worker/TaskDetailsPage.js +26 -25
  94. package/dist/adaptercloud/pages/worker/TaskDetailsPage.js.map +1 -1
  95. package/dist/adaptercloud/pages/worker/WorkerDashboard.js +43 -43
  96. package/dist/adaptercloud/pages/worker/WorkerDashboard.js.map +1 -1
  97. package/dist/adaptercloud/pages/worker/WorkerOrdersPage.js +37 -36
  98. package/dist/adaptercloud/pages/worker/WorkerOrdersPage.js.map +1 -1
  99. package/dist/adaptercloud/pages/worker/WorkerProfilePage.js +34 -34
  100. package/dist/adaptercloud/pages/worker/WorkerProfilePage.js.map +1 -1
  101. package/dist/adaptercloud/pages/worker/WorkerSchedulePage.js +27 -25
  102. package/dist/adaptercloud/pages/worker/WorkerSchedulePage.js.map +1 -1
  103. package/package.json +3 -3
@@ -1 +1 @@
1
- {"version":3,"file":"DirectServiceBookingPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/DirectServiceBookingPage.tsx"],"sourcesContent":["/**\n * Direct Service Booking Page\n * @module adaptercloud/pages/customer\n *\n * 4-step wizard: Location > Details > Payment > Confirmation.\n * Progress indicator, step validation, geolocation button,\n * address fields, preferred time slot selector (30-min slots),\n * urgent booking checkbox, payment method selection,\n * payment summary, confirmation step with checkmark/IDs/next steps.\n */\n\nimport { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n ArrowLeft,\n ArrowRight,\n MapPin,\n Calendar,\n Clock,\n CreditCard,\n Smartphone,\n Wallet,\n CheckCircle2,\n AlertCircle,\n Navigation,\n Phone,\n Home,\n Loader2,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { getCartById } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency } from '../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype Step = 'location' | 'details' | 'payment' | 'confirmation';\nconst STEPS: Step[] = ['location', 'details', 'payment', 'confirmation'];\nconst STEP_LABELS: Record<Step, string> = {\n location: 'Location',\n details: 'Details',\n payment: 'Payment',\n confirmation: 'Confirmation',\n};\n\ninterface ServiceLocation {\n address: string;\n landmark: string;\n instructions: string;\n phoneNumber: string;\n}\n\ninterface BookingDetails {\n preferredTime: string;\n specialInstructions: string;\n isUrgent: boolean;\n}\n\ninterface ConfirmationData {\n bookingId: string;\n transactionId: string;\n estimatedArrival: string;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction generateTimeSlots(): { value: string; label: string }[] {\n const slots: { value: string; label: string }[] = [];\n const now = new Date();\n const start = new Date(now.getTime() + 30 * 60000); // 30 min from now\n\n for (let i = 0; i < 8; i++) {\n const time = new Date(start.getTime() + i * 30 * 60000);\n const val = time.toTimeString().slice(0, 5);\n const lbl = time.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n slots.push({ value: val, label: lbl });\n }\n\n return slots;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function DirectServiceBookingPage() {\n const { cartId } = useParams<{ cartId: string }>();\n const { navigateTo } = useAdapterCloud();\n\n const cart = useMemo(() => (cartId ? getCartById(cartId) : undefined), [cartId]);\n\n const [step, setStep] = useState<Step>('location');\n const [submitting, setSubmitting] = useState(false);\n\n // Location step\n const [location, setLocation] = useState<ServiceLocation>({\n address: '',\n landmark: '',\n instructions: '',\n phoneNumber: '',\n });\n\n // Details step\n const [details, setDetails] = useState<BookingDetails>({\n preferredTime: '',\n specialInstructions: '',\n isUrgent: false,\n });\n\n // Payment step\n const [paymentMethod, setPaymentMethod] = useState<'upi' | 'card' | 'wallet'>('upi');\n\n // Confirmation data\n const [confirmation, setConfirmation] = useState<ConfirmationData | null>(null);\n\n // Mock pricing\n const advancePayment = 100;\n const serviceFee = 50;\n const balancePayment = serviceFee;\n const totalAmount = advancePayment + serviceFee;\n\n // --- Not found ---\n if (!cart) {\n return (\n <PageLayout title=\"Cart Not Found\">\n <EmptyState\n icon={<Home className=\"h-12 w-12\" />}\n title=\"Service not available\"\n description=\"Direct service is not available for this cart.\"\n action={\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n Browse Carts\n </button>\n }\n />\n </PageLayout>\n );\n }\n\n const timeSlots = generateTimeSlots();\n const stepIndex = STEPS.indexOf(step);\n\n // --- Geolocation ---\n const handleGetLocation = () => {\n if (!navigator.geolocation) {\n alert('Geolocation is not supported by this browser.');\n return;\n }\n navigator.geolocation.getCurrentPosition(\n () => {\n setLocation((p) => ({ ...p, address: p.address || 'Current location detected' }));\n alert('Location detected successfully!');\n },\n () => {\n alert('Failed to get your location. Please enter address manually.');\n }\n );\n };\n\n // --- Validation ---\n const validateLocation = (): boolean => {\n if (!location.address.trim()) {\n alert('Please enter your address.');\n return false;\n }\n if (!location.phoneNumber.trim()) {\n alert('Please enter your phone number.');\n return false;\n }\n return true;\n };\n\n const validateDetails = (): boolean => {\n if (!details.preferredTime) {\n alert('Please select a preferred time slot.');\n return false;\n }\n return true;\n };\n\n // --- Navigation ---\n const nextStep = () => {\n if (step === 'location' && validateLocation()) setStep('details');\n else if (step === 'details' && validateDetails()) setStep('payment');\n else if (step === 'payment') handleBookingSubmit();\n };\n\n const prevStep = () => {\n if (step === 'details') setStep('location');\n else if (step === 'payment') setStep('details');\n };\n\n // --- Submit ---\n const handleBookingSubmit = () => {\n setSubmitting(true);\n setTimeout(() => {\n const bookingId = `BK-${Date.now()}`;\n const transactionId = `TXN-${Date.now()}`;\n const estimatedArrival = new Date(Date.now() + 30 * 60000).toISOString();\n setConfirmation({ bookingId, transactionId, estimatedArrival });\n setStep('confirmation');\n setSubmitting(false);\n }, 1500);\n };\n\n return (\n <PageLayout\n title={\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n >\n <ArrowLeft className=\"h-5 w-5\" />\n </button>\n <div>\n <span>Book Direct Service</span>\n <p className=\"text-xs font-normal text-text-secondary\">{cart.name}</p>\n </div>\n </div>\n }\n >\n {/* Progress Indicator */}\n <div className=\"flex items-center justify-between mb-6 px-2\">\n {STEPS.map((s, i) => {\n const isCompleted = i < stepIndex;\n const isCurrent = s === step;\n return (\n <div key={s} className=\"flex items-center\">\n <div className=\"flex flex-col items-center\">\n <div\n className={cn(\n 'flex h-8 w-8 items-center justify-center rounded-full text-xs font-medium',\n isCompleted\n ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n : isCurrent\n ? 'bg-foreground text-background'\n : 'bg-bg-sunken text-text-secondary'\n )}\n >\n {isCompleted ? <CheckCircle2 className=\"h-4 w-4\" /> : i + 1}\n </div>\n <span\n className={cn(\n 'mt-1 text-[10px]',\n isCurrent ? 'font-medium text-text-primary' : 'text-text-secondary'\n )}\n >\n {STEP_LABELS[s]}\n </span>\n </div>\n {i < STEPS.length - 1 && (\n <div\n className={cn(\n 'mx-2 h-0.5 w-8 sm:w-16',\n isCompleted ? 'bg-green-500/30' : 'bg-border'\n )}\n />\n )}\n </div>\n );\n })}\n </div>\n\n <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n {/* Main Content */}\n <div className=\"lg:col-span-2\">\n {/* Step 1: Location */}\n {step === 'location' && (\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <MapPin className=\"h-4 w-4\" />\n Service Location\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Where should the cart come?</p>\n\n <div className=\"space-y-4\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Your Address <span className=\"text-red-500\">*</span>\n </label>\n <div className=\"flex gap-2\">\n <input\n type=\"text\"\n placeholder=\"Enter your full address\"\n value={location.address}\n onChange={(e) => setLocation((p) => ({ ...p, address: e.target.value }))}\n className=\"flex-1 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n <button\n type=\"button\"\n onClick={handleGetLocation}\n className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n >\n <Navigation className=\"h-3.5 w-3.5\" />\n Use Current Location\n </button>\n </div>\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Nearby Landmark\n </label>\n <input\n type=\"text\"\n placeholder=\"e.g., Near Metro Station, Opposite Mall\"\n value={location.landmark}\n onChange={(e) => setLocation((p) => ({ ...p, landmark: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Instructions for Cart Owner\n </label>\n <textarea\n rows={3}\n placeholder=\"Any specific instructions to help us find you...\"\n value={location.instructions}\n onChange={(e) => setLocation((p) => ({ ...p, instructions: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n />\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Phone Number <span className=\"text-red-500\">*</span>\n </label>\n <div className=\"relative\">\n <Phone className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <input\n type=\"tel\"\n placeholder=\"Enter your phone number\"\n value={location.phoneNumber}\n onChange={(e) => setLocation((p) => ({ ...p, phoneNumber: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/* Step 2: Details */}\n {step === 'details' && (\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <Calendar className=\"h-4 w-4\" />\n Booking Details\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Choose your preferred timing</p>\n\n <div className=\"space-y-4\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Preferred Time Slot <span className=\"text-red-500\">*</span>\n </label>\n <div className=\"grid grid-cols-4 gap-2\">\n {timeSlots.map((slot) => (\n <button\n key={slot.value}\n type=\"button\"\n onClick={() => setDetails((p) => ({ ...p, preferredTime: slot.value }))}\n className={cn(\n 'rounded-lg border py-2 px-2 text-xs font-medium transition-colors',\n details.preferredTime === slot.value\n ? 'border-foreground bg-accent text-text-primary'\n : 'border-border-subtle text-text-secondary hover:bg-accent hover:text-text-primary'\n )}\n >\n {slot.label}\n </button>\n ))}\n </div>\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Special Instructions\n </label>\n <textarea\n rows={3}\n placeholder=\"Any special requests or dietary preferences...\"\n value={details.specialInstructions}\n onChange={(e) =>\n setDetails((p) => ({ ...p, specialInstructions: e.target.value }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n />\n </div>\n\n <label className=\"flex items-center gap-2 cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={details.isUrgent}\n onChange={(e) => setDetails((p) => ({ ...p, isUrgent: e.target.checked }))}\n className=\"h-4 w-4 rounded border-border-subtle\"\n />\n <span className=\"text-sm text-text-secondary\">\n This is urgent (additional charges may apply)\n </span>\n </label>\n </div>\n </div>\n )}\n\n {/* Step 3: Payment */}\n {step === 'payment' && (\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <CreditCard className=\"h-4 w-4\" />\n Advance Payment\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Select your payment method</p>\n\n <div className=\"space-y-4\">\n {/* Info callout */}\n <div className=\"flex items-start gap-2 rounded-lg border border-blue-500/20 bg-blue-500/5 p-3\">\n <AlertCircle className=\"h-4 w-4 text-blue-600 dark:text-blue-400 shrink-0 mt-0.5\" />\n <p className=\"text-xs text-blue-700 dark:text-blue-300\">\n You need to pay {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}{' '}\n in advance to confirm your booking. Pay the remaining when the cart arrives.\n </p>\n </div>\n\n {/* Payment methods */}\n <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-3\">\n {[\n {\n value: 'upi' as const,\n label: 'UPI',\n sub: 'Instant payment',\n Icon: Smartphone,\n },\n {\n value: 'card' as const,\n label: 'Card',\n sub: 'Secure payment',\n Icon: CreditCard,\n },\n {\n value: 'wallet' as const,\n label: 'Wallet',\n sub: 'Quick payment',\n Icon: Wallet,\n },\n ].map(({ value, label, sub, Icon }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => setPaymentMethod(value)}\n className={cn(\n 'rounded-lg border p-3 text-center transition-colors',\n paymentMethod === value\n ? 'border-foreground bg-accent'\n : 'border-border-subtle hover:bg-accent'\n )}\n >\n <Icon className=\"mx-auto h-5 w-5 text-text-secondary mb-1\" />\n <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n <p className=\"text-[10px] text-text-secondary\">{sub}</p>\n </button>\n ))}\n </div>\n\n {/* Payment Summary */}\n <div className=\"rounded-lg bg-bg-sunken p-4\">\n <h3 className=\"text-sm font-medium text-text-primary mb-2\">Payment Summary</h3>\n <div className=\"space-y-2 text-sm\">\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Advance Payment:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Service Fee:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between text-text-secondary\">\n <span>Balance Payment (at arrival):</span>\n <span>{formatCurrency(balancePayment, { minimumFractionDigits: 0 })}</span>\n </div>\n <div className=\"flex justify-between border-t border-border-subtle pt-2 font-semibold\">\n <span className=\"text-text-primary\">Total Amount:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(totalAmount, { minimumFractionDigits: 0 })}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/* Step 4: Confirmation */}\n {step === 'confirmation' && confirmation && (\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n {/* Success header */}\n <div className=\"text-center mb-6\">\n <div className=\"mx-auto mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-green-500/10\">\n <CheckCircle2 className=\"h-7 w-7 text-green-600 dark:text-green-400\" />\n </div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-1\">Booking Confirmed!</h2>\n <p className=\"text-sm text-text-secondary\">\n Your direct service booking has been confirmed and payment processed.\n </p>\n </div>\n\n {/* Booking details */}\n <div className=\"rounded-lg bg-bg-sunken p-4 mb-4\">\n <h3 className=\"text-sm font-medium text-text-primary mb-3\">Booking Details</h3>\n <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-xs text-text-secondary\">Booking ID</span>\n <p className=\"font-mono text-xs text-text-primary\">{confirmation.bookingId}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Est. Arrival</span>\n <p className=\"text-text-primary\">\n {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n hour: '2-digit',\n minute: '2-digit',\n })}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Location</span>\n <p className=\"text-text-primary truncate\">{location.address}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Phone</span>\n <p className=\"text-text-primary\">{location.phoneNumber}</p>\n </div>\n </div>\n </div>\n\n {/* Payment details */}\n <div className=\"rounded-lg border border-green-500/20 bg-green-500/5 p-4 mb-4\">\n <h3 className=\"text-sm font-medium text-green-600 dark:text-green-400 mb-2 flex items-center gap-2\">\n <CheckCircle2 className=\"h-4 w-4\" />\n Payment Processed\n </h3>\n <div className=\"grid grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-xs text-text-secondary\">Transaction ID</span>\n <p className=\"font-mono text-xs text-text-primary\">\n {confirmation.transactionId}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Advance Paid</span>\n <p className=\"font-medium text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Method</span>\n <p className=\"capitalize text-text-primary\">{paymentMethod}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Status</span>\n <p className=\"font-medium text-green-600 dark:text-green-400\">Paid</p>\n </div>\n </div>\n </div>\n\n {/* Next Steps */}\n <div className=\"rounded-lg border border-blue-500/20 bg-blue-500/5 p-4 mb-6\">\n <h3 className=\"text-sm font-medium text-blue-600 dark:text-blue-400 mb-2\">\n Next Steps\n </h3>\n <div className=\"space-y-2 text-xs text-blue-700 dark:text-blue-300\">\n <div className=\"flex items-start gap-2\">\n <CheckCircle2 className=\"h-3.5 w-3.5 text-green-600 mt-0.5 shrink-0\" />\n <span>\n Payment confirmed -{' '}\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })} paid\n </span>\n </div>\n <div className=\"flex items-start gap-2\">\n <Clock className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n <span>\n Cart will arrive around{' '}\n {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n hour: '2-digit',\n minute: '2-digit',\n })}\n </span>\n </div>\n <div className=\"flex items-start gap-2\">\n <CreditCard className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n <span>\n Pay remaining {formatCurrency(balancePayment, { minimumFractionDigits: 0 })}{' '}\n when cart arrives\n </span>\n </div>\n </div>\n </div>\n\n {/* Action buttons */}\n <div className=\"flex gap-3\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/bookings/${confirmation.bookingId}`)}\n className=\"flex-1 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n View Booking\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n >\n Browse More\n </button>\n </div>\n </div>\n )}\n\n {/* Navigation Buttons */}\n {step !== 'confirmation' && (\n <div className=\"flex justify-between mt-5\">\n <button\n type=\"button\"\n onClick={prevStep}\n disabled={step === 'location'}\n className={cn(\n 'flex items-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary transition-colors',\n step === 'location' ? 'opacity-40 cursor-not-allowed' : 'hover:bg-accent'\n )}\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Previous\n </button>\n <button\n type=\"button\"\n onClick={nextStep}\n disabled={submitting}\n className={cn(\n 'flex items-center gap-2 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background transition-opacity',\n submitting ? 'opacity-60 cursor-not-allowed' : 'hover:opacity-90'\n )}\n >\n {submitting ? (\n <>\n <Loader2 className=\"h-4 w-4 animate-spin\" />\n {step === 'payment' ? 'Processing Payment...' : 'Processing...'}\n </>\n ) : (\n <>\n {step === 'payment' ? 'Confirm & Pay' : 'Next'}\n <ArrowRight className=\"h-4 w-4\" />\n </>\n )}\n </button>\n </div>\n )}\n </div>\n\n {/* Sidebar: Service Summary */}\n <div className=\"lg:col-span-1\">\n <div className=\"sticky top-6 rounded-lg border border-border-subtle bg-bg-surface p-5\">\n <h3 className=\"text-base font-semibold text-text-primary mb-4\">Service Summary</h3>\n\n <div className=\"flex items-center gap-3 mb-4\">\n <img src={cart.image} alt={cart.name} className=\"h-12 w-12 rounded-lg object-cover\" />\n <div>\n <p className=\"text-sm font-medium text-text-primary\">{cart.name}</p>\n <p className=\"text-xs text-text-secondary\">{cart.category}</p>\n </div>\n </div>\n\n <div className=\"space-y-2 text-sm border-t border-border-subtle pt-3\">\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Service Fee:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Advance Payment:</span>\n <span className=\"font-medium text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </span>\n </div>\n </div>\n\n <div className=\"flex items-center gap-2 mt-3 pt-3 border-t border-border-subtle text-green-600 dark:text-green-400\">\n <CheckCircle2 className=\"h-3.5 w-3.5\" />\n <span className=\"text-xs\">Pay remaining amount at cart</span>\n </div>\n </div>\n </div>\n </div>\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"DirectServiceBookingPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/DirectServiceBookingPage.tsx"],"sourcesContent":["/**\n * Direct Service Booking Page\n * @module adaptercloud/pages/customer\n *\n * 4-step wizard: Location > Details > Payment > Confirmation.\n * Progress indicator, step validation, geolocation button,\n * address fields, preferred time slot selector (30-min slots),\n * urgent booking checkbox, payment method selection,\n * payment summary, confirmation step with checkmark/IDs/next steps.\n */\n\nimport { useState, useMemo } from'react';\nimport { useParams } from'react-router-dom';\nimport {\n ArrowLeft,\n ArrowRight,\n MapPin,\n Calendar,\n Clock,\n CreditCard,\n Smartphone,\n Wallet,\n CheckCircle2,\n AlertCircle,\n Navigation,\n Phone,\n Home,\n Loader2,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { getCartById } from'../../mocks/data';\nimport { cn } from'../../utils/cn';\nimport { formatCurrency } from'../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype Step = 'location' | 'details' | 'payment' | 'confirmation';\nconst STEPS: Step[] = ['location', 'details', 'payment', 'confirmation'];\nconst STEP_LABELS: Record<Step, string> = {\n location: 'Location',\n details: 'Details',\n payment: 'Payment',\n confirmation: 'Confirmation',\n};\n\ninterface ServiceLocation {\n address: string;\n landmark: string;\n instructions: string;\n phoneNumber: string;\n}\n\ninterface BookingDetails {\n preferredTime: string;\n specialInstructions: string;\n isUrgent: boolean;\n}\n\ninterface ConfirmationData {\n bookingId: string;\n transactionId: string;\n estimatedArrival: string;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction generateTimeSlots(): { value: string; label: string }[] {\n const slots: { value: string; label: string }[] = [];\n const now = new Date();\n const start = new Date(now.getTime() + 30 * 60000); // 30 min from now\n\n for (let i = 0; i < 8; i++) {\n const time = new Date(start.getTime() + i * 30 * 60000);\n const val = time.toTimeString().slice(0, 5);\n const lbl = time.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n slots.push({ value: val, label: lbl });\n }\n\n return slots;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function DirectServiceBookingPage() {\n const { cartId } = useParams<{ cartId: string }>();\n const { navigateTo } = useAdapterCloud();\n\n const cart = useMemo(() => (cartId ? getCartById(cartId) : undefined), [cartId]);\n\n const [step, setStep] = useState<Step>('location');\n const [submitting, setSubmitting] = useState(false);\n\n // Location step\n const [location, setLocation] = useState<ServiceLocation>({\n address: '',\n landmark: '',\n instructions: '',\n phoneNumber: '',\n });\n\n // Details step\n const [details, setDetails] = useState<BookingDetails>({\n preferredTime: '',\n specialInstructions: '',\n isUrgent: false,\n });\n\n // Payment step\n const [paymentMethod, setPaymentMethod] = useState<'upi' | 'card' | 'wallet'>('upi');\n\n // Confirmation data\n const [confirmation, setConfirmation] = useState<ConfirmationData | null>(null);\n\n // Mock pricing\n const advancePayment = 100;\n const serviceFee = 50;\n const balancePayment = serviceFee;\n const totalAmount = advancePayment + serviceFee;\n\n // --- Not found ---\n if (!cart) {\n return (\n <PageLayout title=\"Cart Not Found\">\n <EmptyState\n illustration=\"empty-search\"\n icon={<Home className=\"h-12 w-12\" />}\n title=\"Service not available\"\n description=\"Direct service is not available for this cart.\"\n action={\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n Browse Carts\n </button>\n }\n />\n </PageLayout>\n );\n }\n\n const timeSlots = generateTimeSlots();\n const stepIndex = STEPS.indexOf(step);\n\n // --- Geolocation ---\n const handleGetLocation = () => {\n if (!navigator.geolocation) {\n alert('Geolocation is not supported by this browser.');\n return;\n }\n navigator.geolocation.getCurrentPosition(\n () => {\n setLocation((p) => ({ ...p, address: p.address || 'Current location detected' }));\n alert('Location detected successfully!');\n },\n () => {\n alert('Failed to get your location. Please enter address manually.');\n }\n );\n };\n\n // --- Validation ---\n const validateLocation = (): boolean => {\n if (!location.address.trim()) {\n alert('Please enter your address.');\n return false;\n }\n if (!location.phoneNumber.trim()) {\n alert('Please enter your phone number.');\n return false;\n }\n return true;\n };\n\n const validateDetails = (): boolean => {\n if (!details.preferredTime) {\n alert('Please select a preferred time slot.');\n return false;\n }\n return true;\n };\n\n // --- Navigation ---\n const nextStep = () => {\n if (step === 'location' && validateLocation()) setStep('details');\n else if (step === 'details' && validateDetails()) setStep('payment');\n else if (step === 'payment') handleBookingSubmit();\n };\n\n const prevStep = () => {\n if (step === 'details') setStep('location');\n else if (step === 'payment') setStep('details');\n };\n\n // --- Submit ---\n const handleBookingSubmit = () => {\n setSubmitting(true);\n setTimeout(() => {\n const bookingId = `BK-${Date.now()}`;\n const transactionId = `TXN-${Date.now()}`;\n const estimatedArrival = new Date(Date.now() + 30 * 60000).toISOString();\n setConfirmation({ bookingId, transactionId, estimatedArrival });\n setStep('confirmation');\n setSubmitting(false);\n }, 1500);\n };\n\n return (\n <PageLayout\n title={\n <div className=\"flex items-center gap-3\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n >\n <ArrowLeft className=\"h-5 w-5\" />\n </button>\n <div>\n <span>Book Direct Service</span>\n <p className=\"text-xs font-normal text-text-secondary\">{cart.name}</p>\n </div>\n </div>\n }\n >\n {/* Progress Indicator */}\n <div className=\"flex items-center justify-between mb-6 px-2\">\n {STEPS.map((s, i) => {\n const isCompleted = i < stepIndex;\n const isCurrent = s === step;\n return (\n <div key={s} className=\"flex items-center\">\n <div className=\"flex flex-col items-center\">\n <div\n className={cn(\n 'flex h-8 w-8 items-center justify-center rounded-full text-xs font-medium',\n isCompleted\n ? 'bg-status-success-bg-subtle/20 text-status-success-text'\n : isCurrent\n ? 'bg-foreground text-background'\n : 'bg-bg-sunken text-text-secondary'\n )}\n >\n {isCompleted ? <CheckCircle2 className=\"h-4 w-4\" /> : i + 1}\n </div>\n <span\n className={cn(\n 'mt-1 text-[10px]',\n isCurrent ? 'font-medium text-text-primary' : 'text-text-secondary'\n )}\n >\n {STEP_LABELS[s]}\n </span>\n </div>\n {i < STEPS.length - 1 && (\n <div\n className={cn(\n 'mx-2 h-0.5 w-8 sm:w-16',\n isCompleted ? 'bg-status-success-bg-subtle/30' : 'bg-border'\n )}\n />\n )}\n </div>\n );\n })}\n </div>\n\n <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n {/* Main Content */}\n <div className=\"lg:col-span-2\">\n {/* Step 1: Location */}\n {step === 'location' && (\n <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <MapPin className=\"h-4 w-4\" />\n Service Location\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Where should the cart come?</p>\n\n <div className=\"space-y-4\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Your Address <span className=\"text-status-error-text\">*</span>\n </label>\n <div className=\"flex gap-2\">\n <input\n type=\"text\"\n placeholder=\"Enter your full address\"\n value={location.address}\n onChange={(e) => setLocation((p) => ({ ...p, address: e.target.value }))}\n className=\"flex-1 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n <button\n type=\"button\"\n onClick={handleGetLocation}\n className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n >\n <Navigation className=\"h-3.5 w-3.5\" />\n Use Current Location\n </button>\n </div>\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Nearby Landmark\n </label>\n <input\n type=\"text\"\n placeholder=\"e.g., Near Metro Station, Opposite Mall\"\n value={location.landmark}\n onChange={(e) => setLocation((p) => ({ ...p, landmark: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Instructions for Cart Owner\n </label>\n <textarea\n rows={3}\n placeholder=\"Any specific instructions to help us find you...\"\n value={location.instructions}\n onChange={(e) => setLocation((p) => ({ ...p, instructions: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n />\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Phone Number <span className=\"text-status-error-text\">*</span>\n </label>\n <div className=\"relative\">\n <Phone className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <input\n type=\"tel\"\n placeholder=\"Enter your phone number\"\n value={location.phoneNumber}\n onChange={(e) => setLocation((p) => ({ ...p, phoneNumber: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/* Step 2: Details */}\n {step === 'details' && (\n <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <Calendar className=\"h-4 w-4\" />\n Booking Details\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Choose your preferred timing</p>\n\n <div className=\"space-y-4\">\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Preferred Time Slot <span className=\"text-status-error-text\">*</span>\n </label>\n <div className=\"grid grid-cols-4 gap-2\">\n {timeSlots.map((slot) => (\n <button\n key={slot.value}\n type=\"button\"\n onClick={() => setDetails((p) => ({ ...p, preferredTime: slot.value }))}\n className={cn(\n 'rounded-lg border py-2 px-2 text-xs font-medium transition-colors',\n details.preferredTime === slot.value\n ? 'border-foreground bg-accent text-text-primary'\n : 'border-border-subtle text-text-secondary hover:bg-accent hover:text-text-primary'\n )}\n >\n {slot.label}\n </button>\n ))}\n </div>\n </div>\n\n <div>\n <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n Special Instructions\n </label>\n <textarea\n rows={3}\n placeholder=\"Any special requests or dietary preferences...\"\n value={details.specialInstructions}\n onChange={(e) =>\n setDetails((p) => ({ ...p, specialInstructions: e.target.value }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n />\n </div>\n\n <label className=\"flex items-center gap-2 cursor-pointer\">\n <input\n type=\"checkbox\"\n checked={details.isUrgent}\n onChange={(e) => setDetails((p) => ({ ...p, isUrgent: e.target.checked }))}\n className=\"h-4 w-4 rounded border-border-subtle\"\n />\n <span className=\"text-sm text-text-secondary\">\n This is urgent (additional charges may apply)\n </span>\n </label>\n </div>\n </div>\n )}\n\n {/* Step 3: Payment */}\n {step === 'payment' && (\n <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n <CreditCard className=\"h-4 w-4\" />\n Advance Payment\n </h2>\n <p className=\"text-xs text-text-secondary mb-5\">Select your payment method</p>\n\n <div className=\"space-y-4\">\n {/* Info callout */}\n <div className=\"flex items-start gap-2 rounded-lg border border-accent-blue-subtle/20 bg-accent-blue-subtle/5 p-3\">\n <AlertCircle className=\"h-4 w-4 text-accent-blue shrink-0 mt-0.5\" />\n <p className=\"text-xs text-accent-blue\">\n You need to pay {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}{' '}\n in advance to confirm your booking. Pay the remaining when the cart arrives.\n </p>\n </div>\n\n {/* Payment methods */}\n <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-3\">\n {[\n {\n value: 'upi' as const,\n label: 'UPI',\n sub: 'Instant payment',\n Icon: Smartphone,\n },\n {\n value: 'card' as const,\n label: 'Card',\n sub: 'Secure payment',\n Icon: CreditCard,\n },\n {\n value: 'wallet' as const,\n label: 'Wallet',\n sub: 'Quick payment',\n Icon: Wallet,\n },\n ].map(({ value, label, sub, Icon }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => setPaymentMethod(value)}\n className={cn(\n 'rounded-lg border p-3 text-center transition-colors',\n paymentMethod === value\n ? 'border-foreground bg-accent'\n : 'border-border-subtle hover:bg-accent'\n )}\n >\n <Icon className=\"mx-auto h-5 w-5 text-text-secondary mb-1\" />\n <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n <p className=\"text-[10px] text-text-secondary\">{sub}</p>\n </button>\n ))}\n </div>\n\n {/* Payment Summary */}\n <div className=\"rounded-lg bg-bg-sunken p-4\">\n <h3 className=\"text-sm font-medium text-text-primary mb-2\">Payment Summary</h3>\n <div className=\"space-y-2 text-sm\">\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Advance Payment:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Service Fee:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between text-text-secondary\">\n <span>Balance Payment (at arrival):</span>\n <span>{formatCurrency(balancePayment, { minimumFractionDigits: 0 })}</span>\n </div>\n <div className=\"flex justify-between border-t border-border-subtle pt-2 font-semibold\">\n <span className=\"text-text-primary\">Total Amount:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(totalAmount, { minimumFractionDigits: 0 })}\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n )}\n\n {/* Step 4: Confirmation */}\n {step === 'confirmation' && confirmation && (\n <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n {/* Success header */}\n <div className=\"text-center mb-6\">\n <div className=\"mx-auto mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-status-success-bg-subtle/10\">\n <CheckCircle2 className=\"h-7 w-7 text-status-success-text\" />\n </div>\n <h2 className=\"text-lg font-semibold text-text-primary mb-1\">Booking Confirmed!</h2>\n <p className=\"text-sm text-text-secondary\">\n Your direct service booking has been confirmed and payment processed.\n </p>\n </div>\n\n {/* Booking details */}\n <div className=\"rounded-lg bg-bg-sunken p-4 mb-4\">\n <h3 className=\"text-sm font-medium text-text-primary mb-3\">Booking Details</h3>\n <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-xs text-text-secondary\">Booking ID</span>\n <p className=\"font-mono text-xs text-text-primary\">{confirmation.bookingId}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Est. Arrival</span>\n <p className=\"text-text-primary\">\n {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n hour: '2-digit',\n minute: '2-digit',\n })}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Location</span>\n <p className=\"text-text-primary truncate\">{location.address}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Phone</span>\n <p className=\"text-text-primary\">{location.phoneNumber}</p>\n </div>\n </div>\n </div>\n\n {/* Payment details */}\n <div className=\"rounded-lg border border-status-success-border/20 bg-status-success-bg-subtle/5 p-4 mb-4\">\n <h3 className=\"text-sm font-medium text-status-success-text mb-2 flex items-center gap-2\">\n <CheckCircle2 className=\"h-4 w-4\" />\n Payment Processed\n </h3>\n <div className=\"grid grid-cols-2 gap-3 text-sm\">\n <div>\n <span className=\"text-xs text-text-secondary\">Transaction ID</span>\n <p className=\"font-mono text-xs text-text-primary\">\n {confirmation.transactionId}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Advance Paid</span>\n <p className=\"font-medium text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Method</span>\n <p className=\"capitalize text-text-primary\">{paymentMethod}</p>\n </div>\n <div>\n <span className=\"text-xs text-text-secondary\">Status</span>\n <p className=\"font-medium text-status-success-text\">Paid</p>\n </div>\n </div>\n </div>\n\n {/* Next Steps */}\n <div className=\"rounded-lg border border-accent-blue-subtle/20 bg-accent-blue-subtle/5 p-4 mb-6\">\n <h3 className=\"text-sm font-medium text-accent-blue mb-2\">\n Next Steps\n </h3>\n <div className=\"space-y-2 text-xs text-accent-blue\">\n <div className=\"flex items-start gap-2\">\n <CheckCircle2 className=\"h-3.5 w-3.5 text-status-success-text mt-0.5 shrink-0\" />\n <span>\n Payment confirmed -{' '}\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })} paid\n </span>\n </div>\n <div className=\"flex items-start gap-2\">\n <Clock className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n <span>\n Cart will arrive around{' '}\n {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n hour: '2-digit',\n minute: '2-digit',\n })}\n </span>\n </div>\n <div className=\"flex items-start gap-2\">\n <CreditCard className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n <span>\n Pay remaining {formatCurrency(balancePayment, { minimumFractionDigits: 0 })}{' '}\n when cart arrives\n </span>\n </div>\n </div>\n </div>\n\n {/* Action buttons */}\n <div className=\"flex gap-3\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/bookings/${confirmation.bookingId}`)}\n className=\"flex-1 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n View Booking\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n >\n Browse More\n </button>\n </div>\n </div>\n )}\n\n {/* Navigation Buttons */}\n {step !== 'confirmation' && (\n <div className=\"flex justify-between mt-5\">\n <button\n type=\"button\"\n onClick={prevStep}\n disabled={step === 'location'}\n className={cn(\n 'flex items-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary transition-colors',\n step === 'location' ? 'opacity-40 cursor-not-allowed' : 'hover:bg-accent'\n )}\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Previous\n </button>\n <button\n type=\"button\"\n onClick={nextStep}\n disabled={submitting}\n className={cn(\n 'flex items-center gap-2 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background transition-opacity',\n submitting ? 'opacity-60 cursor-not-allowed' : 'hover:opacity-90'\n )}\n >\n {submitting ? (\n <>\n <Loader2 className=\"h-4 w-4 animate-spin\" />\n {step === 'payment' ? 'Processing Payment...' : 'Processing...'}\n </>\n ) : (\n <>\n {step === 'payment' ? 'Confirm & Pay' : 'Next'}\n <ArrowRight className=\"h-4 w-4\" />\n </>\n )}\n </button>\n </div>\n )}\n </div>\n\n {/* Sidebar: Service Summary */}\n <div className=\"lg:col-span-1\">\n <div className=\"sticky top-6 rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n <h3 className=\"text-base font-semibold text-text-primary mb-4\">Service Summary</h3>\n\n <div className=\"flex items-center gap-3 mb-4\">\n <img src={cart.image} alt={cart.name} className=\"h-12 w-12 rounded-lg object-cover\" />\n <div>\n <p className=\"text-sm font-medium text-text-primary\">{cart.name}</p>\n <p className=\"text-xs text-text-secondary\">{cart.category}</p>\n </div>\n </div>\n\n <div className=\"space-y-2 text-sm border-t border-border-subtle pt-3\">\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Service Fee:</span>\n <span className=\"text-text-primary\">\n {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span className=\"text-text-secondary\">Advance Payment:</span>\n <span className=\"font-medium text-text-primary\">\n {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n </span>\n </div>\n </div>\n\n <div className=\"flex items-center gap-2 mt-3 pt-3 border-t border-border-subtle text-status-success-text\">\n <CheckCircle2 className=\"h-3.5 w-3.5\" />\n <span className=\"text-xs\">Pay remaining amount at cart</span>\n </div>\n </div>\n </div>\n </div>\n </PageLayout>\n );\n}\n"],"mappings":"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"}
@@ -123,7 +123,7 @@ function x() {
123
123
  ]
124
124
  }),
125
125
  /* @__PURE__ */ y("div", {
126
- className: "rounded-lg border border-border-subtle bg-bg-surface p-4 mb-6",
126
+ className: "rounded-lg border border-border-seam bg-bg-surface p-4 mb-6 bg-gloss-card shadow-pop",
127
127
  children: /* @__PURE__ */ b("div", {
128
128
  className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3",
129
129
  children: [
@@ -222,6 +222,7 @@ function x() {
222
222
  })
223
223
  }),
224
224
  M.length === 0 && N.length === 0 ? /* @__PURE__ */ y(r, {
225
+ illustration: "empty-data",
225
226
  icon: /* @__PURE__ */ y(d, { className: "h-12 w-12" }),
226
227
  title: "No favorites yet",
227
228
  description: "Browse carts and tap the heart icon to add them to your favorites.",
@@ -262,13 +263,13 @@ function x() {
262
263
  type: "button",
263
264
  onClick: () => P(e.id),
264
265
  title: "Remove from favorites",
265
- className: "absolute top-2 right-2 flex h-8 w-8 items-center justify-center rounded-full bg-bg-surface/80 backdrop-blur-sm text-red-500 hover:bg-bg-surface transition-colors",
266
+ className: "absolute top-2 right-2 flex h-8 w-8 items-center justify-center rounded-full bg-bg-surface/80 backdrop-blur-sm text-status-error-text hover:bg-bg-surface transition-colors",
266
267
  children: /* @__PURE__ */ y(d, { className: "h-4 w-4 fill-current" })
267
268
  }),
268
269
  /* @__PURE__ */ y("div", {
269
270
  className: "absolute top-2 left-2",
270
271
  children: /* @__PURE__ */ y("span", {
271
- className: t("inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium", e.isOpen ? "bg-green-500/20 text-green-600 dark:text-green-400" : "bg-status-error-bg/20 text-status-error-text"),
272
+ className: t("inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium", e.isOpen ? "bg-status-success-bg-subtle/20 text-status-success-text" : "bg-status-error-bg/20 text-status-error-text"),
272
273
  children: e.isOpen ? "Open" : "Closed"
273
274
  })
274
275
  })
@@ -284,7 +285,7 @@ function x() {
284
285
  }), /* @__PURE__ */ b("div", {
285
286
  className: "flex items-center gap-1 shrink-0",
286
287
  children: [
287
- /* @__PURE__ */ y(g, { className: "h-3.5 w-3.5 fill-yellow-400 text-yellow-400" }),
288
+ /* @__PURE__ */ y(g, { className: "h-3.5 w-3.5 fill-status-warning-text text-status-warning-text" }),
288
289
  /* @__PURE__ */ y("span", {
289
290
  className: "text-xs font-medium text-text-primary",
290
291
  children: e.rating
@@ -364,7 +365,7 @@ function x() {
364
365
  }), /* @__PURE__ */ y("div", {
365
366
  className: "space-y-3",
366
367
  children: N.map((e) => /* @__PURE__ */ y("div", {
367
- className: "rounded-lg border border-border-subtle bg-bg-surface p-4",
368
+ className: "rounded-lg border border-border-seam bg-bg-surface p-4 bg-gloss-card shadow-pop",
368
369
  children: /* @__PURE__ */ b("div", {
369
370
  className: "flex flex-col sm:flex-row sm:items-center gap-4",
370
371
  children: [
@@ -390,7 +391,7 @@ function x() {
390
391
  type: "button",
391
392
  onClick: () => F(e.id),
392
393
  title: "Remove from favorites",
393
- className: "rounded-md p-1 text-red-500 hover:bg-status-error-bg/10 transition-colors",
394
+ className: "rounded-md p-1 text-status-error-text hover:bg-status-error-bg/10 transition-colors",
394
395
  children: /* @__PURE__ */ y(v, { className: "h-4 w-4" })
395
396
  })]
396
397
  })]
@@ -430,11 +431,11 @@ function x() {
430
431
  className: "flex flex-wrap items-center gap-2",
431
432
  children: [
432
433
  e.isVegetarian && /* @__PURE__ */ b("span", {
433
- className: "inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400",
434
+ className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text",
434
435
  children: [/* @__PURE__ */ y(f, { className: "h-3 w-3" }), "Veg"]
435
436
  }),
436
437
  e.isVegan && /* @__PURE__ */ b("span", {
437
- className: "inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400",
438
+ className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text",
438
439
  children: [/* @__PURE__ */ y(f, { className: "h-3 w-3" }), "Vegan"]
439
440
  }),
440
441
  /* @__PURE__ */ b("span", {
@@ -1 +1 @@
1
- {"version":3,"file":"FavoritesPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/FavoritesPage.tsx"],"sourcesContent":["/**\n * Favorites Page\n * @module adaptercloud/pages/customer\n *\n * Favorite carts AND products with stats header, 4 filters\n * (search, type, category, sort), Order Again / View Menu per cart,\n * Add to Cart / View Cart + remove per product, Veg badges,\n * prep time, 3 mock favorite products, 2 mock favorite carts.\n */\n\nimport { useState, useCallback, useEffect } from 'react';\nimport {\n Heart,\n Star,\n MapPin,\n Clock,\n CheckCircle2,\n Search,\n ShoppingCart,\n Leaf,\n Utensils,\n RotateCcw,\n ListFilter,\n X,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useProviders, useOrders } from '../../hooks/useAdapterCloudApi';\nimport { mockCarts } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency, formatDate, formatDistance } from '../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface FavoriteCart {\n id: string;\n name: string;\n description: string;\n category: string;\n image: string;\n rating: number;\n reviewCount: number;\n isOpen: boolean;\n isVerified: boolean;\n distance: number;\n estimatedTime: number;\n addedToFavorites: string;\n lastOrdered?: string;\n totalOrders: number;\n totalSpent: number;\n}\n\ninterface FavoriteProduct {\n id: string;\n name: string;\n description: string;\n price: number;\n category: string;\n image: string;\n cartId: string;\n cartName: string;\n isVegetarian: boolean;\n isVegan: boolean;\n preparationTime: number;\n rating: number;\n addedToFavorites: string;\n lastOrdered?: string;\n orderCount: number;\n}\n\ninterface FavoriteFilters {\n searchQuery: string;\n type: 'all' | 'carts' | 'products';\n category: string;\n sortBy: 'recent' | 'name' | 'rating' | 'orders';\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function FavoritesPage() {\n const { navigateTo, currentUser } = useAdapterCloud();\n const { data: providers = [], isLoading: isLoadingProviders } = useProviders();\n const { data: orders = [], isLoading: isLoadingOrders } = useOrders({\n customerId: currentUser?.id,\n });\n\n const favoriteCarts: FavoriteCart[] = providers.slice(0, 2).map((p) => ({\n id: p.id,\n name: p.name,\n description: 'Authentic services from AdapterCloud',\n category: p.category,\n image: p.image,\n rating: p.rating,\n reviewCount: p.totalRatings,\n isOpen: p.isOpen,\n isVerified: p.isVerified || false,\n distance: p.distance,\n estimatedTime: p.estimatedTime,\n addedToFavorites: new Date().toISOString(),\n totalOrders: orders.filter((o) => o.cartId === p.id).length,\n totalSpent: orders.filter((o) => o.cartId === p.id).reduce((acc, o) => acc + o.total, 0),\n }));\n\n const favoriteProducts: FavoriteProduct[] = [\n {\n id: 'prod-001',\n name: 'Masala Dosa',\n description: 'Crispy rice crepe with spiced potato filling',\n price: 120,\n category: 'South Indian',\n image: 'https://images.unsplash.com/photo-1630383249896-424e482df921?w=300',\n cartId: providers[0]?.id || 'FOOD-001',\n cartName: providers[0]?.name || 'Dosa Express',\n isVegetarian: true,\n isVegan: false,\n preparationTime: 15,\n rating: 4.7,\n addedToFavorites: '2024-02-20T12:30:00Z',\n orderCount: 8,\n },\n ];\n\n const [filters, setFilters] = useState<FavoriteFilters>({\n searchQuery: '',\n type: 'all',\n category: '',\n sortBy: 'recent',\n });\n\n const isLoading = isLoadingProviders || isLoadingOrders;\n\n // --- Derived data ---\n const getDisplayItems = useCallback(() => {\n let carts = [...favoriteCarts];\n let products = [...favoriteProducts];\n\n // Search\n if (filters.searchQuery) {\n const q = filters.searchQuery.toLowerCase();\n carts = carts.filter(\n (c) =>\n c.name.toLowerCase().includes(q) ||\n c.description.toLowerCase().includes(q) ||\n c.category.toLowerCase().includes(q)\n );\n products = products.filter(\n (p) =>\n p.name.toLowerCase().includes(q) ||\n p.description.toLowerCase().includes(q) ||\n p.category.toLowerCase().includes(q) ||\n p.cartName.toLowerCase().includes(q)\n );\n }\n\n // Category\n if (filters.category) {\n carts = carts.filter((c) => c.category === filters.category);\n products = products.filter((p) => p.category === filters.category);\n }\n\n // Sort\n switch (filters.sortBy) {\n case 'recent':\n carts.sort(\n (a, b) => new Date(b.addedToFavorites).getTime() - new Date(a.addedToFavorites).getTime()\n );\n products.sort(\n (a, b) => new Date(b.addedToFavorites).getTime() - new Date(a.addedToFavorites).getTime()\n );\n break;\n case 'name':\n carts.sort((a, b) => a.name.localeCompare(b.name));\n products.sort((a, b) => a.name.localeCompare(b.name));\n break;\n case 'rating':\n carts.sort((a, b) => b.rating - a.rating);\n products.sort((a, b) => b.rating - a.rating);\n break;\n case 'orders':\n carts.sort((a, b) => b.totalOrders - a.totalOrders);\n products.sort((a, b) => b.orderCount - a.orderCount);\n break;\n }\n\n // Type filter\n if (filters.type === 'carts') return { carts, products: [] };\n if (filters.type === 'products') return { carts: [], products };\n return { carts, products };\n }, [favoriteCarts, favoriteProducts, filters]);\n\n const { carts: displayCarts, products: displayProducts } = getDisplayItems();\n\n const handleRemoveCart = (id: string) => {\n // In real app, this would call an API\n console.log('Remove cart:', id);\n };\n\n const handleRemoveProduct = (id: string) => {\n // In real app, this would call an API\n console.log('Remove product:', id);\n };\n\n // Stats\n const totalSaved =\n favoriteCarts.reduce((s, c) => s + c.totalSpent, 0) +\n favoriteProducts.reduce((s, p) => s + p.price * p.orderCount, 0);\n\n if (isLoading) {\n return (\n <PageLayout title=\"My Favorites\">\n <div className=\"flex items-center justify-center py-20\">\n <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground\" />\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title=\"My Favorites\"\n description={`${favoriteCarts.length} carts, ${favoriteProducts.length} products`}\n >\n {/* Stats Header */}\n <div className=\"flex flex-wrap items-center gap-4 text-sm text-text-secondary mb-6\">\n <span className=\"flex items-center gap-1.5\">\n <ShoppingCart className=\"h-3.5 w-3.5\" />\n {favoriteCarts.length} carts\n </span>\n <span className=\"flex items-center gap-1.5\">\n <Utensils className=\"h-3.5 w-3.5\" />\n {favoriteProducts.length} products\n </span>\n <span className=\"flex items-center gap-1.5\">\n <Star className=\"h-3.5 w-3.5\" />\n Total saved: {formatCurrency(totalSaved, { minimumFractionDigits: 0 })}\n </span>\n </div>\n\n {/* Filters */}\n <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-4 mb-6\">\n <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3\">\n {/* Search */}\n <div className=\"relative\">\n <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <input\n type=\"text\"\n placeholder=\"Search favorites...\"\n value={filters.searchQuery}\n onChange={(e) => setFilters((p) => ({ ...p, searchQuery: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n\n {/* Type */}\n <select\n value={filters.type}\n onChange={(e) =>\n setFilters((p) => ({ ...p, type: e.target.value as FavoriteFilters['type'] }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"all\">All Favorites</option>\n <option value=\"carts\">Favorite Carts</option>\n <option value=\"products\">Favorite Products</option>\n </select>\n\n {/* Category */}\n <select\n value={filters.category}\n onChange={(e) => setFilters((p) => ({ ...p, category: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"\">All Categories</option>\n <option value=\"Food & Beverage\">Food & Beverage</option>\n <option value=\"Street Food\">Street Food</option>\n <option value=\"South Indian\">South Indian</option>\n <option value=\"Beverages\">Beverages</option>\n </select>\n\n {/* Sort */}\n <select\n value={filters.sortBy}\n onChange={(e) =>\n setFilters((p) => ({ ...p, sortBy: e.target.value as FavoriteFilters['sortBy'] }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"recent\">Recently Added</option>\n <option value=\"name\">Name A-Z</option>\n <option value=\"rating\">Highest Rated</option>\n <option value=\"orders\">Most Ordered</option>\n </select>\n </div>\n </div>\n\n {/* Content */}\n {displayCarts.length === 0 && displayProducts.length === 0 ? (\n <EmptyState\n icon={<Heart className=\"h-12 w-12\" />}\n title=\"No favorites yet\"\n description=\"Browse carts and tap the heart icon to add them to your favorites.\"\n action={\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n Discover Carts\n </button>\n }\n />\n ) : (\n <div className=\"space-y-8\">\n {/* Favorite Carts */}\n {displayCarts.length > 0 && (\n <section>\n <h3 className=\"text-base font-semibold text-text-primary mb-4 flex items-center gap-2\">\n <ShoppingCart className=\"h-4 w-4 text-text-secondary\" />\n Favorite Carts ({displayCarts.length})\n </h3>\n <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n {displayCarts.map((cart) => (\n <div\n key={cart.id}\n className=\"rounded-lg border border-border-subtle bg-bg-surface shadow-sm overflow-hidden\"\n >\n {/* Image */}\n <div className=\"relative h-36 bg-bg-sunken\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"block h-full w-full\"\n >\n <img\n src={cart.image}\n alt={cart.name}\n className=\"h-full w-full object-cover\"\n />\n </button>\n <button\n type=\"button\"\n onClick={() => handleRemoveCart(cart.id)}\n title=\"Remove from favorites\"\n className=\"absolute top-2 right-2 flex h-8 w-8 items-center justify-center rounded-full bg-bg-surface/80 backdrop-blur-sm text-red-500 hover:bg-bg-surface transition-colors\"\n >\n <Heart className=\"h-4 w-4 fill-current\" />\n </button>\n <div className=\"absolute top-2 left-2\">\n <span\n className={cn(\n 'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n cart.isOpen\n ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n : 'bg-status-error-bg/20 text-status-error-text'\n )}\n >\n {cart.isOpen ? 'Open' : 'Closed'}\n </span>\n </div>\n </div>\n\n {/* Details */}\n <div className=\"p-4\">\n <div className=\"flex items-start justify-between gap-2 mb-2\">\n <h4 className=\"text-sm font-semibold text-text-primary truncate\">\n {cart.name}\n </h4>\n <div className=\"flex items-center gap-1 shrink-0\">\n <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n <span className=\"text-xs font-medium text-text-primary\">{cart.rating}</span>\n <span className=\"text-xs text-text-secondary\">\n ({cart.reviewCount})\n </span>\n </div>\n </div>\n\n <p className=\"text-xs text-text-secondary line-clamp-2 mb-3\">\n {cart.description}\n </p>\n\n <div className=\"space-y-1.5 text-xs text-text-secondary\">\n <div className=\"flex justify-between\">\n <span>Added:</span>\n <span>\n {formatDate(cart.addedToFavorites, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span>Total orders:</span>\n <span>{cart.totalOrders}</span>\n </div>\n <div className=\"flex justify-between\">\n <span>Total spent:</span>\n <span className=\"font-medium\">\n {formatCurrency(cart.totalSpent, { minimumFractionDigits: 0 })}\n </span>\n </div>\n {cart.lastOrdered && (\n <div className=\"flex justify-between\">\n <span>Last ordered:</span>\n <span>\n {formatDate(cart.lastOrdered, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n )}\n </div>\n\n <div className=\"flex gap-2 mt-4\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"flex-1 flex items-center justify-center gap-1.5 rounded-lg bg-foreground px-3 py-2 text-xs font-medium text-background hover:opacity-90 transition-opacity\"\n >\n <RotateCcw className=\"h-3 w-3\" />\n Order Again\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"flex-1 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n >\n View Menu\n </button>\n </div>\n </div>\n </div>\n ))}\n </div>\n </section>\n )}\n\n {/* Favorite Products */}\n {displayProducts.length > 0 && (\n <section>\n <h3 className=\"text-base font-semibold text-text-primary mb-4 flex items-center gap-2\">\n <Utensils className=\"h-4 w-4 text-text-secondary\" />\n Favorite Products ({displayProducts.length})\n </h3>\n <div className=\"space-y-3\">\n {displayProducts.map((product) => (\n <div key={product.id} className=\"rounded-lg border border-border-subtle bg-bg-surface p-4\">\n <div className=\"flex flex-col sm:flex-row sm:items-center gap-4\">\n {/* Image */}\n <img\n src={product.image}\n alt={product.name}\n className=\"w-20 h-20 rounded-lg object-cover shrink-0 mx-auto sm:mx-0\"\n />\n\n {/* Info */}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-start justify-between gap-2 mb-1\">\n <h4 className=\"text-sm font-semibold text-text-primary\">{product.name}</h4>\n <div className=\"flex items-center gap-2 shrink-0\">\n <span className=\"text-base font-bold text-text-primary\">\n {formatCurrency(product.price, { minimumFractionDigits: 0 })}\n </span>\n <button\n type=\"button\"\n onClick={() => handleRemoveProduct(product.id)}\n title=\"Remove from favorites\"\n className=\"rounded-md p-1 text-red-500 hover:bg-status-error-bg/10 transition-colors\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n\n <p className=\"text-xs text-text-secondary mb-2\">{product.description}</p>\n\n <div className=\"flex flex-wrap items-center gap-2 text-xs text-text-secondary mb-2\">\n <span>\n From:{' '}\n <span className=\"font-medium text-text-primary\">{product.cartName}</span>\n </span>\n <span>Ordered {product.orderCount} times</span>\n <span>\n Added:{' '}\n {formatDate(product.addedToFavorites, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n\n <div className=\"flex flex-wrap items-center gap-2\">\n {product.isVegetarian && (\n <span className=\"inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400\">\n <Leaf className=\"h-3 w-3\" />\n Veg\n </span>\n )}\n {product.isVegan && (\n <span className=\"inline-flex items-center gap-1 rounded-full bg-green-500/10 px-2 py-0.5 text-[10px] font-medium text-green-600 dark:text-green-400\">\n <Leaf className=\"h-3 w-3\" />\n Vegan\n </span>\n )}\n <span className=\"inline-flex items-center gap-1 rounded-full bg-bg-sunken px-2 py-0.5 text-[10px] font-medium text-text-secondary\">\n <Clock className=\"h-3 w-3\" />\n {product.preparationTime} min\n </span>\n </div>\n </div>\n\n {/* Actions */}\n <div className=\"flex sm:flex-col gap-2 shrink-0\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${product.cartId}`)}\n className=\"flex-1 sm:flex-none rounded-lg bg-foreground px-4 py-2 text-xs font-medium text-background hover:opacity-90 transition-opacity whitespace-nowrap\"\n >\n Add to Cart\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${product.cartId}`)}\n className=\"flex-1 sm:flex-none rounded-lg border border-border-subtle px-4 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n >\n View Cart\n </button>\n </div>\n </div>\n </div>\n ))}\n </div>\n </section>\n )}\n </div>\n )}\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"FavoritesPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/FavoritesPage.tsx"],"sourcesContent":["/**\n * Favorites Page\n * @module adaptercloud/pages/customer\n *\n * Favorite carts AND products with stats header, 4 filters\n * (search, type, category, sort), Order Again / View Menu per cart,\n * Add to Cart / View Cart + remove per product, Veg badges,\n * prep time, 3 mock favorite products, 2 mock favorite carts.\n */\n\nimport { useState, useCallback, useEffect } from'react';\nimport {\n Heart,\n Star,\n MapPin,\n Clock,\n CheckCircle2,\n Search,\n ShoppingCart,\n Leaf,\n Utensils,\n RotateCcw,\n ListFilter,\n X,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { useProviders, useOrders } from'../../hooks/useAdapterCloudApi';\nimport { mockCarts } from'../../mocks/data';\nimport { cn } from'../../utils/cn';\nimport { formatCurrency, formatDate, formatDistance } from'../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface FavoriteCart {\n id: string;\n name: string;\n description: string;\n category: string;\n image: string;\n rating: number;\n reviewCount: number;\n isOpen: boolean;\n isVerified: boolean;\n distance: number;\n estimatedTime: number;\n addedToFavorites: string;\n lastOrdered?: string;\n totalOrders: number;\n totalSpent: number;\n}\n\ninterface FavoriteProduct {\n id: string;\n name: string;\n description: string;\n price: number;\n category: string;\n image: string;\n cartId: string;\n cartName: string;\n isVegetarian: boolean;\n isVegan: boolean;\n preparationTime: number;\n rating: number;\n addedToFavorites: string;\n lastOrdered?: string;\n orderCount: number;\n}\n\ninterface FavoriteFilters {\n searchQuery: string;\n type: 'all' | 'carts' | 'products';\n category: string;\n sortBy: 'recent' | 'name' | 'rating' | 'orders';\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function FavoritesPage() {\n const { navigateTo, currentUser } = useAdapterCloud();\n const { data: providers = [], isLoading: isLoadingProviders } = useProviders();\n const { data: orders = [], isLoading: isLoadingOrders } = useOrders({\n customerId: currentUser?.id,\n });\n\n const favoriteCarts: FavoriteCart[] = providers.slice(0, 2).map((p) => ({\n id: p.id,\n name: p.name,\n description: 'Authentic services from AdapterCloud',\n category: p.category,\n image: p.image,\n rating: p.rating,\n reviewCount: p.totalRatings,\n isOpen: p.isOpen,\n isVerified: p.isVerified || false,\n distance: p.distance,\n estimatedTime: p.estimatedTime,\n addedToFavorites: new Date().toISOString(),\n totalOrders: orders.filter((o) => o.cartId === p.id).length,\n totalSpent: orders.filter((o) => o.cartId === p.id).reduce((acc, o) => acc + o.total, 0),\n }));\n\n const favoriteProducts: FavoriteProduct[] = [\n {\n id: 'prod-001',\n name: 'Masala Dosa',\n description: 'Crispy rice crepe with spiced potato filling',\n price: 120,\n category: 'South Indian',\n image: 'https://images.unsplash.com/photo-1630383249896-424e482df921?w=300',\n cartId: providers[0]?.id || 'FOOD-001',\n cartName: providers[0]?.name || 'Dosa Express',\n isVegetarian: true,\n isVegan: false,\n preparationTime: 15,\n rating: 4.7,\n addedToFavorites: '2024-02-20T12:30:00Z',\n orderCount: 8,\n },\n ];\n\n const [filters, setFilters] = useState<FavoriteFilters>({\n searchQuery: '',\n type: 'all',\n category: '',\n sortBy: 'recent',\n });\n\n const isLoading = isLoadingProviders || isLoadingOrders;\n\n // --- Derived data ---\n const getDisplayItems = useCallback(() => {\n let carts = [...favoriteCarts];\n let products = [...favoriteProducts];\n\n // Search\n if (filters.searchQuery) {\n const q = filters.searchQuery.toLowerCase();\n carts = carts.filter(\n (c) =>\n c.name.toLowerCase().includes(q) ||\n c.description.toLowerCase().includes(q) ||\n c.category.toLowerCase().includes(q)\n );\n products = products.filter(\n (p) =>\n p.name.toLowerCase().includes(q) ||\n p.description.toLowerCase().includes(q) ||\n p.category.toLowerCase().includes(q) ||\n p.cartName.toLowerCase().includes(q)\n );\n }\n\n // Category\n if (filters.category) {\n carts = carts.filter((c) => c.category === filters.category);\n products = products.filter((p) => p.category === filters.category);\n }\n\n // Sort\n switch (filters.sortBy) {\n case'recent':\n carts.sort(\n (a, b) => new Date(b.addedToFavorites).getTime() - new Date(a.addedToFavorites).getTime()\n );\n products.sort(\n (a, b) => new Date(b.addedToFavorites).getTime() - new Date(a.addedToFavorites).getTime()\n );\n break;\n case'name':\n carts.sort((a, b) => a.name.localeCompare(b.name));\n products.sort((a, b) => a.name.localeCompare(b.name));\n break;\n case'rating':\n carts.sort((a, b) => b.rating - a.rating);\n products.sort((a, b) => b.rating - a.rating);\n break;\n case'orders':\n carts.sort((a, b) => b.totalOrders - a.totalOrders);\n products.sort((a, b) => b.orderCount - a.orderCount);\n break;\n }\n\n // Type filter\n if (filters.type === 'carts') return { carts, products: [] };\n if (filters.type === 'products') return { carts: [], products };\n return { carts, products };\n }, [favoriteCarts, favoriteProducts, filters]);\n\n const { carts: displayCarts, products: displayProducts } = getDisplayItems();\n\n const handleRemoveCart = (id: string) => {\n // In real app, this would call an API\n console.log('Remove cart:', id);\n };\n\n const handleRemoveProduct = (id: string) => {\n // In real app, this would call an API\n console.log('Remove product:', id);\n };\n\n // Stats\n const totalSaved =\n favoriteCarts.reduce((s, c) => s + c.totalSpent, 0) +\n favoriteProducts.reduce((s, p) => s + p.price * p.orderCount, 0);\n\n if (isLoading) {\n return (\n <PageLayout title=\"My Favorites\">\n <div className=\"flex items-center justify-center py-20\">\n <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground\" />\n </div>\n </PageLayout>\n );\n }\n\n return (\n <PageLayout\n title=\"My Favorites\"\n description={`${favoriteCarts.length} carts, ${favoriteProducts.length} products`}\n >\n {/* Stats Header */}\n <div className=\"flex flex-wrap items-center gap-4 text-sm text-text-secondary mb-6\">\n <span className=\"flex items-center gap-1.5\">\n <ShoppingCart className=\"h-3.5 w-3.5\" />\n {favoriteCarts.length} carts\n </span>\n <span className=\"flex items-center gap-1.5\">\n <Utensils className=\"h-3.5 w-3.5\" />\n {favoriteProducts.length} products\n </span>\n <span className=\"flex items-center gap-1.5\">\n <Star className=\"h-3.5 w-3.5\" />\n Total saved: {formatCurrency(totalSaved, { minimumFractionDigits: 0 })}\n </span>\n </div>\n\n {/* Filters */}\n <div className=\"rounded-lg border border-border-seam bg-bg-surface p-4 mb-6 bg-gloss-card shadow-pop\">\n <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3\">\n {/* Search */}\n <div className=\"relative\">\n <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n <input\n type=\"text\"\n placeholder=\"Search favorites...\"\n value={filters.searchQuery}\n onChange={(e) => setFilters((p) => ({ ...p, searchQuery: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n\n {/* Type */}\n <select\n value={filters.type}\n onChange={(e) =>\n setFilters((p) => ({ ...p, type: e.target.value as FavoriteFilters['type'] }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"all\">All Favorites</option>\n <option value=\"carts\">Favorite Carts</option>\n <option value=\"products\">Favorite Products</option>\n </select>\n\n {/* Category */}\n <select\n value={filters.category}\n onChange={(e) => setFilters((p) => ({ ...p, category: e.target.value }))}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"\">All Categories</option>\n <option value=\"Food & Beverage\">Food & Beverage</option>\n <option value=\"Street Food\">Street Food</option>\n <option value=\"South Indian\">South Indian</option>\n <option value=\"Beverages\">Beverages</option>\n </select>\n\n {/* Sort */}\n <select\n value={filters.sortBy}\n onChange={(e) =>\n setFilters((p) => ({ ...p, sortBy: e.target.value as FavoriteFilters['sortBy'] }))\n }\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <option value=\"recent\">Recently Added</option>\n <option value=\"name\">Name A-Z</option>\n <option value=\"rating\">Highest Rated</option>\n <option value=\"orders\">Most Ordered</option>\n </select>\n </div>\n </div>\n\n {/* Content */}\n {displayCarts.length === 0 && displayProducts.length === 0 ? (\n <EmptyState\n illustration=\"empty-data\"\n icon={<Heart className=\"h-12 w-12\" />}\n title=\"No favorites yet\"\n description=\"Browse carts and tap the heart icon to add them to your favorites.\"\n action={\n <button\n type=\"button\"\n onClick={() => navigateTo('/customer/carts')}\n className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n >\n Discover Carts\n </button>\n }\n />\n ) : (\n <div className=\"space-y-8\">\n {/* Favorite Carts */}\n {displayCarts.length > 0 && (\n <section>\n <h3 className=\"text-base font-semibold text-text-primary mb-4 flex items-center gap-2\">\n <ShoppingCart className=\"h-4 w-4 text-text-secondary\" />\n Favorite Carts ({displayCarts.length})\n </h3>\n <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n {displayCarts.map((cart) => (\n <div\n key={cart.id}\n className=\"rounded-lg border border-border-subtle bg-bg-surface shadow-sm overflow-hidden\"\n >\n {/* Image */}\n <div className=\"relative h-36 bg-bg-sunken\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"block h-full w-full\"\n >\n <img\n src={cart.image}\n alt={cart.name}\n className=\"h-full w-full object-cover\"\n />\n </button>\n <button\n type=\"button\"\n onClick={() => handleRemoveCart(cart.id)}\n title=\"Remove from favorites\"\n className=\"absolute top-2 right-2 flex h-8 w-8 items-center justify-center rounded-full bg-bg-surface/80 backdrop-blur-sm text-status-error-text hover:bg-bg-surface transition-colors\"\n >\n <Heart className=\"h-4 w-4 fill-current\" />\n </button>\n <div className=\"absolute top-2 left-2\">\n <span\n className={cn(\n 'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n cart.isOpen\n ? 'bg-status-success-bg-subtle/20 text-status-success-text'\n : 'bg-status-error-bg/20 text-status-error-text'\n )}\n >\n {cart.isOpen ? 'Open' : 'Closed'}\n </span>\n </div>\n </div>\n\n {/* Details */}\n <div className=\"p-4\">\n <div className=\"flex items-start justify-between gap-2 mb-2\">\n <h4 className=\"text-sm font-semibold text-text-primary truncate\">\n {cart.name}\n </h4>\n <div className=\"flex items-center gap-1 shrink-0\">\n <Star className=\"h-3.5 w-3.5 fill-status-warning-text text-status-warning-text\" />\n <span className=\"text-xs font-medium text-text-primary\">{cart.rating}</span>\n <span className=\"text-xs text-text-secondary\">\n ({cart.reviewCount})\n </span>\n </div>\n </div>\n\n <p className=\"text-xs text-text-secondary line-clamp-2 mb-3\">\n {cart.description}\n </p>\n\n <div className=\"space-y-1.5 text-xs text-text-secondary\">\n <div className=\"flex justify-between\">\n <span>Added:</span>\n <span>\n {formatDate(cart.addedToFavorites, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n <div className=\"flex justify-between\">\n <span>Total orders:</span>\n <span>{cart.totalOrders}</span>\n </div>\n <div className=\"flex justify-between\">\n <span>Total spent:</span>\n <span className=\"font-medium\">\n {formatCurrency(cart.totalSpent, { minimumFractionDigits: 0 })}\n </span>\n </div>\n {cart.lastOrdered && (\n <div className=\"flex justify-between\">\n <span>Last ordered:</span>\n <span>\n {formatDate(cart.lastOrdered, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n )}\n </div>\n\n <div className=\"flex gap-2 mt-4\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"flex-1 flex items-center justify-center gap-1.5 rounded-lg bg-foreground px-3 py-2 text-xs font-medium text-background hover:opacity-90 transition-opacity\"\n >\n <RotateCcw className=\"h-3 w-3\" />\n Order Again\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n className=\"flex-1 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n >\n View Menu\n </button>\n </div>\n </div>\n </div>\n ))}\n </div>\n </section>\n )}\n\n {/* Favorite Products */}\n {displayProducts.length > 0 && (\n <section>\n <h3 className=\"text-base font-semibold text-text-primary mb-4 flex items-center gap-2\">\n <Utensils className=\"h-4 w-4 text-text-secondary\" />\n Favorite Products ({displayProducts.length})\n </h3>\n <div className=\"space-y-3\">\n {displayProducts.map((product) => (\n <div key={product.id} className=\"rounded-lg border border-border-seam bg-bg-surface p-4 bg-gloss-card shadow-pop\">\n <div className=\"flex flex-col sm:flex-row sm:items-center gap-4\">\n {/* Image */}\n <img\n src={product.image}\n alt={product.name}\n className=\"w-20 h-20 rounded-lg object-cover shrink-0 mx-auto sm:mx-0\"\n />\n\n {/* Info */}\n <div className=\"flex-1 min-w-0\">\n <div className=\"flex items-start justify-between gap-2 mb-1\">\n <h4 className=\"text-sm font-semibold text-text-primary\">{product.name}</h4>\n <div className=\"flex items-center gap-2 shrink-0\">\n <span className=\"text-base font-bold text-text-primary\">\n {formatCurrency(product.price, { minimumFractionDigits: 0 })}\n </span>\n <button\n type=\"button\"\n onClick={() => handleRemoveProduct(product.id)}\n title=\"Remove from favorites\"\n className=\"rounded-md p-1 text-status-error-text hover:bg-status-error-bg/10 transition-colors\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n\n <p className=\"text-xs text-text-secondary mb-2\">{product.description}</p>\n\n <div className=\"flex flex-wrap items-center gap-2 text-xs text-text-secondary mb-2\">\n <span>\n From:{' '}\n <span className=\"font-medium text-text-primary\">{product.cartName}</span>\n </span>\n <span>Ordered {product.orderCount} times</span>\n <span>\n Added:{' '}\n {formatDate(product.addedToFavorites, {\n hour: undefined,\n minute: undefined,\n hour12: undefined,\n })}\n </span>\n </div>\n\n <div className=\"flex flex-wrap items-center gap-2\">\n {product.isVegetarian && (\n <span className=\"inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text\">\n <Leaf className=\"h-3 w-3\" />\n Veg\n </span>\n )}\n {product.isVegan && (\n <span className=\"inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text\">\n <Leaf className=\"h-3 w-3\" />\n Vegan\n </span>\n )}\n <span className=\"inline-flex items-center gap-1 rounded-full bg-bg-sunken px-2 py-0.5 text-[10px] font-medium text-text-secondary\">\n <Clock className=\"h-3 w-3\" />\n {product.preparationTime} min\n </span>\n </div>\n </div>\n\n {/* Actions */}\n <div className=\"flex sm:flex-col gap-2 shrink-0\">\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${product.cartId}`)}\n className=\"flex-1 sm:flex-none rounded-lg bg-foreground px-4 py-2 text-xs font-medium text-background hover:opacity-90 transition-opacity whitespace-nowrap\"\n >\n Add to Cart\n </button>\n <button\n type=\"button\"\n onClick={() => navigateTo(`/customer/carts/${product.cartId}`)}\n className=\"flex-1 sm:flex-none rounded-lg border border-border-subtle px-4 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n >\n View Cart\n </button>\n </div>\n </div>\n </div>\n ))}\n </div>\n </section>\n )}\n </div>\n )}\n </PageLayout>\n );\n}\n"],"mappings":"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"}
@@ -238,7 +238,7 @@ function M() {
238
238
  ]
239
239
  }),
240
240
  /* @__PURE__ */ E("div", {
241
- className: "rounded-lg border border-border-subtle bg-bg-surface p-4 mb-6",
241
+ className: "rounded-lg border border-border-seam bg-bg-surface p-4 mb-6 bg-gloss-card shadow-pop",
242
242
  children: /* @__PURE__ */ D("div", {
243
243
  className: "grid grid-cols-1 md:grid-cols-4 gap-3",
244
244
  children: [
@@ -289,6 +289,7 @@ function M() {
289
289
  children: "Loading orders..."
290
290
  })]
291
291
  }) : U.length === 0 ? /* @__PURE__ */ E(r, {
292
+ illustration: "empty-data",
292
293
  icon: /* @__PURE__ */ E(x, { className: "h-12 w-12" }),
293
294
  title: "No orders found",
294
295
  description: I.searchQuery || I.status ? "Try adjusting your filters" : "You haven't placed any orders yet",
@@ -372,7 +373,7 @@ function M() {
372
373
  className: "mt-3",
373
374
  children: [
374
375
  e.status === "delivered" && /* @__PURE__ */ D("div", {
375
- className: "flex items-center gap-1.5 text-xs text-green-600 dark:text-green-400",
376
+ className: "flex items-center gap-1.5 text-xs text-status-success-text",
376
377
  children: [/* @__PURE__ */ E(d, { className: "h-3 w-3" }), /* @__PURE__ */ E("span", { children: "Order delivered successfully" })]
377
378
  }),
378
379
  e.status === "cancelled" && /* @__PURE__ */ D("div", {
@@ -386,7 +387,7 @@ function M() {
386
387
  "ready",
387
388
  "out_for_delivery"
388
389
  ].includes(e.status) && /* @__PURE__ */ D("div", {
389
- className: "flex items-center gap-1.5 text-xs text-blue-600 dark:text-blue-400",
390
+ className: "flex items-center gap-1.5 text-xs text-accent-blue",
390
391
  children: [/* @__PURE__ */ E(w, { className: "h-3 w-3" }), /* @__PURE__ */ D("span", { children: [
391
392
  "Estimated delivery by",
392
393
  " ",