@burdenoff/microfe-store 2026.805.1 → 2026.819.2

package/dist/pages/OrdersPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrdersPage.js","names":[],"sources":["../../src/pages/OrdersPage.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useMemo, useState, useCallback } from 'react';\nimport { useNavigate } from 'react-router';\nimport {\n  Package,\n  ArrowLeft,\n  ShoppingBag,\n  Download,\n  CheckCircle,\n  Clock,\n  XCircle,\n  RefreshCw,\n  Loader2,\n  ChevronRight,\n} from 'lucide-react';\nimport { useStore } from '../providers/StoreProvider';\nimport { useInstallations } from '../hooks/useInstallations';\nimport { useOrders } from '../hooks/useOrders';\nimport { formatPrice } from '../utils';\nimport { InstallAppModal, type AppInfo } from '../components/InstallAppModal';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { useOrderStatusUpdatedSubscription } from '../generated/global-operations';\n\n// Local types for UI\ninterface OrderItem {\n  id: string;\n  productId: string;\n  productName: string;\n  productIcon?: string;\n  productType: string;\n  version?: string;\n  quantity: number;\n  unitPrice: number;\n  totalPrice: number;\n  installed?: boolean;\n}\n\ninterface UIOrder {\n  id: string;\n  orderNumber: string;\n  items: OrderItem[];\n  subtotal: number;\n  tax: number;\n  total: number;\n  status:\n    | 'PENDING'\n    | 'PROCESSING'\n    | 'COMPLETED'\n    | 'FAILED'\n    | 'CANCELLED'\n    | 'FULFILLED'\n    | 'PROCESSED'\n    | 'REFUNDED';\n  createdAt: string;\n  fulfillment?: {\n    status?: string | null;\n    trackingNumber?: string | null;\n    trackingUrl?: string | null;\n    carrier?: string | null;\n    estimatedDeliveryDate?: string | null;\n  } | null;\n}\n\ntype OrdersTab = 'completed' | 'pending';\n\nconst SUCCESSFUL_ORDER_STATUSES: UIOrder['status'][] = ['COMPLETED', 'FULFILLED', 'PROCESSED'];\n\n/**\n * Get status badge config\n */\nconst getStatusDisplay = (status: UIOrder['status']) => {\n  switch (status) {\n    case 'COMPLETED':\n    case 'FULFILLED':\n    case 'PROCESSED':\n      return {\n        icon: CheckCircle,\n        classes:\n          'bg-status-success-bg-subtle/15 text-status-success-text border-status-success-text/20',\n        label: 'Completed',\n      };\n    case 'PROCESSING':\n      return {\n        icon: Clock,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Processing',\n      };\n    case 'PENDING':\n      return {\n        icon: Clock,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Pending',\n      };\n    case 'FAILED':\n      return {\n        icon: XCircle,\n        classes: 'bg-status-error-bg-subtle/15 text-status-error-text border-status-error-text/20',\n        label: 'Failed',\n      };\n    case 'REFUNDED':\n      return {\n        icon: RefreshCw,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Refunded',\n      };\n    case 'CANCELLED':\n      return {\n        icon: RefreshCw,\n        classes: 'bg-bg-sunken text-text-muted border-border-default',\n        label: 'Cancelled',\n      };\n    default:\n      return {\n        icon: Clock,\n        classes: 'bg-bg-sunken text-text-muted border-border-default',\n        label: status,\n      };\n  }\n};\n\n/**\n * Status badge component\n */\nconst StatusBadge: FC<{ status: UIOrder['status'] }> = ({ status }) => {\n  const display = getStatusDisplay(status);\n  const Icon = display.icon;\n  return (\n    <span\n      className={`inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs font-semibold ${display.classes}`}\n    >\n      <Icon className=\"size-3.5\" />\n      {display.label}\n    </span>\n  );\n};\n\n/**\n * OrdersPage component\n *\n * Displays a table of all orders with expandable rows showing line items\n * and Install App buttons for digital products.\n */\nexport const OrdersPage: FC = () => {\n  const navigate = useNavigate();\n  const { basePath } = useStore();\n  const { t } = useI18n();\n  const { orders: backendOrders, loading, error, refetchOrders, hasMore, loadMore } = useOrders();\n  const { installations, refetch: refetchInstallations } = useInstallations();\n\n  useOrderStatusUpdatedSubscription({\n    onData: () => {\n      void refetchOrders();\n    },\n    onError: (err) => {\n      console.warn('OrderStatusUpdated subscription error:', err.message);\n    },\n  });\n\n  // Expanded rows tracking\n  const [expandedOrders, setExpandedOrders] = useState<Set<string>>(new Set());\n  const [activeTab, setActiveTab] = useState<OrdersTab>('completed');\n\n  // Modal state\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const [selectedOrderId, setSelectedOrderId] = useState<string | null>(null);\n  const [selectedApp, setSelectedApp] = useState<AppInfo | null>(null);\n  const [selectedItemId, setSelectedItemId] = useState<string | null>(null);\n\n  const installedProductIds = useMemo(\n    () =>\n      new Set(\n        installations.flatMap((installation) =>\n          installation.status === 'ACTIVE' ? [installation.productId] : []\n        )\n      ),\n    [installations]\n  );\n\n  // Map backend orders to UI format\n  const orders: UIOrder[] = backendOrders.map((order) => {\n    const lineItems = order.lineItems || [];\n    const subtotal = lineItems.reduce((sum, item) => sum + item.subtotal, 0);\n    const tax = order.total - subtotal;\n\n    const items: OrderItem[] = lineItems.map((item, index) => ({\n      id: `${order.id}-${index}`,\n      productId: item.productId,\n      productName: item.name,\n      productIcon: item.productIcon,\n      productType:\n        item.productType ||\n        (typeof item.itemType === 'string' ? item.itemType.toUpperCase() : 'APP'),\n      version: item.version,\n      quantity: item.quantity,\n      unitPrice: item.unitPrice,\n      totalPrice: item.subtotal,\n      installed: installedProductIds.has(item.productId),\n    }));\n\n    return {\n      id: order.id,\n      orderNumber: `#${order.id.slice(-8).toUpperCase()}`,\n      items,\n      subtotal,\n      tax,\n      total: order.total,\n      status: order.status as UIOrder['status'],\n      createdAt: order.createdAt,\n      fulfillment: order.fulfillment ?? null,\n    };\n  });\n\n  const completedOrders = useMemo(\n    () => orders.filter((order) => SUCCESSFUL_ORDER_STATUSES.includes(order.status)),\n    [orders]\n  );\n\n  const pendingOrders = useMemo(\n    () => orders.filter((order) => !SUCCESSFUL_ORDER_STATUSES.includes(order.status)),\n    [orders]\n  );\n\n  const visibleOrders = activeTab === 'completed' ? completedOrders : pendingOrders;\n\n  const toggleExpand = useCallback((orderId: string) => {\n    setExpandedOrders((prev) => {\n      const next = new Set(prev);\n      if (next.has(orderId)) {\n        next.delete(orderId);\n      } else {\n        next.add(orderId);\n      }\n      return next;\n    });\n  }, []);\n\n  const handleOpenInstallModal = (orderId: string, item: OrderItem) => {\n    setSelectedOrderId(orderId);\n    setSelectedItemId(item.id);\n    setSelectedApp({\n      id: item.productId,\n      name: item.productName,\n      icon: item.productIcon,\n      type: item.productType,\n      version: item.version,\n    });\n    setIsModalOpen(true);\n  };\n\n  const handleCloseModal = () => {\n    setIsModalOpen(false);\n    setSelectedOrderId(null);\n    setSelectedApp(null);\n    setSelectedItemId(null);\n  };\n\n  const handleInstallSuccess = (_workspaceId: string, _workspaceName: string) => {\n    handleCloseModal();\n    void refetchInstallations();\n  };\n\n  const handleInstallError = (_error: Error) => {\n    // Error is displayed in modal\n  };\n\n  const handleBrowseMarketplace = () => {\n    navigate(`${basePath}/marketplace`);\n  };\n\n  // ──── Shared table cell classes ────\n  const cellCls = 'px-4 py-3 text-sm';\n  const headerCls =\n    'px-4 py-3 text-left text-xs font-semibold uppercase tracking-wider text-text-muted';\n\n  return (\n    <div className=\"flex h-full flex-col\">\n      {/* Header */}\n      <header className=\"flex-shrink-0 border-b border-border-seam bg-bg-surface px-6 py-4\">\n        <div className=\"mx-auto max-w-6xl\">\n          <div className=\"flex items-center justify-between\">\n            <div className=\"flex items-center gap-4\">\n              <button\n                type=\"button\"\n                onClick={() => navigate(-1)}\n                aria-label=\"Go back\"\n                className=\"cursor-pointer rounded-lg p-2 text-text-muted transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n              >\n                <ArrowLeft className=\"size-5\" />\n              </button>\n              <div className=\"flex items-center gap-3\">\n                <Package className=\"size-6 text-text-primary\" />\n                <h1 className=\"text-xl font-bold text-text-primary\">\n                  {t('pages.orders.title', { defaultValue: 'My Orders' })}\n                </h1>\n                {orders.length > 0 && (\n                  <span className=\"rounded-full bg-action-primary-bg/10 px-2.5 py-0.5 text-sm font-medium text-action-primary-bg\">\n                    {orders.length}\n                  </span>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </header>\n\n      {/* Scrollable content area */}\n      <div className=\"flex-1 overflow-y-auto\">\n        <div className=\"mx-auto max-w-6xl p-6\">\n          <PagePurpose className=\"mb-6\">\n            A record of everything you've purchased from the marketplace. Track each order's status,\n            review what you paid, and — once an order is complete — install the apps you bought into\n            a workspace right from here. Come back to re-install on a new workspace or check a past\n            receipt.\n          </PagePurpose>\n\n          {loading && orders.length === 0 ? (\n            // ── Loading state ──\n            <div className=\"flex flex-col items-center justify-center py-24\">\n              <Loader2 className=\"size-12 animate-spin text-text-muted mb-4\" aria-hidden=\"true\" />\n              <p className=\"text-text-muted\">Loading your orders…</p>\n            </div>\n          ) : error ? (\n            // ── Error state ──\n            <div className=\"flex flex-col items-center justify-center py-24 text-center\">\n              <div className=\"mb-6 rounded-full bg-status-error-bg-subtle/10 p-6\">\n                <XCircle className=\"size-16 text-status-error-text\" />\n              </div>\n              <h2 className=\"mb-2 text-2xl font-bold text-text-primary\">\n                {t('pages.orders.failedToLoad', { defaultValue: 'Failed to load orders' })}\n              </h2>\n              <p className=\"mb-6 max-w-md text-text-muted\">\n                {error.message || 'An error occurred while loading your orders. Please try again.'}\n              </p>\n              <button\n                type=\"button\"\n                onClick={handleBrowseMarketplace}\n                className=\"cursor-pointer flex items-center gap-2 rounded-lg bg-action-primary-bg px-6 py-3 font-semibold text-action-primary-text transition-opacity hover:opacity-90\"\n              >\n                <ShoppingBag className=\"size-5\" />\n                Browse Marketplace\n              </button>\n            </div>\n          ) : orders.length === 0 ? (\n            // ── Empty state ──\n            <IllustratedEmptyState\n              illustration=\"empty-data\"\n              title={t('pages.orders.emptyTitle', { defaultValue: 'No orders yet' })}\n              description=\"You have not placed any orders yet. Browse the marketplace to discover apps and products!\"\n              action={\n                <button\n                  type=\"button\"\n                  onClick={handleBrowseMarketplace}\n                  className=\"cursor-pointer flex items-center gap-2 rounded-lg bg-action-primary-bg px-6 py-3 font-semibold text-action-primary-text transition-opacity hover:opacity-90\"\n                >\n                  <ShoppingBag className=\"size-5\" />\n                  Browse Marketplace\n                </button>\n              }\n            />\n          ) : (\n            // ── Table ──\n            <div className=\"space-y-4\">\n              <div className=\"inline-flex rounded-xl border border-border-seam bg-bg-surface p-1\">\n                <button\n                  type=\"button\"\n                  onClick={() => setActiveTab('completed')}\n                  className={`rounded-lg px-4 py-2 text-sm font-medium transition-colors ${\n                    activeTab === 'completed'\n                      ? 'bg-action-primary-bg text-action-primary-text'\n                      : 'text-text-muted hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  Completed\n                  <span className=\"ml-2 rounded-full bg-black/10 px-2 py-0.5 text-xs\">\n                    {completedOrders.length}\n                  </span>\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setActiveTab('pending')}\n                  className={`rounded-lg px-4 py-2 text-sm font-medium transition-colors ${\n                    activeTab === 'pending'\n                      ? 'bg-action-primary-bg text-action-primary-text'\n                      : 'text-text-muted hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  Pending\n                  <span className=\"ml-2 rounded-full bg-black/10 px-2 py-0.5 text-xs\">\n                    {pendingOrders.length}\n                  </span>\n                </button>\n              </div>\n\n              {visibleOrders.length === 0 ? (\n                <GlassCard className=\"p-10 text-center\">\n                  <div className=\"mx-auto mb-4 flex size-14 items-center justify-center rounded-full bg-bg-sunken text-text-muted\">\n                    <Package className=\"size-6\" />\n                  </div>\n                  <h2 className=\"mb-2 text-lg font-semibold text-text-primary\">\n                    {activeTab === 'completed' ? 'No completed orders yet' : 'No pending orders'}\n                  </h2>\n                  <p className=\"text-sm text-text-muted\">\n                    {activeTab === 'completed'\n                      ? 'Completed purchases will appear here once payment is successful.'\n                      : 'Orders that are pending, processing, failed, refunded, or cancelled will appear here.'}\n                  </p>\n                </GlassCard>\n              ) : (\n                <div className=\"overflow-hidden rounded-xl border border-border-seam bg-bg-surface\">\n                  {/* Table Header */}\n                  <div className=\"hidden border-b border-border-seam bg-bg-sunken/50 md:grid md:grid-cols-[40px_1fr_180px_140px_120px_160px]\">\n                    <div className={headerCls} />\n                    <div className={headerCls}>Order</div>\n                    <div className={headerCls}>Date</div>\n                    <div className={headerCls}>Items</div>\n                    <div className={`${headerCls} text-right`}>Total</div>\n                    <div className={`${headerCls} text-center`}>Status</div>\n                  </div>\n\n                  {/* Table Body */}\n                  {visibleOrders.map((order) => {\n                    const isExpanded = expandedOrders.has(order.id);\n                    const isSuccessful =\n                      order.status === 'COMPLETED' ||\n                      order.status === 'FULFILLED' ||\n                      order.status === 'PROCESSED';\n\n                    return (\n                      <div key={order.id} className=\"border-b border-border-seam last:border-b-0\">\n                        {/* Order Row */}\n                        <button\n                          type=\"button\"\n                          onClick={() => toggleExpand(order.id)}\n                          className=\"grid w-full cursor-pointer grid-cols-[40px_1fr_180px_140px_120px_160px] items-center transition-colors hover:bg-bg-sunken/50 md:grid\"\n                        >\n                          {/* Expand/collapse chevron */}\n                          <div className={`${cellCls} flex justify-center`}>\n                            <ChevronRight\n                              className={`size-4 text-text-muted transition-transform duration-200 ${\n                                isExpanded ? 'rotate-90' : ''\n                              }`}\n                            />\n                          </div>\n\n                          {/* Order number */}\n                          <div className={`${cellCls} font-medium text-text-primary`}>\n                            {order.orderNumber}\n                          </div>\n\n                          {/* Date */}\n                          <div className={`${cellCls} text-text-muted`}>\n                            {new Date(order.createdAt).toLocaleDateString('en-US', {\n                              year: 'numeric',\n                              month: 'short',\n                              day: 'numeric',\n                            })}\n                          </div>\n\n                          {/* Items summary */}\n                          <div className={`${cellCls} text-text-muted`}>\n                            {order.items.length} {order.items.length === 1 ? 'item' : 'items'}\n                            <span className=\"block text-xs text-text-muted/70\">\n                              {order.items.map((i) => i.productName).join(', ')}\n                            </span>\n                          </div>\n\n                          {/* Total */}\n                          <div\n                            className={`${cellCls} text-right font-semibold tabular-nums text-text-primary`}\n                          >\n                            {formatPrice(order.total)}\n                          </div>\n\n                          {/* Status */}\n                          <div className={`${cellCls} flex justify-center`}>\n                            <StatusBadge status={order.status} />\n                          </div>\n                        </button>\n\n                        {/* Expanded: Line items */}\n                        {isExpanded && (\n                          <div className=\"border-t border-border-seam bg-bg-sunken/30\">\n                            {order.fulfillment && (\n                              <div className=\"mx-4 mt-4 rounded-xl border border-border-seam bg-bg-surface px-4 py-4 md:mx-12\">\n                                <div className=\"flex flex-col gap-3 md:flex-row md:items-center md:justify-between\">\n                                  <div>\n                                    <div className=\"text-sm font-semibold text-text-primary\">\n                                      Order tracking\n                                    </div>\n                                    <div className=\"mt-1 text-xs text-text-muted\">\n                                      {order.fulfillment.status || 'PENDING'}\n                                      {order.fulfillment.carrier\n                                        ? ` · ${order.fulfillment.carrier}`\n                                        : ''}\n                                      {order.fulfillment.estimatedDeliveryDate\n                                        ? ` · Est. delivery ${new Date(order.fulfillment.estimatedDeliveryDate).toLocaleDateString()}`\n                                        : ''}\n                                    </div>\n                                  </div>\n\n                                  <div className=\"flex flex-col items-start gap-2 md:items-end\">\n                                    {order.fulfillment.trackingNumber && (\n                                      <div className=\"text-xs text-text-muted\">\n                                        Tracking #:{' '}\n                                        <span className=\"font-medium text-text-primary\">\n                                          {order.fulfillment.trackingNumber}\n                                        </span>\n                                      </div>\n                                    )}\n                                    {order.fulfillment.trackingUrl && (\n                                      <a\n                                        href={order.fulfillment.trackingUrl}\n                                        target=\"_blank\"\n                                        rel=\"noreferrer\"\n                                        className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-bg-sunken\"\n                                      >\n                                        Track package\n                                        <ChevronRight className=\"size-3.5\" />\n                                      </a>\n                                    )}\n                                  </div>\n                                </div>\n\n                                <div className=\"mt-4 grid gap-2 sm:grid-cols-4\">\n                                  {[\n                                    { key: 'PROCESSING', label: 'Processing' },\n                                    { key: 'SHIPPED', label: 'Shipped' },\n                                    { key: 'OUT_FOR_DELIVERY', label: 'Out for delivery' },\n                                    { key: 'DELIVERED', label: 'Delivered' },\n                                  ].map((step) => {\n                                    const current = order.fulfillment?.status || 'PENDING';\n                                    const reached =\n                                      [\n                                        'PROCESSING',\n                                        'READY_TO_SHIP',\n                                        'SHIPPED',\n                                        'IN_TRANSIT',\n                                        'OUT_FOR_DELIVERY',\n                                        'DELIVERED',\n                                      ].indexOf(current) >=\n                                      [\n                                        'PROCESSING',\n                                        'SHIPPED',\n                                        'OUT_FOR_DELIVERY',\n                                        'DELIVERED',\n                                      ].indexOf(step.key);\n                                    return (\n                                      <div\n                                        key={step.key}\n                                        className={`rounded-lg border px-3 py-2 text-xs font-medium ${\n                                          reached\n                                            ? 'border-status-success-border bg-status-success-bg-subtle text-status-success-text'\n                                            : 'border-border-seam bg-bg-sunken/40 text-text-muted'\n                                        }`}\n                                      >\n                                        {step.label}\n                                      </div>\n                                    );\n                                  })}\n                                </div>\n                              </div>\n                            )}\n\n                            {/* Column headers for items */}\n                            <div className=\"hidden grid-cols-[1fr_100px_120px_160px] gap-4 px-12 py-2 md:grid\">\n                              <span className=\"text-xs font-medium text-text-muted\">Product</span>\n                              <span className=\"text-xs font-medium text-text-muted text-right\">\n                                Qty\n                              </span>\n                              <span className=\"text-xs font-medium text-text-muted text-right\">\n                                Price\n                              </span>\n                              <span className=\"text-xs font-medium text-text-muted text-center\">\n                                Action\n                              </span>\n                            </div>\n\n                            {order.items.map((item) => {\n                              const isInstallable =\n                                item.productType !== 'PHYSICAL' &&\n                                item.productType !== 'MERCHANDISE';\n\n                              return (\n                                <div\n                                  key={item.id}\n                                  className=\"grid grid-cols-[auto_1fr_auto] items-center gap-3 px-4 py-3 md:px-12 md:grid-cols-[1fr_100px_120px_160px]\"\n                                >\n                                  {/* Product info */}\n                                  <div className=\"flex items-center gap-3 min-w-0\">\n                                    <div className=\"size-10 flex-shrink-0 overflow-hidden rounded-lg bg-bg-sunken\">\n                                      {item.productIcon ? (\n                                        <img\n                                          src={item.productIcon}\n                                          alt={item.productName}\n                                          className=\"size-full object-cover\"\n                                        />\n                                      ) : (\n                                        <div className=\"flex size-full items-center justify-center text-sm font-bold text-text-muted\">\n                                          {item.productName.charAt(0)}\n                                        </div>\n                                      )}\n                                    </div>\n                                    <div className=\"min-w-0\">\n                                      <p className=\"truncate text-sm font-medium text-text-primary\">\n                                        {item.productName}\n                                      </p>\n                                      <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-muted\">\n                                        {item.productType}\n                                      </span>\n                                    </div>\n                                  </div>\n\n                                  {/* Quantity */}\n                                  <div className=\"hidden text-right text-sm text-text-muted md:block\">\n                                    {item.quantity}\n                                  </div>\n\n                                  {/* Price */}\n                                  <div className=\"hidden text-right text-sm font-semibold tabular-nums text-text-primary md:block\">\n                                    {formatPrice(item.totalPrice)}\n                                  </div>\n\n                                  {/* Mobile price + qty */}\n                                  <div className=\"text-right text-sm text-text-muted md:hidden\">\n                                    <span className=\"tabular-nums\">{item.quantity} &times; </span>\n                                    <span className=\"font-semibold text-text-primary tabular-nums\">\n                                      {formatPrice(item.unitPrice)}\n                                    </span>\n                                  </div>\n\n                                  {/* Install button */}\n                                  <div className=\"flex justify-end md:justify-center\">\n                                    {item.installed ? (\n                                      <span className=\"inline-flex items-center gap-1 rounded-lg px-3 py-1.5 text-xs font-medium text-status-success-text\">\n                                        <CheckCircle className=\"size-3.5\" />\n                                        Installed\n                                      </span>\n                                    ) : isSuccessful && isInstallable ? (\n                                      <button\n                                        type=\"button\"\n                                        onClick={(e) => {\n                                          e.stopPropagation();\n                                          handleOpenInstallModal(order.id, item);\n                                        }}\n                                        className=\"inline-flex cursor-pointer items-center gap-1.5 rounded-lg bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text transition-all hover:opacity-90 active:scale-95\"\n                                      >\n                                        <Download className=\"size-3.5\" />\n                                        Install App\n                                      </button>\n                                    ) : null}\n                                  </div>\n                                </div>\n                              );\n                            })}\n\n                            {/* Order summary footer */}\n                            <div className=\"border-t border-border-seam/50 px-4 py-2 md:px-12\">\n                              <div className=\"flex justify-end gap-6 text-xs text-text-muted\">\n                                <span>\n                                  Subtotal:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.subtotal)}\n                                  </span>\n                                </span>\n                                <span>\n                                  Tax:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.tax)}\n                                  </span>\n                                </span>\n                                <span className=\"font-semibold\">\n                                  Total:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.total)}\n                                  </span>\n                                </span>\n                              </div>\n                            </div>\n                          </div>\n                        )}\n                      </div>\n                    );\n                  })}\n\n                  {/* Load More */}\n                  {hasMore && (\n                    <div className=\"flex justify-center px-4 py-5\">\n                      <button\n                        type=\"button\"\n                        onClick={loadMore}\n                        disabled={loading}\n                        className=\"flex items-center gap-2 rounded-lg border border-border-default px-6 py-2.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-subtle disabled:opacity-50\"\n                        aria-label={t('common.loadMore', { defaultValue: 'Load more' })}\n                      >\n                        {loading ? (\n                          <Loader2 className=\"size-4 animate-spin\" aria-hidden=\"true\" />\n                        ) : null}\n                        {t('common.loadMore', { defaultValue: 'Load more' })}\n                      </button>\n                    </div>\n                  )}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Install App Modal */}\n      {selectedApp && (\n        <InstallAppModal\n          isOpen={isModalOpen}\n          onClose={handleCloseModal}\n          app={selectedApp}\n          orderId={selectedOrderId}\n          onInstallSuccess={handleInstallSuccess}\n          onInstallError={handleInstallError}\n        />\n      )}\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"OrdersPage.js","names":[],"sources":["../../src/pages/OrdersPage.tsx"],"sourcesContent":["import type { FC } from 'react';\nimport { useMemo, useState, useCallback } from 'react';\nimport { useNavigate } from 'react-router';\nimport {\n  Package,\n  ArrowLeft,\n  ShoppingBag,\n  Download,\n  CheckCircle,\n  Clock,\n  XCircle,\n  RefreshCw,\n  Loader2,\n  ChevronRight,\n} from 'lucide-react';\nimport { useStore } from '../providers/StoreProvider';\nimport { useInstallations } from '../hooks/useInstallations';\nimport { useOrders } from '../hooks/useOrders';\nimport { formatPrice } from '../utils';\nimport { InstallAppModal, type AppInfo } from '../components/InstallAppModal';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { useOrderStatusUpdatedSubscription } from '../generated/global-operations';\n\n// Local types for UI\ninterface OrderItem {\n  id: string;\n  productId: string;\n  productName: string;\n  productIcon?: string;\n  productType: string;\n  version?: string;\n  quantity: number;\n  unitPrice: number;\n  totalPrice: number;\n  installed?: boolean;\n}\n\ninterface UIOrder {\n  id: string;\n  orderNumber: string;\n  items: OrderItem[];\n  subtotal: number;\n  tax: number;\n  total: number;\n  status:\n    | 'PENDING'\n    | 'PROCESSING'\n    | 'COMPLETED'\n    | 'FAILED'\n    | 'CANCELLED'\n    | 'FULFILLED'\n    | 'PROCESSED'\n    | 'REFUNDED';\n  createdAt: string;\n  fulfillment?: {\n    status?: string | null;\n    trackingNumber?: string | null;\n    trackingUrl?: string | null;\n    carrier?: string | null;\n    estimatedDeliveryDate?: string | null;\n  } | null;\n}\n\ntype OrdersTab = 'completed' | 'pending';\n\nconst SUCCESSFUL_ORDER_STATUSES: UIOrder['status'][] = ['COMPLETED', 'FULFILLED', 'PROCESSED'];\n\n/**\n * Get status badge config\n */\nconst getStatusDisplay = (status: UIOrder['status']) => {\n  switch (status) {\n    case 'COMPLETED':\n    case 'FULFILLED':\n    case 'PROCESSED':\n      return {\n        icon: CheckCircle,\n        classes:\n          'bg-status-success-bg-subtle/15 text-status-success-text border-status-success-text/20',\n        label: 'Completed',\n      };\n    case 'PROCESSING':\n      return {\n        icon: Clock,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Processing',\n      };\n    case 'PENDING':\n      return {\n        icon: Clock,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Pending',\n      };\n    case 'FAILED':\n      return {\n        icon: XCircle,\n        classes: 'bg-status-error-bg-subtle/15 text-status-error-text border-status-error-text/20',\n        label: 'Failed',\n      };\n    case 'REFUNDED':\n      return {\n        icon: RefreshCw,\n        classes:\n          'bg-status-warning-bg-subtle/15 text-status-warning-text border-status-warning-text/20',\n        label: 'Refunded',\n      };\n    case 'CANCELLED':\n      return {\n        icon: RefreshCw,\n        classes: 'bg-bg-sunken text-text-muted border-border-default',\n        label: 'Cancelled',\n      };\n    default:\n      return {\n        icon: Clock,\n        classes: 'bg-bg-sunken text-text-muted border-border-default',\n        label: status,\n      };\n  }\n};\n\n/**\n * Status badge component\n */\nconst StatusBadge: FC<{ status: UIOrder['status'] }> = ({ status }) => {\n  const display = getStatusDisplay(status);\n  const Icon = display.icon;\n  return (\n    <span\n      className={`inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs font-semibold ${display.classes}`}\n    >\n      <Icon className=\"size-3.5\" />\n      {display.label}\n    </span>\n  );\n};\n\n/**\n * OrdersPage component\n *\n * Displays a table of all orders with expandable rows showing line items\n * and Install App buttons for digital products.\n */\nexport const OrdersPage: FC = () => {\n  const navigate = useNavigate();\n  const { basePath } = useStore();\n  const { t } = useI18n();\n  const { orders: backendOrders, loading, error, refetchOrders, hasMore, loadMore } = useOrders();\n  const { installations, refetch: refetchInstallations } = useInstallations();\n\n  useOrderStatusUpdatedSubscription({\n    onData: () => {\n      void refetchOrders();\n    },\n    onError: (err) => {\n      console.warn('OrderStatusUpdated subscription error:', err.message);\n    },\n  });\n\n  // Expanded rows tracking\n  const [expandedOrders, setExpandedOrders] = useState<Set<string>>(new Set());\n  const [activeTab, setActiveTab] = useState<OrdersTab>('completed');\n\n  // Modal state\n  const [isModalOpen, setIsModalOpen] = useState(false);\n  const [selectedOrderId, setSelectedOrderId] = useState<string | null>(null);\n  const [selectedApp, setSelectedApp] = useState<AppInfo | null>(null);\n  const [selectedItemId, setSelectedItemId] = useState<string | null>(null);\n\n  const installedProductIds = useMemo(\n    () =>\n      new Set(\n        installations.flatMap((installation) =>\n          installation.status === 'ACTIVE' ? [installation.productId] : []\n        )\n      ),\n    [installations]\n  );\n\n  // Map backend orders to UI format\n  const orders: UIOrder[] = backendOrders.map((order) => {\n    const lineItems = order.lineItems || [];\n    const subtotal = lineItems.reduce((sum, item) => sum + item.subtotal, 0);\n    const tax = order.total - subtotal;\n\n    const items: OrderItem[] = lineItems.map((item, index) => ({\n      id: `${order.id}-${index}`,\n      productId: item.productId,\n      productName: item.name,\n      productIcon: item.productIcon,\n      productType:\n        item.productType ||\n        (typeof item.itemType === 'string' ? item.itemType.toUpperCase() : 'APP'),\n      version: item.version,\n      quantity: item.quantity,\n      unitPrice: item.unitPrice,\n      totalPrice: item.subtotal,\n      installed: installedProductIds.has(item.productId),\n    }));\n\n    return {\n      id: order.id,\n      orderNumber: `#${order.id.slice(-8).toUpperCase()}`,\n      items,\n      subtotal,\n      tax,\n      total: order.total,\n      status: order.status as UIOrder['status'],\n      createdAt: order.createdAt,\n      fulfillment: order.fulfillment ?? null,\n    };\n  });\n\n  const completedOrders = useMemo(\n    () => orders.filter((order) => SUCCESSFUL_ORDER_STATUSES.includes(order.status)),\n    [orders]\n  );\n\n  const pendingOrders = useMemo(\n    () => orders.filter((order) => !SUCCESSFUL_ORDER_STATUSES.includes(order.status)),\n    [orders]\n  );\n\n  const visibleOrders = activeTab === 'completed' ? completedOrders : pendingOrders;\n\n  const toggleExpand = useCallback((orderId: string) => {\n    setExpandedOrders((prev) => {\n      const next = new Set(prev);\n      if (next.has(orderId)) {\n        next.delete(orderId);\n      } else {\n        next.add(orderId);\n      }\n      return next;\n    });\n  }, []);\n\n  const handleOpenInstallModal = (orderId: string, item: OrderItem) => {\n    setSelectedOrderId(orderId);\n    setSelectedItemId(item.id);\n    setSelectedApp({\n      id: item.productId,\n      name: item.productName,\n      icon: item.productIcon,\n      type: item.productType,\n      version: item.version,\n    });\n    setIsModalOpen(true);\n  };\n\n  const handleCloseModal = () => {\n    setIsModalOpen(false);\n    setSelectedOrderId(null);\n    setSelectedApp(null);\n    setSelectedItemId(null);\n  };\n\n  const handleInstallSuccess = (_workspaceId: string, _workspaceName: string) => {\n    handleCloseModal();\n    void refetchInstallations();\n  };\n\n  const handleInstallError = (_error: Error) => {\n    // Error is displayed in modal\n  };\n\n  const handleBrowseMarketplace = () => {\n    navigate(`${basePath}/marketplace`);\n  };\n\n  // ──── Shared table cell classes ────\n  const cellCls = 'px-4 py-3 text-sm';\n  const headerCls =\n    'px-4 py-3 text-left text-xs font-semibold uppercase tracking-wider text-text-muted';\n\n  return (\n    <div className=\"flex h-full flex-col\">\n      {/* Header */}\n      <header className=\"flex-shrink-0 border-b border-border-seam bg-bg-surface px-6 py-4\">\n        <div className=\"mx-auto max-w-6xl\">\n          <div className=\"flex items-center justify-between\">\n            <div className=\"flex items-center gap-4\">\n              <button\n                type=\"button\"\n                onClick={() => navigate(-1)}\n                aria-label=\"Go back\"\n                className=\"cursor-pointer rounded-lg p-2 text-text-muted transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n              >\n                <ArrowLeft className=\"size-5\" />\n              </button>\n              <div className=\"flex items-center gap-3\">\n                <Package className=\"size-6 text-text-primary\" />\n                <h1 className=\"text-xl font-bold text-text-primary\">\n                  {t('pages.orders.title', { defaultValue: 'My Orders' })}\n                </h1>\n                {orders.length > 0 && (\n                  <span className=\"rounded-full bg-action-primary-bg/10 px-2.5 py-0.5 text-sm font-medium text-action-primary-bg\">\n                    {orders.length}\n                  </span>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </header>\n\n      {/* Scrollable content area */}\n      <div className=\"flex-1 overflow-y-auto\">\n        <div className=\"mx-auto max-w-6xl p-6\">\n          <PagePurpose className=\"mb-6\">\n            A record of everything you've purchased from the marketplace. Track each order's status,\n            review what you paid, and — once an order is complete — install the apps you bought into\n            a workspace right from here. Come back to re-install on a new workspace or check a past\n            receipt.\n          </PagePurpose>\n\n          {loading && orders.length === 0 ? (\n            // ── Loading state ──\n            <div className=\"flex flex-col items-center justify-center py-24\">\n              <Loader2 className=\"size-12 animate-spin text-text-muted mb-4\" aria-hidden=\"true\" />\n              <p className=\"text-text-muted\">Loading your orders…</p>\n            </div>\n          ) : error ? (\n            // ── Error state ──\n            <div className=\"flex flex-col items-center justify-center py-24 text-center\">\n              <div className=\"mb-6 rounded-full bg-status-error-bg-subtle/10 p-6\">\n                <XCircle className=\"size-16 text-status-error-text\" />\n              </div>\n              <h2 className=\"mb-2 text-2xl font-bold text-text-primary\">\n                {t('pages.orders.failedToLoad', { defaultValue: 'Failed to load orders' })}\n              </h2>\n              <p className=\"mb-6 max-w-md text-text-muted\">\n                {error.message || 'An error occurred while loading your orders. Please try again.'}\n              </p>\n              <button\n                type=\"button\"\n                onClick={handleBrowseMarketplace}\n                className=\"cursor-pointer flex items-center gap-2 rounded-lg bg-action-primary-bg px-6 py-3 font-semibold text-action-primary-text transition-opacity hover:opacity-90\"\n              >\n                <ShoppingBag className=\"size-5\" />\n                Browse Marketplace\n              </button>\n            </div>\n          ) : orders.length === 0 ? (\n            // ── Empty state ──\n            <IllustratedEmptyState\n              illustration=\"empty-data\"\n              title={t('pages.orders.emptyTitle', { defaultValue: 'No orders yet' })}\n              description=\"You have not placed any orders yet. Browse the marketplace to discover apps and products!\"\n              action={\n                <button\n                  type=\"button\"\n                  onClick={handleBrowseMarketplace}\n                  className=\"cursor-pointer flex items-center gap-2 rounded-lg bg-action-primary-bg px-6 py-3 font-semibold text-action-primary-text transition-opacity hover:opacity-90\"\n                >\n                  <ShoppingBag className=\"size-5\" />\n                  Browse Marketplace\n                </button>\n              }\n            />\n          ) : (\n            // ── Table ──\n            <div className=\"space-y-4\">\n              <div className=\"inline-flex rounded-xl border border-border-seam bg-bg-surface p-1\">\n                <button\n                  type=\"button\"\n                  onClick={() => setActiveTab('completed')}\n                  className={`rounded-lg px-4 py-2 text-sm font-medium transition-colors ${\n                    activeTab === 'completed'\n                      ? 'bg-action-primary-bg text-action-primary-text'\n                      : 'text-text-muted hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  Completed\n                  <span className=\"ml-2 rounded-full bg-black/10 px-2 py-0.5 text-xs\">\n                    {completedOrders.length}\n                  </span>\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setActiveTab('pending')}\n                  className={`rounded-lg px-4 py-2 text-sm font-medium transition-colors ${\n                    activeTab === 'pending'\n                      ? 'bg-action-primary-bg text-action-primary-text'\n                      : 'text-text-muted hover:bg-bg-sunken hover:text-text-primary'\n                  }`}\n                >\n                  Pending\n                  <span className=\"ml-2 rounded-full bg-black/10 px-2 py-0.5 text-xs\">\n                    {pendingOrders.length}\n                  </span>\n                </button>\n              </div>\n\n              {visibleOrders.length === 0 ? (\n                <GlassCard className=\"p-10 text-center\">\n                  <div className=\"mx-auto mb-4 flex size-14 items-center justify-center rounded-full bg-bg-sunken text-text-muted\">\n                    <Package className=\"size-6\" />\n                  </div>\n                  <h2 className=\"mb-2 text-lg font-semibold text-text-primary\">\n                    {activeTab === 'completed' ? 'No completed orders yet' : 'No pending orders'}\n                  </h2>\n                  <p className=\"text-sm text-text-muted\">\n                    {activeTab === 'completed'\n                      ? 'Completed purchases will appear here once payment is successful.'\n                      : 'Orders that are pending, processing, failed, refunded, or cancelled will appear here.'}\n                  </p>\n                </GlassCard>\n              ) : (\n                <div className=\"overflow-hidden rounded-xl border border-border-seam bg-bg-surface\">\n                  {/* Table Header */}\n                  <div className=\"hidden border-b border-border-seam bg-bg-sunken/50 md:grid md:grid-cols-[40px_1fr_180px_140px_120px_160px]\">\n                    <div className={headerCls} />\n                    <div className={headerCls}>Order</div>\n                    <div className={headerCls}>Date</div>\n                    <div className={headerCls}>Items</div>\n                    <div className={`${headerCls} text-right`}>Total</div>\n                    <div className={`${headerCls} text-center`}>Status</div>\n                  </div>\n\n                  {/* Table Body */}\n                  {visibleOrders.map((order) => {\n                    const isExpanded = expandedOrders.has(order.id);\n                    const isSuccessful =\n                      order.status === 'COMPLETED' ||\n                      order.status === 'FULFILLED' ||\n                      order.status === 'PROCESSED';\n\n                    return (\n                      <div key={order.id} className=\"border-b border-border-seam last:border-b-0\">\n                        {/* Order Row */}\n                        <button\n                          type=\"button\"\n                          onClick={() => toggleExpand(order.id)}\n                          className=\"grid w-full cursor-pointer grid-cols-[40px_1fr_180px_140px_120px_160px] items-center transition-colors hover:bg-bg-sunken/50 md:grid\"\n                        >\n                          {/* Expand/collapse chevron */}\n                          <div className={`${cellCls} flex justify-center`}>\n                            <ChevronRight\n                              className={`size-4 text-text-muted transition-transform duration-200 ${\n                                isExpanded ? 'rotate-90' : ''\n                              }`}\n                            />\n                          </div>\n\n                          {/* Order number */}\n                          <div className={`${cellCls} font-medium text-text-primary`}>\n                            {order.orderNumber}\n                          </div>\n\n                          {/* Date */}\n                          <div className={`${cellCls} text-text-muted`}>\n                            {new Date(order.createdAt).toLocaleDateString('en-US', {\n                              year: 'numeric',\n                              month: 'short',\n                              day: 'numeric',\n                            })}\n                          </div>\n\n                          {/* Items summary */}\n                          <div className={`${cellCls} text-text-muted`}>\n                            {order.items.length} {order.items.length === 1 ? 'item' : 'items'}\n                            <span className=\"block text-xs text-text-muted/70\">\n                              {order.items.map((i) => i.productName).join(', ')}\n                            </span>\n                          </div>\n\n                          {/* Total */}\n                          <div\n                            className={`${cellCls} text-right font-semibold tabular-nums text-text-primary`}\n                          >\n                            {formatPrice(order.total)}\n                          </div>\n\n                          {/* Status */}\n                          <div className={`${cellCls} flex justify-center`}>\n                            <StatusBadge status={order.status} />\n                          </div>\n                        </button>\n\n                        {/* Expanded: Line items */}\n                        {isExpanded && (\n                          <div className=\"border-t border-border-seam bg-bg-sunken/30\">\n                            {order.fulfillment && (\n                              <div className=\"mx-4 mt-4 rounded-xl border border-border-seam bg-bg-surface px-4 py-4 md:mx-12\">\n                                <div className=\"flex flex-col gap-3 md:flex-row md:items-center md:justify-between\">\n                                  <div>\n                                    <div className=\"text-sm font-semibold text-text-primary\">\n                                      Order tracking\n                                    </div>\n                                    <div className=\"mt-1 text-xs text-text-muted\">\n                                      {order.fulfillment.status || 'PENDING'}\n                                      {order.fulfillment.carrier\n                                        ? ` · ${order.fulfillment.carrier}`\n                                        : ''}\n                                      {order.fulfillment.estimatedDeliveryDate\n                                        ? ` · Est. delivery ${new Date(order.fulfillment.estimatedDeliveryDate).toLocaleDateString()}`\n                                        : ''}\n                                    </div>\n                                  </div>\n\n                                  <div className=\"flex flex-col items-start gap-2 md:items-end\">\n                                    {order.fulfillment.trackingNumber && (\n                                      <div className=\"text-xs text-text-muted\">\n                                        Tracking #:{' '}\n                                        <span className=\"font-medium text-text-primary\">\n                                          {order.fulfillment.trackingNumber}\n                                        </span>\n                                      </div>\n                                    )}\n                                    {order.fulfillment.trackingUrl && (\n                                      <a\n                                        href={order.fulfillment.trackingUrl}\n                                        target=\"_blank\"\n                                        rel=\"noreferrer\"\n                                        className=\"inline-flex items-center gap-1 rounded-md border border-border-default px-3 py-1.5 text-xs font-medium text-text-primary hover:bg-bg-sunken\"\n                                      >\n                                        Track package\n                                        <ChevronRight className=\"size-3.5\" />\n                                      </a>\n                                    )}\n                                  </div>\n                                </div>\n\n                                <div className=\"mt-4 grid gap-2 sm:grid-cols-4\">\n                                  {[\n                                    { key: 'PROCESSING', label: 'Processing' },\n                                    { key: 'SHIPPED', label: 'Shipped' },\n                                    { key: 'OUT_FOR_DELIVERY', label: 'Out for delivery' },\n                                    { key: 'DELIVERED', label: 'Delivered' },\n                                  ].map((step) => {\n                                    const current = order.fulfillment?.status || 'PENDING';\n                                    const reached =\n                                      [\n                                        'PROCESSING',\n                                        'READY_TO_SHIP',\n                                        'SHIPPED',\n                                        'IN_TRANSIT',\n                                        'OUT_FOR_DELIVERY',\n                                        'DELIVERED',\n                                      ].indexOf(current) >=\n                                      [\n                                        'PROCESSING',\n                                        'SHIPPED',\n                                        'OUT_FOR_DELIVERY',\n                                        'DELIVERED',\n                                      ].indexOf(step.key);\n                                    return (\n                                      <div\n                                        key={step.key}\n                                        className={`rounded-lg border px-3 py-2 text-xs font-medium ${\n                                          reached\n                                            ? 'border-status-success-border bg-status-success-bg-subtle text-status-success-text'\n                                            : 'border-border-seam bg-bg-sunken/40 text-text-muted'\n                                        }`}\n                                      >\n                                        {step.label}\n                                      </div>\n                                    );\n                                  })}\n                                </div>\n                              </div>\n                            )}\n\n                            {/* Column headers for items */}\n                            <div className=\"hidden grid-cols-[1fr_100px_120px_160px] gap-4 px-12 py-2 md:grid\">\n                              <span className=\"text-xs font-medium text-text-muted\">Product</span>\n                              <span className=\"text-xs font-medium text-text-muted text-right\">\n                                Qty\n                              </span>\n                              <span className=\"text-xs font-medium text-text-muted text-right\">\n                                Price\n                              </span>\n                              <span className=\"text-xs font-medium text-text-muted text-center\">\n                                Action\n                              </span>\n                            </div>\n\n                            {order.items.map((item) => {\n                              const isInstallable =\n                                item.productType !== 'PHYSICAL' &&\n                                item.productType !== 'MERCHANDISE';\n\n                              return (\n                                <div\n                                  key={item.id}\n                                  className=\"grid grid-cols-[auto_1fr_auto] items-center gap-3 px-4 py-3 md:px-12 md:grid-cols-[1fr_100px_120px_160px]\"\n                                >\n                                  {/* Product info */}\n                                  <div className=\"flex items-center gap-3 min-w-0\">\n                                    <div className=\"size-10 flex-shrink-0 overflow-hidden rounded-lg bg-bg-sunken\">\n                                      {item.productIcon ? (\n                                        <img\n                                          src={item.productIcon}\n                                          alt={item.productName}\n                                          className=\"size-full object-cover\"\n                                        />\n                                      ) : (\n                                        <div className=\"flex size-full items-center justify-center text-sm font-bold text-text-muted\">\n                                          {item.productName.charAt(0)}\n                                        </div>\n                                      )}\n                                    </div>\n                                    <div className=\"min-w-0\">\n                                      <p className=\"truncate text-sm font-medium text-text-primary\">\n                                        {item.productName}\n                                      </p>\n                                      <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-muted\">\n                                        {item.productType}\n                                      </span>\n                                    </div>\n                                  </div>\n\n                                  {/* Quantity */}\n                                  <div className=\"hidden text-right text-sm text-text-muted md:block\">\n                                    {item.quantity}\n                                  </div>\n\n                                  {/* Price */}\n                                  <div className=\"hidden text-right text-sm font-semibold tabular-nums text-text-primary md:block\">\n                                    {formatPrice(item.totalPrice)}\n                                  </div>\n\n                                  {/* Mobile price + qty */}\n                                  <div className=\"text-right text-sm text-text-muted md:hidden\">\n                                    <span className=\"tabular-nums\">{item.quantity} &times; </span>\n                                    <span className=\"font-semibold text-text-primary tabular-nums\">\n                                      {formatPrice(item.unitPrice)}\n                                    </span>\n                                  </div>\n\n                                  {/* Install button */}\n                                  <div className=\"flex justify-end md:justify-center\">\n                                    {item.installed ? (\n                                      <span className=\"inline-flex items-center gap-1 rounded-lg px-3 py-1.5 text-xs font-medium text-status-success-text\">\n                                        <CheckCircle className=\"size-3.5\" />\n                                        Installed\n                                      </span>\n                                    ) : isSuccessful && isInstallable ? (\n                                      <button\n                                        type=\"button\"\n                                        onClick={(e) => {\n                                          e.stopPropagation();\n                                          handleOpenInstallModal(order.id, item);\n                                        }}\n                                        className=\"inline-flex cursor-pointer items-center gap-1.5 rounded-lg bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text transition-all hover:opacity-90 active:scale-95\"\n                                      >\n                                        <Download className=\"size-3.5\" />\n                                        Install App\n                                      </button>\n                                    ) : null}\n                                  </div>\n                                </div>\n                              );\n                            })}\n\n                            {/* Order summary footer */}\n                            <div className=\"border-t border-border-seam/50 px-4 py-2 md:px-12\">\n                              <div className=\"flex justify-end gap-6 text-xs text-text-muted\">\n                                <span>\n                                  Subtotal:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.subtotal)}\n                                  </span>\n                                </span>\n                                <span>\n                                  Tax:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.tax)}\n                                  </span>\n                                </span>\n                                <span className=\"font-semibold\">\n                                  Total:{' '}\n                                  <span className=\"tabular-nums text-text-primary\">\n                                    {formatPrice(order.total)}\n                                  </span>\n                                </span>\n                              </div>\n                            </div>\n                          </div>\n                        )}\n                      </div>\n                    );\n                  })}\n\n                  {/* Load More */}\n                  {hasMore && (\n                    <div className=\"flex justify-center px-4 py-5\">\n                      <button\n                        type=\"button\"\n                        onClick={loadMore}\n                        disabled={loading}\n                        className=\"flex items-center gap-2 rounded-lg border border-border-default px-6 py-2.5 text-sm font-medium text-text-primary transition-colors hover:bg-bg-subtle disabled:opacity-50\"\n                        aria-label={t('common.loadMore', { defaultValue: 'Load more' })}\n                      >\n                        {loading ? (\n                          <Loader2 className=\"size-4 animate-spin\" aria-hidden=\"true\" />\n                        ) : null}\n                        {t('common.loadMore', { defaultValue: 'Load more' })}\n                      </button>\n                    </div>\n                  )}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n\n      {/* Install App Modal */}\n      {selectedApp && (\n        <InstallAppModal\n          isOpen={isModalOpen}\n          onClose={handleCloseModal}\n          app={selectedApp}\n          orderId={selectedOrderId}\n          onInstallSuccess={handleInstallSuccess}\n          onInstallError={handleInstallError}\n        />\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkEA,IAAM,IAAiD;CAAC;CAAa;CAAa;CAAY,EAKxF,KAAoB,MAA8B;AACtD,SAAQ,GAAR;EACE,KAAK;EACL,KAAK;EACL,KAAK,YACH,QAAO;GACL,MAAM;GACN,SACE;GACF,OAAO;GACR;EACH,KAAK,aACH,QAAO;GACL,MAAM;GACN,SACE;GACF,OAAO;GACR;EACH,KAAK,UACH,QAAO;GACL,MAAM;GACN,SACE;GACF,OAAO;GACR;EACH,KAAK,SACH,QAAO;GACL,MAAM;GACN,SAAS;GACT,OAAO;GACR;EACH,KAAK,WACH,QAAO;GACL,MAAM;GACN,SACE;GACF,OAAO;GACR;EACH,KAAK,YACH,QAAO;GACL,MAAM;GACN,SAAS;GACT,OAAO;GACR;EACH,QACE,QAAO;GACL,MAAM;GACN,SAAS;GACT,OAAO;GACR;;GAOD,KAAkD,EAAE,gBAAa;CACrE,IAAM,IAAU,EAAiB,EAAO,EAClC,IAAO,EAAQ;AACrB,QACE,kBAAC,QAAD;EACE,WAAW,0FAA0F,EAAQ;YAD/G,CAGE,kBAAC,GAAD,EAAM,WAAU,YAAa,CAAA,EAC5B,EAAQ,MACJ;;GAUE,UAAuB;CAClC,IAAM,IAAW,GAAa,EACxB,EAAE,gBAAa,GAAU,EACzB,EAAE,SAAM,IAAS,EACjB,EAAE,QAAQ,GAAe,YAAS,UAAO,kBAAe,YAAS,gBAAa,GAAW,EACzF,EAAE,kBAAe,SAAS,OAAyB,GAAkB;AAE3E,GAAkC;EAChC,cAAc;AACP,MAAe;;EAEtB,UAAU,MAAQ;AAChB,WAAQ,KAAK,0CAA0C,EAAI,QAAQ;;EAEtE,CAAC;CAGF,IAAM,CAAC,IAAgB,MAAqB,kBAAsB,IAAI,KAAK,CAAC,EACtE,CAAC,GAAW,KAAgB,EAAoB,YAAY,EAG5D,CAAC,GAAa,KAAkB,EAAS,GAAM,EAC/C,CAAC,GAAiB,KAAsB,EAAwB,KAAK,EACrE,CAAC,GAAa,KAAkB,EAAyB,KAAK,EAC9D,CAAC,IAAgB,KAAqB,EAAwB,KAAK,EAEnE,IAAsB,QAExB,IAAI,IACF,EAAc,SAAS,MACrB,EAAa,WAAW,WAAW,CAAC,EAAa,UAAU,GAAG,EAAE,CACjE,CACF,EACH,CAAC,EAAc,CAChB,EAGK,IAAoB,EAAc,KAAK,MAAU;EACrD,IAAM,IAAY,EAAM,aAAa,EAAE,EACjC,IAAW,EAAU,QAAQ,GAAK,MAAS,IAAM,EAAK,UAAU,EAAE,EAClE,IAAM,EAAM,QAAQ,GAEpB,IAAqB,EAAU,KAAK,GAAM,OAAW;GACzD,IAAI,GAAG,EAAM,GAAG,GAAG;GACnB,WAAW,EAAK;GAChB,aAAa,EAAK;GAClB,aAAa,EAAK;GAClB,aACE,EAAK,gBACJ,OAAO,EAAK,YAAa,WAAW,EAAK,SAAS,aAAa,GAAG;GACrE,SAAS,EAAK;GACd,UAAU,EAAK;GACf,WAAW,EAAK;GAChB,YAAY,EAAK;GACjB,WAAW,EAAoB,IAAI,EAAK,UAAU;GACnD,EAAE;AAEH,SAAO;GACL,IAAI,EAAM;GACV,aAAa,IAAI,EAAM,GAAG,MAAM,GAAG,CAAC,aAAa;GACjD;GACA;GACA;GACA,OAAO,EAAM;GACb,QAAQ,EAAM;GACd,WAAW,EAAM;GACjB,aAAa,EAAM,eAAe;GACnC;GACD,EAEI,IAAkB,QAChB,EAAO,QAAQ,MAAU,EAA0B,SAAS,EAAM,OAAO,CAAC,EAChF,CAAC,EAAO,CACT,EAEK,IAAgB,QACd,EAAO,QAAQ,MAAU,CAAC,EAA0B,SAAS,EAAM,OAAO,CAAC,EACjF,CAAC,EAAO,CACT,EAEK,IAAgB,MAAc,cAAc,IAAkB,GAE9D,IAAe,GAAa,MAAoB;AACpD,MAAmB,MAAS;GAC1B,IAAM,IAAO,IAAI,IAAI,EAAK;AAM1B,UALI,EAAK,IAAI,EAAQ,GACnB,EAAK,OAAO,EAAQ,GAEpB,EAAK,IAAI,EAAQ,EAEZ;IACP;IACD,EAAE,CAAC,EAEA,MAA0B,GAAiB,MAAoB;AAUnE,EATA,EAAmB,EAAQ,EAC3B,EAAkB,EAAK,GAAG,EAC1B,EAAe;GACb,IAAI,EAAK;GACT,MAAM,EAAK;GACX,MAAM,EAAK;GACX,MAAM,EAAK;GACX,SAAS,EAAK;GACf,CAAC,EACF,EAAe,GAAK;IAGhB,UAAyB;AAI7B,EAHA,EAAe,GAAM,EACrB,EAAmB,KAAK,EACxB,EAAe,KAAK,EACpB,EAAkB,KAAK;IAGnB,MAAwB,GAAsB,MAA2B;AAExE,EADL,GAAkB,EACb,IAAsB;IAGvB,MAAsB,MAAkB,IAIxC,UAAgC;AACpC,IAAS,GAAG,EAAS,cAAc;IAI/B,IAAU,qBACV,IACJ;AAEF,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GAEE,kBAAC,UAAD;IAAQ,WAAU;cAChB,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MAAK,WAAU;gBACb,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAS,GAAG;QAC3B,cAAW;QACX,WAAU;kBAEV,kBAAC,GAAD,EAAW,WAAU,UAAW,CAAA;QACzB,CAAA,EACT,kBAAC,OAAD;QAAK,WAAU;kBAAf;SACE,kBAAC,GAAD,EAAS,WAAU,4BAA6B,CAAA;SAChD,kBAAC,MAAD;UAAI,WAAU;oBACX,EAAE,sBAAsB,EAAE,cAAc,aAAa,CAAC;UACpD,CAAA;SACJ,EAAO,SAAS,KACf,kBAAC,QAAD;UAAM,WAAU;oBACb,EAAO;UACH,CAAA;SAEL;UACF;;MACF,CAAA;KACF,CAAA;IACC,CAAA;GAGT,kBAAC,OAAD;IAAK,WAAU;cACb,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD;MAAa,WAAU;gBAAO;MAKhB,CAAA,EAEb,KAAW,EAAO,WAAW,IAE5B,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,GAAD;OAAS,WAAU;OAA4C,eAAY;OAAS,CAAA,EACpF,kBAAC,KAAD;OAAG,WAAU;iBAAkB;OAAwB,CAAA,CACnD;UACJ,IAEF,kBAAC,OAAD;MAAK,WAAU;gBAAf;OACE,kBAAC,OAAD;QAAK,WAAU;kBACb,kBAAC,GAAD,EAAS,WAAU,kCAAmC,CAAA;QAClD,CAAA;OACN,kBAAC,MAAD;QAAI,WAAU;kBACX,EAAE,6BAA6B,EAAE,cAAc,yBAAyB,CAAC;QACvE,CAAA;OACL,kBAAC,KAAD;QAAG,WAAU;kBACV,EAAM,WAAW;QAChB,CAAA;OACJ,kBAAC,UAAD;QACE,MAAK;QACL,SAAS;QACT,WAAU;kBAHZ,CAKE,kBAAC,GAAD,EAAa,WAAU,UAAW,CAAA,EAAA,qBAE3B;;OACL;UACJ,EAAO,WAAW,IAEpB,kBAAC,GAAD;MACE,cAAa;MACb,OAAO,EAAE,2BAA2B,EAAE,cAAc,iBAAiB,CAAC;MACtE,aAAY;MACZ,QACE,kBAAC,UAAD;OACE,MAAK;OACL,SAAS;OACT,WAAU;iBAHZ,CAKE,kBAAC,GAAD,EAAa,WAAU,UAAW,CAAA,EAAA,qBAE3B;;MAEX,CAAA,GAGF,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAa,YAAY;QACxC,WAAW,8DACT,MAAc,cACV,kDACA;kBANR,CAQC,aAEC,kBAAC,QAAD;SAAM,WAAU;mBACb,EAAgB;SACZ,CAAA,CACA;WACT,kBAAC,UAAD;QACE,MAAK;QACL,eAAe,EAAa,UAAU;QACtC,WAAW,8DACT,MAAc,YACV,kDACA;kBANR,CAQC,WAEC,kBAAC,QAAD;SAAM,WAAU;mBACb,EAAc;SACV,CAAA,CACA;UACL;UAEL,EAAc,WAAW,IACxB,kBAAC,GAAD;OAAW,WAAU;iBAArB;QACE,kBAAC,OAAD;SAAK,WAAU;mBACb,kBAAC,GAAD,EAAS,WAAU,UAAW,CAAA;SAC1B,CAAA;QACN,kBAAC,MAAD;SAAI,WAAU;mBACX,MAAc,cAAc,4BAA4B;SACtD,CAAA;QACL,kBAAC,KAAD;SAAG,WAAU;mBACV,MAAc,cACX,qEACA;SACF,CAAA;QACM;WAEZ,kBAAC,OAAD;OAAK,WAAU;iBAAf;QAEE,kBAAC,OAAD;SAAK,WAAU;mBAAf;UACE,kBAAC,OAAD,EAAK,WAAW,GAAa,CAAA;UAC7B,kBAAC,OAAD;WAAK,WAAW;qBAAW;WAAW,CAAA;UACtC,kBAAC,OAAD;WAAK,WAAW;qBAAW;WAAU,CAAA;UACrC,kBAAC,OAAD;WAAK,WAAW;qBAAW;WAAW,CAAA;UACtC,kBAAC,OAAD;WAAK,WAAW,GAAG,EAAU;qBAAc;WAAW,CAAA;UACtD,kBAAC,OAAD;WAAK,WAAW,GAAG,EAAU;qBAAe;WAAY,CAAA;UACpD;;QAGL,EAAc,KAAK,MAAU;SAC5B,IAAM,IAAa,GAAe,IAAI,EAAM,GAAG,EACzC,IACJ,EAAM,WAAW,eACjB,EAAM,WAAW,eACjB,EAAM,WAAW;AAEnB,gBACE,kBAAC,OAAD;UAAoB,WAAU;oBAA9B,CAEE,kBAAC,UAAD;WACE,MAAK;WACL,eAAe,EAAa,EAAM,GAAG;WACrC,WAAU;qBAHZ;YAME,kBAAC,OAAD;aAAK,WAAW,GAAG,EAAQ;uBACzB,kBAAC,GAAD,EACE,WAAW,4DACT,IAAa,cAAc,MAE7B,CAAA;aACE,CAAA;YAGN,kBAAC,OAAD;aAAK,WAAW,GAAG,EAAQ;uBACxB,EAAM;aACH,CAAA;YAGN,kBAAC,OAAD;aAAK,WAAW,GAAG,EAAQ;uBACxB,IAAI,KAAK,EAAM,UAAU,CAAC,mBAAmB,SAAS;cACrD,MAAM;cACN,OAAO;cACP,KAAK;cACN,CAAC;aACE,CAAA;YAGN,kBAAC,OAAD;aAAK,WAAW,GAAG,EAAQ;uBAA3B;cACG,EAAM,MAAM;cAAO;cAAE,EAAM,MAAM,WAAW,IAAI,SAAS;cAC1D,kBAAC,QAAD;eAAM,WAAU;yBACb,EAAM,MAAM,KAAK,MAAM,EAAE,YAAY,CAAC,KAAK,KAAK;eAC5C,CAAA;cACH;;YAGN,kBAAC,OAAD;aACE,WAAW,GAAG,EAAQ;uBAErB,EAAY,EAAM,MAAM;aACrB,CAAA;YAGN,kBAAC,OAAD;aAAK,WAAW,GAAG,EAAQ;uBACzB,kBAAC,GAAD,EAAa,QAAQ,EAAM,QAAU,CAAA;aACjC,CAAA;YACC;cAGR,KACC,kBAAC,OAAD;WAAK,WAAU;qBAAf;YACG,EAAM,eACL,kBAAC,OAAD;aAAK,WAAU;uBAAf,CACE,kBAAC,OAAD;cAAK,WAAU;wBAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,OAAD;eAAK,WAAU;yBAA0C;eAEnD,CAAA,EACN,kBAAC,OAAD;eAAK,WAAU;yBAAf;gBACG,EAAM,YAAY,UAAU;gBAC5B,EAAM,YAAY,UACf,MAAM,EAAM,YAAY,YACxB;gBACH,EAAM,YAAY,wBACf,oBAAoB,IAAI,KAAK,EAAM,YAAY,sBAAsB,CAAC,oBAAoB,KAC1F;gBACA;iBACF,EAAA,CAAA,EAEN,kBAAC,OAAD;eAAK,WAAU;yBAAf,CACG,EAAM,YAAY,kBACjB,kBAAC,OAAD;gBAAK,WAAU;0BAAf;iBAAyC;iBAC3B;iBACZ,kBAAC,QAAD;kBAAM,WAAU;4BACb,EAAM,YAAY;kBACd,CAAA;iBACH;mBAEP,EAAM,YAAY,eACjB,kBAAC,KAAD;gBACE,MAAM,EAAM,YAAY;gBACxB,QAAO;gBACP,KAAI;gBACJ,WAAU;0BAJZ,CAKC,iBAEC,kBAAC,GAAD,EAAc,WAAU,YAAa,CAAA,CACnC;kBAEF;iBACF;iBAEN,kBAAC,OAAD;cAAK,WAAU;wBACZ;eACC;gBAAE,KAAK;gBAAc,OAAO;gBAAc;eAC1C;gBAAE,KAAK;gBAAW,OAAO;gBAAW;eACpC;gBAAE,KAAK;gBAAoB,OAAO;gBAAoB;eACtD;gBAAE,KAAK;gBAAa,OAAO;gBAAa;eACzC,CAAC,KAAK,MAAS;eACd,IAAM,IAAU,EAAM,aAAa,UAAU;AAgB7C,sBACE,kBAAC,OAAD;gBAEE,WAAW,mDAjBb;iBACE;iBACA;iBACA;iBACA;iBACA;iBACA;iBACD,CAAC,QAAQ,EAAQ,IAClB;iBACE;iBACA;iBACA;iBACA;iBACD,CAAC,QAAQ,EAAK,IAAI,GAMX,sFACA;0BAGL,EAAK;gBACF,EARC,EAAK,IAQN;gBAER;cACE,CAAA,CACF;;YAIR,kBAAC,OAAD;aAAK,WAAU;uBAAf;cACE,kBAAC,QAAD;eAAM,WAAU;yBAAsC;eAAc,CAAA;cACpE,kBAAC,QAAD;eAAM,WAAU;yBAAiD;eAE1D,CAAA;cACP,kBAAC,QAAD;eAAM,WAAU;yBAAiD;eAE1D,CAAA;cACP,kBAAC,QAAD;eAAM,WAAU;yBAAkD;eAE3D,CAAA;cACH;;YAEL,EAAM,MAAM,KAAK,MAAS;aACzB,IAAM,IACJ,EAAK,gBAAgB,cACrB,EAAK,gBAAgB;AAEvB,oBACE,kBAAC,OAAD;cAEE,WAAU;wBAFZ;eAKE,kBAAC,OAAD;gBAAK,WAAU;0BAAf,CACE,kBAAC,OAAD;iBAAK,WAAU;2BACZ,EAAK,cACJ,kBAAC,OAAD;kBACE,KAAK,EAAK;kBACV,KAAK,EAAK;kBACV,WAAU;kBACV,CAAA,GAEF,kBAAC,OAAD;kBAAK,WAAU;4BACZ,EAAK,YAAY,OAAO,EAAE;kBACvB,CAAA;iBAEJ,CAAA,EACN,kBAAC,OAAD;iBAAK,WAAU;2BAAf,CACE,kBAAC,KAAD;kBAAG,WAAU;4BACV,EAAK;kBACJ,CAAA,EACJ,kBAAC,QAAD;kBAAM,WAAU;4BACb,EAAK;kBACD,CAAA,CACH;mBACF;;eAGN,kBAAC,OAAD;gBAAK,WAAU;0BACZ,EAAK;gBACF,CAAA;eAGN,kBAAC,OAAD;gBAAK,WAAU;0BACZ,EAAY,EAAK,WAAW;gBACzB,CAAA;eAGN,kBAAC,OAAD;gBAAK,WAAU;0BAAf,CACE,kBAAC,QAAD;iBAAM,WAAU;2BAAhB,CAAgC,EAAK,UAAS,MAAgB;oBAC9D,kBAAC,QAAD;iBAAM,WAAU;2BACb,EAAY,EAAK,UAAU;iBACvB,CAAA,CACH;;eAGN,kBAAC,OAAD;gBAAK,WAAU;0BACZ,EAAK,YACJ,kBAAC,QAAD;iBAAM,WAAU;2BAAhB,CACE,kBAAC,GAAD,EAAa,WAAU,YAAa,CAAA,EAAA,YAE/B;qBACL,KAAgB,IAClB,kBAAC,UAAD;iBACE,MAAK;iBACL,UAAU,MAAM;AAEd,kBADA,EAAE,iBAAiB,EACnB,GAAuB,EAAM,IAAI,EAAK;;iBAExC,WAAU;2BANZ,CAQE,kBAAC,GAAD,EAAU,WAAU,YAAa,CAAA,EAAA,cAE1B;qBACP;gBACA,CAAA;eACF;gBAnEC,EAAK,GAmEN;cAER;YAGF,kBAAC,OAAD;aAAK,WAAU;uBACb,kBAAC,OAAD;cAAK,WAAU;wBAAf;eACE,kBAAC,QAAD,EAAA,UAAA;gBAAM;gBACM;gBACV,kBAAC,QAAD;iBAAM,WAAU;2BACb,EAAY,EAAM,SAAS;iBACvB,CAAA;gBACF,EAAA,CAAA;eACP,kBAAC,QAAD,EAAA,UAAA;gBAAM;gBACC;gBACL,kBAAC,QAAD;iBAAM,WAAU;2BACb,EAAY,EAAM,IAAI;iBAClB,CAAA;gBACF,EAAA,CAAA;eACP,kBAAC,QAAD;gBAAM,WAAU;0BAAhB;iBAAgC;iBACvB;iBACP,kBAAC,QAAD;kBAAM,WAAU;4BACb,EAAY,EAAM,MAAM;kBACpB,CAAA;iBACF;;eACH;;aACF,CAAA;YACF;aAEJ;YA5PI,EAAM,GA4PV;UAER;QAGD,KACC,kBAAC,OAAD;SAAK,WAAU;mBACb,kBAAC,UAAD;UACE,MAAK;UACL,SAAS;UACT,UAAU;UACV,WAAU;UACV,cAAY,EAAE,mBAAmB,EAAE,cAAc,aAAa,CAAC;oBALjE,CAOG,IACC,kBAAC,GAAD;WAAS,WAAU;WAAsB,eAAY;WAAS,CAAA,GAC5D,MACH,EAAE,mBAAmB,EAAE,cAAc,aAAa,CAAC,CAC7C;;SACL,CAAA;QAEJ;SAEJ;QAEJ;;IACF,CAAA;GAGL,KACC,kBAAC,GAAD;IACE,QAAQ;IACR,SAAS;IACT,KAAK;IACL,SAAS;IACT,kBAAkB;IAClB,gBAAgB;IAChB,CAAA;GAEA"}

package/dist/pages/ProductDetailPage.js

@@ -7,9 +7,9 @@ import { InstallAppModal as ae } from "../components/InstallAppModal.js";
 import { useInstallations as oe } from "../hooks/useInstallations.js";
 import { nativeConfirm as se, nativeImpact as ce, nativeNotify as le } from "../utils/nativeBridge.js";
 import { useCallback as a, useEffect as ue, useMemo as de, useRef as fe, useState as o } from "react";
-import { AlertCircle as s, ArrowLeft as pe, Check as me, Loader2 as he, Package as c, ShieldCheck as l, ShoppingCart as ge, Star as u, ThumbsUp as d } from "lucide-react";
+import { useLocation as pe, useNavigate as me, useParams as he } from "react-router";
+import { AlertCircle as s, ArrowLeft as ge, Check as _e, Loader2 as ve, Package as c, ShieldCheck as l, ShoppingCart as ye, Star as u, ThumbsUp as d } from "lucide-react";
 import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { useLocation as _e, useNavigate as ve, useParams as ye } from "react-router";
 import { EmphasisPanel as be, GlassCard as h, IllustratedEmptyState as xe, NextSteps as Se, PagePurpose as Ce } from "@burdenoff/fe-libs/ui";
 import { useEventBus as we } from "@burdenoff/fe-libs/shared/events";
 //#region src/pages/ProductDetailPage.tsx
@@ -453,7 +453,7 @@ var Te = (e, t) => ({
 		]
 	})
 }), Ae = () => {
-	let { productId: s } = ye(), d = ve(), Ae = _e(), { basePath: g, workspaceId: _ } = e(), { addProduct: je, cartItems: Me, addingToCart: Ne, createOrder: Pe, checkingOut: Fe } = t(), { installations: Ie, refetch: Le } = oe({
+	let { productId: s } = he(), d = me(), Ae = pe(), { basePath: g, workspaceId: _ } = e(), { addProduct: je, cartItems: Me, addingToCart: Ne, createOrder: Pe, checkingOut: Fe } = t(), { installations: Ie, refetch: Le } = oe({
 		filter: de(() => s && _ ? {
 			productId: s,
 			workspaceId: _
@@ -665,7 +665,7 @@ var Te = (e, t) => ({
 									type: "button",
 									onClick: () => d(-1),
 									className: "mb-6 cursor-pointer inline-flex items-center gap-2 text-sm text-text-muted transition-colors hover:text-text-primary",
-									children: [/* @__PURE__ */ p(pe, { className: "size-4" }), "Back"]
+									children: [/* @__PURE__ */ p(ge, { className: "size-4" }), "Back"]
 								}),
 								/* @__PURE__ */ p("h1", {
 									className: "mb-3 text-4xl font-normal leading-tight text-text-primary lg:text-5xl",
@@ -864,13 +864,13 @@ var Te = (e, t) => ({
 												onClick: ft,
 												disabled: Ye || Fe || $,
 												className: "cursor-pointer flex items-center gap-2 rounded-full bg-action-primary-bg px-8 py-3 font-medium text-action-primary-text transition-opacity hover:opacity-90 disabled:opacity-70",
-												children: Ye || Fe ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(he, { className: "size-4 animate-spin" }), "Processing…"] }) : $ ? "Out of stock" : `Buy ${wt()}`
+												children: Ye || Fe ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(ve, { className: "size-4 animate-spin" }), "Processing…"] }) : $ ? "Out of stock" : `Buy ${wt()}`
 											}), !Y && (!W || X) && /* @__PURE__ */ m("button", {
 												type: "button",
 												onClick: dt,
 												disabled: Ne || $,
 												className: "cursor-pointer flex items-center gap-2 rounded-full border border-border-default px-4 py-3 text-sm text-text-primary transition-colors hover:bg-bg-sunken disabled:opacity-50",
-												children: [Ne ? /* @__PURE__ */ p(he, { className: "size-4 animate-spin" }) : z ? /* @__PURE__ */ p(me, { className: "size-4 text-status-success-text" }) : /* @__PURE__ */ p(ge, { className: "size-4" }), z ? "In Cart" : "Add to Cart"]
+												children: [Ne ? /* @__PURE__ */ p(ve, { className: "size-4 animate-spin" }) : z ? /* @__PURE__ */ p(_e, { className: "size-4 text-status-success-text" }) : /* @__PURE__ */ p(ye, { className: "size-4" }), z ? "In Cart" : "Add to Cart"]
 											})]
 										}),
 										X ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ m("p", {

package/dist/pages/SellerSourcingOffersPage.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const SellerSourcingOffersPage: FC;

package/dist/pages/SellerSourcingOffersPage.js

@@ -0,0 +1,284 @@
+import { useStore as e } from "../providers/StoreProvider.js";
+import { useSourcingApi as t } from "../hooks/useSourcing.js";
+import { usePublisherSourcingAccess as n } from "../providers/SourcingAccessProvider.js";
+import { SourcingOfferStatus as r } from "../generated/global-types.js";
+import { ContextRequiredPanel as i, SourcingEmptyState as ee, SourcingErrorState as a, SourcingLoadingState as o, SourcingPageHeader as s, SourcingStatusBadge as c, formatDate as l, formatDateTime as u, formatLocation as te, formatMoney as d, formatSourcingUnit as f, joinStorePath as p, primaryButtonClassName as m, secondaryButtonClassName as h, toErrorMessage as g } from "../components/sourcing/SourcingUi.js";
+import { useCallback as _, useEffect as v, useState as y } from "react";
+import { useNavigate as b } from "react-router";
+import { ArrowRight as x, CalendarDays as S, CircleDollarSign as C, MapPin as w, PackageSearch as T, RefreshCw as ne, TicketCheck as re } from "lucide-react";
+import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
+import { GlassCard as k, PagePurpose as A } from "@burdenoff/fe-libs/ui";
+//#region src/pages/SellerSourcingOffersPage.tsx
+var j = 30;
+function M(e) {
+	switch (e) {
+		case r.Active: return r.Active;
+		case r.Accepted: return r.Accepted;
+		case r.Rejected: return r.Rejected;
+		default: return "";
+	}
+}
+var N = () => {
+	let N = b(), { basePath: P } = e(), { profile: F, loading: I, error: L, isEligible: R, refresh: z } = n(), { listSellerOffers: B } = t(), [V, H] = y([]), [U, W] = y(""), [G, K] = y(0), [q, J] = y(!1), [Y, X] = y(!1), [Z, Q] = y(null), $ = _(async (e = 0, t = !1) => {
+		if (R) {
+			X(!0), Q(null);
+			try {
+				let n = await B({
+					status: U || void 0,
+					limit: j,
+					offset: e
+				});
+				H((e) => t ? [...e, ...n] : n), K(e), J(n.length === j);
+			} catch (e) {
+				Q(g(e, "Your sourcing offers could not be loaded."));
+			} finally {
+				X(!1);
+			}
+		}
+	}, [
+		R,
+		B,
+		U
+	]);
+	return v(() => {
+		$();
+	}, [$]), /* @__PURE__ */ O("div", {
+		className: "min-h-full bg-surface-default",
+		children: [/* @__PURE__ */ D(s, {
+			title: "My sourcing offers",
+			description: "Track and update the offers submitted by your verified Store Publisher.",
+			icon: /* @__PURE__ */ D(re, {
+				className: "size-5",
+				"aria-hidden": "true"
+			}),
+			actions: /* @__PURE__ */ O("button", {
+				type: "button",
+				onClick: () => N(p(P, "publisher/sourcing/opportunities")),
+				className: m,
+				children: [/* @__PURE__ */ D(T, {
+					className: "size-4",
+					"aria-hidden": "true"
+				}), "Find opportunities"]
+			})
+		}), /* @__PURE__ */ O("main", {
+			className: "mx-auto max-w-6xl px-4 py-6 sm:px-6",
+			children: [/* @__PURE__ */ D(A, {
+				className: "mb-6",
+				children: "Active offers can be updated while their request remains open. Accepted and rejected offers are final. When a buyer accepts your offer, the resulting Store order and fulfillment status appear here without exposing another publisher's private offer."
+			}), I ? /* @__PURE__ */ D(o, { label: "Checking Store Publisher access…" }) : L ? /* @__PURE__ */ D(a, {
+				title: "Publisher access could not be checked",
+				message: L,
+				onRetry: () => void z()
+			}) : F ? R ? /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ O("div", {
+				className: "mb-5 flex flex-col gap-3 rounded-xl border border-border-seam bg-surface-raised p-4 sm:flex-row sm:items-end sm:justify-between",
+				children: [/* @__PURE__ */ O("label", {
+					className: "block sm:w-64",
+					children: [/* @__PURE__ */ D("span", {
+						className: "text-sm font-medium text-text-primary",
+						children: "Offer status"
+					}), /* @__PURE__ */ O("select", {
+						value: U,
+						onChange: (e) => W(M(e.target.value)),
+						className: "mt-1.5 w-full rounded-lg border border-border-default bg-surface-default px-3 py-2 text-sm text-text-primary outline-none focus:border-action-primary-bg focus:ring-2 focus:ring-action-primary-bg/20",
+						children: [
+							/* @__PURE__ */ D("option", {
+								value: "",
+								children: "All statuses"
+							}),
+							/* @__PURE__ */ D("option", {
+								value: r.Active,
+								children: "Active"
+							}),
+							/* @__PURE__ */ D("option", {
+								value: r.Accepted,
+								children: "Accepted"
+							}),
+							/* @__PURE__ */ D("option", {
+								value: r.Rejected,
+								children: "Rejected"
+							})
+						]
+					})]
+				}), /* @__PURE__ */ O("button", {
+					type: "button",
+					onClick: () => void $(),
+					disabled: Y,
+					className: h,
+					children: [/* @__PURE__ */ D(ne, {
+						className: `size-4 ${Y ? "animate-spin" : ""}`,
+						"aria-hidden": "true"
+					}), "Refresh"]
+				})]
+			}), Y && V.length === 0 ? /* @__PURE__ */ D(o, { label: "Loading your sourcing offers…" }) : Z && V.length === 0 ? /* @__PURE__ */ D(a, {
+				title: "Offers could not be loaded",
+				message: Z,
+				onRetry: () => void $()
+			}) : V.length === 0 ? /* @__PURE__ */ D(ee, {
+				title: U ? "No offers match this status" : "No sourcing offers yet",
+				description: U ? "Choose another status to review the rest of your offers." : "Browse open buyer opportunities to create your first sourcing offer.",
+				action: /* @__PURE__ */ O("button", {
+					type: "button",
+					onClick: () => N(p(P, "publisher/sourcing/opportunities")),
+					className: m,
+					children: [/* @__PURE__ */ D(T, {
+						className: "size-4",
+						"aria-hidden": "true"
+					}), "Browse opportunities"]
+				})
+			}) : /* @__PURE__ */ O(E, { children: [
+				Z ? /* @__PURE__ */ D("div", {
+					role: "alert",
+					className: "mb-4 rounded-lg border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger",
+					children: Z
+				}) : null,
+				/* @__PURE__ */ D("ul", {
+					className: "grid gap-4 md:grid-cols-2",
+					children: V.map((e) => /* @__PURE__ */ D("li", { children: /* @__PURE__ */ O(k, {
+						className: "flex h-full flex-col p-5",
+						children: [
+							/* @__PURE__ */ O("div", {
+								className: "flex items-start justify-between gap-3",
+								children: [/* @__PURE__ */ O("div", {
+									className: "min-w-0",
+									children: [/* @__PURE__ */ D("p", {
+										className: "truncate text-xs font-semibold uppercase tracking-wide text-text-accent",
+										children: e.request?.category ?? "Sourcing request"
+									}), /* @__PURE__ */ D("h2", {
+										className: "mt-1 line-clamp-2 text-lg font-semibold text-text-primary",
+										children: e.request?.productName ?? `Request ${e.requestId}`
+									})]
+								}), /* @__PURE__ */ D(c, { status: e.status })]
+							}),
+							/* @__PURE__ */ O("dl", {
+								className: "mt-5 grid gap-4 text-sm sm:grid-cols-2",
+								children: [
+									/* @__PURE__ */ O("div", {
+										className: "flex gap-2",
+										children: [/* @__PURE__ */ D(C, {
+											className: "mt-0.5 size-4 shrink-0 text-text-tertiary",
+											"aria-hidden": "true"
+										}), /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("dt", {
+											className: "text-xs text-text-tertiary",
+											children: "Your unit price"
+										}), /* @__PURE__ */ D("dd", {
+											className: "font-semibold text-text-primary",
+											children: d(e.unitPrice, e.currency)
+										})] })]
+									}),
+									/* @__PURE__ */ O("div", {
+										className: "flex gap-2",
+										children: [/* @__PURE__ */ D(T, {
+											className: "mt-0.5 size-4 shrink-0 text-text-tertiary",
+											"aria-hidden": "true"
+										}), /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("dt", {
+											className: "text-xs text-text-tertiary",
+											children: "Quantity"
+										}), /* @__PURE__ */ O("dd", {
+											className: "font-medium text-text-primary",
+											children: [
+												e.quantity.toLocaleString(),
+												" ",
+												f(e.unit)
+											]
+										})] })]
+									}),
+									/* @__PURE__ */ O("div", {
+										className: "flex gap-2",
+										children: [/* @__PURE__ */ D(S, {
+											className: "mt-0.5 size-4 shrink-0 text-text-tertiary",
+											"aria-hidden": "true"
+										}), /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("dt", {
+											className: "text-xs text-text-tertiary",
+											children: "Promised delivery"
+										}), /* @__PURE__ */ D("dd", {
+											className: "font-medium text-text-primary",
+											children: u(e.deliveryDate)
+										})] })]
+									}),
+									e.request ? /* @__PURE__ */ O("div", {
+										className: "flex gap-2",
+										children: [/* @__PURE__ */ D(w, {
+											className: "mt-0.5 size-4 shrink-0 text-text-tertiary",
+											"aria-hidden": "true"
+										}), /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("dt", {
+											className: "text-xs text-text-tertiary",
+											children: "Destination"
+										}), /* @__PURE__ */ D("dd", {
+											className: "font-medium text-text-primary",
+											children: te({
+												country: e.request.deliveryCountry,
+												region: e.request.deliveryRegion,
+												city: e.request.deliveryCity
+											})
+										})] })]
+									}) : null
+								]
+							}),
+							e.message ? /* @__PURE__ */ D("p", {
+								className: "mt-4 line-clamp-3 rounded-lg bg-surface-muted p-3 text-sm leading-6 text-text-secondary",
+								children: e.message
+							}) : null,
+							e.order ? /* @__PURE__ */ O("div", {
+								className: "mt-4 rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3",
+								children: [
+									/* @__PURE__ */ O("p", {
+										className: "text-xs font-medium text-status-success-text",
+										children: ["Store order ", e.order.id]
+									}),
+									/* @__PURE__ */ O("p", {
+										className: "mt-1 text-sm font-semibold text-text-primary",
+										children: [
+											d(e.order.total, e.order.currency),
+											" ·",
+											" ",
+											e.order.status
+										]
+									}),
+									e.order.fulfillment ? /* @__PURE__ */ O("p", {
+										className: "mt-1 text-xs text-text-secondary",
+										children: ["Fulfillment: ", e.order.fulfillment.status.replaceAll("_", " ")]
+									}) : null
+								]
+							}) : null,
+							/* @__PURE__ */ O("div", {
+								className: "mt-auto flex items-center justify-between gap-3 border-t border-border-seam pt-4",
+								children: [/* @__PURE__ */ O("p", {
+									className: "text-xs text-text-tertiary",
+									children: ["Updated ", l(e.updatedAt)]
+								}), /* @__PURE__ */ O("button", {
+									type: "button",
+									onClick: () => N(p(P, `publisher/sourcing/opportunities/${e.requestId}`)),
+									className: h,
+									children: [e.status === r.Active ? "Review or update" : "View details", /* @__PURE__ */ D(x, {
+										className: "size-4",
+										"aria-hidden": "true"
+									})]
+								})]
+							})
+						]
+					}) }, e.id))
+				}),
+				q ? /* @__PURE__ */ D("div", {
+					className: "mt-6 flex justify-center",
+					children: /* @__PURE__ */ D("button", {
+						type: "button",
+						onClick: () => void $(G + j, !0),
+						disabled: Y,
+						className: h,
+						children: Y ? "Loading…" : "Load more"
+					})
+				}) : null
+			] })] }) : /* @__PURE__ */ D(i, {
+				title: "Verified publisher status required",
+				description: `The publisher profile “${F.name}” is currently ${F.verificationStatus.toLowerCase().replaceAll("_", " ")}. Offers are available only to active verified publishers.`
+			}) : /* @__PURE__ */ D(i, {
+				title: "Store Publisher profile required",
+				description: "A Store Publisher profile is required to submit or review sourcing offers."
+			})]
+		})]
+	});
+};
+//#endregion
+export { N as SellerSourcingOffersPage };
+
+//# sourceMappingURL=SellerSourcingOffersPage.js.map

package/dist/pages/SellerSourcingOffersPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SellerSourcingOffersPage.js","names":[],"sources":["../../src/pages/SellerSourcingOffersPage.tsx"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport type { FC } from 'react';\nimport { useNavigate } from 'react-router';\nimport {\n  ArrowRight,\n  CalendarDays,\n  CircleDollarSign,\n  MapPin,\n  PackageSearch,\n  RefreshCw,\n  TicketCheck,\n} from 'lucide-react';\nimport { GlassCard, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { SourcingOfferStatus } from '../generated/global-types';\nimport { useStore } from '../providers/StoreProvider';\nimport { type SellerSourcingOffer, useSourcingApi } from '../hooks/useSourcing';\nimport { usePublisherSourcingAccess } from '../providers/SourcingAccessProvider';\nimport {\n  ContextRequiredPanel,\n  formatDate,\n  formatDateTime,\n  formatLocation,\n  formatMoney,\n  formatSourcingUnit,\n  joinStorePath,\n  primaryButtonClassName,\n  secondaryButtonClassName,\n  SourcingEmptyState,\n  SourcingErrorState,\n  SourcingLoadingState,\n  SourcingPageHeader,\n  SourcingStatusBadge,\n  toErrorMessage,\n} from '../components/sourcing/SourcingUi';\n\nconst PAGE_SIZE = 30;\ntype OfferFilter = SourcingOfferStatus | '';\n\nfunction parseOfferFilter(value: string): OfferFilter {\n  switch (value) {\n    case SourcingOfferStatus.Active:\n      return SourcingOfferStatus.Active;\n    case SourcingOfferStatus.Accepted:\n      return SourcingOfferStatus.Accepted;\n    case SourcingOfferStatus.Rejected:\n      return SourcingOfferStatus.Rejected;\n    default:\n      return '';\n  }\n}\n\nexport const SellerSourcingOffersPage: FC = () => {\n  const navigate = useNavigate();\n  const { basePath } = useStore();\n  const {\n    profile,\n    loading: accessLoading,\n    error: accessError,\n    isEligible,\n    refresh: refreshAccess,\n  } = usePublisherSourcingAccess();\n  const { listSellerOffers } = useSourcingApi();\n  const [offers, setOffers] = useState<SellerSourcingOffer[]>([]);\n  const [status, setStatus] = useState<OfferFilter>('');\n  const [offset, setOffset] = useState(0);\n  const [hasMore, setHasMore] = useState(false);\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  const load = useCallback(\n    async (nextOffset = 0, append = false) => {\n      if (!isEligible) return;\n      setLoading(true);\n      setError(null);\n      try {\n        const result = await listSellerOffers({\n          status: status || undefined,\n          limit: PAGE_SIZE,\n          offset: nextOffset,\n        });\n        setOffers((current) => (append ? [...current, ...result] : result));\n        setOffset(nextOffset);\n        setHasMore(result.length === PAGE_SIZE);\n      } catch (loadError) {\n        setError(toErrorMessage(loadError, 'Your sourcing offers could not be loaded.'));\n      } finally {\n        setLoading(false);\n      }\n    },\n    [isEligible, listSellerOffers, status]\n  );\n\n  useEffect(() => {\n    void load();\n  }, [load]);\n\n  return (\n    <div className=\"min-h-full bg-surface-default\">\n      <SourcingPageHeader\n        title=\"My sourcing offers\"\n        description=\"Track and update the offers submitted by your verified Store Publisher.\"\n        icon={<TicketCheck className=\"size-5\" aria-hidden=\"true\" />}\n        actions={\n          <button\n            type=\"button\"\n            onClick={() => navigate(joinStorePath(basePath, 'publisher/sourcing/opportunities'))}\n            className={primaryButtonClassName}\n          >\n            <PackageSearch className=\"size-4\" aria-hidden=\"true\" />\n            Find opportunities\n          </button>\n        }\n      />\n\n      <main className=\"mx-auto max-w-6xl px-4 py-6 sm:px-6\">\n        <PagePurpose className=\"mb-6\">\n          Active offers can be updated while their request remains open. Accepted and rejected\n          offers are final. When a buyer accepts your offer, the resulting Store order and\n          fulfillment status appear here without exposing another publisher's private offer.\n        </PagePurpose>\n\n        {accessLoading ? (\n          <SourcingLoadingState label=\"Checking Store Publisher access…\" />\n        ) : accessError ? (\n          <SourcingErrorState\n            title=\"Publisher access could not be checked\"\n            message={accessError}\n            onRetry={() => void refreshAccess()}\n          />\n        ) : !profile ? (\n          <ContextRequiredPanel\n            title=\"Store Publisher profile required\"\n            description=\"A Store Publisher profile is required to submit or review sourcing offers.\"\n          />\n        ) : !isEligible ? (\n          <ContextRequiredPanel\n            title=\"Verified publisher status required\"\n            description={`The publisher profile “${profile.name}” is currently ${profile.verificationStatus.toLowerCase().replaceAll('_', ' ')}. Offers are available only to active verified publishers.`}\n          />\n        ) : (\n          <>\n            <div className=\"mb-5 flex flex-col gap-3 rounded-xl border border-border-seam bg-surface-raised p-4 sm:flex-row sm:items-end sm:justify-between\">\n              <label className=\"block sm:w-64\">\n                <span className=\"text-sm font-medium text-text-primary\">Offer status</span>\n                <select\n                  value={status}\n                  onChange={(event) => setStatus(parseOfferFilter(event.target.value))}\n                  className=\"mt-1.5 w-full rounded-lg border border-border-default bg-surface-default px-3 py-2 text-sm text-text-primary outline-none focus:border-action-primary-bg focus:ring-2 focus:ring-action-primary-bg/20\"\n                >\n                  <option value=\"\">All statuses</option>\n                  <option value={SourcingOfferStatus.Active}>Active</option>\n                  <option value={SourcingOfferStatus.Accepted}>Accepted</option>\n                  <option value={SourcingOfferStatus.Rejected}>Rejected</option>\n                </select>\n              </label>\n              <button\n                type=\"button\"\n                onClick={() => void load()}\n                disabled={loading}\n                className={secondaryButtonClassName}\n              >\n                <RefreshCw\n                  className={`size-4 ${loading ? 'animate-spin' : ''}`}\n                  aria-hidden=\"true\"\n                />\n                Refresh\n              </button>\n            </div>\n\n            {loading && offers.length === 0 ? (\n              <SourcingLoadingState label=\"Loading your sourcing offers…\" />\n            ) : error && offers.length === 0 ? (\n              <SourcingErrorState\n                title=\"Offers could not be loaded\"\n                message={error}\n                onRetry={() => void load()}\n              />\n            ) : offers.length === 0 ? (\n              <SourcingEmptyState\n                title={status ? 'No offers match this status' : 'No sourcing offers yet'}\n                description={\n                  status\n                    ? 'Choose another status to review the rest of your offers.'\n                    : 'Browse open buyer opportunities to create your first sourcing offer.'\n                }\n                action={\n                  <button\n                    type=\"button\"\n                    onClick={() =>\n                      navigate(joinStorePath(basePath, 'publisher/sourcing/opportunities'))\n                    }\n                    className={primaryButtonClassName}\n                  >\n                    <PackageSearch className=\"size-4\" aria-hidden=\"true\" />\n                    Browse opportunities\n                  </button>\n                }\n              />\n            ) : (\n              <>\n                {error ? (\n                  <div\n                    role=\"alert\"\n                    className=\"mb-4 rounded-lg border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger\"\n                  >\n                    {error}\n                  </div>\n                ) : null}\n                <ul className=\"grid gap-4 md:grid-cols-2\">\n                  {offers.map((offer) => (\n                    <li key={offer.id}>\n                      <GlassCard className=\"flex h-full flex-col p-5\">\n                        <div className=\"flex items-start justify-between gap-3\">\n                          <div className=\"min-w-0\">\n                            <p className=\"truncate text-xs font-semibold uppercase tracking-wide text-text-accent\">\n                              {offer.request?.category ?? 'Sourcing request'}\n                            </p>\n                            <h2 className=\"mt-1 line-clamp-2 text-lg font-semibold text-text-primary\">\n                              {offer.request?.productName ?? `Request ${offer.requestId}`}\n                            </h2>\n                          </div>\n                          <SourcingStatusBadge status={offer.status} />\n                        </div>\n\n                        <dl className=\"mt-5 grid gap-4 text-sm sm:grid-cols-2\">\n                          <div className=\"flex gap-2\">\n                            <CircleDollarSign\n                              className=\"mt-0.5 size-4 shrink-0 text-text-tertiary\"\n                              aria-hidden=\"true\"\n                            />\n                            <div>\n                              <dt className=\"text-xs text-text-tertiary\">Your unit price</dt>\n                              <dd className=\"font-semibold text-text-primary\">\n                                {formatMoney(offer.unitPrice, offer.currency)}\n                              </dd>\n                            </div>\n                          </div>\n                          <div className=\"flex gap-2\">\n                            <PackageSearch\n                              className=\"mt-0.5 size-4 shrink-0 text-text-tertiary\"\n                              aria-hidden=\"true\"\n                            />\n                            <div>\n                              <dt className=\"text-xs text-text-tertiary\">Quantity</dt>\n                              <dd className=\"font-medium text-text-primary\">\n                                {offer.quantity.toLocaleString()} {formatSourcingUnit(offer.unit)}\n                              </dd>\n                            </div>\n                          </div>\n                          <div className=\"flex gap-2\">\n                            <CalendarDays\n                              className=\"mt-0.5 size-4 shrink-0 text-text-tertiary\"\n                              aria-hidden=\"true\"\n                            />\n                            <div>\n                              <dt className=\"text-xs text-text-tertiary\">Promised delivery</dt>\n                              <dd className=\"font-medium text-text-primary\">\n                                {formatDateTime(offer.deliveryDate)}\n                              </dd>\n                            </div>\n                          </div>\n                          {offer.request ? (\n                            <div className=\"flex gap-2\">\n                              <MapPin\n                                className=\"mt-0.5 size-4 shrink-0 text-text-tertiary\"\n                                aria-hidden=\"true\"\n                              />\n                              <div>\n                                <dt className=\"text-xs text-text-tertiary\">Destination</dt>\n                                <dd className=\"font-medium text-text-primary\">\n                                  {formatLocation({\n                                    country: offer.request.deliveryCountry,\n                                    region: offer.request.deliveryRegion,\n                                    city: offer.request.deliveryCity,\n                                  })}\n                                </dd>\n                              </div>\n                            </div>\n                          ) : null}\n                        </dl>\n\n                        {offer.message ? (\n                          <p className=\"mt-4 line-clamp-3 rounded-lg bg-surface-muted p-3 text-sm leading-6 text-text-secondary\">\n                            {offer.message}\n                          </p>\n                        ) : null}\n\n                        {offer.order ? (\n                          <div className=\"mt-4 rounded-lg border border-status-success-border bg-status-success-bg-subtle p-3\">\n                            <p className=\"text-xs font-medium text-status-success-text\">\n                              Store order {offer.order.id}\n                            </p>\n                            <p className=\"mt-1 text-sm font-semibold text-text-primary\">\n                              {formatMoney(offer.order.total, offer.order.currency)} ·{' '}\n                              {offer.order.status}\n                            </p>\n                            {offer.order.fulfillment ? (\n                              <p className=\"mt-1 text-xs text-text-secondary\">\n                                Fulfillment: {offer.order.fulfillment.status.replaceAll('_', ' ')}\n                              </p>\n                            ) : null}\n                          </div>\n                        ) : null}\n\n                        <div className=\"mt-auto flex items-center justify-between gap-3 border-t border-border-seam pt-4\">\n                          <p className=\"text-xs text-text-tertiary\">\n                            Updated {formatDate(offer.updatedAt)}\n                          </p>\n                          <button\n                            type=\"button\"\n                            onClick={() =>\n                              navigate(\n                                joinStorePath(\n                                  basePath,\n                                  `publisher/sourcing/opportunities/${offer.requestId}`\n                                )\n                              )\n                            }\n                            className={secondaryButtonClassName}\n                          >\n                            {offer.status === SourcingOfferStatus.Active\n                              ? 'Review or update'\n                              : 'View details'}\n                            <ArrowRight className=\"size-4\" aria-hidden=\"true\" />\n                          </button>\n                        </div>\n                      </GlassCard>\n                    </li>\n                  ))}\n                </ul>\n\n                {hasMore ? (\n                  <div className=\"mt-6 flex justify-center\">\n                    <button\n                      type=\"button\"\n                      onClick={() => void load(offset + PAGE_SIZE, true)}\n                      disabled={loading}\n                      className={secondaryButtonClassName}\n                    >\n                      {loading ? 'Loading…' : 'Load more'}\n                    </button>\n                  </div>\n                ) : null}\n              </>\n            )}\n          </>\n        )}\n      </main>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/pages/SellerSourcingOpportunitiesPage.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const SellerSourcingOpportunitiesPage: FC;