@burdenoff/microfe-atheletebridge 2026.624.1 → 2026.625.1

package/dist/atheletebridge/pages/customer/CartDiscoveryPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartDiscoveryPage.js","names":[],"sources":["../../../../src/atheletebridge/pages/customer/CartDiscoveryPage.tsx"],"sourcesContent":["/**\n * Cart Discovery Page\n * @module atheletebridge/pages/customer\n *\n * Browse and search service providers (carts) with full filtering:\n * category, rating, price range, sort, search. Grid view with\n * cart info modal, load more, investment indicators, scheduled stops,\n * direct service links, verified badges, and prep time badges.\n */\n\nimport { useState, useMemo } from 'react';\nimport type { MockCart } from '../../types';\nimport {\n  Search,\n  X,\n  Star,\n  MapPin,\n  Clock,\n  CheckCircle2,\n  Info,\n  Home,\n  TrendingUp,\n  Calendar,\n  Tag,\n  Loader2,\n  AlertCircle,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { useProviders, useInvestmentOpportunities } from '../../hooks/useAthleteBridgeApi';\nimport { cn } from '../../utils/cn';\nimport { formatDistance, formatCurrency } from '../../utils/formatters';\n\nconst ALL_CATEGORIES = 'All';\n\ntype RatingFilter = '' | '4.5' | '4.0' | '3.5';\ntype PriceFilter = '' | 'low' | 'medium' | 'high';\ntype SortBy = 'rating' | 'popularity' | 'distance' | 'newest';\n\nexport function CartDiscoveryPage() {\n  const { navigateTo } = useAthleteBridge();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [selectedCategory, setSelectedCategory] = useState<string>(ALL_CATEGORIES);\n  const [ratingFilter, setRatingFilter] = useState<RatingFilter>('');\n  const [priceFilter, setPriceFilter] = useState<PriceFilter>('');\n  const [sortBy, setSortBy] = useState<SortBy>('rating');\n  const [visibleCount, setVisibleCount] = useState(9);\n  const [showCartInfo, setShowCartInfo] = useState(false);\n  const [selectedCartInfo, setSelectedCartInfo] = useState<MockCart | null>(null);\n\n  const { data: providers = [], isLoading, isError } = useProviders();\n  const { data: investmentOpportunities = [] } = useInvestmentOpportunities();\n\n  const categories = useMemo(() => {\n    const cats = new Set<string>();\n    providers.forEach((p) => {\n      if (p.category) cats.add(p.category);\n    });\n    return [ALL_CATEGORIES, ...Array.from(cats)];\n  }, [providers]);\n\n  const filteredCarts = useMemo(() => {\n    let carts = [...providers];\n\n    // Search query\n    if (searchQuery.trim()) {\n      const q = searchQuery.toLowerCase();\n      carts = carts.filter(\n        (c) => c.name.toLowerCase().includes(q) || c.category.toLowerCase().includes(q)\n      );\n    }\n\n    // Category filter\n    if (selectedCategory !== ALL_CATEGORIES) {\n      carts = carts.filter((cart) => cart.category === selectedCategory);\n    }\n\n    // Rating filter\n    if (ratingFilter) {\n      const minRating = parseFloat(ratingFilter);\n      carts = carts.filter((cart) => cart.rating >= minRating);\n    }\n\n    // Price range filter\n    if (priceFilter) {\n      carts = carts.filter((cart) => {\n        const avg = cart.averageOrderValue ?? 0;\n        switch (priceFilter) {\n          case 'low':\n            return avg <= 300;\n          case 'medium':\n            return avg > 300 && avg <= 800;\n          case 'high':\n            return avg > 800;\n          default:\n            return true;\n        }\n      });\n    }\n\n    // Sort\n    switch (sortBy) {\n      case 'rating':\n        carts.sort((a, b) => b.rating - a.rating);\n        break;\n      case 'popularity':\n        carts.sort((a, b) => (b.totalRatings || 0) - (a.totalRatings || 0));\n        break;\n      case 'distance':\n        carts.sort((a, b) => (a.distance || 0) - (b.distance || 0));\n        break;\n      case 'newest':\n        carts.sort(\n          (a, b) => new Date(b.createdAt || 0).getTime() - new Date(a.createdAt || 0).getTime()\n        );\n        break;\n    }\n\n    return carts;\n  }, [providers, searchQuery, selectedCategory, ratingFilter, priceFilter, sortBy]);\n\n  const visibleCarts = filteredCarts.slice(0, visibleCount);\n  const hasMore = visibleCount < filteredCarts.length;\n\n  const hasActiveFilters =\n    selectedCategory !== ALL_CATEGORIES ||\n    ratingFilter !== '' ||\n    priceFilter !== '' ||\n    searchQuery.trim() !== '';\n\n  const clearAllFilters = () => {\n    setSearchQuery('');\n    setSelectedCategory(ALL_CATEGORIES);\n    setRatingFilter('');\n    setPriceFilter('');\n    setSortBy('rating');\n    setVisibleCount(9);\n  };\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Discover Carts\" description=\"Finding services and shops near you...\">\n        <div className=\"flex h-[60vh] items-center justify-center\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-primary\" />\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout title=\"Discover Carts\" description=\"Error loading carts\">\n        <div className=\"flex h-[60vh] flex-col items-center justify-center gap-4\">\n          <AlertCircle className=\"h-12 w-12 text-status-error-text\" />\n          <h2 className=\"text-xl font-semibold\">Error loading service providers</h2>\n          <button\n            type=\"button\"\n            onClick={() => window.location.reload()}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text\"\n          >\n            Retry\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Discover Carts\"\n      description=\"Find services and shops near you\"\n      actions={\n        <span className=\"text-sm text-text-secondary\">{filteredCarts.length} carts found</span>\n      }\n    >\n      {/* Search Bar */}\n      <div className=\"relative\">\n        <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <input\n          type=\"text\"\n          placeholder=\"Search carts, services, or items...\"\n          value={searchQuery}\n          onChange={(e) => setSearchQuery(e.target.value)}\n          className={cn(\n            'w-full rounded-lg border border-border-subtle bg-bg-surface py-2.5 pl-10 pr-10 text-sm text-text-primary',\n            'placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]'\n          )}\n        />\n        {searchQuery && (\n          <button\n            type=\"button\"\n            onClick={() => setSearchQuery('')}\n            className=\"absolute right-3 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary\"\n          >\n            <X className=\"h-4 w-4\" />\n          </button>\n        )}\n      </div>\n\n      {/* Category Chips */}\n      <div className=\"mt-4 flex flex-wrap gap-2\">\n        {categories.map((category) => (\n          <button\n            key={category}\n            type=\"button\"\n            onClick={() => setSelectedCategory(category)}\n            className={cn(\n              'rounded-full px-3 py-1.5 text-xs font-medium transition-colors',\n              selectedCategory === category\n                ? 'bg-foreground text-background'\n                : 'bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary'\n            )}\n          >\n            {category}\n          </button>\n        ))}\n      </div>\n\n      {/* Filter Row */}\n      <div className=\"mt-4 flex flex-wrap items-center gap-3\">\n        <select\n          value={ratingFilter}\n          onChange={(e) => setRatingFilter(e.target.value as RatingFilter)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">Any Rating</option>\n          <option value=\"4.5\">4.5+ Stars</option>\n          <option value=\"4.0\">4.0+ Stars</option>\n          <option value=\"3.5\">3.5+ Stars</option>\n        </select>\n\n        <select\n          value={priceFilter}\n          onChange={(e) => setPriceFilter(e.target.value as PriceFilter)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">Any Price</option>\n          <option value=\"low\">Under ₹300</option>\n          <option value=\"medium\">₹300 - ₹800</option>\n          <option value=\"high\">₹800+</option>\n        </select>\n\n        <select\n          value={sortBy}\n          onChange={(e) => setSortBy(e.target.value as SortBy)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"rating\">Highest Rated</option>\n          <option value=\"popularity\">Most Popular</option>\n          <option value=\"distance\">Nearest</option>\n          <option value=\"newest\">Newest</option>\n        </select>\n\n        {hasActiveFilters && (\n          <button\n            type=\"button\"\n            onClick={clearAllFilters}\n            className=\"rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n          >\n            Clear All Filters\n          </button>\n        )}\n      </div>\n\n      {/* Cart Grid */}\n      {visibleCarts.length > 0 ? (\n        <>\n          <div className=\"mt-6 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n            {visibleCarts.map((cart) => {\n              const investment = investmentOpportunities.find((o) => o.cartId === cart.id);\n              return (\n                <div\n                  key={cart.id}\n                  className=\"rounded-lg border border-border-subtle bg-bg-surface shadow-sm overflow-hidden hover:shadow-md transition-shadow flex flex-col\"\n                >\n                  {/* Image */}\n                  <div className=\"relative h-40 bg-bg-sunken\">\n                    <img src={cart.image} alt={cart.name} className=\"h-full w-full object-cover\" />\n                    <div className=\"absolute top-2 left-2 flex gap-1.5\">\n                      <span\n                        className={cn(\n                          'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium backdrop-blur-sm',\n                          cart.isOpen\n                            ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                            : 'bg-red-500/20 text-red-600 dark:text-red-400'\n                        )}\n                      >\n                        {cart.isOpen ? 'Open' : 'Closed'}\n                      </span>\n                      {cart.isVerified && (\n                        <span className=\"inline-flex items-center gap-0.5 rounded-full bg-blue-500/20 px-2 py-0.5 text-xs font-medium text-blue-600 dark:text-blue-400 backdrop-blur-sm\">\n                          <CheckCircle2 className=\"h-3 w-3\" />\n                          Verified\n                        </span>\n                      )}\n                    </div>\n                    <div className=\"absolute top-2 right-2\">\n                      <span className=\"rounded-full bg-black/50 px-2 py-0.5 text-xs text-white backdrop-blur-sm\">\n                        {cart.estimatedTime} min\n                      </span>\n                    </div>\n                  </div>\n\n                  {/* Details */}\n                  <div className=\"flex flex-col flex-1 p-4\">\n                    <div className=\"flex items-start justify-between gap-2 mb-1\">\n                      <h3 className=\"text-sm font-semibold text-text-primary truncate flex-1\">\n                        {cart.name}\n                      </h3>\n                      <div className=\"flex items-center gap-1 shrink-0\">\n                        <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n                        <span className=\"text-xs font-medium text-text-primary\">{cart.rating}</span>\n                        <span className=\"text-xs text-text-secondary\">({cart.totalRatings})</span>\n                      </div>\n                    </div>\n\n                    <p className=\"text-xs text-text-secondary mb-2\">{cart.category}</p>\n\n                    <div className=\"flex items-center gap-3 text-xs text-text-secondary mb-2\">\n                      <span className=\"flex items-center gap-1\">\n                        <MapPin className=\"h-3 w-3\" />\n                        {cart.location?.address?.split(',')[0] || 'Unknown'}\n                      </span>\n                    </div>\n\n                    <div className=\"flex items-center gap-3 text-xs text-text-secondary mb-3\">\n                      {cart.averageOrderValue && (\n                        <span>\n                          Avg {formatCurrency(cart.averageOrderValue, { minimumFractionDigits: 0 })}\n                        </span>\n                      )}\n                      <span className=\"flex items-center gap-1\">\n                        <MapPin className=\"h-3 w-3\" />\n                        {formatDistance(cart.distance)}\n                      </span>\n                    </div>\n\n                    {/* Scheduled Stop Info */}\n                    {cart.serviceTypes?.includes('appointment') && (\n                      <div className=\"mb-3 rounded-md bg-blue-500/10 border border-blue-500/20 p-2\">\n                        <div className=\"flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400\">\n                          <Calendar className=\"h-3 w-3\" />\n                          <span className=\"font-medium\">Appointment available</span>\n                        </div>\n                      </div>\n                    )}\n\n                    {/* Direct Service Info */}\n                    {cart.serviceTypes?.includes('direct_service') && (\n                      <div className=\"mb-3 rounded-md bg-purple-500/10 border border-purple-500/20 p-2\">\n                        <div className=\"flex items-center gap-1 text-xs text-purple-600 dark:text-purple-400\">\n                          <Home className=\"h-3 w-3\" />\n                          <span className=\"font-medium\">Direct Service Available</span>\n                        </div>\n                      </div>\n                    )}\n\n                    {/* Tags */}\n                    {cart.serviceTypes && cart.serviceTypes.length > 0 && (\n                      <div className=\"flex flex-wrap gap-1 mb-3\">\n                        {cart.serviceTypes.slice(0, 3).map((tag: string) => (\n                          <span\n                            key={tag}\n                            className=\"rounded-full bg-bg-sunken px-2 py-0.5 text-[10px] text-text-secondary\"\n                          >\n                            {tag.replace(/_/g, ' ')}\n                          </span>\n                        ))}\n                      </div>\n                    )}\n\n                    <div className=\"mt-auto flex gap-2\">\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/cart/${cart.id}`)}\n                        disabled={!cart.isOpen}\n                        className={cn(\n                          'flex-1 rounded-lg py-2 text-xs font-medium transition-opacity',\n                          cart.isOpen\n                            ? 'bg-foreground text-background hover:opacity-90'\n                            : 'bg-bg-sunken text-text-secondary cursor-not-allowed'\n                        )}\n                      >\n                        {cart.isOpen ? 'View Services' : 'Closed'}\n                      </button>\n\n                      {cart.serviceTypes?.includes('direct_service') && (\n                        <button\n                          type=\"button\"\n                          onClick={() => navigateTo(`/customer/cart/${cart.id}`)}\n                          className=\"rounded-lg border border-border-subtle px-2 py-2 text-xs text-text-primary hover:bg-accent transition-colors\"\n                          title=\"Book Direct Service\"\n                        >\n                          <Home className=\"h-3.5 w-3.5\" />\n                        </button>\n                      )}\n\n                      {investment && (\n                        <button\n                          type=\"button\"\n                          onClick={() =>\n                            alert('Investment opportunity available! View in Investor section.')\n                          }\n                          className=\"rounded-lg border border-green-500/30 bg-green-500/10 px-2 py-2 text-xs text-green-600 dark:text-green-400 hover:bg-green-500/20 transition-colors\"\n                          title=\"Investment Opportunity\"\n                        >\n                          <TrendingUp className=\"h-3.5 w-3.5\" />\n                        </button>\n                      )}\n\n                      <button\n                        type=\"button\"\n                        onClick={() => {\n                          setSelectedCartInfo(cart);\n                          setShowCartInfo(true);\n                        }}\n                        className=\"rounded-lg border border-border-subtle px-2 py-2 text-xs text-text-primary hover:bg-accent transition-colors\"\n                        title=\"Cart Info\"\n                      >\n                        <Info className=\"h-3.5 w-3.5\" />\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n\n          {/* Load More */}\n          {hasMore && (\n            <div className=\"mt-8 text-center\">\n              <button\n                type=\"button\"\n                onClick={() => setVisibleCount((prev) => prev + 9)}\n                className=\"rounded-lg border border-border-subtle px-6 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                Load More Carts\n              </button>\n            </div>\n          )}\n        </>\n      ) : (\n        <div className=\"mt-6\">\n          <EmptyState\n            icon={<Search className=\"h-12 w-12\" />}\n            title=\"No carts found\"\n            description={\n              searchQuery\n                ? `No results for \"${searchQuery}\". Try a different search term.`\n                : 'No carts available with these filters.'\n            }\n            action={\n              <button\n                type=\"button\"\n                onClick={clearAllFilters}\n                className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n              >\n                Clear Filters\n              </button>\n            }\n          />\n        </div>\n      )}\n\n      {/* Cart Info Modal */}\n      {showCartInfo && selectedCartInfo && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-2xl max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface\">\n            <div className=\"p-5\">\n              <div className=\"flex items-center justify-between mb-4\">\n                <h3 className=\"text-lg font-semibold text-text-primary\">Cart Information</h3>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowCartInfo(false)}\n                  className=\"rounded-md p-1 text-text-secondary hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-5 w-5\" />\n                </button>\n              </div>\n\n              {/* Image */}\n              <div className=\"h-48 rounded-lg overflow-hidden mb-4\">\n                <img\n                  src={selectedCartInfo.image}\n                  alt={selectedCartInfo.name}\n                  className=\"h-full w-full object-cover\"\n                />\n              </div>\n\n              {/* Basic Info */}\n              <h4 className=\"text-xl font-semibold text-text-primary mb-1\">\n                {selectedCartInfo.name}\n              </h4>\n              <div className=\"flex flex-wrap items-center gap-3 mb-4\">\n                <div className=\"flex items-center gap-1\">\n                  <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n                  <span className=\"text-sm font-medium\">{selectedCartInfo.rating}</span>\n                  <span className=\"text-xs text-text-secondary\">\n                    ({selectedCartInfo.totalRatings} reviews)\n                  </span>\n                </div>\n                <span\n                  className={cn(\n                    'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                    selectedCartInfo.isOpen\n                      ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                      : 'bg-red-500/20 text-red-600 dark:text-red-400'\n                  )}\n                >\n                  {selectedCartInfo.isOpen ? 'Open' : 'Closed'}\n                </span>\n              </div>\n\n              {/* Details Grid */}\n              <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 mb-4\">\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <MapPin className=\"h-3 w-3\" /> Location\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {selectedCartInfo.location.address}\n                  </p>\n                </div>\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <Tag className=\"h-3 w-3\" /> Category\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">{selectedCartInfo.category}</p>\n                </div>\n                {selectedCartInfo.averageOrderValue && (\n                  <div className=\"rounded-md bg-bg-sunken p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary\">Average Order</p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {formatCurrency(selectedCartInfo.averageOrderValue, {\n                        minimumFractionDigits: 0,\n                      })}\n                    </p>\n                  </div>\n                )}\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <Clock className=\"h-3 w-3\" /> Estimated Time\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {selectedCartInfo.estimatedTime} minutes\n                  </p>\n                </div>\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary\">Distance</p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {formatDistance(selectedCartInfo.distance)}\n                  </p>\n                </div>\n                {selectedCartInfo.isVerified && (\n                  <div className=\"rounded-md bg-bg-sunken p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                      <CheckCircle2 className=\"h-3 w-3\" /> Verification\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">Verified cart</p>\n                  </div>\n                )}\n              </div>\n\n              {/* Service Types */}\n              {selectedCartInfo.serviceTypes && selectedCartInfo.serviceTypes.length > 0 && (\n                <div className=\"mb-4\">\n                  <p className=\"text-xs font-medium text-text-secondary mb-2\">Service Types</p>\n                  <div className=\"flex flex-wrap gap-2\">\n                    {(selectedCartInfo.serviceTypes as string[]).map((type: string) => (\n                      <span\n                        key={type}\n                        className=\"rounded-full bg-bg-sunken px-2.5 py-1 text-xs text-text-secondary capitalize\"\n                      >\n                        {type.replace(/_/g, ' ')}\n                      </span>\n                    ))}\n                  </div>\n                </div>\n              )}\n\n              {/* Business Hours */}\n              {selectedCartInfo.businessHours &&\n                Object.keys(selectedCartInfo.businessHours).length > 0 && (\n                  <div className=\"mb-4\">\n                    <p className=\"text-xs font-medium text-text-secondary mb-2\">\n                      Operating Hours\n                    </p>\n                    <div className=\"space-y-1\">\n                      {Object.entries(selectedCartInfo.businessHours as Record<string, any>).map(\n                        ([day, hours]) => (\n                          <div key={day} className=\"flex justify-between text-xs\">\n                            <span className=\"capitalize text-text-primary\">{day}</span>\n                            <span className=\"text-text-secondary\">\n                              {hours.isOpen ? `${hours.open} - ${hours.close}` : 'Closed'}\n                            </span>\n                          </div>\n                        )\n                      )}\n                    </div>\n                  </div>\n                )}\n\n              {/* Actions */}\n              <div className=\"flex gap-3 mt-6\">\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowCartInfo(false);\n                    navigateTo(`/customer/carts/${selectedCartInfo.id}`);\n                  }}\n                  disabled={!selectedCartInfo.isOpen}\n                  className={cn(\n                    'flex-1 rounded-lg py-2.5 text-sm font-medium transition-opacity',\n                    selectedCartInfo.isOpen\n                      ? 'bg-foreground text-background hover:opacity-90'\n                      : 'bg-bg-sunken text-text-secondary cursor-not-allowed'\n                  )}\n                >\n                  {selectedCartInfo.isOpen ? 'View Menu' : 'Currently Closed'}\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowCartInfo(false)}\n                  className=\"rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Close\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CartDiscoveryPage.js","names":[],"sources":["../../../../src/atheletebridge/pages/customer/CartDiscoveryPage.tsx"],"sourcesContent":["/**\n * Cart Discovery Page\n * @module atheletebridge/pages/customer\n *\n * Browse and search service providers (carts) with full filtering:\n * category, rating, price range, sort, search. Grid view with\n * cart info modal, load more, investment indicators, scheduled stops,\n * direct service links, verified badges, and prep time badges.\n */\n\nimport { useState, useMemo } from 'react';\nimport type { MockCart } from '../../types';\nimport {\n  Search,\n  X,\n  Star,\n  MapPin,\n  Clock,\n  CheckCircle2,\n  Info,\n  Home,\n  TrendingUp,\n  Calendar,\n  Tag,\n  Loader2,\n  AlertCircle,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { useProviders, useInvestmentOpportunities } from '../../hooks/useAthleteBridgeApi';\nimport { cn } from '../../utils/cn';\nimport { formatDistance, formatCurrency } from '../../utils/formatters';\n\nconst ALL_CATEGORIES = 'All';\n\ntype RatingFilter = '' | '4.5' | '4.0' | '3.5';\ntype PriceFilter = '' | 'low' | 'medium' | 'high';\ntype SortBy = 'rating' | 'popularity' | 'distance' | 'newest';\n\nexport function CartDiscoveryPage() {\n  const { navigateTo } = useAthleteBridge();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [selectedCategory, setSelectedCategory] = useState<string>(ALL_CATEGORIES);\n  const [ratingFilter, setRatingFilter] = useState<RatingFilter>('');\n  const [priceFilter, setPriceFilter] = useState<PriceFilter>('');\n  const [sortBy, setSortBy] = useState<SortBy>('rating');\n  const [visibleCount, setVisibleCount] = useState(9);\n  const [showCartInfo, setShowCartInfo] = useState(false);\n  const [selectedCartInfo, setSelectedCartInfo] = useState<MockCart | null>(null);\n\n  const { data: providers = [], isLoading, isError } = useProviders();\n  const { data: investmentOpportunities = [] } = useInvestmentOpportunities();\n\n  const categories = useMemo(() => {\n    const cats = new Set<string>();\n    providers.forEach((p) => {\n      if (p.category) cats.add(p.category);\n    });\n    return [ALL_CATEGORIES, ...Array.from(cats)];\n  }, [providers]);\n\n  const filteredCarts = useMemo(() => {\n    let carts = [...providers];\n\n    // Search query\n    if (searchQuery.trim()) {\n      const q = searchQuery.toLowerCase();\n      carts = carts.filter(\n        (c) => c.name.toLowerCase().includes(q) || c.category.toLowerCase().includes(q)\n      );\n    }\n\n    // Category filter\n    if (selectedCategory !== ALL_CATEGORIES) {\n      carts = carts.filter((cart) => cart.category === selectedCategory);\n    }\n\n    // Rating filter\n    if (ratingFilter) {\n      const minRating = parseFloat(ratingFilter);\n      carts = carts.filter((cart) => cart.rating >= minRating);\n    }\n\n    // Price range filter\n    if (priceFilter) {\n      carts = carts.filter((cart) => {\n        const avg = cart.averageOrderValue ?? 0;\n        switch (priceFilter) {\n          case 'low':\n            return avg <= 300;\n          case 'medium':\n            return avg > 300 && avg <= 800;\n          case 'high':\n            return avg > 800;\n          default:\n            return true;\n        }\n      });\n    }\n\n    // Sort\n    switch (sortBy) {\n      case 'rating':\n        carts.sort((a, b) => b.rating - a.rating);\n        break;\n      case 'popularity':\n        carts.sort((a, b) => (b.totalRatings || 0) - (a.totalRatings || 0));\n        break;\n      case 'distance':\n        carts.sort((a, b) => (a.distance || 0) - (b.distance || 0));\n        break;\n      case 'newest':\n        carts.sort(\n          (a, b) => new Date(b.createdAt || 0).getTime() - new Date(a.createdAt || 0).getTime()\n        );\n        break;\n    }\n\n    return carts;\n  }, [providers, searchQuery, selectedCategory, ratingFilter, priceFilter, sortBy]);\n\n  const visibleCarts = filteredCarts.slice(0, visibleCount);\n  const hasMore = visibleCount < filteredCarts.length;\n\n  const hasActiveFilters =\n    selectedCategory !== ALL_CATEGORIES ||\n    ratingFilter !== '' ||\n    priceFilter !== '' ||\n    searchQuery.trim() !== '';\n\n  const clearAllFilters = () => {\n    setSearchQuery('');\n    setSelectedCategory(ALL_CATEGORIES);\n    setRatingFilter('');\n    setPriceFilter('');\n    setSortBy('rating');\n    setVisibleCount(9);\n  };\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Discover Carts\" description=\"Finding services and shops near you...\">\n        <div className=\"flex h-[60vh] items-center justify-center\">\n          <Loader2 className=\"h-8 w-8 animate-spin text-primary\" />\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (isError) {\n    return (\n      <PageLayout title=\"Discover Carts\" description=\"Error loading carts\">\n        <div className=\"flex h-[60vh] flex-col items-center justify-center gap-4\">\n          <AlertCircle className=\"h-12 w-12 text-status-error-text\" />\n          <h2 className=\"text-xl font-semibold\">Error loading service providers</h2>\n          <button\n            type=\"button\"\n            onClick={() => window.location.reload()}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text\"\n          >\n            Retry\n          </button>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Discover Carts\"\n      description=\"Find services and shops near you\"\n      actions={\n        <span className=\"text-sm text-text-secondary\">{filteredCarts.length} carts found</span>\n      }\n    >\n      {/* Search Bar */}\n      <div className=\"relative\">\n        <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n        <input\n          type=\"text\"\n          placeholder=\"Search carts, services, or items...\"\n          value={searchQuery}\n          onChange={(e) => setSearchQuery(e.target.value)}\n          className={cn(\n            'w-full rounded-lg border border-border-subtle bg-bg-surface py-2.5 pl-10 pr-10 text-sm text-text-primary',\n            'placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]'\n          )}\n        />\n        {searchQuery && (\n          <button\n            type=\"button\"\n            onClick={() => setSearchQuery('')}\n            className=\"absolute right-3 top-1/2 -translate-y-1/2 text-text-secondary hover:text-text-primary\"\n          >\n            <X className=\"h-4 w-4\" />\n          </button>\n        )}\n      </div>\n\n      {/* Category Chips */}\n      <div className=\"mt-4 flex flex-wrap gap-2\">\n        {categories.map((category) => (\n          <button\n            key={category}\n            type=\"button\"\n            onClick={() => setSelectedCategory(category)}\n            className={cn(\n              'rounded-full px-3 py-1.5 text-xs font-medium transition-colors',\n              selectedCategory === category\n                ? 'bg-foreground text-background'\n                : 'bg-bg-sunken text-text-secondary hover:bg-accent hover:text-text-primary'\n            )}\n          >\n            {category}\n          </button>\n        ))}\n      </div>\n\n      {/* Filter Row */}\n      <div className=\"mt-4 flex flex-wrap items-center gap-3\">\n        <select\n          value={ratingFilter}\n          onChange={(e) => setRatingFilter(e.target.value as RatingFilter)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">Any Rating</option>\n          <option value=\"4.5\">4.5+ Stars</option>\n          <option value=\"4.0\">4.0+ Stars</option>\n          <option value=\"3.5\">3.5+ Stars</option>\n        </select>\n\n        <select\n          value={priceFilter}\n          onChange={(e) => setPriceFilter(e.target.value as PriceFilter)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">Any Price</option>\n          <option value=\"low\">Under ₹300</option>\n          <option value=\"medium\">₹300 - ₹800</option>\n          <option value=\"high\">₹800+</option>\n        </select>\n\n        <select\n          value={sortBy}\n          onChange={(e) => setSortBy(e.target.value as SortBy)}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-xs text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"rating\">Highest Rated</option>\n          <option value=\"popularity\">Most Popular</option>\n          <option value=\"distance\">Nearest</option>\n          <option value=\"newest\">Newest</option>\n        </select>\n\n        {hasActiveFilters && (\n          <button\n            type=\"button\"\n            onClick={clearAllFilters}\n            className=\"rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-secondary hover:text-text-primary transition-colors\"\n          >\n            Clear All Filters\n          </button>\n        )}\n      </div>\n\n      {/* Cart Grid */}\n      {visibleCarts.length > 0 ? (\n        <>\n          <div className=\"mt-6 grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n            {visibleCarts.map((cart) => {\n              const investment = investmentOpportunities.find((o) => o.cartId === cart.id);\n              return (\n                <div\n                  key={cart.id}\n                  className=\"rounded-lg border border-border-subtle bg-bg-surface shadow-sm overflow-hidden hover:shadow-md transition-shadow flex flex-col\"\n                >\n                  {/* Image */}\n                  <div className=\"relative h-40 bg-bg-sunken\">\n                    <img src={cart.image} alt={cart.name} className=\"h-full w-full object-cover\" />\n                    <div className=\"absolute top-2 left-2 flex gap-1.5\">\n                      <span\n                        className={cn(\n                          'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium backdrop-blur-sm',\n                          cart.isOpen\n                            ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                            : 'bg-red-500/20 text-red-600 dark:text-red-400'\n                        )}\n                      >\n                        {cart.isOpen ? 'Open' : 'Closed'}\n                      </span>\n                      {cart.isVerified && (\n                        <span className=\"inline-flex items-center gap-0.5 rounded-full bg-blue-500/20 px-2 py-0.5 text-xs font-medium text-blue-600 dark:text-blue-400 backdrop-blur-sm\">\n                          <CheckCircle2 className=\"h-3 w-3\" />\n                          Verified\n                        </span>\n                      )}\n                    </div>\n                    <div className=\"absolute top-2 right-2\">\n                      <span className=\"rounded-full bg-black/50 px-2 py-0.5 text-xs text-white backdrop-blur-sm\">\n                        {cart.estimatedTime} min\n                      </span>\n                    </div>\n                  </div>\n\n                  {/* Details */}\n                  <div className=\"flex flex-col flex-1 p-4\">\n                    <div className=\"flex items-start justify-between gap-2 mb-1\">\n                      <h3 className=\"text-sm font-semibold text-text-primary truncate flex-1\">\n                        {cart.name}\n                      </h3>\n                      <div className=\"flex items-center gap-1 shrink-0\">\n                        <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n                        <span className=\"text-xs font-medium text-text-primary\">{cart.rating}</span>\n                        <span className=\"text-xs text-text-secondary\">({cart.totalRatings})</span>\n                      </div>\n                    </div>\n\n                    <p className=\"text-xs text-text-secondary mb-2\">{cart.category}</p>\n\n                    <div className=\"flex items-center gap-3 text-xs text-text-secondary mb-2\">\n                      <span className=\"flex items-center gap-1\">\n                        <MapPin className=\"h-3 w-3\" />\n                        {cart.location?.address?.split(',')[0] || 'Unknown'}\n                      </span>\n                    </div>\n\n                    <div className=\"flex items-center gap-3 text-xs text-text-secondary mb-3\">\n                      {cart.averageOrderValue && (\n                        <span>\n                          Avg {formatCurrency(cart.averageOrderValue, { minimumFractionDigits: 0 })}\n                        </span>\n                      )}\n                      <span className=\"flex items-center gap-1\">\n                        <MapPin className=\"h-3 w-3\" />\n                        {formatDistance(cart.distance)}\n                      </span>\n                    </div>\n\n                    {/* Scheduled Stop Info */}\n                    {cart.serviceTypes?.includes('appointment') && (\n                      <div className=\"mb-3 rounded-md bg-blue-500/10 border border-blue-500/20 p-2\">\n                        <div className=\"flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400\">\n                          <Calendar className=\"h-3 w-3\" />\n                          <span className=\"font-medium\">Appointment available</span>\n                        </div>\n                      </div>\n                    )}\n\n                    {/* Direct Service Info */}\n                    {cart.serviceTypes?.includes('direct_service') && (\n                      <div className=\"mb-3 rounded-md bg-purple-500/10 border border-purple-500/20 p-2\">\n                        <div className=\"flex items-center gap-1 text-xs text-purple-600 dark:text-purple-400\">\n                          <Home className=\"h-3 w-3\" />\n                          <span className=\"font-medium\">Direct Service Available</span>\n                        </div>\n                      </div>\n                    )}\n\n                    {/* Tags */}\n                    {cart.serviceTypes && cart.serviceTypes.length > 0 && (\n                      <div className=\"flex flex-wrap gap-1 mb-3\">\n                        {cart.serviceTypes.slice(0, 3).map((tag: string) => (\n                          <span\n                            key={tag}\n                            className=\"rounded-full bg-bg-sunken px-2 py-0.5 text-[10px] text-text-secondary\"\n                          >\n                            {tag.replace(/_/g, ' ')}\n                          </span>\n                        ))}\n                      </div>\n                    )}\n\n                    <div className=\"mt-auto flex gap-2\">\n                      <button\n                        type=\"button\"\n                        onClick={() => navigateTo(`/customer/cart/${cart.id}`)}\n                        disabled={!cart.isOpen}\n                        className={cn(\n                          'flex-1 rounded-lg py-2 text-xs font-medium transition-opacity',\n                          cart.isOpen\n                            ? 'bg-foreground text-background hover:opacity-90'\n                            : 'bg-bg-sunken text-text-secondary cursor-not-allowed'\n                        )}\n                      >\n                        {cart.isOpen ? 'View Services' : 'Closed'}\n                      </button>\n\n                      {cart.serviceTypes?.includes('direct_service') && (\n                        <button\n                          type=\"button\"\n                          onClick={() => navigateTo(`/customer/cart/${cart.id}`)}\n                          className=\"rounded-lg border border-border-subtle px-2 py-2 text-xs text-text-primary hover:bg-accent transition-colors\"\n                          title=\"Book Direct Service\"\n                        >\n                          <Home className=\"h-3.5 w-3.5\" />\n                        </button>\n                      )}\n\n                      {investment && (\n                        <button\n                          type=\"button\"\n                          onClick={() =>\n                            alert('Investment opportunity available! View in Investor section.')\n                          }\n                          className=\"rounded-lg border border-green-500/30 bg-green-500/10 px-2 py-2 text-xs text-green-600 dark:text-green-400 hover:bg-green-500/20 transition-colors\"\n                          title=\"Investment Opportunity\"\n                        >\n                          <TrendingUp className=\"h-3.5 w-3.5\" />\n                        </button>\n                      )}\n\n                      <button\n                        type=\"button\"\n                        onClick={() => {\n                          setSelectedCartInfo(cart);\n                          setShowCartInfo(true);\n                        }}\n                        className=\"rounded-lg border border-border-subtle px-2 py-2 text-xs text-text-primary hover:bg-accent transition-colors\"\n                        title=\"Cart Info\"\n                      >\n                        <Info className=\"h-3.5 w-3.5\" />\n                      </button>\n                    </div>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n\n          {/* Load More */}\n          {hasMore && (\n            <div className=\"mt-8 text-center\">\n              <button\n                type=\"button\"\n                onClick={() => setVisibleCount((prev) => prev + 9)}\n                className=\"rounded-lg border border-border-subtle px-6 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n              >\n                Load More Carts\n              </button>\n            </div>\n          )}\n        </>\n      ) : (\n        <div className=\"mt-6\">\n          <EmptyState\n            illustration=\"empty-search\"\n            icon={<Search className=\"h-12 w-12\" />}\n            title=\"No carts found\"\n            description={\n              searchQuery\n                ? `No results for \"${searchQuery}\". Try a different search term.`\n                : 'No carts available with these filters.'\n            }\n            action={\n              <button\n                type=\"button\"\n                onClick={clearAllFilters}\n                className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n              >\n                Clear Filters\n              </button>\n            }\n          />\n        </div>\n      )}\n\n      {/* Cart Info Modal */}\n      {showCartInfo && selectedCartInfo && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-2xl max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface\">\n            <div className=\"p-5\">\n              <div className=\"flex items-center justify-between mb-4\">\n                <h3 className=\"text-lg font-semibold text-text-primary\">Cart Information</h3>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowCartInfo(false)}\n                  className=\"rounded-md p-1 text-text-secondary hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-5 w-5\" />\n                </button>\n              </div>\n\n              {/* Image */}\n              <div className=\"h-48 rounded-lg overflow-hidden mb-4\">\n                <img\n                  src={selectedCartInfo.image}\n                  alt={selectedCartInfo.name}\n                  className=\"h-full w-full object-cover\"\n                />\n              </div>\n\n              {/* Basic Info */}\n              <h4 className=\"text-xl font-semibold text-text-primary mb-1\">\n                {selectedCartInfo.name}\n              </h4>\n              <div className=\"flex flex-wrap items-center gap-3 mb-4\">\n                <div className=\"flex items-center gap-1\">\n                  <Star className=\"h-3.5 w-3.5 fill-yellow-400 text-yellow-400\" />\n                  <span className=\"text-sm font-medium\">{selectedCartInfo.rating}</span>\n                  <span className=\"text-xs text-text-secondary\">\n                    ({selectedCartInfo.totalRatings} reviews)\n                  </span>\n                </div>\n                <span\n                  className={cn(\n                    'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium',\n                    selectedCartInfo.isOpen\n                      ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                      : 'bg-red-500/20 text-red-600 dark:text-red-400'\n                  )}\n                >\n                  {selectedCartInfo.isOpen ? 'Open' : 'Closed'}\n                </span>\n              </div>\n\n              {/* Details Grid */}\n              <div className=\"grid grid-cols-1 gap-3 sm:grid-cols-2 mb-4\">\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <MapPin className=\"h-3 w-3\" /> Location\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {selectedCartInfo.location.address}\n                  </p>\n                </div>\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <Tag className=\"h-3 w-3\" /> Category\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">{selectedCartInfo.category}</p>\n                </div>\n                {selectedCartInfo.averageOrderValue && (\n                  <div className=\"rounded-md bg-bg-sunken p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary\">Average Order</p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {formatCurrency(selectedCartInfo.averageOrderValue, {\n                        minimumFractionDigits: 0,\n                      })}\n                    </p>\n                  </div>\n                )}\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                    <Clock className=\"h-3 w-3\" /> Estimated Time\n                  </p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {selectedCartInfo.estimatedTime} minutes\n                  </p>\n                </div>\n                <div className=\"rounded-md bg-bg-sunken p-3\">\n                  <p className=\"text-xs font-medium text-text-secondary\">Distance</p>\n                  <p className=\"mt-1 text-sm text-text-primary\">\n                    {formatDistance(selectedCartInfo.distance)}\n                  </p>\n                </div>\n                {selectedCartInfo.isVerified && (\n                  <div className=\"rounded-md bg-bg-sunken p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary flex items-center gap-1\">\n                      <CheckCircle2 className=\"h-3 w-3\" /> Verification\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">Verified cart</p>\n                  </div>\n                )}\n              </div>\n\n              {/* Service Types */}\n              {selectedCartInfo.serviceTypes && selectedCartInfo.serviceTypes.length > 0 && (\n                <div className=\"mb-4\">\n                  <p className=\"text-xs font-medium text-text-secondary mb-2\">Service Types</p>\n                  <div className=\"flex flex-wrap gap-2\">\n                    {(selectedCartInfo.serviceTypes as string[]).map((type: string) => (\n                      <span\n                        key={type}\n                        className=\"rounded-full bg-bg-sunken px-2.5 py-1 text-xs text-text-secondary capitalize\"\n                      >\n                        {type.replace(/_/g, ' ')}\n                      </span>\n                    ))}\n                  </div>\n                </div>\n              )}\n\n              {/* Business Hours */}\n              {selectedCartInfo.businessHours &&\n                Object.keys(selectedCartInfo.businessHours).length > 0 && (\n                  <div className=\"mb-4\">\n                    <p className=\"text-xs font-medium text-text-secondary mb-2\">Operating Hours</p>\n                    <div className=\"space-y-1\">\n                      {Object.entries(selectedCartInfo.businessHours as Record<string, any>).map(\n                        ([day, hours]) => (\n                          <div key={day} className=\"flex justify-between text-xs\">\n                            <span className=\"capitalize text-text-primary\">{day}</span>\n                            <span className=\"text-text-secondary\">\n                              {hours.isOpen ? `${hours.open} - ${hours.close}` : 'Closed'}\n                            </span>\n                          </div>\n                        )\n                      )}\n                    </div>\n                  </div>\n                )}\n\n              {/* Actions */}\n              <div className=\"flex gap-3 mt-6\">\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowCartInfo(false);\n                    navigateTo(`/customer/carts/${selectedCartInfo.id}`);\n                  }}\n                  disabled={!selectedCartInfo.isOpen}\n                  className={cn(\n                    'flex-1 rounded-lg py-2.5 text-sm font-medium transition-opacity',\n                    selectedCartInfo.isOpen\n                      ? 'bg-foreground text-background hover:opacity-90'\n                      : 'bg-bg-sunken text-text-secondary cursor-not-allowed'\n                  )}\n                >\n                  {selectedCartInfo.isOpen ? 'View Menu' : 'Currently Closed'}\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => setShowCartInfo(false)}\n                  className=\"rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Close\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/atheletebridge/pages/customer/DirectServiceBookingPage.js

@@ -48,6 +48,7 @@ function k() {
 	if (!j) return /* @__PURE__ */ w(n, {
 		title: "Cart Not Found",
 		children: /* @__PURE__ */ w(r, {
+			illustration: "empty-generic",
 			icon: /* @__PURE__ */ w(h, { className: "h-12 w-12" }),
 			title: "Service not available",
 			description: "Direct service is not available for this cart.",

package/dist/atheletebridge/pages/customer/DirectServiceBookingPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DirectServiceBookingPage.js","names":[],"sources":["../../../../src/atheletebridge/pages/customer/DirectServiceBookingPage.tsx"],"sourcesContent":["/**\n * Direct Service Booking Page\n * @module atheletebridge/pages/customer\n *\n * 4-step wizard: Location > Details > Payment > Confirmation.\n * Progress indicator, step validation, geolocation button,\n * address fields, preferred time slot selector (30-min slots),\n * urgent booking checkbox, payment method selection,\n * payment summary, confirmation step with checkmark/IDs/next steps.\n */\n\nimport { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n  ArrowLeft,\n  ArrowRight,\n  MapPin,\n  Calendar,\n  Clock,\n  CreditCard,\n  Smartphone,\n  Wallet,\n  CheckCircle2,\n  AlertCircle,\n  Navigation,\n  Phone,\n  Home,\n  Loader2,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { getCartById } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency } from '../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype Step = 'location' | 'details' | 'payment' | 'confirmation';\nconst STEPS: Step[] = ['location', 'details', 'payment', 'confirmation'];\nconst STEP_LABELS: Record<Step, string> = {\n  location: 'Location',\n  details: 'Details',\n  payment: 'Payment',\n  confirmation: 'Confirmation',\n};\n\ninterface ServiceLocation {\n  address: string;\n  landmark: string;\n  instructions: string;\n  phoneNumber: string;\n}\n\ninterface BookingDetails {\n  preferredTime: string;\n  specialInstructions: string;\n  isUrgent: boolean;\n}\n\ninterface ConfirmationData {\n  bookingId: string;\n  transactionId: string;\n  estimatedArrival: string;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction generateTimeSlots(): { value: string; label: string }[] {\n  const slots: { value: string; label: string }[] = [];\n  const now = new Date();\n  const start = new Date(now.getTime() + 30 * 60000); // 30 min from now\n\n  for (let i = 0; i < 8; i++) {\n    const time = new Date(start.getTime() + i * 30 * 60000);\n    const val = time.toTimeString().slice(0, 5);\n    const lbl = time.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n    slots.push({ value: val, label: lbl });\n  }\n\n  return slots;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function DirectServiceBookingPage() {\n  const { cartId } = useParams<{ cartId: string }>();\n  const { navigateTo } = useAthleteBridge();\n\n  const cart = useMemo(() => (cartId ? getCartById(cartId) : undefined), [cartId]);\n\n  const [step, setStep] = useState<Step>('location');\n  const [submitting, setSubmitting] = useState(false);\n\n  // Location step\n  const [location, setLocation] = useState<ServiceLocation>({\n    address: '',\n    landmark: '',\n    instructions: '',\n    phoneNumber: '',\n  });\n\n  // Details step\n  const [details, setDetails] = useState<BookingDetails>({\n    preferredTime: '',\n    specialInstructions: '',\n    isUrgent: false,\n  });\n\n  // Payment step\n  const [paymentMethod, setPaymentMethod] = useState<'upi' | 'card' | 'wallet'>('upi');\n\n  // Confirmation data\n  const [confirmation, setConfirmation] = useState<ConfirmationData | null>(null);\n\n  // Mock pricing\n  const advancePayment = 100;\n  const serviceFee = 50;\n  const balancePayment = serviceFee;\n  const totalAmount = advancePayment + serviceFee;\n\n  // --- Not found ---\n  if (!cart) {\n    return (\n      <PageLayout title=\"Cart Not Found\">\n        <EmptyState\n          icon={<Home className=\"h-12 w-12\" />}\n          title=\"Service not available\"\n          description=\"Direct service is not available for this cart.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/customer/carts')}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Browse Carts\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const timeSlots = generateTimeSlots();\n  const stepIndex = STEPS.indexOf(step);\n\n  // --- Geolocation ---\n  const handleGetLocation = () => {\n    if (!navigator.geolocation) {\n      alert('Geolocation is not supported by this browser.');\n      return;\n    }\n    navigator.geolocation.getCurrentPosition(\n      () => {\n        setLocation((p) => ({ ...p, address: p.address || 'Current location detected' }));\n        alert('Location detected successfully!');\n      },\n      () => {\n        alert('Failed to get your location. Please enter address manually.');\n      }\n    );\n  };\n\n  // --- Validation ---\n  const validateLocation = (): boolean => {\n    if (!location.address.trim()) {\n      alert('Please enter your address.');\n      return false;\n    }\n    if (!location.phoneNumber.trim()) {\n      alert('Please enter your phone number.');\n      return false;\n    }\n    return true;\n  };\n\n  const validateDetails = (): boolean => {\n    if (!details.preferredTime) {\n      alert('Please select a preferred time slot.');\n      return false;\n    }\n    return true;\n  };\n\n  // --- Navigation ---\n  const nextStep = () => {\n    if (step === 'location' && validateLocation()) setStep('details');\n    else if (step === 'details' && validateDetails()) setStep('payment');\n    else if (step === 'payment') handleBookingSubmit();\n  };\n\n  const prevStep = () => {\n    if (step === 'details') setStep('location');\n    else if (step === 'payment') setStep('details');\n  };\n\n  // --- Submit ---\n  const handleBookingSubmit = () => {\n    setSubmitting(true);\n    setTimeout(() => {\n      const bookingId = `BK-${Date.now()}`;\n      const transactionId = `TXN-${Date.now()}`;\n      const estimatedArrival = new Date(Date.now() + 30 * 60000).toISOString();\n      setConfirmation({ bookingId, transactionId, estimatedArrival });\n      setStep('confirmation');\n      setSubmitting(false);\n    }, 1500);\n  };\n\n  return (\n    <PageLayout\n      title={\n        <div className=\"flex items-center gap-3\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n            className=\"rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n          >\n            <ArrowLeft className=\"h-5 w-5\" />\n          </button>\n          <div>\n            <span>Book Direct Service</span>\n            <p className=\"text-xs font-normal text-text-secondary\">{cart.name}</p>\n          </div>\n        </div>\n      }\n    >\n      {/* Progress Indicator */}\n      <div className=\"flex items-center justify-between mb-6 px-2\">\n        {STEPS.map((s, i) => {\n          const isCompleted = i < stepIndex;\n          const isCurrent = s === step;\n          return (\n            <div key={s} className=\"flex items-center\">\n              <div className=\"flex flex-col items-center\">\n                <div\n                  className={cn(\n                    'flex h-8 w-8 items-center justify-center rounded-full text-xs font-medium',\n                    isCompleted\n                      ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                      : isCurrent\n                        ? 'bg-foreground text-background'\n                        : 'bg-bg-sunken text-text-secondary'\n                  )}\n                >\n                  {isCompleted ? <CheckCircle2 className=\"h-4 w-4\" /> : i + 1}\n                </div>\n                <span\n                  className={cn(\n                    'mt-1 text-[10px]',\n                    isCurrent ? 'font-medium text-text-primary' : 'text-text-secondary'\n                  )}\n                >\n                  {STEP_LABELS[s]}\n                </span>\n              </div>\n              {i < STEPS.length - 1 && (\n                <div\n                  className={cn(\n                    'mx-2 h-0.5 w-8 sm:w-16',\n                    isCompleted ? 'bg-green-500/30' : 'bg-border'\n                  )}\n                />\n              )}\n            </div>\n          );\n        })}\n      </div>\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n        {/* Main Content */}\n        <div className=\"lg:col-span-2\">\n          {/* Step 1: Location */}\n          {step === 'location' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <MapPin className=\"h-4 w-4\" />\n                Service Location\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Where should the cart come?</p>\n\n              <div className=\"space-y-4\">\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Your Address <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"flex gap-2\">\n                    <input\n                      type=\"text\"\n                      placeholder=\"Enter your full address\"\n                      value={location.address}\n                      onChange={(e) => setLocation((p) => ({ ...p, address: e.target.value }))}\n                      className=\"flex-1 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                    <button\n                      type=\"button\"\n                      onClick={handleGetLocation}\n                      className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n                    >\n                      <Navigation className=\"h-3.5 w-3.5\" />\n                      Use Current Location\n                    </button>\n                  </div>\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Nearby Landmark\n                  </label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"e.g., Near Metro Station, Opposite Mall\"\n                    value={location.landmark}\n                    onChange={(e) => setLocation((p) => ({ ...p, landmark: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Instructions for Cart Owner\n                  </label>\n                  <textarea\n                    rows={3}\n                    placeholder=\"Any specific instructions to help us find you...\"\n                    value={location.instructions}\n                    onChange={(e) => setLocation((p) => ({ ...p, instructions: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Phone Number <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"relative\">\n                    <Phone className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n                    <input\n                      type=\"tel\"\n                      placeholder=\"Enter your phone number\"\n                      value={location.phoneNumber}\n                      onChange={(e) => setLocation((p) => ({ ...p, phoneNumber: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Step 2: Details */}\n          {step === 'details' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <Calendar className=\"h-4 w-4\" />\n                Booking Details\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Choose your preferred timing</p>\n\n              <div className=\"space-y-4\">\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Preferred Time Slot <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"grid grid-cols-4 gap-2\">\n                    {timeSlots.map((slot) => (\n                      <button\n                        key={slot.value}\n                        type=\"button\"\n                        onClick={() => setDetails((p) => ({ ...p, preferredTime: slot.value }))}\n                        className={cn(\n                          'rounded-lg border py-2 px-2 text-xs font-medium transition-colors',\n                          details.preferredTime === slot.value\n                            ? 'border-foreground bg-accent text-text-primary'\n                            : 'border-border-subtle text-text-secondary hover:bg-accent hover:text-text-primary'\n                        )}\n                      >\n                        {slot.label}\n                      </button>\n                    ))}\n                  </div>\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Special Instructions\n                  </label>\n                  <textarea\n                    rows={3}\n                    placeholder=\"Any special requests or dietary preferences...\"\n                    value={details.specialInstructions}\n                    onChange={(e) =>\n                      setDetails((p) => ({ ...p, specialInstructions: e.target.value }))\n                    }\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                <label className=\"flex items-center gap-2 cursor-pointer\">\n                  <input\n                    type=\"checkbox\"\n                    checked={details.isUrgent}\n                    onChange={(e) => setDetails((p) => ({ ...p, isUrgent: e.target.checked }))}\n                    className=\"h-4 w-4 rounded border-border-subtle\"\n                  />\n                  <span className=\"text-sm text-text-secondary\">\n                    This is urgent (additional charges may apply)\n                  </span>\n                </label>\n              </div>\n            </div>\n          )}\n\n          {/* Step 3: Payment */}\n          {step === 'payment' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <CreditCard className=\"h-4 w-4\" />\n                Advance Payment\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Select your payment method</p>\n\n              <div className=\"space-y-4\">\n                {/* Info callout */}\n                <div className=\"flex items-start gap-2 rounded-lg border border-blue-500/20 bg-blue-500/5 p-3\">\n                  <AlertCircle className=\"h-4 w-4 text-blue-600 dark:text-blue-400 shrink-0 mt-0.5\" />\n                  <p className=\"text-xs text-blue-700 dark:text-blue-300\">\n                    You need to pay {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}{' '}\n                    in advance to confirm your booking. Pay the remaining when the cart arrives.\n                  </p>\n                </div>\n\n                {/* Payment methods */}\n                <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-3\">\n                  {[\n                    {\n                      value: 'upi' as const,\n                      label: 'UPI',\n                      sub: 'Instant payment',\n                      Icon: Smartphone,\n                    },\n                    {\n                      value: 'card' as const,\n                      label: 'Card',\n                      sub: 'Secure payment',\n                      Icon: CreditCard,\n                    },\n                    {\n                      value: 'wallet' as const,\n                      label: 'Wallet',\n                      sub: 'Quick payment',\n                      Icon: Wallet,\n                    },\n                  ].map(({ value, label, sub, Icon }) => (\n                    <button\n                      key={value}\n                      type=\"button\"\n                      onClick={() => setPaymentMethod(value)}\n                      className={cn(\n                        'rounded-lg border p-3 text-center transition-colors',\n                        paymentMethod === value\n                          ? 'border-foreground bg-accent'\n                          : 'border-border-subtle hover:bg-accent'\n                      )}\n                    >\n                      <Icon className=\"mx-auto h-5 w-5 text-text-secondary mb-1\" />\n                      <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n                      <p className=\"text-[10px] text-text-secondary\">{sub}</p>\n                    </button>\n                  ))}\n                </div>\n\n                {/* Payment Summary */}\n                <div className=\"rounded-lg bg-bg-sunken p-4\">\n                  <h3 className=\"text-sm font-medium text-text-primary mb-2\">Payment Summary</h3>\n                  <div className=\"space-y-2 text-sm\">\n                    <div className=\"flex justify-between\">\n                      <span className=\"text-text-secondary\">Advance Payment:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                    <div className=\"flex justify-between\">\n                      <span className=\"text-text-secondary\">Service Fee:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                    <div className=\"flex justify-between text-text-secondary\">\n                      <span>Balance Payment (at arrival):</span>\n                      <span>{formatCurrency(balancePayment, { minimumFractionDigits: 0 })}</span>\n                    </div>\n                    <div className=\"flex justify-between border-t border-border-subtle pt-2 font-semibold\">\n                      <span className=\"text-text-primary\">Total Amount:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(totalAmount, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Step 4: Confirmation */}\n          {step === 'confirmation' && confirmation && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              {/* Success header */}\n              <div className=\"text-center mb-6\">\n                <div className=\"mx-auto mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-green-500/10\">\n                  <CheckCircle2 className=\"h-7 w-7 text-green-600 dark:text-green-400\" />\n                </div>\n                <h2 className=\"text-lg font-semibold text-text-primary mb-1\">Booking Confirmed!</h2>\n                <p className=\"text-sm text-text-secondary\">\n                  Your direct service booking has been confirmed and payment processed.\n                </p>\n              </div>\n\n              {/* Booking details */}\n              <div className=\"rounded-lg bg-bg-sunken p-4 mb-4\">\n                <h3 className=\"text-sm font-medium text-text-primary mb-3\">Booking Details</h3>\n                <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm\">\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Booking ID</span>\n                    <p className=\"font-mono text-xs text-text-primary\">{confirmation.bookingId}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Est. Arrival</span>\n                    <p className=\"text-text-primary\">\n                      {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n                        hour: '2-digit',\n                        minute: '2-digit',\n                      })}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Location</span>\n                    <p className=\"text-text-primary truncate\">{location.address}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Phone</span>\n                    <p className=\"text-text-primary\">{location.phoneNumber}</p>\n                  </div>\n                </div>\n              </div>\n\n              {/* Payment details */}\n              <div className=\"rounded-lg border border-green-500/20 bg-green-500/5 p-4 mb-4\">\n                <h3 className=\"text-sm font-medium text-green-600 dark:text-green-400 mb-2 flex items-center gap-2\">\n                  <CheckCircle2 className=\"h-4 w-4\" />\n                  Payment Processed\n                </h3>\n                <div className=\"grid grid-cols-2 gap-3 text-sm\">\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Transaction ID</span>\n                    <p className=\"font-mono text-xs text-text-primary\">\n                      {confirmation.transactionId}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Advance Paid</span>\n                    <p className=\"font-medium text-text-primary\">\n                      {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Method</span>\n                    <p className=\"capitalize text-text-primary\">{paymentMethod}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Status</span>\n                    <p className=\"font-medium text-green-600 dark:text-green-400\">Paid</p>\n                  </div>\n                </div>\n              </div>\n\n              {/* Next Steps */}\n              <div className=\"rounded-lg border border-blue-500/20 bg-blue-500/5 p-4 mb-6\">\n                <h3 className=\"text-sm font-medium text-blue-600 dark:text-blue-400 mb-2\">\n                  Next Steps\n                </h3>\n                <div className=\"space-y-2 text-xs text-blue-700 dark:text-blue-300\">\n                  <div className=\"flex items-start gap-2\">\n                    <CheckCircle2 className=\"h-3.5 w-3.5 text-green-600 mt-0.5 shrink-0\" />\n                    <span>\n                      Payment confirmed -{' '}\n                      {formatCurrency(advancePayment, { minimumFractionDigits: 0 })} paid\n                    </span>\n                  </div>\n                  <div className=\"flex items-start gap-2\">\n                    <Clock className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n                    <span>\n                      Cart will arrive around{' '}\n                      {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n                        hour: '2-digit',\n                        minute: '2-digit',\n                      })}\n                    </span>\n                  </div>\n                  <div className=\"flex items-start gap-2\">\n                    <CreditCard className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n                    <span>\n                      Pay remaining {formatCurrency(balancePayment, { minimumFractionDigits: 0 })}{' '}\n                      when cart arrives\n                    </span>\n                  </div>\n                </div>\n              </div>\n\n              {/* Action buttons */}\n              <div className=\"flex gap-3\">\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/customer/bookings/${confirmation.bookingId}`)}\n                  className=\"flex-1 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  View Booking\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo('/customer/carts')}\n                  className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Browse More\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Navigation Buttons */}\n          {step !== 'confirmation' && (\n            <div className=\"flex justify-between mt-5\">\n              <button\n                type=\"button\"\n                onClick={prevStep}\n                disabled={step === 'location'}\n                className={cn(\n                  'flex items-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary transition-colors',\n                  step === 'location' ? 'opacity-40 cursor-not-allowed' : 'hover:bg-accent'\n                )}\n              >\n                <ArrowLeft className=\"h-4 w-4\" />\n                Previous\n              </button>\n              <button\n                type=\"button\"\n                onClick={nextStep}\n                disabled={submitting}\n                className={cn(\n                  'flex items-center gap-2 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background transition-opacity',\n                  submitting ? 'opacity-60 cursor-not-allowed' : 'hover:opacity-90'\n                )}\n              >\n                {submitting ? (\n                  <>\n                    <Loader2 className=\"h-4 w-4 animate-spin\" />\n                    {step === 'payment' ? 'Processing Payment...' : 'Processing...'}\n                  </>\n                ) : (\n                  <>\n                    {step === 'payment' ? 'Confirm & Pay' : 'Next'}\n                    <ArrowRight className=\"h-4 w-4\" />\n                  </>\n                )}\n              </button>\n            </div>\n          )}\n        </div>\n\n        {/* Sidebar: Service Summary */}\n        <div className=\"lg:col-span-1\">\n          <div className=\"sticky top-6 rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <h3 className=\"text-base font-semibold text-text-primary mb-4\">Service Summary</h3>\n\n            <div className=\"flex items-center gap-3 mb-4\">\n              <img src={cart.image} alt={cart.name} className=\"h-12 w-12 rounded-lg object-cover\" />\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">{cart.name}</p>\n                <p className=\"text-xs text-text-secondary\">{cart.category}</p>\n              </div>\n            </div>\n\n            <div className=\"space-y-2 text-sm border-t border-border-subtle pt-3\">\n              <div className=\"flex justify-between\">\n                <span className=\"text-text-secondary\">Service Fee:</span>\n                <span className=\"text-text-primary\">\n                  {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-text-secondary\">Advance Payment:</span>\n                <span className=\"font-medium text-text-primary\">\n                  {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-2 mt-3 pt-3 border-t border-border-subtle text-green-600 dark:text-green-400\">\n              <CheckCircle2 className=\"h-3.5 w-3.5\" />\n              <span className=\"text-xs\">Pay remaining amount at cart</span>\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DirectServiceBookingPage.js","names":[],"sources":["../../../../src/atheletebridge/pages/customer/DirectServiceBookingPage.tsx"],"sourcesContent":["/**\n * Direct Service Booking Page\n * @module atheletebridge/pages/customer\n *\n * 4-step wizard: Location > Details > Payment > Confirmation.\n * Progress indicator, step validation, geolocation button,\n * address fields, preferred time slot selector (30-min slots),\n * urgent booking checkbox, payment method selection,\n * payment summary, confirmation step with checkmark/IDs/next steps.\n */\n\nimport { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n  ArrowLeft,\n  ArrowRight,\n  MapPin,\n  Calendar,\n  Clock,\n  CreditCard,\n  Smartphone,\n  Wallet,\n  CheckCircle2,\n  AlertCircle,\n  Navigation,\n  Phone,\n  Home,\n  Loader2,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useAthleteBridge } from '../../context/AthleteBridgeContext';\nimport { getCartById } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency } from '../../utils/formatters';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ntype Step = 'location' | 'details' | 'payment' | 'confirmation';\nconst STEPS: Step[] = ['location', 'details', 'payment', 'confirmation'];\nconst STEP_LABELS: Record<Step, string> = {\n  location: 'Location',\n  details: 'Details',\n  payment: 'Payment',\n  confirmation: 'Confirmation',\n};\n\ninterface ServiceLocation {\n  address: string;\n  landmark: string;\n  instructions: string;\n  phoneNumber: string;\n}\n\ninterface BookingDetails {\n  preferredTime: string;\n  specialInstructions: string;\n  isUrgent: boolean;\n}\n\ninterface ConfirmationData {\n  bookingId: string;\n  transactionId: string;\n  estimatedArrival: string;\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nfunction generateTimeSlots(): { value: string; label: string }[] {\n  const slots: { value: string; label: string }[] = [];\n  const now = new Date();\n  const start = new Date(now.getTime() + 30 * 60000); // 30 min from now\n\n  for (let i = 0; i < 8; i++) {\n    const time = new Date(start.getTime() + i * 30 * 60000);\n    const val = time.toTimeString().slice(0, 5);\n    const lbl = time.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n    slots.push({ value: val, label: lbl });\n  }\n\n  return slots;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function DirectServiceBookingPage() {\n  const { cartId } = useParams<{ cartId: string }>();\n  const { navigateTo } = useAthleteBridge();\n\n  const cart = useMemo(() => (cartId ? getCartById(cartId) : undefined), [cartId]);\n\n  const [step, setStep] = useState<Step>('location');\n  const [submitting, setSubmitting] = useState(false);\n\n  // Location step\n  const [location, setLocation] = useState<ServiceLocation>({\n    address: '',\n    landmark: '',\n    instructions: '',\n    phoneNumber: '',\n  });\n\n  // Details step\n  const [details, setDetails] = useState<BookingDetails>({\n    preferredTime: '',\n    specialInstructions: '',\n    isUrgent: false,\n  });\n\n  // Payment step\n  const [paymentMethod, setPaymentMethod] = useState<'upi' | 'card' | 'wallet'>('upi');\n\n  // Confirmation data\n  const [confirmation, setConfirmation] = useState<ConfirmationData | null>(null);\n\n  // Mock pricing\n  const advancePayment = 100;\n  const serviceFee = 50;\n  const balancePayment = serviceFee;\n  const totalAmount = advancePayment + serviceFee;\n\n  // --- Not found ---\n  if (!cart) {\n    return (\n      <PageLayout title=\"Cart Not Found\">\n        <EmptyState\n          illustration=\"empty-generic\"\n          icon={<Home className=\"h-12 w-12\" />}\n          title=\"Service not available\"\n          description=\"Direct service is not available for this cart.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/customer/carts')}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Browse Carts\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const timeSlots = generateTimeSlots();\n  const stepIndex = STEPS.indexOf(step);\n\n  // --- Geolocation ---\n  const handleGetLocation = () => {\n    if (!navigator.geolocation) {\n      alert('Geolocation is not supported by this browser.');\n      return;\n    }\n    navigator.geolocation.getCurrentPosition(\n      () => {\n        setLocation((p) => ({ ...p, address: p.address || 'Current location detected' }));\n        alert('Location detected successfully!');\n      },\n      () => {\n        alert('Failed to get your location. Please enter address manually.');\n      }\n    );\n  };\n\n  // --- Validation ---\n  const validateLocation = (): boolean => {\n    if (!location.address.trim()) {\n      alert('Please enter your address.');\n      return false;\n    }\n    if (!location.phoneNumber.trim()) {\n      alert('Please enter your phone number.');\n      return false;\n    }\n    return true;\n  };\n\n  const validateDetails = (): boolean => {\n    if (!details.preferredTime) {\n      alert('Please select a preferred time slot.');\n      return false;\n    }\n    return true;\n  };\n\n  // --- Navigation ---\n  const nextStep = () => {\n    if (step === 'location' && validateLocation()) setStep('details');\n    else if (step === 'details' && validateDetails()) setStep('payment');\n    else if (step === 'payment') handleBookingSubmit();\n  };\n\n  const prevStep = () => {\n    if (step === 'details') setStep('location');\n    else if (step === 'payment') setStep('details');\n  };\n\n  // --- Submit ---\n  const handleBookingSubmit = () => {\n    setSubmitting(true);\n    setTimeout(() => {\n      const bookingId = `BK-${Date.now()}`;\n      const transactionId = `TXN-${Date.now()}`;\n      const estimatedArrival = new Date(Date.now() + 30 * 60000).toISOString();\n      setConfirmation({ bookingId, transactionId, estimatedArrival });\n      setStep('confirmation');\n      setSubmitting(false);\n    }, 1500);\n  };\n\n  return (\n    <PageLayout\n      title={\n        <div className=\"flex items-center gap-3\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo(`/customer/carts/${cart.id}`)}\n            className=\"rounded-md p-1 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n          >\n            <ArrowLeft className=\"h-5 w-5\" />\n          </button>\n          <div>\n            <span>Book Direct Service</span>\n            <p className=\"text-xs font-normal text-text-secondary\">{cart.name}</p>\n          </div>\n        </div>\n      }\n    >\n      {/* Progress Indicator */}\n      <div className=\"flex items-center justify-between mb-6 px-2\">\n        {STEPS.map((s, i) => {\n          const isCompleted = i < stepIndex;\n          const isCurrent = s === step;\n          return (\n            <div key={s} className=\"flex items-center\">\n              <div className=\"flex flex-col items-center\">\n                <div\n                  className={cn(\n                    'flex h-8 w-8 items-center justify-center rounded-full text-xs font-medium',\n                    isCompleted\n                      ? 'bg-green-500/20 text-green-600 dark:text-green-400'\n                      : isCurrent\n                        ? 'bg-foreground text-background'\n                        : 'bg-bg-sunken text-text-secondary'\n                  )}\n                >\n                  {isCompleted ? <CheckCircle2 className=\"h-4 w-4\" /> : i + 1}\n                </div>\n                <span\n                  className={cn(\n                    'mt-1 text-[10px]',\n                    isCurrent ? 'font-medium text-text-primary' : 'text-text-secondary'\n                  )}\n                >\n                  {STEP_LABELS[s]}\n                </span>\n              </div>\n              {i < STEPS.length - 1 && (\n                <div\n                  className={cn(\n                    'mx-2 h-0.5 w-8 sm:w-16',\n                    isCompleted ? 'bg-green-500/30' : 'bg-border'\n                  )}\n                />\n              )}\n            </div>\n          );\n        })}\n      </div>\n\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-6\">\n        {/* Main Content */}\n        <div className=\"lg:col-span-2\">\n          {/* Step 1: Location */}\n          {step === 'location' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <MapPin className=\"h-4 w-4\" />\n                Service Location\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Where should the cart come?</p>\n\n              <div className=\"space-y-4\">\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Your Address <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"flex gap-2\">\n                    <input\n                      type=\"text\"\n                      placeholder=\"Enter your full address\"\n                      value={location.address}\n                      onChange={(e) => setLocation((p) => ({ ...p, address: e.target.value }))}\n                      className=\"flex-1 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                    <button\n                      type=\"button\"\n                      onClick={handleGetLocation}\n                      className=\"flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-2 text-xs font-medium text-text-primary hover:bg-accent transition-colors whitespace-nowrap\"\n                    >\n                      <Navigation className=\"h-3.5 w-3.5\" />\n                      Use Current Location\n                    </button>\n                  </div>\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Nearby Landmark\n                  </label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"e.g., Near Metro Station, Opposite Mall\"\n                    value={location.landmark}\n                    onChange={(e) => setLocation((p) => ({ ...p, landmark: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Instructions for Cart Owner\n                  </label>\n                  <textarea\n                    rows={3}\n                    placeholder=\"Any specific instructions to help us find you...\"\n                    value={location.instructions}\n                    onChange={(e) => setLocation((p) => ({ ...p, instructions: e.target.value }))}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Phone Number <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"relative\">\n                    <Phone className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n                    <input\n                      type=\"tel\"\n                      placeholder=\"Enter your phone number\"\n                      value={location.phoneNumber}\n                      onChange={(e) => setLocation((p) => ({ ...p, phoneNumber: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Step 2: Details */}\n          {step === 'details' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <Calendar className=\"h-4 w-4\" />\n                Booking Details\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Choose your preferred timing</p>\n\n              <div className=\"space-y-4\">\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Preferred Time Slot <span className=\"text-red-500\">*</span>\n                  </label>\n                  <div className=\"grid grid-cols-4 gap-2\">\n                    {timeSlots.map((slot) => (\n                      <button\n                        key={slot.value}\n                        type=\"button\"\n                        onClick={() => setDetails((p) => ({ ...p, preferredTime: slot.value }))}\n                        className={cn(\n                          'rounded-lg border py-2 px-2 text-xs font-medium transition-colors',\n                          details.preferredTime === slot.value\n                            ? 'border-foreground bg-accent text-text-primary'\n                            : 'border-border-subtle text-text-secondary hover:bg-accent hover:text-text-primary'\n                        )}\n                      >\n                        {slot.label}\n                      </button>\n                    ))}\n                  </div>\n                </div>\n\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1.5\">\n                    Special Instructions\n                  </label>\n                  <textarea\n                    rows={3}\n                    placeholder=\"Any special requests or dietary preferences...\"\n                    value={details.specialInstructions}\n                    onChange={(e) =>\n                      setDetails((p) => ({ ...p, specialInstructions: e.target.value }))\n                    }\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)] resize-none\"\n                  />\n                </div>\n\n                <label className=\"flex items-center gap-2 cursor-pointer\">\n                  <input\n                    type=\"checkbox\"\n                    checked={details.isUrgent}\n                    onChange={(e) => setDetails((p) => ({ ...p, isUrgent: e.target.checked }))}\n                    className=\"h-4 w-4 rounded border-border-subtle\"\n                  />\n                  <span className=\"text-sm text-text-secondary\">\n                    This is urgent (additional charges may apply)\n                  </span>\n                </label>\n              </div>\n            </div>\n          )}\n\n          {/* Step 3: Payment */}\n          {step === 'payment' && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              <h2 className=\"text-base font-semibold text-text-primary mb-1 flex items-center gap-2\">\n                <CreditCard className=\"h-4 w-4\" />\n                Advance Payment\n              </h2>\n              <p className=\"text-xs text-text-secondary mb-5\">Select your payment method</p>\n\n              <div className=\"space-y-4\">\n                {/* Info callout */}\n                <div className=\"flex items-start gap-2 rounded-lg border border-blue-500/20 bg-blue-500/5 p-3\">\n                  <AlertCircle className=\"h-4 w-4 text-blue-600 dark:text-blue-400 shrink-0 mt-0.5\" />\n                  <p className=\"text-xs text-blue-700 dark:text-blue-300\">\n                    You need to pay {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}{' '}\n                    in advance to confirm your booking. Pay the remaining when the cart arrives.\n                  </p>\n                </div>\n\n                {/* Payment methods */}\n                <div className=\"grid grid-cols-1 sm:grid-cols-3 gap-3\">\n                  {[\n                    {\n                      value: 'upi' as const,\n                      label: 'UPI',\n                      sub: 'Instant payment',\n                      Icon: Smartphone,\n                    },\n                    {\n                      value: 'card' as const,\n                      label: 'Card',\n                      sub: 'Secure payment',\n                      Icon: CreditCard,\n                    },\n                    {\n                      value: 'wallet' as const,\n                      label: 'Wallet',\n                      sub: 'Quick payment',\n                      Icon: Wallet,\n                    },\n                  ].map(({ value, label, sub, Icon }) => (\n                    <button\n                      key={value}\n                      type=\"button\"\n                      onClick={() => setPaymentMethod(value)}\n                      className={cn(\n                        'rounded-lg border p-3 text-center transition-colors',\n                        paymentMethod === value\n                          ? 'border-foreground bg-accent'\n                          : 'border-border-subtle hover:bg-accent'\n                      )}\n                    >\n                      <Icon className=\"mx-auto h-5 w-5 text-text-secondary mb-1\" />\n                      <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n                      <p className=\"text-[10px] text-text-secondary\">{sub}</p>\n                    </button>\n                  ))}\n                </div>\n\n                {/* Payment Summary */}\n                <div className=\"rounded-lg bg-bg-sunken p-4\">\n                  <h3 className=\"text-sm font-medium text-text-primary mb-2\">Payment Summary</h3>\n                  <div className=\"space-y-2 text-sm\">\n                    <div className=\"flex justify-between\">\n                      <span className=\"text-text-secondary\">Advance Payment:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                    <div className=\"flex justify-between\">\n                      <span className=\"text-text-secondary\">Service Fee:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                    <div className=\"flex justify-between text-text-secondary\">\n                      <span>Balance Payment (at arrival):</span>\n                      <span>{formatCurrency(balancePayment, { minimumFractionDigits: 0 })}</span>\n                    </div>\n                    <div className=\"flex justify-between border-t border-border-subtle pt-2 font-semibold\">\n                      <span className=\"text-text-primary\">Total Amount:</span>\n                      <span className=\"text-text-primary\">\n                        {formatCurrency(totalAmount, { minimumFractionDigits: 0 })}\n                      </span>\n                    </div>\n                  </div>\n                </div>\n              </div>\n            </div>\n          )}\n\n          {/* Step 4: Confirmation */}\n          {step === 'confirmation' && confirmation && (\n            <div className=\"rounded-lg border border-border-subtle bg-bg-surface p-5\">\n              {/* Success header */}\n              <div className=\"text-center mb-6\">\n                <div className=\"mx-auto mb-3 flex h-14 w-14 items-center justify-center rounded-full bg-green-500/10\">\n                  <CheckCircle2 className=\"h-7 w-7 text-green-600 dark:text-green-400\" />\n                </div>\n                <h2 className=\"text-lg font-semibold text-text-primary mb-1\">Booking Confirmed!</h2>\n                <p className=\"text-sm text-text-secondary\">\n                  Your direct service booking has been confirmed and payment processed.\n                </p>\n              </div>\n\n              {/* Booking details */}\n              <div className=\"rounded-lg bg-bg-sunken p-4 mb-4\">\n                <h3 className=\"text-sm font-medium text-text-primary mb-3\">Booking Details</h3>\n                <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm\">\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Booking ID</span>\n                    <p className=\"font-mono text-xs text-text-primary\">{confirmation.bookingId}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Est. Arrival</span>\n                    <p className=\"text-text-primary\">\n                      {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n                        hour: '2-digit',\n                        minute: '2-digit',\n                      })}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Location</span>\n                    <p className=\"text-text-primary truncate\">{location.address}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Phone</span>\n                    <p className=\"text-text-primary\">{location.phoneNumber}</p>\n                  </div>\n                </div>\n              </div>\n\n              {/* Payment details */}\n              <div className=\"rounded-lg border border-green-500/20 bg-green-500/5 p-4 mb-4\">\n                <h3 className=\"text-sm font-medium text-green-600 dark:text-green-400 mb-2 flex items-center gap-2\">\n                  <CheckCircle2 className=\"h-4 w-4\" />\n                  Payment Processed\n                </h3>\n                <div className=\"grid grid-cols-2 gap-3 text-sm\">\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Transaction ID</span>\n                    <p className=\"font-mono text-xs text-text-primary\">\n                      {confirmation.transactionId}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Advance Paid</span>\n                    <p className=\"font-medium text-text-primary\">\n                      {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                    </p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Method</span>\n                    <p className=\"capitalize text-text-primary\">{paymentMethod}</p>\n                  </div>\n                  <div>\n                    <span className=\"text-xs text-text-secondary\">Status</span>\n                    <p className=\"font-medium text-green-600 dark:text-green-400\">Paid</p>\n                  </div>\n                </div>\n              </div>\n\n              {/* Next Steps */}\n              <div className=\"rounded-lg border border-blue-500/20 bg-blue-500/5 p-4 mb-6\">\n                <h3 className=\"text-sm font-medium text-blue-600 dark:text-blue-400 mb-2\">\n                  Next Steps\n                </h3>\n                <div className=\"space-y-2 text-xs text-blue-700 dark:text-blue-300\">\n                  <div className=\"flex items-start gap-2\">\n                    <CheckCircle2 className=\"h-3.5 w-3.5 text-green-600 mt-0.5 shrink-0\" />\n                    <span>\n                      Payment confirmed -{' '}\n                      {formatCurrency(advancePayment, { minimumFractionDigits: 0 })} paid\n                    </span>\n                  </div>\n                  <div className=\"flex items-start gap-2\">\n                    <Clock className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n                    <span>\n                      Cart will arrive around{' '}\n                      {new Date(confirmation.estimatedArrival).toLocaleTimeString([], {\n                        hour: '2-digit',\n                        minute: '2-digit',\n                      })}\n                    </span>\n                  </div>\n                  <div className=\"flex items-start gap-2\">\n                    <CreditCard className=\"h-3.5 w-3.5 mt-0.5 shrink-0\" />\n                    <span>\n                      Pay remaining {formatCurrency(balancePayment, { minimumFractionDigits: 0 })}{' '}\n                      when cart arrives\n                    </span>\n                  </div>\n                </div>\n              </div>\n\n              {/* Action buttons */}\n              <div className=\"flex gap-3\">\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/customer/bookings/${confirmation.bookingId}`)}\n                  className=\"flex-1 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  View Booking\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo('/customer/carts')}\n                  className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Browse More\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Navigation Buttons */}\n          {step !== 'confirmation' && (\n            <div className=\"flex justify-between mt-5\">\n              <button\n                type=\"button\"\n                onClick={prevStep}\n                disabled={step === 'location'}\n                className={cn(\n                  'flex items-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary transition-colors',\n                  step === 'location' ? 'opacity-40 cursor-not-allowed' : 'hover:bg-accent'\n                )}\n              >\n                <ArrowLeft className=\"h-4 w-4\" />\n                Previous\n              </button>\n              <button\n                type=\"button\"\n                onClick={nextStep}\n                disabled={submitting}\n                className={cn(\n                  'flex items-center gap-2 rounded-lg bg-foreground px-4 py-2.5 text-sm font-medium text-background transition-opacity',\n                  submitting ? 'opacity-60 cursor-not-allowed' : 'hover:opacity-90'\n                )}\n              >\n                {submitting ? (\n                  <>\n                    <Loader2 className=\"h-4 w-4 animate-spin\" />\n                    {step === 'payment' ? 'Processing Payment...' : 'Processing...'}\n                  </>\n                ) : (\n                  <>\n                    {step === 'payment' ? 'Confirm & Pay' : 'Next'}\n                    <ArrowRight className=\"h-4 w-4\" />\n                  </>\n                )}\n              </button>\n            </div>\n          )}\n        </div>\n\n        {/* Sidebar: Service Summary */}\n        <div className=\"lg:col-span-1\">\n          <div className=\"sticky top-6 rounded-lg border border-border-subtle bg-bg-surface p-5\">\n            <h3 className=\"text-base font-semibold text-text-primary mb-4\">Service Summary</h3>\n\n            <div className=\"flex items-center gap-3 mb-4\">\n              <img src={cart.image} alt={cart.name} className=\"h-12 w-12 rounded-lg object-cover\" />\n              <div>\n                <p className=\"text-sm font-medium text-text-primary\">{cart.name}</p>\n                <p className=\"text-xs text-text-secondary\">{cart.category}</p>\n              </div>\n            </div>\n\n            <div className=\"space-y-2 text-sm border-t border-border-subtle pt-3\">\n              <div className=\"flex justify-between\">\n                <span className=\"text-text-secondary\">Service Fee:</span>\n                <span className=\"text-text-primary\">\n                  {formatCurrency(serviceFee, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n              <div className=\"flex justify-between\">\n                <span className=\"text-text-secondary\">Advance Payment:</span>\n                <span className=\"font-medium text-text-primary\">\n                  {formatCurrency(advancePayment, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-2 mt-3 pt-3 border-t border-border-subtle text-green-600 dark:text-green-400\">\n              <CheckCircle2 className=\"h-3.5 w-3.5\" />\n              <span className=\"text-xs\">Pay remaining amount at cart</span>\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/atheletebridge/pages/customer/FavoritesPage.js

@@ -222,6 +222,7 @@ function x() {
 				})
 			}),
 			M.length === 0 && N.length === 0 ? /* @__PURE__ */ y(r, {
+				illustration: "empty-data",
 				icon: /* @__PURE__ */ y(d, { className: "h-12 w-12" }),
 				title: "No favorites yet",
 				description: "Browse carts and tap the heart icon to add them to your favorites.",