@burdenoff/microfe-crewfoundry 2026.1013.1 → 2026.1029.1

package/dist/crewfoundry/pages/MarketplaceServiceDetailsPagePage.js

@@ -1,310 +1,147 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
-import { getInitials as t } from "../components/viz/lib/format.js";
-import { RatingStars as n } from "../components/viz/RatingStars.js";
+import { StatCard as t } from "../components/viz/StatCard.js";
+import { AvatarStack as n } from "../components/viz/AvatarStack.js";
 import "../components/viz/index.js";
-import { useMemo as r, useState as i } from "react";
-import { CalendarDays as a, CheckCircle2 as o, Clock3 as s, MessageSquare as c, PauseCircle as l, Star as u } from "lucide-react";
-import { useLocation as d, useNavigate as f } from "react-router";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
-import { Badge as h, Button as g, Card as _, CardContent as v, CardHeader as y, CardTitle as b, EmphasisPanel as x, GradientText as S, IllustratedEmptyState as C, Input as w, PagePurpose as T, Spinner as E } from "@burdenoff/fe-libs/ui";
+import { formatDate as r } from "../utils/dateUtils.js";
+import { InlineError as i } from "../components/InlineError.js";
+import { useEnsureLoaded as a } from "../lib/useEnsureLoaded.js";
+import { formatRate as o } from "../lib/marketplace.js";
+import { BookServiceModal as s } from "../components/marketplace/BookServiceModal.js";
+import { ServiceListingModal as c } from "../components/marketplace/ServiceListingModal.js";
+import { useState as l } from "react";
+import { ArrowLeft as u, Pencil as d } from "lucide-react";
+import { useNavigate as f, useSearchParams as p } from "react-router";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { Badge as g, Button as _, Card as v, CardContent as y, CardHeader as b, CardTitle as x, GradientText as S, IllustratedEmptyState as C, Spinner as w } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/MarketplaceServiceDetailsPagePage.tsx
-function D(e) {
-	switch (e) {
-		case "active": return {
-			label: "Available for new projects",
-			icon: o,
-			className: "text-status-success-text"
-		};
-		case "pending": return {
-			label: "Pending review",
-			icon: s,
-			className: "text-status-warning-text"
-		};
-		default: return {
-			label: "Not currently available",
-			icon: l,
-			className: "text-text-secondary"
-		};
-	}
-}
-function O() {
-	let o = f(), l = d(), { marketplaceServices: O, initialized: k } = e(), A = new URLSearchParams(l.search).get("id"), j = O.find((e) => e.id === A) ?? O[0], M = r(() => j ? O.filter((e) => e.provider === j.provider) : [], [O, j]), [N, P] = i(null), F = (/* @__PURE__ */ new Date()).toISOString().slice(0, 10), [I, L] = i(F);
-	if (!k && !j) return /* @__PURE__ */ p("div", {
+function T() {
+	let T = f(), [E] = p(), { serviceListings: D, bookings: O, marketplaceLoaded: k, fetchMarketplace: A, initParams: j } = e(), M = a(k, A), [N, P] = l(null), [F, I] = l(!1), [L, R] = l(null), z = E.get("id"), B = D.find((e) => e.id === z);
+	if (!k && !M) return /* @__PURE__ */ m("div", {
 		className: "flex min-h-[60vh] items-center justify-center p-6",
-		children: /* @__PURE__ */ p(E, { size: "lg" })
+		children: /* @__PURE__ */ m(w, { size: "lg" })
 	});
-	if (!j) return /* @__PURE__ */ p("div", {
-		className: "p-6",
-		children: /* @__PURE__ */ p(C, {
+	if (!B) return /* @__PURE__ */ h("div", {
+		className: "space-y-4 p-6",
+		children: [/* @__PURE__ */ m(i, { message: M }), /* @__PURE__ */ m(C, {
 			illustration: "empty-search",
 			title: "Service not found",
-			description: "This service is no longer available."
-		})
+			description: "This service was removed or the link is incomplete.",
+			action: /* @__PURE__ */ m(_, {
+				size: "sm",
+				onClick: () => T("../marketplace/marketplace-page"),
+				children: "Back to the marketplace"
+			})
+		})]
 	});
-	let R = M.find((e) => e.id === N) ?? j, z = D(j.status), B = z.icon;
-	return /* @__PURE__ */ m("div", {
+	let V = B.providerActorId === j.actorId, H = O.filter((e) => e.listingId === B.id), U = H.filter((e) => e.status === "completed").length, W = H.filter((e) => e.status === "requested" || e.status === "confirmed").length;
+	return /* @__PURE__ */ h("div", {
 		className: "space-y-6 p-6",
-		children: [/* @__PURE__ */ m("div", {
-			className: "text-xs text-text-secondary",
-			children: [
-				/* @__PURE__ */ p("button", {
-					type: "button",
-					className: "hover:text-text-primary",
-					onClick: () => o("../marketplace/marketplace-page"),
-					children: "Marketplace"
-				}),
-				/* @__PURE__ */ p("span", {
-					className: "mx-1",
-					children: "/"
-				}),
-				/* @__PURE__ */ p("span", {
-					className: "text-text-primary",
-					children: j.title
-				})
-			]
-		}), /* @__PURE__ */ m("div", {
-			className: "grid gap-6 lg:grid-cols-3",
-			children: [/* @__PURE__ */ m("div", {
-				className: "space-y-6 lg:col-span-2",
-				children: [
-					/* @__PURE__ */ m("div", {
-						className: "flex flex-col gap-4 sm:flex-row sm:items-start",
-						children: [/* @__PURE__ */ p("span", {
-							className: "flex h-20 w-20 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-2xl font-semibold text-action-primary-text",
-							"aria-hidden": "true",
-							children: t(j.provider)
-						}), /* @__PURE__ */ m("div", {
-							className: "min-w-0 flex-1 space-y-2",
-							children: [
-								/* @__PURE__ */ p("h1", {
-									className: "text-2xl font-semibold",
-									children: /* @__PURE__ */ p(S, { children: j.provider })
-								}),
-								/* @__PURE__ */ p("p", {
-									className: "text-sm text-text-secondary",
-									children: j.title
-								}),
-								/* @__PURE__ */ m("div", {
-									className: "flex flex-wrap items-center gap-3",
-									children: [
-										/* @__PURE__ */ p(n, {
-											value: j.rating,
-											count: j.reviews,
-											showValue: !0,
-											size: 16
-										}),
-										/* @__PURE__ */ m("span", {
-											className: "flex items-center gap-1 text-xs text-text-secondary",
-											children: [/* @__PURE__ */ p(s, { className: "h-3 w-3" }), j.deliveryTime]
-										}),
-										/* @__PURE__ */ p(h, {
-											variant: "outline",
-											className: "text-[10px]",
-											children: j.category
-										})
-									]
-								}),
-								/* @__PURE__ */ p("div", {
-									className: "flex flex-wrap gap-1.5 pt-1",
-									children: j.skills.map((e) => /* @__PURE__ */ p(h, {
-										variant: "secondary",
-										className: "text-xs",
-										children: e
-									}, e))
-								})
-							]
-						})]
-					}),
-					/* @__PURE__ */ p(T, { children: "See exactly what this service includes, what it costs, and how others rated it — use the booking panel to pick a package and request an engagement." }),
-					/* @__PURE__ */ m(x, { children: [/* @__PURE__ */ p("div", {
-						className: "mb-2 text-lg font-semibold",
-						children: "About this service"
-					}), /* @__PURE__ */ p("p", {
-						className: "text-sm text-text-secondary",
-						children: j.description
-					})] }),
-					/* @__PURE__ */ m("div", {
-						className: "space-y-3",
-						children: [/* @__PURE__ */ p("h2", {
-							className: "text-lg font-semibold",
-							children: "Services offered"
-						}), /* @__PURE__ */ p("div", {
-							className: "grid gap-3 sm:grid-cols-2 xl:grid-cols-3",
-							children: M.map((e) => {
-								let t = e.id === R.id;
-								return /* @__PURE__ */ m("button", {
-									type: "button",
-									onClick: () => P(e.id),
-									"aria-pressed": t,
-									className: `flex flex-col rounded-lg border p-4 text-left transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] ${t ? "border-action-primary-bg bg-action-primary-bg/5" : "border-border-subtle hover:bg-bg-sunken/50"}`,
-									children: [
-										/* @__PURE__ */ m("div", {
-											className: "flex items-start justify-between gap-2",
-											children: [/* @__PURE__ */ p("p", {
-												className: "text-sm font-semibold",
-												children: e.title
-											}), /* @__PURE__ */ p("span", {
-												className: "whitespace-nowrap text-[11px] text-text-secondary",
-												children: e.deliveryTime
-											})]
-										}),
-										/* @__PURE__ */ m("p", {
-											className: "mt-1 text-xl font-bold tabular-nums",
-											children: [
-												"$",
-												e.price.toLocaleString(),
-												/* @__PURE__ */ m("span", {
-													className: "text-xs font-normal text-text-secondary",
-													children: ["/", e.priceType]
-												})
-											]
-										}),
-										/* @__PURE__ */ p("p", {
-											className: "mt-2 line-clamp-3 text-xs text-text-secondary",
-											children: e.description
-										})
-									]
-								}, e.id);
-							})
-						})]
-					}),
-					/* @__PURE__ */ m("div", {
-						className: "space-y-3",
-						children: [/* @__PURE__ */ p("h2", {
-							className: "text-lg font-semibold",
-							children: "Reviews"
-						}), /* @__PURE__ */ p(_, { children: /* @__PURE__ */ m(v, {
-							className: "flex flex-col items-center gap-2 p-6 text-center",
-							children: [/* @__PURE__ */ m("div", {
-								className: "flex items-center gap-2",
-								children: [
-									/* @__PURE__ */ p(u, {
-										className: "h-6 w-6 text-status-warning-text",
-										fill: "currentColor"
-									}),
-									/* @__PURE__ */ p("span", {
-										className: "text-2xl font-bold tabular-nums",
-										children: j.rating.toFixed(1)
-									}),
-									/* @__PURE__ */ p("span", {
-										className: "text-sm text-text-secondary",
-										children: "/ 5"
-									})
-								]
-							}), /* @__PURE__ */ m("p", {
-								className: "text-sm text-text-secondary",
-								children: [
-									"Based on ",
-									j.reviews.toLocaleString(),
-									" ",
-									j.reviews === 1 ? "review" : "reviews",
-									". Individual review notes aren't published for this listing yet."
-								]
-							})]
-						}) })]
-					})
-				]
-			}), /* @__PURE__ */ p("div", {
-				className: "lg:col-span-1",
-				children: /* @__PURE__ */ m(_, {
-					className: "lg:sticky lg:top-6",
-					children: [/* @__PURE__ */ p(y, { children: /* @__PURE__ */ p(b, {
-						className: "text-lg",
-						children: "Book this service"
-					}) }), /* @__PURE__ */ m(v, {
-						className: "space-y-5",
+		children: [
+			/* @__PURE__ */ h(_, {
+				variant: "ghost",
+				size: "sm",
+				onClick: () => T("../marketplace/marketplace-page"),
+				children: [/* @__PURE__ */ m(u, { className: "mr-1 h-4 w-4" }), "Marketplace"]
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
+				children: [/* @__PURE__ */ h("div", {
+					className: "min-w-0",
+					children: [/* @__PURE__ */ h("div", {
+						className: "flex flex-wrap items-center gap-2",
 						children: [
-							/* @__PURE__ */ m("fieldset", {
-								className: "space-y-2",
-								children: [/* @__PURE__ */ p("legend", {
-									className: "mb-1 text-sm font-medium",
-									children: "Package"
-								}), M.map((e) => {
-									let t = e.id === R.id;
-									return /* @__PURE__ */ m("button", {
-										type: "button",
-										onClick: () => P(e.id),
-										"aria-pressed": t,
-										className: `flex w-full items-center justify-between gap-3 rounded-lg border px-3 py-2.5 text-left transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] ${t ? "border-action-primary-bg bg-action-primary-bg/5" : "border-border-subtle hover:bg-bg-sunken/50"}`,
-										children: [/* @__PURE__ */ m("span", {
-											className: "flex items-center gap-2 min-w-0",
-											children: [/* @__PURE__ */ p("span", {
-												className: `flex h-4 w-4 shrink-0 items-center justify-center rounded-full border ${t ? "border-action-primary-bg" : "border-border-strong"}`,
-												"aria-hidden": "true",
-												children: t ? /* @__PURE__ */ p("span", { className: "h-2 w-2 rounded-full bg-action-primary-bg" }) : null
-											}), /* @__PURE__ */ p("span", {
-												className: "truncate text-sm",
-												children: e.title
-											})]
-										}), /* @__PURE__ */ m("span", {
-											className: "whitespace-nowrap text-sm font-semibold tabular-nums",
-											children: ["$", e.price.toLocaleString()]
-										})]
-									}, e.id);
-								})]
-							}),
-							/* @__PURE__ */ m("div", {
-								className: "space-y-1.5",
-								children: [/* @__PURE__ */ p("label", {
-									htmlFor: "booking-date",
-									className: "text-sm font-medium",
-									children: "Date"
-								}), /* @__PURE__ */ m("div", {
-									className: "relative",
-									children: [/* @__PURE__ */ p(a, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ p(w, {
-										id: "booking-date",
-										type: "date",
-										min: F,
-										value: I,
-										onChange: (e) => L(e.target.value),
-										className: "pl-9"
-									})]
-								})]
-							}),
-							/* @__PURE__ */ m("div", {
-								className: "flex items-center justify-between border-t border-border-subtle pt-3",
-								children: [/* @__PURE__ */ p("span", {
-									className: "text-sm font-medium",
-									children: "Total price"
-								}), /* @__PURE__ */ m("span", {
-									className: "text-lg font-bold tabular-nums",
-									children: [
-										"$",
-										R.price.toLocaleString(),
-										/* @__PURE__ */ m("span", {
-											className: "text-xs font-normal text-text-secondary",
-											children: ["/", R.priceType]
-										})
-									]
-								})]
+							/* @__PURE__ */ m("h1", {
+								className: "text-2xl font-semibold",
+								children: /* @__PURE__ */ m(S, { children: B.title })
 							}),
-							/* @__PURE__ */ m("div", {
-								className: "space-y-2",
-								children: [/* @__PURE__ */ p(g, {
-									className: "w-full",
-									disabled: !0,
-									title: "Booking is coming soon",
-									"aria-label": "Book now — coming soon",
-									children: "Book Now · Coming soon"
-								}), /* @__PURE__ */ m(g, {
-									variant: "outline",
-									className: "w-full",
-									onClick: () => o("../marketplace/messaging-page"),
-									children: [/* @__PURE__ */ p(c, { className: "mr-1 h-4 w-4" }), "Message"]
-								})]
+							/* @__PURE__ */ m(g, {
+								variant: B.status === "active" ? "default" : "secondary",
+								className: "text-[10px]",
+								children: B.status === "active" ? "Bookable" : "Paused"
 							}),
-							/* @__PURE__ */ m("p", {
-								className: `flex items-center justify-center gap-1.5 text-xs ${z.className}`,
-								children: [/* @__PURE__ */ p(B, { className: "h-3.5 w-3.5" }), z.label]
+							B.category && /* @__PURE__ */ m(g, {
+								variant: "outline",
+								className: "text-[10px]",
+								children: B.category
 							})
 						]
+					}), /* @__PURE__ */ h("div", {
+						className: "mt-2 flex items-center gap-2 text-sm text-text-secondary",
+						children: [
+							/* @__PURE__ */ m(n, {
+								people: [{ name: B.providerName }],
+								size: 28
+							}),
+							B.providerName,
+							V && " (you)",
+							" · listed ",
+							r(B.createdAt)
+						]
 					})]
-				})
-			})]
-		})]
+				}), /* @__PURE__ */ h("div", {
+					className: "flex flex-wrap gap-2",
+					children: [V && /* @__PURE__ */ h(_, {
+						size: "sm",
+						variant: "outline",
+						onClick: () => I(!0),
+						children: [/* @__PURE__ */ m(d, { className: "mr-1 h-4 w-4" }), "Edit"]
+					}), /* @__PURE__ */ m(_, {
+						size: "sm",
+						disabled: B.status !== "active",
+						title: B.status === "active" ? void 0 : "The provider has paused this service",
+						onClick: () => {
+							R(null), P(B);
+						},
+						children: "Book this service"
+					})]
+				})]
+			}),
+			/* @__PURE__ */ m(i, { message: M }),
+			L && /* @__PURE__ */ m("div", {
+				role: "status",
+				className: "rounded-[var(--radius-card)] border border-border-default bg-status-info-bg p-3 text-sm text-status-info-text",
+				children: L
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "grid gap-4 sm:grid-cols-3",
+				children: [
+					/* @__PURE__ */ m(t, {
+						label: "Rate",
+						value: o(B)
+					}),
+					/* @__PURE__ */ m(t, {
+						label: "Open Bookings",
+						value: W
+					}),
+					/* @__PURE__ */ m(t, {
+						label: "Completed Bookings",
+						value: U
+					})
+				]
+			}),
+			/* @__PURE__ */ h(v, { children: [/* @__PURE__ */ m(b, { children: /* @__PURE__ */ m(x, {
+				className: "text-base",
+				children: "What’s included"
+			}) }), /* @__PURE__ */ m(y, { children: /* @__PURE__ */ m("p", {
+				className: "whitespace-pre-line text-sm text-text-secondary",
+				children: B.description
+			}) })] }),
+			/* @__PURE__ */ m(s, {
+				listing: N,
+				onOpenChange: (e) => {
+					e || P(null);
+				},
+				onBooked: () => R("Booking requested. Track it under Bookings; the provider confirms it there.")
+			}),
+			/* @__PURE__ */ m(c, {
+				open: F,
+				onOpenChange: I,
+				listing: B
+			})
+		]
 	});
 }
 //#endregion
-export { O as MarketplaceServiceDetailsPagePage };
+export { T as MarketplaceServiceDetailsPagePage };
 
 //# sourceMappingURL=MarketplaceServiceDetailsPagePage.js.map

package/dist/crewfoundry/pages/MarketplaceServiceDetailsPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarketplaceServiceDetailsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/MarketplaceServiceDetailsPagePage.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  EmphasisPanel,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n  Spinner,\n} from '@burdenoff/fe-libs/ui';\nimport { CalendarDays, CheckCircle2, Clock3, MessageSquare, PauseCircle, Star } from 'lucide-react';\nimport { useLocation, useNavigate } from 'react-router';\nimport { useCrewFoundryStore, type MarketplaceService } from '../store/crewfoundryStore';\nimport { RatingStars, getInitials } from '../components/viz';\n\n/** Honest availability derived from the real service `status` enum (never \"Booked\"). */\nfunction availabilityOf(status: MarketplaceService['status']): {\n  label: string;\n  icon: typeof CheckCircle2;\n  className: string;\n} {\n  switch (status) {\n    case 'active':\n      return {\n        label: 'Available for new projects',\n        icon: CheckCircle2,\n        className: 'text-status-success-text',\n      };\n    case 'pending':\n      return { label: 'Pending review', icon: Clock3, className: 'text-status-warning-text' };\n    default:\n      return {\n        label: 'Not currently available',\n        icon: PauseCircle,\n        className: 'text-text-secondary',\n      };\n  }\n}\n\nexport function MarketplaceServiceDetailsPagePage() {\n  const navigate = useNavigate();\n  const location = useLocation();\n  const { marketplaceServices, initialized } = useCrewFoundryStore();\n  const selectedId = new URLSearchParams(location.search).get('id');\n  const svc = marketplaceServices.find((s) => s.id === selectedId) ?? marketplaceServices[0];\n\n  // Real \"packages\": every service this same provider actually offers. The\n  // backend exposes a single price per service (no synthetic tiers), so each\n  // package is a genuine listing — the viewed service is pre-selected.\n  const providerPackages = useMemo(\n    () =>\n      svc\n        ? marketplaceServices.filter((s) => s.provider === svc.provider)\n        : ([] as MarketplaceService[]),\n    [marketplaceServices, svc]\n  );\n\n  const [selectedPackageId, setSelectedPackageId] = useState<string | null>(null);\n  const today = new Date().toISOString().slice(0, 10);\n  const [bookingDate, setBookingDate] = useState(today);\n\n  if (!initialized && !svc) {\n    return (\n      <div className=\"flex min-h-[60vh] items-center justify-center p-6\">\n        <Spinner size=\"lg\" />\n      </div>\n    );\n  }\n\n  if (!svc) {\n    return (\n      <div className=\"p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-search\"\n          title=\"Service not found\"\n          description=\"This service is no longer available.\"\n        />\n      </div>\n    );\n  }\n\n  const selectedPackage = providerPackages.find((p) => p.id === selectedPackageId) ?? svc;\n  const availability = availabilityOf(svc.status);\n  const AvailabilityIcon = availability.icon;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"text-xs text-text-secondary\">\n        <button\n          type=\"button\"\n          className=\"hover:text-text-primary\"\n          onClick={() => navigate('../marketplace/marketplace-page')}\n        >\n          Marketplace\n        </button>\n        <span className=\"mx-1\">/</span>\n        <span className=\"text-text-primary\">{svc.title}</span>\n      </div>\n\n      <div className=\"grid gap-6 lg:grid-cols-3\">\n        {/* ── Left: provider + service detail ─────────────────────────── */}\n        <div className=\"space-y-6 lg:col-span-2\">\n          <div className=\"flex flex-col gap-4 sm:flex-row sm:items-start\">\n            <span\n              className=\"flex h-20 w-20 shrink-0 items-center justify-center rounded-full bg-action-primary-bg text-2xl font-semibold text-action-primary-text\"\n              aria-hidden=\"true\"\n            >\n              {getInitials(svc.provider)}\n            </span>\n            <div className=\"min-w-0 flex-1 space-y-2\">\n              <h1 className=\"text-2xl font-semibold\">\n                <GradientText>{svc.provider}</GradientText>\n              </h1>\n              <p className=\"text-sm text-text-secondary\">{svc.title}</p>\n              <div className=\"flex flex-wrap items-center gap-3\">\n                <RatingStars value={svc.rating} count={svc.reviews} showValue size={16} />\n                <span className=\"flex items-center gap-1 text-xs text-text-secondary\">\n                  <Clock3 className=\"h-3 w-3\" />\n                  {svc.deliveryTime}\n                </span>\n                <Badge variant=\"outline\" className=\"text-[10px]\">\n                  {svc.category}\n                </Badge>\n              </div>\n              <div className=\"flex flex-wrap gap-1.5 pt-1\">\n                {svc.skills.map((skill) => (\n                  <Badge key={skill} variant=\"secondary\" className=\"text-xs\">\n                    {skill}\n                  </Badge>\n                ))}\n              </div>\n            </div>\n          </div>\n\n          <PagePurpose>\n            See exactly what this service includes, what it costs, and how others rated it — use the\n            booking panel to pick a package and request an engagement.\n          </PagePurpose>\n\n          <EmphasisPanel>\n            <div className=\"mb-2 text-lg font-semibold\">About this service</div>\n            <p className=\"text-sm text-text-secondary\">{svc.description}</p>\n          </EmphasisPanel>\n\n          {/* Services offered — real listings from this provider */}\n          <div className=\"space-y-3\">\n            <h2 className=\"text-lg font-semibold\">Services offered</h2>\n            <div className=\"grid gap-3 sm:grid-cols-2 xl:grid-cols-3\">\n              {providerPackages.map((pkg) => {\n                const active = pkg.id === selectedPackage.id;\n                return (\n                  <button\n                    key={pkg.id}\n                    type=\"button\"\n                    onClick={() => setSelectedPackageId(pkg.id)}\n                    aria-pressed={active}\n                    className={`flex flex-col rounded-lg border p-4 text-left transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] ${\n                      active\n                        ? 'border-action-primary-bg bg-action-primary-bg/5'\n                        : 'border-border-subtle hover:bg-bg-sunken/50'\n                    }`}\n                  >\n                    <div className=\"flex items-start justify-between gap-2\">\n                      <p className=\"text-sm font-semibold\">{pkg.title}</p>\n                      <span className=\"whitespace-nowrap text-[11px] text-text-secondary\">\n                        {pkg.deliveryTime}\n                      </span>\n                    </div>\n                    <p className=\"mt-1 text-xl font-bold tabular-nums\">\n                      ${pkg.price.toLocaleString()}\n                      <span className=\"text-xs font-normal text-text-secondary\">\n                        /{pkg.priceType}\n                      </span>\n                    </p>\n                    <p className=\"mt-2 line-clamp-3 text-xs text-text-secondary\">\n                      {pkg.description}\n                    </p>\n                  </button>\n                );\n              })}\n            </div>\n          </div>\n\n          {/* Reviews — backend stores only an aggregate rating + count, not\n              individual review bodies, so we report that honestly rather than\n              inventing reviewer cards. */}\n          <div className=\"space-y-3\">\n            <h2 className=\"text-lg font-semibold\">Reviews</h2>\n            <Card>\n              <CardContent className=\"flex flex-col items-center gap-2 p-6 text-center\">\n                <div className=\"flex items-center gap-2\">\n                  <Star className=\"h-6 w-6 text-status-warning-text\" fill=\"currentColor\" />\n                  <span className=\"text-2xl font-bold tabular-nums\">{svc.rating.toFixed(1)}</span>\n                  <span className=\"text-sm text-text-secondary\">/ 5</span>\n                </div>\n                <p className=\"text-sm text-text-secondary\">\n                  Based on {svc.reviews.toLocaleString()} {svc.reviews === 1 ? 'review' : 'reviews'}\n                  . Individual review notes aren&apos;t published for this listing yet.\n                </p>\n              </CardContent>\n            </Card>\n          </div>\n        </div>\n\n        {/* ── Right: sticky booking panel ─────────────────────────────── */}\n        <div className=\"lg:col-span-1\">\n          <Card className=\"lg:sticky lg:top-6\">\n            <CardHeader>\n              <CardTitle className=\"text-lg\">Book this service</CardTitle>\n            </CardHeader>\n            <CardContent className=\"space-y-5\">\n              <fieldset className=\"space-y-2\">\n                <legend className=\"mb-1 text-sm font-medium\">Package</legend>\n                {providerPackages.map((pkg) => {\n                  const active = pkg.id === selectedPackage.id;\n                  return (\n                    <button\n                      key={pkg.id}\n                      type=\"button\"\n                      onClick={() => setSelectedPackageId(pkg.id)}\n                      aria-pressed={active}\n                      className={`flex w-full items-center justify-between gap-3 rounded-lg border px-3 py-2.5 text-left transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)] ${\n                        active\n                          ? 'border-action-primary-bg bg-action-primary-bg/5'\n                          : 'border-border-subtle hover:bg-bg-sunken/50'\n                      }`}\n                    >\n                      <span className=\"flex items-center gap-2 min-w-0\">\n                        <span\n                          className={`flex h-4 w-4 shrink-0 items-center justify-center rounded-full border ${\n                            active ? 'border-action-primary-bg' : 'border-border-strong'\n                          }`}\n                          aria-hidden=\"true\"\n                        >\n                          {active ? (\n                            <span className=\"h-2 w-2 rounded-full bg-action-primary-bg\" />\n                          ) : null}\n                        </span>\n                        <span className=\"truncate text-sm\">{pkg.title}</span>\n                      </span>\n                      <span className=\"whitespace-nowrap text-sm font-semibold tabular-nums\">\n                        ${pkg.price.toLocaleString()}\n                      </span>\n                    </button>\n                  );\n                })}\n              </fieldset>\n\n              <div className=\"space-y-1.5\">\n                <label htmlFor=\"booking-date\" className=\"text-sm font-medium\">\n                  Date\n                </label>\n                <div className=\"relative\">\n                  <CalendarDays className=\"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n                  <Input\n                    id=\"booking-date\"\n                    type=\"date\"\n                    min={today}\n                    value={bookingDate}\n                    onChange={(event) => setBookingDate(event.target.value)}\n                    className=\"pl-9\"\n                  />\n                </div>\n              </div>\n\n              <div className=\"flex items-center justify-between border-t border-border-subtle pt-3\">\n                <span className=\"text-sm font-medium\">Total price</span>\n                <span className=\"text-lg font-bold tabular-nums\">\n                  ${selectedPackage.price.toLocaleString()}\n                  <span className=\"text-xs font-normal text-text-secondary\">\n                    /{selectedPackage.priceType}\n                  </span>\n                </span>\n              </div>\n\n              <div className=\"space-y-2\">\n                {/* No createCrewBooking mutation exists in the backend yet, so\n                    Book Now stays an honest disabled control — the panel is\n                    fully interactive but does not fake a booking. */}\n                <Button\n                  className=\"w-full\"\n                  disabled\n                  title=\"Booking is coming soon\"\n                  aria-label=\"Book now — coming soon\"\n                >\n                  Book Now · Coming soon\n                </Button>\n                <Button\n                  variant=\"outline\"\n                  className=\"w-full\"\n                  onClick={() => navigate('../marketplace/messaging-page')}\n                >\n                  <MessageSquare className=\"mr-1 h-4 w-4\" />\n                  Message\n                </Button>\n              </div>\n\n              <p\n                className={`flex items-center justify-center gap-1.5 text-xs ${availability.className}`}\n              >\n                <AvailabilityIcon className=\"h-3.5 w-3.5\" />\n                {availability.label}\n              </p>\n            </CardContent>\n          </Card>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"MarketplaceServiceDetailsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/MarketplaceServiceDetailsPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GradientText,\n  IllustratedEmptyState,\n  Spinner,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowLeft, Pencil } from 'lucide-react';\nimport { useNavigate, useSearchParams } from 'react-router';\nimport { InlineError } from '../components/InlineError';\nimport { BookServiceModal } from '../components/marketplace/BookServiceModal';\nimport { ServiceListingModal } from '../components/marketplace/ServiceListingModal';\nimport { AvatarStack, StatCard } from '../components/viz';\nimport { useCrewFoundryStore, type CrewServiceListing } from '../store/crewfoundryStore';\nimport { formatRate } from '../lib/marketplace';\nimport { useEnsureLoaded } from '../lib/useEnsureLoaded';\nimport { formatDate } from '../utils/dateUtils';\n\nexport function MarketplaceServiceDetailsPagePage() {\n  const navigate = useNavigate();\n  const [searchParams] = useSearchParams();\n  const { serviceListings, bookings, marketplaceLoaded, fetchMarketplace, initParams } =\n    useCrewFoundryStore();\n  const loadError = useEnsureLoaded(marketplaceLoaded, fetchMarketplace);\n  const [bookTarget, setBookTarget] = useState<CrewServiceListing | null>(null);\n  const [editOpen, setEditOpen] = useState(false);\n  const [notice, setNotice] = useState<string | null>(null);\n\n  const listingId = searchParams.get('id');\n  const listing = serviceListings.find((item) => item.id === listingId);\n\n  if (!marketplaceLoaded && !loadError) {\n    return (\n      <div className=\"flex min-h-[60vh] items-center justify-center p-6\">\n        <Spinner size=\"lg\" />\n      </div>\n    );\n  }\n\n  if (!listing) {\n    return (\n      <div className=\"space-y-4 p-6\">\n        <InlineError message={loadError} />\n        <IllustratedEmptyState\n          illustration=\"empty-search\"\n          title=\"Service not found\"\n          description=\"This service was removed or the link is incomplete.\"\n          action={\n            <Button size=\"sm\" onClick={() => navigate('../marketplace/marketplace-page')}>\n              Back to the marketplace\n            </Button>\n          }\n        />\n      </div>\n    );\n  }\n\n  const own = listing.providerActorId === initParams.actorId;\n  const listingBookings = bookings.filter((booking) => booking.listingId === listing.id);\n  const completed = listingBookings.filter((booking) => booking.status === 'completed').length;\n  const open = listingBookings.filter(\n    (booking) => booking.status === 'requested' || booking.status === 'confirmed'\n  ).length;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <Button variant=\"ghost\" size=\"sm\" onClick={() => navigate('../marketplace/marketplace-page')}>\n        <ArrowLeft className=\"mr-1 h-4 w-4\" />\n        Marketplace\n      </Button>\n\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\">\n        <div className=\"min-w-0\">\n          <div className=\"flex flex-wrap items-center gap-2\">\n            <h1 className=\"text-2xl font-semibold\">\n              <GradientText>{listing.title}</GradientText>\n            </h1>\n            <Badge\n              variant={listing.status === 'active' ? 'default' : 'secondary'}\n              className=\"text-[10px]\"\n            >\n              {listing.status === 'active' ? 'Bookable' : 'Paused'}\n            </Badge>\n            {listing.category && (\n              <Badge variant=\"outline\" className=\"text-[10px]\">\n                {listing.category}\n              </Badge>\n            )}\n          </div>\n          <div className=\"mt-2 flex items-center gap-2 text-sm text-text-secondary\">\n            <AvatarStack people={[{ name: listing.providerName }]} size={28} />\n            {listing.providerName}\n            {own && ' (you)'} · listed {formatDate(listing.createdAt)}\n          </div>\n        </div>\n        <div className=\"flex flex-wrap gap-2\">\n          {own && (\n            <Button size=\"sm\" variant=\"outline\" onClick={() => setEditOpen(true)}>\n              <Pencil className=\"mr-1 h-4 w-4\" />\n              Edit\n            </Button>\n          )}\n          <Button\n            size=\"sm\"\n            disabled={listing.status !== 'active'}\n            title={listing.status !== 'active' ? 'The provider has paused this service' : undefined}\n            onClick={() => {\n              setNotice(null);\n              setBookTarget(listing);\n            }}\n          >\n            Book this service\n          </Button>\n        </div>\n      </div>\n\n      <InlineError message={loadError} />\n      {notice && (\n        <div\n          role=\"status\"\n          className=\"rounded-[var(--radius-card)] border border-border-default bg-status-info-bg p-3 text-sm text-status-info-text\"\n        >\n          {notice}\n        </div>\n      )}\n\n      <div className=\"grid gap-4 sm:grid-cols-3\">\n        <StatCard label=\"Rate\" value={formatRate(listing)} />\n        <StatCard label=\"Open Bookings\" value={open} />\n        <StatCard label=\"Completed Bookings\" value={completed} />\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle className=\"text-base\">What’s included</CardTitle>\n        </CardHeader>\n        <CardContent>\n          <p className=\"whitespace-pre-line text-sm text-text-secondary\">{listing.description}</p>\n        </CardContent>\n      </Card>\n\n      <BookServiceModal\n        listing={bookTarget}\n        onOpenChange={(next) => {\n          if (!next) setBookTarget(null);\n        }}\n        onBooked={() =>\n          setNotice('Booking requested. Track it under Bookings; the provider confirms it there.')\n        }\n      />\n      <ServiceListingModal open={editOpen} onOpenChange={setEditOpen} listing={listing} />\n    </div>\n  );\n}\n"],"mappings":"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"}