@burdenoff/microfe-adaptercloud 2026.624.1 → 2026.625.1

package/dist/adaptercloud/pages/customer/OrderHistoryPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderHistoryPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/OrderHistoryPage.tsx"],"sourcesContent":["/**\n * Order History Page\n * @module adaptercloud/pages/customer\n *\n * Full list of customer orders with stats summary, search, status/date/sort\n * filters, rating display, reorder, cancellation reason, and Load More pagination.\n */\n\nimport { useState, useMemo, useCallback, useEffect } from 'react';\nimport {\n  ShoppingBag,\n  Search,\n  Star,\n  RotateCcw,\n  Eye,\n  ChevronDown,\n  Package,\n  IndianRupee,\n  TrendingUp,\n  Clock,\n  Heart,\n  CheckCircle2,\n  XCircle,\n  Truck,\n  Loader2,\n  AlertCircle,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { EmptyState } from '../../components/EmptyState';\nimport { RatingDisplay } from '../../components/RatingDisplay';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useOrders } from '../../hooks/useAdapterCloudApi';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency, formatDate } from '../../utils/formatters';\nimport type { OrderStatus, MockOrder } from '../../types';\n\ninterface OrderFilters {\n  status: string;\n  dateRange: string;\n  searchQuery: string;\n  sortBy: string;\n}\n\nconst PAGE_SIZE = 10;\n\nconst statusOptions = [\n  { value: '', label: 'All Status' },\n  { value: 'pending', label: 'Pending' },\n  { value: 'confirmed', label: 'Confirmed' },\n  { value: 'preparing', label: 'Preparing' },\n  { value: 'ready', label: 'Ready' },\n  { value: 'out_for_delivery', label: 'Out for Delivery' },\n  { value: 'delivered', label: 'Delivered' },\n  { value: 'cancelled', label: 'Cancelled' },\n];\n\nconst dateRangeOptions = [\n  { value: '7days', label: 'Last 7 Days' },\n  { value: '30days', label: 'Last 30 Days' },\n  { value: '90days', label: 'Last 90 Days' },\n  { value: 'all', label: 'All Time' },\n];\n\nconst sortOptions = [\n  { value: 'recent', label: 'Most Recent' },\n  { value: 'oldest', label: 'Oldest First' },\n  { value: 'amount_high', label: 'Amount: High to Low' },\n  { value: 'amount_low', label: 'Amount: Low to High' },\n];\n\nexport function OrderHistoryPage() {\n  const { navigateTo, currentUser } = useAdapterCloud();\n  const [displayCount, setDisplayCount] = useState(PAGE_SIZE);\n  const [filters, setFilters] = useState<OrderFilters>({\n    status: '',\n    dateRange: '30days',\n    searchQuery: '',\n    sortBy: 'recent',\n  });\n\n  const { data: allOrders = [], isLoading, isError } = useOrders({ customerId: currentUser?.id });\n\n  // Calculate stats from all orders\n  const orderStats = useMemo(() => {\n    const totalOrders = allOrders.length;\n    const totalSpent = allOrders.reduce((sum, o) => sum + o.total, 0);\n    const averageOrderValue = totalOrders > 0 ? Math.round(totalSpent / totalOrders) : 0;\n    const recentOrdersCount = allOrders.filter(\n      (o) => new Date(o.orderDate) > new Date(Date.now() - 7 * 24 * 60 * 60 * 1000)\n    ).length;\n\n    // Find favorite cart (most ordered from)\n    const cartCounts: Record<string, number> = {};\n    for (const o of allOrders) {\n      cartCounts[o.cartName] = (cartCounts[o.cartName] || 0) + 1;\n    }\n    const favoriteCart =\n      Object.entries(cartCounts).sort((a, b) => b[1] - a[1])[0]?.[0] || 'No orders yet';\n\n    return { totalOrders, totalSpent, averageOrderValue, recentOrdersCount, favoriteCart };\n  }, [allOrders]);\n\n  // Filter and sort orders\n  const filteredOrders = useMemo(() => {\n    let orders = [...allOrders];\n\n    // Filter by status\n    if (filters.status) {\n      orders = orders.filter((o) => o.status === filters.status);\n    }\n\n    // Filter by date range\n    if (filters.dateRange !== 'all') {\n      const now = new Date();\n      const dateLimit = new Date();\n      switch (filters.dateRange) {\n        case '7days':\n          dateLimit.setDate(now.getDate() - 7);\n          break;\n        case '30days':\n          dateLimit.setDate(now.getDate() - 30);\n          break;\n        case '90days':\n          dateLimit.setDate(now.getDate() - 90);\n          break;\n      }\n      orders = orders.filter((o) => new Date(o.orderDate) >= dateLimit);\n    }\n\n    // Search filter\n    if (filters.searchQuery) {\n      const query = filters.searchQuery.toLowerCase();\n      orders = orders.filter(\n        (o) =>\n          o.id.toLowerCase().includes(query) ||\n          o.cartName.toLowerCase().includes(query) ||\n          o.items.some((item) => item.name.toLowerCase().includes(query))\n      );\n    }\n\n    // Sort\n    switch (filters.sortBy) {\n      case 'recent':\n        orders.sort((a, b) => new Date(b.orderDate).getTime() - new Date(a.orderDate).getTime());\n        break;\n      case 'oldest':\n        orders.sort((a, b) => new Date(a.orderDate).getTime() - new Date(b.orderDate).getTime());\n        break;\n      case 'amount_high':\n        orders.sort((a, b) => b.total - a.total);\n        break;\n      case 'amount_low':\n        orders.sort((a, b) => a.total - b.total);\n        break;\n    }\n\n    return orders;\n  }, [allOrders, filters]);\n\n  const displayedOrders = useMemo(\n    () => filteredOrders.slice(0, displayCount),\n    [filteredOrders, displayCount]\n  );\n\n  const hasMore = displayCount < filteredOrders.length;\n\n  const handleFilterChange = (key: keyof OrderFilters, value: string) => {\n    setFilters((prev) => ({ ...prev, [key]: value }));\n    setDisplayCount(PAGE_SIZE);\n  };\n\n  const handleReorder = (order: MockOrder) => {\n    navigateTo(`/customer/cart/${order.cartId}`);\n    alert('Add items to cart to reorder');\n  };\n\n  const handleLoadMore = () => {\n    setDisplayCount((prev) => prev + PAGE_SIZE);\n  };\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Order History\" description=\"Loading your orders...\">\n        <div className=\"flex h-[60vh] items-center justify-center\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-primary\" />\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout title=\"Order History\" description=\"Error loading orders\">\n        <div className=\"flex h-[60vh] flex-col items-center justify-center gap-4\">\n          <AlertCircle className=\"h-12 w-12 text-status-error-text\" />\n          <h2 className=\"text-xl font-semibold\">Error loading your orders</h2>\n          <button\n            type=\"button\"\n            onClick={() => window.location.reload()}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text\"\n          >\n            Retry\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout title=\"Order History\" description=\"View all your past and current orders\">\n      {/* Stats Summary */}\n      <div className=\"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3 mb-6\">\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Package className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Total Orders</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">{orderStats.totalOrders}</p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <IndianRupee className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Total Spent</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">\n            {formatCurrency(orderStats.totalSpent, { minimumFractionDigits: 0 })}\n          </p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <TrendingUp className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Average Order</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">\n            {formatCurrency(orderStats.averageOrderValue, { minimumFractionDigits: 0 })}\n          </p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Clock className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Recent Orders</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">{orderStats.recentOrdersCount}</p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5 col-span-2 md:col-span-1\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Heart className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Favorite Cart</p>\n          </div>\n          <p className=\"text-sm font-bold text-text-primary truncate\">{orderStats.favoriteCart}</p>\n        </div>\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 md: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 orders...\"\n              value={filters.searchQuery}\n              onChange={(e) => handleFilterChange('searchQuery', e.target.value)}\n              className=\"w-full rounded-lg border border-border-subtle bg-bg-surface pl-9 pr-3 py-2.5 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          {/* Status Filter */}\n          <select\n            value={filters.status}\n            onChange={(e) => handleFilterChange('status', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {statusOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n\n          {/* Date Range */}\n          <select\n            value={filters.dateRange}\n            onChange={(e) => handleFilterChange('dateRange', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {dateRangeOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n\n          {/* Sort */}\n          <select\n            value={filters.sortBy}\n            onChange={(e) => handleFilterChange('sortBy', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {sortOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n        </div>\n      </div>\n\n      {/* Orders List */}\n      {isLoading ? (\n        <div className=\"flex flex-col items-center justify-center py-12 text-center\">\n          <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4\" />\n          <p className=\"text-sm text-text-secondary\">Loading orders...</p>\n        </div>\n      ) : displayedOrders.length === 0 ? (\n        <EmptyState\n          icon={<ShoppingBag className=\"h-12 w-12\" />}\n          title=\"No orders found\"\n          description={\n            filters.searchQuery || filters.status\n              ? 'Try adjusting your filters'\n              : \"You haven't placed any orders yet\"\n          }\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              Start Ordering\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"space-y-4\">\n          {displayedOrders.map((order) => (\n            <div\n              key={order.id}\n              className=\"rounded-lg border border-border-subtle bg-bg-surface hover:shadow-md transition-shadow\"\n            >\n              <div className=\"p-4 md:p-5\">\n                {/* Order Header */}\n                <div className=\"flex flex-col md:flex-row md:items-center justify-between mb-3\">\n                  <div className=\"mb-3 md:mb-0\">\n                    <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                      <h3 className=\"text-base font-semibold text-text-primary\">{order.cartName}</h3>\n                      <StatusBadge status={order.status} />\n                    </div>\n                    <p className=\"text-xs text-text-secondary mt-1\">\n                      Order #{order.id} &middot; {formatDate(order.orderDate)}\n                    </p>\n                  </div>\n                  <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                    <p className=\"text-lg font-bold text-text-primary\">\n                      {formatCurrency(order.total, { minimumFractionDigits: 0 })}\n                    </p>\n                    <div className=\"flex gap-2\">\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/orders/${order.id}`)}\n                        className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n                      >\n                        <Eye className=\"h-3 w-3\" />\n                        Track Order\n                      </button>\n                      {order.status === 'delivered' && (\n                        <button\n                          type=\"button\"\n                          onClick={() => handleReorder(order)}\n                          className=\"flex items-center gap-1.5 rounded-lg bg-foreground px-3 py-1.5 text-xs font-medium text-background hover:opacity-90 transition-opacity\"\n                        >\n                          <RotateCcw className=\"h-3 w-3\" />\n                          Reorder\n                        </button>\n                      )}\n                    </div>\n                  </div>\n                </div>\n\n                {/* Order Items Summary */}\n                <div className=\"border-t border-border-subtle pt-3\">\n                  <div className=\"flex flex-wrap gap-1\">\n                    {order.items.slice(0, 3).map((item, index) => (\n                      <span key={index} className=\"text-xs text-text-secondary\">\n                        {item.name} ({item.quantity})\n                        {index < Math.min(2, order.items.length - 1) && ', '}\n                      </span>\n                    ))}\n                    {order.items.length > 3 && (\n                      <span className=\"text-xs text-text-secondary\">\n                        +{order.items.length - 3} more items\n                      </span>\n                    )}\n                  </div>\n                </div>\n\n                {/* Status Message */}\n                <div className=\"mt-3\">\n                  {order.status === 'delivered' && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-green-600 dark:text-green-400\">\n                      <CheckCircle2 className=\"h-3 w-3\" />\n                      <span>Order delivered successfully</span>\n                    </div>\n                  )}\n                  {order.status === 'cancelled' && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-status-error-text\">\n                      <XCircle className=\"h-3 w-3\" />\n                      <span>\n                        Cancelled{order.cancellationReason && ` - ${order.cancellationReason}`}\n                      </span>\n                    </div>\n                  )}\n                  {['pending', 'confirmed', 'preparing', 'ready', 'out_for_delivery'].includes(\n                    order.status\n                  ) && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-blue-600 dark:text-blue-400\">\n                      <Truck className=\"h-3 w-3\" />\n                      <span>\n                        Estimated delivery by{' '}\n                        {order.estimatedDeliveryTime\n                          ? formatDate(order.estimatedDeliveryTime)\n                          : 'TBD'}\n                      </span>\n                    </div>\n                  )}\n                </div>\n\n                {/* Rating Section */}\n                {order.status === 'delivered' && (\n                  <div className=\"mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2\">\n                    {order.rating ? (\n                      <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                        <RatingDisplay value={order.rating} />\n                        {order.review && (\n                          <p className=\"text-xs text-text-secondary italic\">\n                            &ldquo;{order.review}&rdquo;\n                          </p>\n                        )}\n                      </div>\n                    ) : (\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/orders/${order.id}/rate`)}\n                        className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n                      >\n                        <Star className=\"h-3 w-3\" />\n                        Rate Order\n                      </button>\n                    )}\n                  </div>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* Load More */}\n      {hasMore && !isLoading && (\n        <div className=\"text-center mt-8\">\n          <button\n            type=\"button\"\n            onClick={handleLoadMore}\n            className=\"inline-flex items-center gap-2 rounded-lg border border-border-subtle px-6 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n          >\n            <ChevronDown className=\"h-4 w-4\" />\n            Load More Orders\n          </button>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"OrderHistoryPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/OrderHistoryPage.tsx"],"sourcesContent":["/**\n * Order History Page\n * @module adaptercloud/pages/customer\n *\n * Full list of customer orders with stats summary, search, status/date/sort\n * filters, rating display, reorder, cancellation reason, and Load More pagination.\n */\n\nimport { useState, useMemo, useCallback, useEffect } from'react';\nimport {\n  ShoppingBag,\n  Search,\n  Star,\n  RotateCcw,\n  Eye,\n  ChevronDown,\n  Package,\n  IndianRupee,\n  TrendingUp,\n  Clock,\n  Heart,\n  CheckCircle2,\n  XCircle,\n  Truck,\n  Loader2,\n  AlertCircle,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { StatusBadge } from'../../components/StatusBadge';\nimport { EmptyState } from'../../components/EmptyState';\nimport { RatingDisplay } from'../../components/RatingDisplay';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { useOrders } from'../../hooks/useAdapterCloudApi';\nimport { cn } from'../../utils/cn';\nimport { formatCurrency, formatDate } from'../../utils/formatters';\nimport type { OrderStatus, MockOrder } from'../../types';\n\ninterface OrderFilters {\n  status: string;\n  dateRange: string;\n  searchQuery: string;\n  sortBy: string;\n}\n\nconst PAGE_SIZE = 10;\n\nconst statusOptions = [\n  { value: '', label: 'All Status' },\n  { value: 'pending', label: 'Pending' },\n  { value: 'confirmed', label: 'Confirmed' },\n  { value: 'preparing', label: 'Preparing' },\n  { value: 'ready', label: 'Ready' },\n  { value: 'out_for_delivery', label: 'Out for Delivery' },\n  { value: 'delivered', label: 'Delivered' },\n  { value: 'cancelled', label: 'Cancelled' },\n];\n\nconst dateRangeOptions = [\n  { value: '7days', label: 'Last 7 Days' },\n  { value: '30days', label: 'Last 30 Days' },\n  { value: '90days', label: 'Last 90 Days' },\n  { value: 'all', label: 'All Time' },\n];\n\nconst sortOptions = [\n  { value: 'recent', label: 'Most Recent' },\n  { value: 'oldest', label: 'Oldest First' },\n  { value: 'amount_high', label: 'Amount: High to Low' },\n  { value: 'amount_low', label: 'Amount: Low to High' },\n];\n\nexport function OrderHistoryPage() {\n  const { navigateTo, currentUser } = useAdapterCloud();\n  const [displayCount, setDisplayCount] = useState(PAGE_SIZE);\n  const [filters, setFilters] = useState<OrderFilters>({\n    status: '',\n    dateRange: '30days',\n    searchQuery: '',\n    sortBy: 'recent',\n  });\n\n  const { data: allOrders = [], isLoading, isError } = useOrders({ customerId: currentUser?.id });\n\n  // Calculate stats from all orders\n  const orderStats = useMemo(() => {\n    const totalOrders = allOrders.length;\n    const totalSpent = allOrders.reduce((sum, o) => sum + o.total, 0);\n    const averageOrderValue = totalOrders > 0 ? Math.round(totalSpent / totalOrders) : 0;\n    const recentOrdersCount = allOrders.filter(\n      (o) => new Date(o.orderDate) > new Date(Date.now() - 7 * 24 * 60 * 60 * 1000)\n    ).length;\n\n    // Find favorite cart (most ordered from)\n    const cartCounts: Record<string, number> = {};\n    for (const o of allOrders) {\n      cartCounts[o.cartName] = (cartCounts[o.cartName] || 0) + 1;\n    }\n    const favoriteCart =\n      Object.entries(cartCounts).sort((a, b) => b[1] - a[1])[0]?.[0] || 'No orders yet';\n\n    return { totalOrders, totalSpent, averageOrderValue, recentOrdersCount, favoriteCart };\n  }, [allOrders]);\n\n  // Filter and sort orders\n  const filteredOrders = useMemo(() => {\n    let orders = [...allOrders];\n\n    // Filter by status\n    if (filters.status) {\n      orders = orders.filter((o) => o.status === filters.status);\n    }\n\n    // Filter by date range\n    if (filters.dateRange !== 'all') {\n      const now = new Date();\n      const dateLimit = new Date();\n      switch (filters.dateRange) {\n        case'7days':\n          dateLimit.setDate(now.getDate() - 7);\n          break;\n        case'30days':\n          dateLimit.setDate(now.getDate() - 30);\n          break;\n        case'90days':\n          dateLimit.setDate(now.getDate() - 90);\n          break;\n      }\n      orders = orders.filter((o) => new Date(o.orderDate) >= dateLimit);\n    }\n\n    // Search filter\n    if (filters.searchQuery) {\n      const query = filters.searchQuery.toLowerCase();\n      orders = orders.filter(\n        (o) =>\n          o.id.toLowerCase().includes(query) ||\n          o.cartName.toLowerCase().includes(query) ||\n          o.items.some((item) => item.name.toLowerCase().includes(query))\n      );\n    }\n\n    // Sort\n    switch (filters.sortBy) {\n      case'recent':\n        orders.sort((a, b) => new Date(b.orderDate).getTime() - new Date(a.orderDate).getTime());\n        break;\n      case'oldest':\n        orders.sort((a, b) => new Date(a.orderDate).getTime() - new Date(b.orderDate).getTime());\n        break;\n      case'amount_high':\n        orders.sort((a, b) => b.total - a.total);\n        break;\n      case'amount_low':\n        orders.sort((a, b) => a.total - b.total);\n        break;\n    }\n\n    return orders;\n  }, [allOrders, filters]);\n\n  const displayedOrders = useMemo(\n    () => filteredOrders.slice(0, displayCount),\n    [filteredOrders, displayCount]\n  );\n\n  const hasMore = displayCount < filteredOrders.length;\n\n  const handleFilterChange = (key: keyof OrderFilters, value: string) => {\n    setFilters((prev) => ({ ...prev, [key]: value }));\n    setDisplayCount(PAGE_SIZE);\n  };\n\n  const handleReorder = (order: MockOrder) => {\n    navigateTo(`/customer/cart/${order.cartId}`);\n    alert('Add items to cart to reorder');\n  };\n\n  const handleLoadMore = () => {\n    setDisplayCount((prev) => prev + PAGE_SIZE);\n  };\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Order History\" description=\"Loading your orders...\">\n        <div className=\"flex h-[60vh] items-center justify-center\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-primary\" />\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout title=\"Order History\" description=\"Error loading orders\">\n        <div className=\"flex h-[60vh] flex-col items-center justify-center gap-4\">\n          <AlertCircle className=\"h-12 w-12 text-status-error-text\" />\n          <h2 className=\"text-xl font-semibold\">Error loading your orders</h2>\n          <button\n            type=\"button\"\n            onClick={() => window.location.reload()}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text\"\n          >\n            Retry\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout title=\"Order History\" description=\"View all your past and current orders\">\n      {/* Stats Summary */}\n      <div className=\"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3 mb-6\">\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Package className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Total Orders</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">{orderStats.totalOrders}</p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <IndianRupee className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Total Spent</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">\n            {formatCurrency(orderStats.totalSpent, { minimumFractionDigits: 0 })}\n          </p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <TrendingUp className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Average Order</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">\n            {formatCurrency(orderStats.averageOrderValue, { minimumFractionDigits: 0 })}\n          </p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Clock className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Recent Orders</p>\n          </div>\n          <p className=\"text-xl font-bold text-text-primary\">{orderStats.recentOrdersCount}</p>\n        </div>\n        <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-3.5 col-span-2 md:col-span-1\">\n          <div className=\"flex items-center gap-2 mb-1\">\n            <Heart className=\"h-3.5 w-3.5 text-text-secondary\" />\n            <p className=\"text-xs text-text-secondary\">Favorite Cart</p>\n          </div>\n          <p className=\"text-sm font-bold text-text-primary truncate\">{orderStats.favoriteCart}</p>\n        </div>\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 md: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 orders...\"\n              value={filters.searchQuery}\n              onChange={(e) => handleFilterChange('searchQuery', e.target.value)}\n              className=\"w-full rounded-lg border border-border-subtle bg-bg-surface pl-9 pr-3 py-2.5 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          {/* Status Filter */}\n          <select\n            value={filters.status}\n            onChange={(e) => handleFilterChange('status', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {statusOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n\n          {/* Date Range */}\n          <select\n            value={filters.dateRange}\n            onChange={(e) => handleFilterChange('dateRange', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {dateRangeOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n\n          {/* Sort */}\n          <select\n            value={filters.sortBy}\n            onChange={(e) => handleFilterChange('sortBy', e.target.value)}\n            className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2.5 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n          >\n            {sortOptions.map((opt) => (\n              <option key={opt.value} value={opt.value}>\n                {opt.label}\n              </option>\n            ))}\n          </select>\n        </div>\n      </div>\n\n      {/* Orders List */}\n      {isLoading ? (\n        <div className=\"flex flex-col items-center justify-center py-12 text-center\">\n          <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4\" />\n          <p className=\"text-sm text-text-secondary\">Loading orders...</p>\n        </div>\n      ) : displayedOrders.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-data\"\n          icon={<ShoppingBag className=\"h-12 w-12\" />}\n          title=\"No orders found\"\n          description={\n            filters.searchQuery || filters.status\n              ? 'Try adjusting your filters'\n              : \"You haven't placed any orders yet\"\n          }\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              Start Ordering\n            </button>\n          }\n        />\n      ) : (\n        <div className=\"space-y-4\">\n          {displayedOrders.map((order) => (\n            <div\n              key={order.id}\n              className=\"rounded-lg border border-border-subtle bg-bg-surface hover:shadow-md transition-shadow\"\n            >\n              <div className=\"p-4 md:p-5\">\n                {/* Order Header */}\n                <div className=\"flex flex-col md:flex-row md:items-center justify-between mb-3\">\n                  <div className=\"mb-3 md:mb-0\">\n                    <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                      <h3 className=\"text-base font-semibold text-text-primary\">{order.cartName}</h3>\n                      <StatusBadge status={order.status} />\n                    </div>\n                    <p className=\"text-xs text-text-secondary mt-1\">\n                      Order #{order.id} &middot; {formatDate(order.orderDate)}\n                    </p>\n                  </div>\n                  <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                    <p className=\"text-lg font-bold text-text-primary\">\n                      {formatCurrency(order.total, { minimumFractionDigits: 0 })}\n                    </p>\n                    <div className=\"flex gap-2\">\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/orders/${order.id}`)}\n                        className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n                      >\n                        <Eye className=\"h-3 w-3\" />\n                        Track Order\n                      </button>\n                      {order.status === 'delivered' && (\n                        <button\n                          type=\"button\"\n                          onClick={() => handleReorder(order)}\n                          className=\"flex items-center gap-1.5 rounded-lg bg-foreground px-3 py-1.5 text-xs font-medium text-background hover:opacity-90 transition-opacity\"\n                        >\n                          <RotateCcw className=\"h-3 w-3\" />\n                          Reorder\n                        </button>\n                      )}\n                    </div>\n                  </div>\n                </div>\n\n                {/* Order Items Summary */}\n                <div className=\"border-t border-border-subtle pt-3\">\n                  <div className=\"flex flex-wrap gap-1\">\n                    {order.items.slice(0, 3).map((item, index) => (\n                      <span key={index} className=\"text-xs text-text-secondary\">\n                        {item.name} ({item.quantity})\n                        {index < Math.min(2, order.items.length - 1) && ', '}\n                      </span>\n                    ))}\n                    {order.items.length > 3 && (\n                      <span className=\"text-xs text-text-secondary\">\n                        +{order.items.length - 3} more items\n                      </span>\n                    )}\n                  </div>\n                </div>\n\n                {/* Status Message */}\n                <div className=\"mt-3\">\n                  {order.status === 'delivered' && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-status-success-text\">\n                      <CheckCircle2 className=\"h-3 w-3\" />\n                      <span>Order delivered successfully</span>\n                    </div>\n                  )}\n                  {order.status === 'cancelled' && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-status-error-text\">\n                      <XCircle className=\"h-3 w-3\" />\n                      <span>\n                        Cancelled{order.cancellationReason && ` - ${order.cancellationReason}`}\n                      </span>\n                    </div>\n                  )}\n                  {['pending', 'confirmed', 'preparing', 'ready', 'out_for_delivery'].includes(\n                    order.status\n                  ) && (\n                    <div className=\"flex items-center gap-1.5 text-xs text-accent-blue\">\n                      <Truck className=\"h-3 w-3\" />\n                      <span>\n                        Estimated delivery by{' '}\n                        {order.estimatedDeliveryTime\n                          ? formatDate(order.estimatedDeliveryTime)\n                          : 'TBD'}\n                      </span>\n                    </div>\n                  )}\n                </div>\n\n                {/* Rating Section */}\n                {order.status === 'delivered' && (\n                  <div className=\"mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2\">\n                    {order.rating ? (\n                      <div className=\"flex flex-col sm:flex-row sm:items-center gap-2\">\n                        <RatingDisplay value={order.rating} />\n                        {order.review && (\n                          <p className=\"text-xs text-text-secondary italic\">\n                            &ldquo;{order.review}&rdquo;\n                          </p>\n                        )}\n                      </div>\n                    ) : (\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/orders/${order.id}/rate`)}\n                        className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-accent transition-colors\"\n                      >\n                        <Star className=\"h-3 w-3\" />\n                        Rate Order\n                      </button>\n                    )}\n                  </div>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n\n      {/* Load More */}\n      {hasMore && !isLoading && (\n        <div className=\"text-center mt-8\">\n          <button\n            type=\"button\"\n            onClick={handleLoadMore}\n            className=\"inline-flex items-center gap-2 rounded-lg border border-border-subtle px-6 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n          >\n            <ChevronDown className=\"h-4 w-4\" />\n            Load More Orders\n          </button>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/adaptercloud/pages/customer/OrderTrackingPage.js

@@ -61,6 +61,7 @@ function A() {
 	if (!j) return /* @__PURE__ */ w(n, {
 		title: "Order Not Found",
 		children: /* @__PURE__ */ w(i, {
+			illustration: "empty-data",
 			icon: /* @__PURE__ */ w(y, { className: "h-12 w-12" }),
 			title: "Order not found",
 			description: "The order you're looking for doesn't exist.",
@@ -90,7 +91,7 @@ function A() {
 				className: "lg:col-span-2 space-y-6",
 				children: [
 					/* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ T("div", {
 							className: "flex flex-col sm:flex-row sm:justify-between sm:items-start gap-3",
 							children: [/* @__PURE__ */ T("div", {
@@ -129,15 +130,15 @@ function A() {
 								children: j.cancellationReason
 							})] })]
 						}) : /* @__PURE__ */ T("div", {
-							className: t("mt-4 flex items-start gap-3 rounded-lg p-4 border", P ? "bg-green-500/10 border-green-500/20" : "bg-blue-500/10 border-blue-500/20"),
-							children: [P ? /* @__PURE__ */ w(d, { className: "h-5 w-5 text-green-600 dark:text-green-400 mt-0.5 shrink-0" }) : /* @__PURE__ */ w(m, { className: "h-5 w-5 text-blue-600 dark:text-blue-400 mt-0.5 shrink-0" }), /* @__PURE__ */ w("p", {
-								className: t("text-sm font-medium", P ? "text-green-600 dark:text-green-400" : "text-blue-600 dark:text-blue-400"),
+							className: t("mt-4 flex items-start gap-3 rounded-lg p-4 border", P ? "bg-status-success-bg-subtle/10 border-status-success-border/20" : "bg-accent-blue-subtle/10 border-accent-blue-subtle/20"),
+							children: [P ? /* @__PURE__ */ w(d, { className: "h-5 w-5 text-status-success-text mt-0.5 shrink-0" }) : /* @__PURE__ */ w(m, { className: "h-5 w-5 text-accent-blue mt-0.5 shrink-0" }), /* @__PURE__ */ w("p", {
+								className: t("text-sm font-medium", P ? "text-status-success-text" : "text-accent-blue"),
 								children: P ? `Delivered at ${o(j.actualDeliveryTime)}` : j.estimatedDeliveryTime ? `Estimated delivery by ${o(j.estimatedDeliveryTime)}` : "Estimated delivery time: TBD"
 							})]
 						})]
 					}),
 					!N && /* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ w("h3", {
 							className: "text-base font-semibold text-text-primary mb-5",
 							children: "Order Status"
@@ -148,9 +149,9 @@ function A() {
 								return /* @__PURE__ */ T("div", {
 									className: "flex items-start relative",
 									children: [
-										!a && /* @__PURE__ */ w("div", { className: t("absolute left-5 top-10 w-0.5 h-8 z-0", r ? "bg-green-500" : "bg-border") }),
+										!a && /* @__PURE__ */ w("div", { className: t("absolute left-5 top-10 w-0.5 h-8 z-0", r ? "bg-status-success-bg-subtle" : "bg-border") }),
 										/* @__PURE__ */ w("div", {
-											className: t("relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full", r ? "bg-green-500/10 border-2 border-green-500 text-green-600 dark:text-green-400" : "bg-bg-sunken border-2 border-border-subtle text-text-secondary", i && "ring-4 ring-green-500/20"),
+											className: t("relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full", r ? "bg-status-success-bg-subtle/10 border-2 border-status-success-border text-status-success-text" : "bg-bg-sunken border-2 border-border-subtle text-text-secondary", i && "ring-4 ring-status-success-border/20"),
 											children: /* @__PURE__ */ w(o, { className: "h-4 w-4" })
 										}),
 										/* @__PURE__ */ T("div", {
@@ -165,7 +166,7 @@ function A() {
 													children: k[e]
 												}),
 												i && j.assignedWorker && /* @__PURE__ */ T("div", {
-													className: "mt-1.5 text-xs text-blue-600 dark:text-blue-400",
+													className: "mt-1.5 text-xs text-accent-blue",
 													children: [/* @__PURE__ */ T("p", { children: ["Driver: ", j.assignedWorker.name] }), /* @__PURE__ */ T("p", { children: ["Contact: ", j.assignedWorker.phone] })]
 												})
 											]
@@ -176,7 +177,7 @@ function A() {
 						})]
 					}),
 					/* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [
 							/* @__PURE__ */ w("h3", {
 								className: "text-base font-semibold text-text-primary mb-3",
@@ -228,7 +229,7 @@ function A() {
 										children: [/* @__PURE__ */ w("span", { children: "Tax" }), /* @__PURE__ */ w("span", { children: a(j.taxes, { minimumFractionDigits: 0 }) })]
 									}),
 									j.discount && j.discount > 0 && /* @__PURE__ */ T("div", {
-										className: "flex justify-between text-green-600 dark:text-green-400",
+										className: "flex justify-between text-status-success-text",
 										children: [/* @__PURE__ */ w("span", { children: "Discount" }), /* @__PURE__ */ T("span", { children: ["-", a(j.discount, { minimumFractionDigits: 0 })] })]
 									}),
 									/* @__PURE__ */ T("div", {
@@ -244,7 +245,7 @@ function A() {
 				className: "lg:col-span-1 space-y-6",
 				children: [
 					/* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ w("h3", {
 							className: "text-base font-semibold text-text-primary mb-3",
 							children: "Delivery Details"
@@ -305,7 +306,7 @@ function A() {
 						})]
 					}),
 					j.assignedWorker && /* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ w("h3", {
 							className: "text-base font-semibold text-text-primary mb-3",
 							children: "Delivery Partner"
@@ -328,7 +329,7 @@ function A() {
 											children: j.assignedWorker.name
 										}), /* @__PURE__ */ T("div", {
 											className: "flex items-center gap-1.5 mt-0.5",
-											children: [/* @__PURE__ */ w(b, { className: "h-3 w-3 fill-yellow-400 text-yellow-400" }), /* @__PURE__ */ T("span", {
+											children: [/* @__PURE__ */ w(b, { className: "h-3 w-3 fill-status-warning-text text-status-warning-text" }), /* @__PURE__ */ T("span", {
 												className: "text-xs text-text-secondary",
 												children: [j.assignedWorker.rating, "/5"]
 											})]
@@ -349,7 +350,7 @@ function A() {
 						})]
 					}),
 					/* @__PURE__ */ T("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ w("h3", {
 							className: "text-base font-semibold text-text-primary mb-3",
 							children: "Need Help?"

package/dist/adaptercloud/pages/customer/OrderTrackingPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderTrackingPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/OrderTrackingPage.tsx"],"sourcesContent":["/**\n * Order Tracking Page\n * @module adaptercloud/pages/customer\n *\n * Real-time order tracking with status timeline, delivery partner info,\n * price breakdown, Need Help sidebar, and rate order functionality.\n */\n\nimport { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n  ArrowLeft,\n  CheckCircle2,\n  Circle,\n  Clock,\n  MapPin,\n  Phone,\n  Star,\n  Package,\n  Truck,\n  ChefHat,\n  ShoppingBag,\n  XCircle,\n  MessageCircle,\n  AlertTriangle,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { getOrderById } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency, formatDate } from '../../utils/formatters';\nimport type { OrderStatus } from '../../types';\n\nconst statusIcons: Record<string, typeof Package> = {\n  pending: Clock,\n  confirmed: CheckCircle2,\n  preparing: ChefHat,\n  ready: Package,\n  picked_up: Package,\n  out_for_delivery: Truck,\n  delivered: CheckCircle2,\n  cancelled: XCircle,\n};\n\nconst statusOrder: OrderStatus[] = [\n  'pending',\n  'confirmed',\n  'preparing',\n  'ready',\n  'out_for_delivery',\n  'delivered',\n];\n\nconst statusLabels: Record<string, string> = {\n  pending: 'Order Placed',\n  confirmed: 'Confirmed',\n  preparing: 'Preparing',\n  ready: 'Ready',\n  out_for_delivery: 'Out for Delivery',\n  delivered: 'Delivered',\n};\n\nconst statusDescriptions: Record<string, string> = {\n  pending: 'Your order has been received',\n  confirmed: 'Cart has accepted your order',\n  preparing: 'Your food is being prepared',\n  ready: 'Order is ready for pickup/delivery',\n  out_for_delivery: 'Your order is on the way',\n  delivered: 'Order has been delivered',\n};\n\nexport function OrderTrackingPage() {\n  const { orderId } = useParams<{ orderId: string }>();\n  const { navigateTo } = useAdapterCloud();\n  const [isLoading, setIsLoading] = useState(true);\n\n  // Simulate loading\n  useMemo(() => {\n    const timer = setTimeout(() => setIsLoading(false), 800);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const order = useMemo(() => (orderId ? getOrderById(orderId) : undefined), [orderId]);\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Track Order\">\n        <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n          <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4\" />\n          <p className=\"text-sm text-text-secondary\">Loading order details...</p>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (!order) {\n    return (\n      <PageLayout title=\"Order Not Found\">\n        <EmptyState\n          icon={<ShoppingBag className=\"h-12 w-12\" />}\n          title=\"Order not found\"\n          description={`The order you're looking for doesn't exist.`}\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/customer/orders')}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              View All Orders\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const currentStatusIndex = statusOrder.indexOf(order.status);\n  const isCancelled = order.status === 'cancelled';\n  const isDelivered = order.status === 'delivered';\n\n  const isStepCompleted = (stepStatus: string): boolean => {\n    const stepIndex = statusOrder.indexOf(stepStatus as OrderStatus);\n    return stepIndex <= currentStatusIndex;\n  };\n\n  const isCurrentStep = (stepStatus: string): boolean => {\n    return stepStatus === order.status;\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/orders')}\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          <span>Track Order</span>\n        </div>\n      }\n      actions={<StatusBadge status={order.status} />}\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Left: Order Details & Timeline */}\n        <div className=\"lg:col-span-2 space-y-6\">\n          {/* Order Header */}\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <div className=\"flex flex-col sm:flex-row sm:justify-between sm:items-start gap-3\">\n              <div className=\"flex-1\">\n                <h2 className=\"text-lg font-semibold text-text-primary\">Order #{order.id}</h2>\n                <p className=\"text-sm text-text-secondary\">{order.cartName}</p>\n                <p className=\"text-xs text-text-secondary mt-0.5\">\n                  {formatDate(order.orderDate)}\n                </p>\n              </div>\n              <div className=\"text-left sm:text-right\">\n                <p className=\"text-xl font-bold text-text-primary\">\n                  {formatCurrency(order.total, { minimumFractionDigits: 0 })}\n                </p>\n                <p className=\"text-xs text-text-secondary uppercase\">{order.paymentMethod}</p>\n              </div>\n            </div>\n\n            {/* Status Banner */}\n            {isCancelled ? (\n              <div className=\"mt-4 flex items-start gap-3 rounded-lg bg-status-error-bg/10 p-4 border border-status-error-border/20\">\n                <XCircle className=\"h-5 w-5 text-status-error-text mt-0.5 shrink-0\" />\n                <div>\n                  <p className=\"font-medium text-status-error-text\">Order Cancelled</p>\n                  {order.cancellationReason && (\n                    <p className=\"text-sm text-status-error-text/80 mt-0.5\">{order.cancellationReason}</p>\n                  )}\n                </div>\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'mt-4 flex items-start gap-3 rounded-lg p-4 border',\n                  isDelivered\n                    ? 'bg-green-500/10 border-green-500/20'\n                    : 'bg-blue-500/10 border-blue-500/20'\n                )}\n              >\n                {isDelivered ? (\n                  <CheckCircle2 className=\"h-5 w-5 text-green-600 dark:text-green-400 mt-0.5 shrink-0\" />\n                ) : (\n                  <Clock className=\"h-5 w-5 text-blue-600 dark:text-blue-400 mt-0.5 shrink-0\" />\n                )}\n                <p\n                  className={cn(\n                    'text-sm font-medium',\n                    isDelivered\n                      ? 'text-green-600 dark:text-green-400'\n                      : 'text-blue-600 dark:text-blue-400'\n                  )}\n                >\n                  {isDelivered\n                    ? `Delivered at ${formatDate(order.actualDeliveryTime!)}`\n                    : order.estimatedDeliveryTime\n                      ? `Estimated delivery by ${formatDate(order.estimatedDeliveryTime)}`\n                      : 'Estimated delivery time: TBD'}\n                </p>\n              </div>\n            )}\n          </div>\n\n          {/* Tracking Progress Timeline */}\n          {!isCancelled && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h3 className=\"text-base font-semibold text-text-primary mb-5\">Order Status</h3>\n              <div className=\"relative space-y-0\">\n                {statusOrder.map((stepStatus, index) => {\n                  const completed = isStepCompleted(stepStatus);\n                  const current = isCurrentStep(stepStatus);\n                  const isLast = index === statusOrder.length - 1;\n                  const StepIcon = statusIcons[stepStatus] ?? Circle;\n\n                  return (\n                    <div key={stepStatus} className=\"flex items-start relative\">\n                      {/* Connecting line */}\n                      {!isLast && (\n                        <div\n                          className={cn(\n                            'absolute left-5 top-10 w-0.5 h-8 z-0',\n                            completed ? 'bg-green-500' : 'bg-border'\n                          )}\n                        />\n                      )}\n\n                      {/* Step circle */}\n                      <div\n                        className={cn(\n                          'relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full',\n                          completed\n                            ? 'bg-green-500/10 border-2 border-green-500 text-green-600 dark:text-green-400'\n                            : 'bg-bg-sunken border-2 border-border-subtle text-text-secondary',\n                          current && 'ring-4 ring-green-500/20'\n                        )}\n                      >\n                        <StepIcon className=\"h-4 w-4\" />\n                      </div>\n\n                      {/* Step content */}\n                      <div className=\"ml-4 flex-1 pb-8\">\n                        <h4\n                          className={cn(\n                            'text-sm font-semibold',\n                            completed ? 'text-text-primary' : 'text-text-secondary'\n                          )}\n                        >\n                          {statusLabels[stepStatus]}\n                        </h4>\n                        <p\n                          className={cn(\n                            'text-xs',\n                            completed ? 'text-text-secondary' : 'text-text-secondary/50'\n                          )}\n                        >\n                          {statusDescriptions[stepStatus]}\n                        </p>\n                        {/* Show driver info at current step */}\n                        {current && order.assignedWorker && (\n                          <div className=\"mt-1.5 text-xs text-blue-600 dark:text-blue-400\">\n                            <p>Driver: {order.assignedWorker.name}</p>\n                            <p>Contact: {order.assignedWorker.phone}</p>\n                          </div>\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </div>\n          )}\n\n          {/* Order Items & Price Breakdown */}\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <h3 className=\"text-base font-semibold text-text-primary mb-3\">Order Items</h3>\n            <div className=\"space-y-2\">\n              {order.items.map((item, index) => (\n                <div\n                  key={index}\n                  className=\"flex justify-between items-start pb-2 border-b border-border-subtle last:border-b-0\"\n                >\n                  <div className=\"flex-1 pr-2\">\n                    <p className=\"text-sm font-medium text-text-primary\">{item.name}</p>\n                    {item.customizations && item.customizations.length > 0 && (\n                      <p className=\"text-xs text-text-secondary\">\n                        {item.customizations.join(', ')}\n                      </p>\n                    )}\n                    <p className=\"text-xs text-text-secondary\">\n                      {formatCurrency(item.price, { minimumFractionDigits: 0 })} x {item.quantity}\n                    </p>\n                  </div>\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {formatCurrency(item.price * item.quantity, { minimumFractionDigits: 0 })}\n                  </p>\n                </div>\n              ))}\n            </div>\n\n            {/* Price Breakdown */}\n            <div className=\"mt-4 pt-4 border-t border-border-subtle space-y-2 text-sm\">\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Subtotal</span>\n                <span>{formatCurrency(order.subtotal, { minimumFractionDigits: 0 })}</span>\n              </div>\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Delivery Fee</span>\n                <span>\n                  {order.deliveryFee === 0\n                    ? 'FREE'\n                    : formatCurrency(order.deliveryFee, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Tax</span>\n                <span>{formatCurrency(order.taxes, { minimumFractionDigits: 0 })}</span>\n              </div>\n              {order.discount && order.discount > 0 && (\n                <div className=\"flex justify-between text-green-600 dark:text-green-400\">\n                  <span>Discount</span>\n                  <span>-{formatCurrency(order.discount, { minimumFractionDigits: 0 })}</span>\n                </div>\n              )}\n              <div className=\"flex justify-between font-semibold pt-2 border-t border-border-subtle text-text-primary\">\n                <span>Total</span>\n                <span>{formatCurrency(order.total, { minimumFractionDigits: 0 })}</span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        {/* Right: Sidebar */}\n        <div className=\"lg:col-span-1 space-y-6\">\n          {/* Delivery Details */}\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <h3 className=\"text-base font-semibold text-text-primary mb-3\">Delivery Details</h3>\n            <div className=\"space-y-3\">\n              <div className=\"flex items-start gap-2\">\n                <MapPin className=\"mt-0.5 h-4 w-4 shrink-0 text-text-secondary\" />\n                <div>\n                  <p className=\"text-xs text-text-secondary\">Delivery Address</p>\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {order.deliveryAddress.street}\n                  </p>\n                  <p className=\"text-sm text-text-secondary\">{order.deliveryAddress.area}</p>\n                  <p className=\"text-sm text-text-secondary\">\n                    {order.deliveryAddress.city}, {order.deliveryAddress.pincode}\n                  </p>\n                  {order.deliveryAddress.landmark && (\n                    <p className=\"text-xs text-text-secondary mt-0.5\">\n                      Landmark: {order.deliveryAddress.landmark}\n                    </p>\n                  )}\n                </div>\n              </div>\n\n              {/* Customer Notes */}\n              {order.customerNotes && (\n                <div>\n                  <p className=\"text-xs text-text-secondary\">Customer Notes</p>\n                  <p className=\"text-sm text-text-primary\">{order.customerNotes}</p>\n                </div>\n              )}\n\n              {/* Payment */}\n              <div>\n                <p className=\"text-xs text-text-secondary\">Payment Method</p>\n                <p className=\"text-sm font-medium text-text-primary capitalize\">\n                  {order.paymentMethod}\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  {order.paymentStatus === 'completed' ? 'Paid' : 'Payment Pending'}\n                </p>\n              </div>\n            </div>\n          </div>\n\n          {/* Delivery Partner */}\n          {order.assignedWorker && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h3 className=\"text-base font-semibold text-text-primary mb-3\">Delivery Partner</h3>\n              <div className=\"space-y-3\">\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-bg-sunken text-text-secondary\">\n                    <span className=\"text-sm font-semibold\">\n                      {order.assignedWorker.name.charAt(0)}\n                    </span>\n                  </div>\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {order.assignedWorker.name}\n                    </p>\n                    <div className=\"flex items-center gap-1.5 mt-0.5\">\n                      <Star className=\"h-3 w-3 fill-yellow-400 text-yellow-400\" />\n                      <span className=\"text-xs text-text-secondary\">\n                        {order.assignedWorker.rating}/5\n                      </span>\n                    </div>\n                  </div>\n                  <a\n                    href={`tel:${order.assignedWorker.phone}`}\n                    className=\"flex h-9 w-9 items-center justify-center rounded-full bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                  >\n                    <Phone className=\"h-4 w-4\" />\n                  </a>\n                </div>\n                <button\n                  type=\"button\"\n                  onClick={() => (window.location.href = `tel:${order.assignedWorker!.phone}`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  <Phone className=\"h-4 w-4\" />\n                  Call Driver\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Need Help */}\n          <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <h3 className=\"text-base font-semibold text-text-primary mb-3\">Need Help?</h3>\n            <div className=\"space-y-2\">\n              <button\n                type=\"button\"\n                onClick={() => alert('Chat support coming soon!')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                <MessageCircle className=\"h-4 w-4\" />\n                Chat Support\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => (window.location.href = 'tel:7012270561')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                <Phone className=\"h-4 w-4\" />\n                Call Support\n              </button>\n              {isDelivered && !order.rating && (\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/customer/orders/${order.id}/rate`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg bg-foreground px-3 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  <Star className=\"h-4 w-4\" />\n                  Rate Order\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"OrderTrackingPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/customer/OrderTrackingPage.tsx"],"sourcesContent":["/**\n * Order Tracking Page\n * @module adaptercloud/pages/customer\n *\n * Real-time order tracking with status timeline, delivery partner info,\n * price breakdown, Need Help sidebar, and rate order functionality.\n */\n\nimport { useState, useMemo } from'react';\nimport { useParams } from'react-router-dom';\nimport {\n  ArrowLeft,\n  CheckCircle2,\n  Circle,\n  Clock,\n  MapPin,\n  Phone,\n  Star,\n  Package,\n  Truck,\n  ChefHat,\n  ShoppingBag,\n  XCircle,\n  MessageCircle,\n  AlertTriangle,\n} from'lucide-react';\nimport { PageLayout } from'../../components/PageLayout';\nimport { StatusBadge } from'../../components/StatusBadge';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useAdapterCloud } from'../../context/AdapterCloudContext';\nimport { getOrderById } from'../../mocks/data';\nimport { cn } from'../../utils/cn';\nimport { formatCurrency, formatDate } from'../../utils/formatters';\nimport type { OrderStatus } from'../../types';\n\nconst statusIcons: Record<string, typeof Package> = {\n  pending: Clock,\n  confirmed: CheckCircle2,\n  preparing: ChefHat,\n  ready: Package,\n  picked_up: Package,\n  out_for_delivery: Truck,\n  delivered: CheckCircle2,\n  cancelled: XCircle,\n};\n\nconst statusOrder: OrderStatus[] = [\n  'pending',\n  'confirmed',\n  'preparing',\n  'ready',\n  'out_for_delivery',\n  'delivered',\n];\n\nconst statusLabels: Record<string, string> = {\n  pending: 'Order Placed',\n  confirmed: 'Confirmed',\n  preparing: 'Preparing',\n  ready: 'Ready',\n  out_for_delivery: 'Out for Delivery',\n  delivered: 'Delivered',\n};\n\nconst statusDescriptions: Record<string, string> = {\n  pending: 'Your order has been received',\n  confirmed: 'Cart has accepted your order',\n  preparing: 'Your food is being prepared',\n  ready: 'Order is ready for pickup/delivery',\n  out_for_delivery: 'Your order is on the way',\n  delivered: 'Order has been delivered',\n};\n\nexport function OrderTrackingPage() {\n  const { orderId } = useParams<{ orderId: string }>();\n  const { navigateTo } = useAdapterCloud();\n  const [isLoading, setIsLoading] = useState(true);\n\n  // Simulate loading\n  useMemo(() => {\n    const timer = setTimeout(() => setIsLoading(false), 800);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const order = useMemo(() => (orderId ? getOrderById(orderId) : undefined), [orderId]);\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Track Order\">\n        <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n          <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4\" />\n          <p className=\"text-sm text-text-secondary\">Loading order details...</p>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (!order) {\n    return (\n      <PageLayout title=\"Order Not Found\">\n        <EmptyState\n          illustration=\"empty-data\"\n          icon={<ShoppingBag className=\"h-12 w-12\" />}\n          title=\"Order not found\"\n          description={`The order you're looking for doesn't exist.`}\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/customer/orders')}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              View All Orders\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const currentStatusIndex = statusOrder.indexOf(order.status);\n  const isCancelled = order.status === 'cancelled';\n  const isDelivered = order.status === 'delivered';\n\n  const isStepCompleted = (stepStatus: string): boolean => {\n    const stepIndex = statusOrder.indexOf(stepStatus as OrderStatus);\n    return stepIndex <= currentStatusIndex;\n  };\n\n  const isCurrentStep = (stepStatus: string): boolean => {\n    return stepStatus === order.status;\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/orders')}\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          <span>Track Order</span>\n        </div>\n      }\n      actions={<StatusBadge status={order.status} />}\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Left: Order Details & Timeline */}\n        <div className=\"lg:col-span-2 space-y-6\">\n          {/* Order Header */}\n          <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n            <div className=\"flex flex-col sm:flex-row sm:justify-between sm:items-start gap-3\">\n              <div className=\"flex-1\">\n                <h2 className=\"text-lg font-semibold text-text-primary\">Order #{order.id}</h2>\n                <p className=\"text-sm text-text-secondary\">{order.cartName}</p>\n                <p className=\"text-xs text-text-secondary mt-0.5\">\n                  {formatDate(order.orderDate)}\n                </p>\n              </div>\n              <div className=\"text-left sm:text-right\">\n                <p className=\"text-xl font-bold text-text-primary\">\n                  {formatCurrency(order.total, { minimumFractionDigits: 0 })}\n                </p>\n                <p className=\"text-xs text-text-secondary uppercase\">{order.paymentMethod}</p>\n              </div>\n            </div>\n\n            {/* Status Banner */}\n            {isCancelled ? (\n              <div className=\"mt-4 flex items-start gap-3 rounded-lg bg-status-error-bg/10 p-4 border border-status-error-border/20\">\n                <XCircle className=\"h-5 w-5 text-status-error-text mt-0.5 shrink-0\" />\n                <div>\n                  <p className=\"font-medium text-status-error-text\">Order Cancelled</p>\n                  {order.cancellationReason && (\n                    <p className=\"text-sm text-status-error-text/80 mt-0.5\">{order.cancellationReason}</p>\n                  )}\n                </div>\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'mt-4 flex items-start gap-3 rounded-lg p-4 border',\n                  isDelivered\n                    ? 'bg-status-success-bg-subtle/10 border-status-success-border/20'\n                    : 'bg-accent-blue-subtle/10 border-accent-blue-subtle/20'\n                )}\n              >\n                {isDelivered ? (\n                  <CheckCircle2 className=\"h-5 w-5 text-status-success-text mt-0.5 shrink-0\" />\n                ) : (\n                  <Clock className=\"h-5 w-5 text-accent-blue mt-0.5 shrink-0\" />\n                )}\n                <p\n                  className={cn(\n                    'text-sm font-medium',\n                    isDelivered\n                      ? 'text-status-success-text'\n                      : 'text-accent-blue'\n                  )}\n                >\n                  {isDelivered\n                    ? `Delivered at ${formatDate(order.actualDeliveryTime!)}`\n                    : order.estimatedDeliveryTime\n                      ? `Estimated delivery by ${formatDate(order.estimatedDeliveryTime)}`\n                      : 'Estimated delivery time: TBD'}\n                </p>\n              </div>\n            )}\n          </div>\n\n          {/* Tracking Progress Timeline */}\n          {!isCancelled && (\n            <div className=\"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-5\">Order Status</h3>\n              <div className=\"relative space-y-0\">\n                {statusOrder.map((stepStatus, index) => {\n                  const completed = isStepCompleted(stepStatus);\n                  const current = isCurrentStep(stepStatus);\n                  const isLast = index === statusOrder.length - 1;\n                  const StepIcon = statusIcons[stepStatus] ?? Circle;\n\n                  return (\n                    <div key={stepStatus} className=\"flex items-start relative\">\n                      {/* Connecting line */}\n                      {!isLast && (\n                        <div\n                          className={cn(\n                            'absolute left-5 top-10 w-0.5 h-8 z-0',\n                            completed ? 'bg-status-success-bg-subtle' : 'bg-border'\n                          )}\n                        />\n                      )}\n\n                      {/* Step circle */}\n                      <div\n                        className={cn(\n                          'relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full',\n                          completed\n                            ? 'bg-status-success-bg-subtle/10 border-2 border-status-success-border text-status-success-text'\n                            : 'bg-bg-sunken border-2 border-border-subtle text-text-secondary',\n                          current && 'ring-4 ring-status-success-border/20'\n                        )}\n                      >\n                        <StepIcon className=\"h-4 w-4\" />\n                      </div>\n\n                      {/* Step content */}\n                      <div className=\"ml-4 flex-1 pb-8\">\n                        <h4\n                          className={cn(\n                            'text-sm font-semibold',\n                            completed ? 'text-text-primary' : 'text-text-secondary'\n                          )}\n                        >\n                          {statusLabels[stepStatus]}\n                        </h4>\n                        <p\n                          className={cn(\n                            'text-xs',\n                            completed ? 'text-text-secondary' : 'text-text-secondary/50'\n                          )}\n                        >\n                          {statusDescriptions[stepStatus]}\n                        </p>\n                        {/* Show driver info at current step */}\n                        {current && order.assignedWorker && (\n                          <div className=\"mt-1.5 text-xs text-accent-blue\">\n                            <p>Driver: {order.assignedWorker.name}</p>\n                            <p>Contact: {order.assignedWorker.phone}</p>\n                          </div>\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </div>\n          )}\n\n          {/* Order Items & Price Breakdown */}\n          <div className=\"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-3\">Order Items</h3>\n            <div className=\"space-y-2\">\n              {order.items.map((item, index) => (\n                <div\n                  key={index}\n                  className=\"flex justify-between items-start pb-2 border-b border-border-subtle last:border-b-0\"\n                >\n                  <div className=\"flex-1 pr-2\">\n                    <p className=\"text-sm font-medium text-text-primary\">{item.name}</p>\n                    {item.customizations && item.customizations.length > 0 && (\n                      <p className=\"text-xs text-text-secondary\">\n                        {item.customizations.join(', ')}\n                      </p>\n                    )}\n                    <p className=\"text-xs text-text-secondary\">\n                      {formatCurrency(item.price, { minimumFractionDigits: 0 })} x {item.quantity}\n                    </p>\n                  </div>\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {formatCurrency(item.price * item.quantity, { minimumFractionDigits: 0 })}\n                  </p>\n                </div>\n              ))}\n            </div>\n\n            {/* Price Breakdown */}\n            <div className=\"mt-4 pt-4 border-t border-border-subtle space-y-2 text-sm\">\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Subtotal</span>\n                <span>{formatCurrency(order.subtotal, { minimumFractionDigits: 0 })}</span>\n              </div>\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Delivery Fee</span>\n                <span>\n                  {order.deliveryFee === 0\n                    ? 'FREE'\n                    : formatCurrency(order.deliveryFee, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n              <div className=\"flex justify-between text-text-secondary\">\n                <span>Tax</span>\n                <span>{formatCurrency(order.taxes, { minimumFractionDigits: 0 })}</span>\n              </div>\n              {order.discount && order.discount > 0 && (\n                <div className=\"flex justify-between text-status-success-text\">\n                  <span>Discount</span>\n                  <span>-{formatCurrency(order.discount, { minimumFractionDigits: 0 })}</span>\n                </div>\n              )}\n              <div className=\"flex justify-between font-semibold pt-2 border-t border-border-subtle text-text-primary\">\n                <span>Total</span>\n                <span>{formatCurrency(order.total, { minimumFractionDigits: 0 })}</span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        {/* Right: Sidebar */}\n        <div className=\"lg:col-span-1 space-y-6\">\n          {/* Delivery Details */}\n          <div className=\"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-3\">Delivery Details</h3>\n            <div className=\"space-y-3\">\n              <div className=\"flex items-start gap-2\">\n                <MapPin className=\"mt-0.5 h-4 w-4 shrink-0 text-text-secondary\" />\n                <div>\n                  <p className=\"text-xs text-text-secondary\">Delivery Address</p>\n                  <p className=\"text-sm font-medium text-text-primary\">\n                    {order.deliveryAddress.street}\n                  </p>\n                  <p className=\"text-sm text-text-secondary\">{order.deliveryAddress.area}</p>\n                  <p className=\"text-sm text-text-secondary\">\n                    {order.deliveryAddress.city}, {order.deliveryAddress.pincode}\n                  </p>\n                  {order.deliveryAddress.landmark && (\n                    <p className=\"text-xs text-text-secondary mt-0.5\">\n                      Landmark: {order.deliveryAddress.landmark}\n                    </p>\n                  )}\n                </div>\n              </div>\n\n              {/* Customer Notes */}\n              {order.customerNotes && (\n                <div>\n                  <p className=\"text-xs text-text-secondary\">Customer Notes</p>\n                  <p className=\"text-sm text-text-primary\">{order.customerNotes}</p>\n                </div>\n              )}\n\n              {/* Payment */}\n              <div>\n                <p className=\"text-xs text-text-secondary\">Payment Method</p>\n                <p className=\"text-sm font-medium text-text-primary capitalize\">\n                  {order.paymentMethod}\n                </p>\n                <p className=\"text-xs text-text-secondary\">\n                  {order.paymentStatus === 'completed' ? 'Paid' : 'Payment Pending'}\n                </p>\n              </div>\n            </div>\n          </div>\n\n          {/* Delivery Partner */}\n          {order.assignedWorker && (\n            <div className=\"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-3\">Delivery Partner</h3>\n              <div className=\"space-y-3\">\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-bg-sunken text-text-secondary\">\n                    <span className=\"text-sm font-semibold\">\n                      {order.assignedWorker.name.charAt(0)}\n                    </span>\n                  </div>\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {order.assignedWorker.name}\n                    </p>\n                    <div className=\"flex items-center gap-1.5 mt-0.5\">\n                      <Star className=\"h-3 w-3 fill-status-warning-text text-status-warning-text\" />\n                      <span className=\"text-xs text-text-secondary\">\n                        {order.assignedWorker.rating}/5\n                      </span>\n                    </div>\n                  </div>\n                  <a\n                    href={`tel:${order.assignedWorker.phone}`}\n                    className=\"flex h-9 w-9 items-center justify-center rounded-full bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                  >\n                    <Phone className=\"h-4 w-4\" />\n                  </a>\n                </div>\n                <button\n                  type=\"button\"\n                  onClick={() => (window.location.href = `tel:${order.assignedWorker!.phone}`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  <Phone className=\"h-4 w-4\" />\n                  Call Driver\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Need Help */}\n          <div className=\"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-3\">Need Help?</h3>\n            <div className=\"space-y-2\">\n              <button\n                type=\"button\"\n                onClick={() => alert('Chat support coming soon!')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                <MessageCircle className=\"h-4 w-4\" />\n                Chat Support\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => (window.location.href = 'tel:7012270561')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border-subtle px-3 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                <Phone className=\"h-4 w-4\" />\n                Call Support\n              </button>\n              {isDelivered && !order.rating && (\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/customer/orders/${order.id}/rate`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg bg-foreground px-3 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  <Star className=\"h-4 w-4\" />\n                  Rate Order\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/adaptercloud/pages/customer/PaymentMethodsPage.js

@@ -65,7 +65,7 @@ function v({ method: e, onRemove: n, onSetDefault: r }) {
 						className: "text-sm font-medium text-text-primary",
 						children: e.label
 					}), e.isDefault && /* @__PURE__ */ g("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",
+						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",
 						children: [/* @__PURE__ */ h(o, { className: "h-3 w-3" }), "Default"]
 					})]
 				}), /* @__PURE__ */ h("p", {
@@ -166,9 +166,9 @@ function y() {
 		}),
 		children: [
 			T && /* @__PURE__ */ g("div", {
-				className: "mb-4 rounded-lg border border-green-500/30 bg-green-500/10 p-3 flex items-center gap-2",
-				children: [/* @__PURE__ */ h(o, { className: "h-4 w-4 text-green-600 dark:text-green-400 shrink-0" }), /* @__PURE__ */ h("p", {
-					className: "text-sm text-green-600 dark:text-green-400",
+				className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
+				children: [/* @__PURE__ */ h(o, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ h("p", {
+					className: "text-sm text-status-success-text",
 					children: T
 				})]
 			}),
@@ -209,7 +209,7 @@ function y() {
 						}, e.id))
 					})] }),
 					/* @__PURE__ */ g("div", {
-						className: "flex items-start gap-3 rounded-lg border border-border-subtle bg-bg-surface p-4",
+						className: "flex items-start gap-3 rounded-lg border border-border-seam bg-bg-surface p-4 bg-gloss-card shadow-pop",
 						children: [/* @__PURE__ */ h(l, { className: "mt-0.5 h-5 w-5 shrink-0 text-text-secondary" }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("p", {
 							className: "text-sm font-medium text-text-primary",
 							children: "Secure Payments"
@@ -220,6 +220,7 @@ function y() {
 					})
 				]
 			}) : /* @__PURE__ */ h(r, {
+				illustration: "empty-generic",
 				icon: /* @__PURE__ */ h(s, { className: "h-12 w-12" }),
 				title: "No payment methods",
 				description: "Add a payment method to make faster checkouts.",
@@ -238,7 +239,7 @@ function y() {
 				}), /* @__PURE__ */ g("div", {
 					className: "grid grid-cols-1 sm:grid-cols-2 gap-4",
 					children: [/* @__PURE__ */ g("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [
 							/* @__PURE__ */ g("div", {
 								className: "flex items-center gap-3 mb-2",
@@ -255,7 +256,7 @@ function y() {
 								children: "Pay when you receive your order"
 							}),
 							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-2 text-green-600 dark:text-green-400",
+								className: "flex items-center gap-2 text-status-success-text",
 								children: [/* @__PURE__ */ h(o, { className: "h-3.5 w-3.5 shrink-0" }), /* @__PURE__ */ h("span", {
 									className: "text-xs",
 									children: "Available for all orders"
@@ -263,7 +264,7 @@ function y() {
 							})
 						]
 					}), /* @__PURE__ */ g("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface p-5",
+						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
 						children: [
 							/* @__PURE__ */ g("div", {
 								className: "flex items-center gap-3 mb-2",
@@ -280,7 +281,7 @@ function y() {
 								children: "Pay directly to the vendor"
 							}),
 							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-2 text-green-600 dark:text-green-400",
+								className: "flex items-center gap-2 text-status-success-text",
 								children: [/* @__PURE__ */ h(o, { className: "h-3.5 w-3.5 shrink-0" }), /* @__PURE__ */ h("span", {
 									className: "text-xs",
 									children: "Supports all payment methods"