@burdenoff/microfe-ggnomad 2026.624.1 → 2026.704.1

package/dist/ggnomad/pages/DashboardPage.js

@@ -1,128 +1,153 @@
 import { GGNOMAD_BOOKINGS_QUERY as e, GGNOMAD_EVENTS_QUERY as t, GGNOMAD_OVERVIEW_QUERY as n, GGNOMAD_PROPERTIES_QUERY as r, GGNOMAD_TOURS_QUERY as i } from "../graphql.js";
 import { PageShell as a } from "./PageShell.js";
-import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { useQuery as s } from "@apollo/client/react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { StatCard as o } from "../components/StatCard.js";
+import { StatusBadge as s } from "../components/StatusBadge.js";
+import { SectionCard as c } from "../components/SectionCard.js";
+import "../components/index.js";
+import { Building as l, CalendarCheck as u, Compass as d, DollarSign as f, Hotel as p, Search as m, Users as h } from "lucide-react";
+import { useI18n as g } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useNavigate as _ } from "react-router-dom";
+import { useQuery as v } from "@apollo/client/react";
+import { EmphasisPanel as y, IllustratedEmptyState as b, NextSteps as x, PagePurpose as S } from "@burdenoff/fe-libs/ui";
+import { jsx as C, jsxs as w } from "react/jsx-runtime";
 //#region src/ggnomad/pages/DashboardPage.tsx
-function u() {
-	let { t: u } = o(), d = s(n), f = s(e, { variables: {
+function T() {
+	let { t: T } = g(), E = _(), D = v(n), O = v(e, { variables: {
 		first: 5,
 		skip: 0
-	} }), p = s(r, { variables: {
+	} }), k = v(r, { variables: {
 		first: 4,
 		skip: 0
-	} }), m = s(i, { variables: {
+	} }), A = v(i, { variables: {
 		first: 4,
 		skip: 0
-	} }), h = s(t, { variables: {
+	} }), j = v(t, { variables: {
 		first: 4,
 		skip: 0
-	} }), g = d.data?.ggnomadOverviewStats;
-	return /* @__PURE__ */ l(a, {
-		title: u("ggnomad.dashboard.title", "GGNomad Dashboard"),
-		subtitle: u("ggnomad.dashboard.subtitle", "Unified travel, hospitality, tourism and entertainment operations"),
-		children: [/* @__PURE__ */ l("section", {
-			className: "grid gap-4 md:grid-cols-4",
-			children: [
-				/* @__PURE__ */ l("div", {
-					className: "rounded-lg border p-4",
-					children: [/* @__PURE__ */ c("p", {
+	} }), M = D.data?.ggnomadOverviewStats, N = O.data?.ggnomadBookings ?? [];
+	return /* @__PURE__ */ w(a, {
+		hero: !0,
+		title: T("ggnomad.dashboard.title", "GGNomad Dashboard"),
+		titleAccent: T("ggnomad.dashboard.title.accent", "GGNomad"),
+		subtitle: T("ggnomad.dashboard.subtitle", "Unified travel, hospitality, tourism and entertainment operations"),
+		children: [
+			/* @__PURE__ */ C(S, {
+				icon: /* @__PURE__ */ C(d, { className: "size-4" }),
+				children: T("ggnomad.dashboard.purpose", "Your command centre for the whole GGNomad marketplace — see live revenue, users, listings and bookings across travel, hospitality, tourism and entertainment in one place, and jump straight into the area you want to work on.")
+			}),
+			/* @__PURE__ */ C(x, {
+				storageKey: "ggnomad-dashboard",
+				steps: [
+					{
+						id: "search",
+						label: T("ggnomad.dashboard.next.search", "Search the catalogue"),
+						description: T("ggnomad.dashboard.next.searchDesc", "Find inventory across every domain at once."),
+						icon: /* @__PURE__ */ C(m, { className: "size-4" }),
+						onClick: () => E("search")
+					},
+					{
+						id: "stays",
+						label: T("ggnomad.dashboard.next.stays", "Browse places to stay"),
+						description: T("ggnomad.dashboard.next.staysDesc", "Explore hospitality listings and open a property."),
+						icon: /* @__PURE__ */ C(p, { className: "size-4" }),
+						onClick: () => E("hospitality")
+					},
+					{
+						id: "tourism",
+						label: T("ggnomad.dashboard.next.tourism", "Discover tours & activities"),
+						description: T("ggnomad.dashboard.next.tourismDesc", "Plan what to do at each destination."),
+						icon: /* @__PURE__ */ C(d, { className: "size-4" }),
+						onClick: () => E("tourism")
+					},
+					{
+						id: "bookings",
+						label: T("ggnomad.dashboard.next.bookings", "Manage bookings"),
+						description: T("ggnomad.dashboard.next.bookingsDesc", "Track and cancel reservations in real time."),
+						icon: /* @__PURE__ */ C(u, { className: "size-4" }),
+						onClick: () => E("bookings")
+					}
+				]
+			}),
+			/* @__PURE__ */ w("section", {
+				className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-4",
+				children: [
+					/* @__PURE__ */ C(o, {
+						hero: !0,
+						label: T("ggnomad.dashboard.stats.monthlyRevenue", "Monthly Revenue"),
+						value: `$${Number(M?.monthlyRevenue ?? 0).toLocaleString()}`,
+						icon: /* @__PURE__ */ C(f, {})
+					}),
+					/* @__PURE__ */ C(o, {
+						label: T("ggnomad.dashboard.stats.users", "Users"),
+						value: Number(M?.users ?? 0).toLocaleString(),
+						icon: /* @__PURE__ */ C(h, {})
+					}),
+					/* @__PURE__ */ C(o, {
+						label: T("ggnomad.dashboard.stats.listings", "Listings"),
+						value: Number(M?.listings ?? 0).toLocaleString(),
+						icon: /* @__PURE__ */ C(l, {})
+					}),
+					/* @__PURE__ */ C(o, {
+						label: T("ggnomad.dashboard.stats.bookings", "Bookings"),
+						value: Number(M?.bookings ?? 0).toLocaleString(),
+						icon: /* @__PURE__ */ C(u, {})
+					})
+				]
+			}),
+			/* @__PURE__ */ w(y, { children: [/* @__PURE__ */ w("div", {
+				className: "grid gap-4 sm:grid-cols-3",
+				children: [
+					/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
 						className: "text-sm text-text-secondary",
-						children: u("ggnomad.dashboard.stats.users", "Users")
-					}), /* @__PURE__ */ c("p", {
-						className: "text-2xl font-semibold",
-						children: g?.users ?? 0
-					})]
-				}),
-				/* @__PURE__ */ l("div", {
-					className: "rounded-lg border p-4",
-					children: [/* @__PURE__ */ c("p", {
+						children: T("ggnomad.dashboard.inventory.properties", "Properties")
+					}), /* @__PURE__ */ C("p", {
+						className: "mt-1 text-2xl font-semibold tabular-nums text-text-primary",
+						children: k.data?.ggnomadProperties?.length ?? 0
+					})] }),
+					/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
 						className: "text-sm text-text-secondary",
-						children: u("ggnomad.dashboard.stats.listings", "Listings")
-					}), /* @__PURE__ */ c("p", {
-						className: "text-2xl font-semibold",
-						children: g?.listings ?? 0
-					})]
-				}),
-				/* @__PURE__ */ l("div", {
-					className: "rounded-lg border p-4",
-					children: [/* @__PURE__ */ c("p", {
+						children: T("ggnomad.dashboard.inventory.tours", "Tours")
+					}), /* @__PURE__ */ C("p", {
+						className: "mt-1 text-2xl font-semibold tabular-nums text-text-primary",
+						children: A.data?.ggnomadTours?.length ?? 0
+					})] }),
+					/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("p", {
 						className: "text-sm text-text-secondary",
-						children: u("ggnomad.dashboard.stats.bookings", "Bookings")
-					}), /* @__PURE__ */ c("p", {
-						className: "text-2xl font-semibold",
-						children: g?.bookings ?? 0
-					})]
-				}),
-				/* @__PURE__ */ l("div", {
-					className: "rounded-lg border p-4",
-					children: [/* @__PURE__ */ c("p", {
-						className: "text-sm text-text-secondary",
-						children: u("ggnomad.dashboard.stats.monthlyRevenue", "Monthly Revenue")
-					}), /* @__PURE__ */ l("p", {
-						className: "text-2xl font-semibold",
-						children: ["$", Number(g?.monthlyRevenue ?? 0).toLocaleString()]
-					})]
-				})
-			]
-		}), /* @__PURE__ */ l("section", {
-			className: "grid gap-4 lg:grid-cols-2",
-			children: [/* @__PURE__ */ l("div", {
-				className: "rounded-lg border p-4",
-				children: [/* @__PURE__ */ c("h2", {
-					className: "mb-3 text-lg font-medium",
-					children: u("ggnomad.dashboard.sections.recentBookings", "Recent bookings")
-				}), /* @__PURE__ */ c("ul", {
+						children: T("ggnomad.dashboard.inventory.events", "Events")
+					}), /* @__PURE__ */ C("p", {
+						className: "mt-1 text-2xl font-semibold tabular-nums text-text-primary",
+						children: j.data?.ggnomadEvents?.length ?? 0
+					})] })
+				]
+			}), /* @__PURE__ */ C("p", {
+				className: "mt-4 text-sm text-text-secondary",
+				children: T("ggnomad.dashboard.inventory.liveDataNotice", "Data is live from `wspace-ggnomad-svc` GraphQL APIs.")
+			})] }),
+			/* @__PURE__ */ C(c, {
+				title: T("ggnomad.dashboard.sections.recentBookings", "Recent bookings"),
+				children: N.length === 0 ? /* @__PURE__ */ C(b, {
+					illustration: "empty-data",
+					title: T("ggnomad.dashboard.recentBookings.emptyTitle", "No recent bookings"),
+					description: T("ggnomad.dashboard.recentBookings.emptyDescription", "New bookings across travel, hospitality and tourism will appear here.")
+				}) : /* @__PURE__ */ C("ul", {
 					className: "space-y-2 text-sm",
-					children: (f.data?.ggnomadBookings ?? []).map((e) => /* @__PURE__ */ l("li", {
-						className: "flex items-center justify-between rounded border p-2",
-						children: [/* @__PURE__ */ l("span", { children: [
-							e.referenceCode,
-							" - ",
-							e.itemName
-						] }), /* @__PURE__ */ c("span", {
-							className: "text-text-secondary",
-							children: e.status
-						})]
+					children: N.map((e) => /* @__PURE__ */ w("li", {
+						className: "flex items-center justify-between gap-3 rounded-lg border border-border-seam bg-bg-surface/40 p-3",
+						children: [/* @__PURE__ */ w("span", {
+							className: "min-w-0 truncate text-text-primary",
+							children: [
+								e.referenceCode,
+								" — ",
+								e.itemName
+							]
+						}), /* @__PURE__ */ C(s, { status: e.status })]
 					}, e.id))
-				})]
-			}), /* @__PURE__ */ l("div", {
-				className: "rounded-lg border p-4",
-				children: [/* @__PURE__ */ c("h2", {
-					className: "mb-3 text-lg font-medium",
-					children: u("ggnomad.dashboard.sections.featuredInventory", "Featured inventory")
-				}), /* @__PURE__ */ l("div", {
-					className: "grid gap-2 text-sm",
-					children: [
-						/* @__PURE__ */ l("p", { children: [
-							u("ggnomad.dashboard.inventory.properties", "Properties"),
-							":",
-							" ",
-							p.data?.ggnomadProperties?.length ?? 0
-						] }),
-						/* @__PURE__ */ l("p", { children: [
-							u("ggnomad.dashboard.inventory.tours", "Tours"),
-							":",
-							" ",
-							m.data?.ggnomadTours?.length ?? 0
-						] }),
-						/* @__PURE__ */ l("p", { children: [
-							u("ggnomad.dashboard.inventory.events", "Events"),
-							":",
-							" ",
-							h.data?.ggnomadEvents?.length ?? 0
-						] }),
-						/* @__PURE__ */ c("p", {
-							className: "text-text-secondary",
-							children: u("ggnomad.dashboard.inventory.liveDataNotice", "Data is live from `wspace-ggnomad-svc` GraphQL APIs.")
-						})
-					]
-				})]
-			})]
-		})]
+				})
+			})
+		]
 	});
 }
 //#endregion
-export { u as DashboardPage };
+export { T as DashboardPage };
 
 //# sourceMappingURL=DashboardPage.js.map

package/dist/ggnomad/pages/DashboardPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/ggnomad/pages/DashboardPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nimport {\n  GGNOMAD_OVERVIEW_QUERY,\n  GGNOMAD_BOOKINGS_QUERY,\n  GGNOMAD_PROPERTIES_QUERY,\n  GGNOMAD_TOURS_QUERY,\n  GGNOMAD_EVENTS_QUERY,\n} from '../graphql';\nimport { PageShell } from './PageShell';\n\nexport function DashboardPage() {\n  const { t } = useI18n();\n  const overview = useQuery<{\n    ggnomadOverviewStats: {\n      users: number;\n      listings: number;\n      bookings: number;\n      monthlyRevenue: number;\n    };\n  }>(GGNOMAD_OVERVIEW_QUERY);\n  const bookings = useQuery<{\n    ggnomadBookings: Array<{ id: string; referenceCode: string; itemName: string; status: string }>;\n  }>(GGNOMAD_BOOKINGS_QUERY, {\n    variables: { first: 5, skip: 0 },\n  });\n  const properties = useQuery<{ ggnomadProperties: Array<{ id: string }> }>(\n    GGNOMAD_PROPERTIES_QUERY,\n    { variables: { first: 4, skip: 0 } }\n  );\n  const tours = useQuery<{ ggnomadTours: Array<{ id: string }> }>(GGNOMAD_TOURS_QUERY, {\n    variables: { first: 4, skip: 0 },\n  });\n  const events = useQuery<{ ggnomadEvents: Array<{ id: string }> }>(GGNOMAD_EVENTS_QUERY, {\n    variables: { first: 4, skip: 0 },\n  });\n\n  const stats = overview.data?.ggnomadOverviewStats;\n\n  return (\n    <PageShell\n      title={t('ggnomad.dashboard.title', 'GGNomad Dashboard')}\n      subtitle={t(\n        'ggnomad.dashboard.subtitle',\n        'Unified travel, hospitality, tourism and entertainment operations'\n      )}\n    >\n      <section className=\"grid gap-4 md:grid-cols-4\">\n        <div className=\"rounded-lg border p-4\">\n          <p className=\"text-sm text-text-secondary\">\n            {t('ggnomad.dashboard.stats.users', 'Users')}\n          </p>\n          <p className=\"text-2xl font-semibold\">{stats?.users ?? 0}</p>\n        </div>\n        <div className=\"rounded-lg border p-4\">\n          <p className=\"text-sm text-text-secondary\">\n            {t('ggnomad.dashboard.stats.listings', 'Listings')}\n          </p>\n          <p className=\"text-2xl font-semibold\">{stats?.listings ?? 0}</p>\n        </div>\n        <div className=\"rounded-lg border p-4\">\n          <p className=\"text-sm text-text-secondary\">\n            {t('ggnomad.dashboard.stats.bookings', 'Bookings')}\n          </p>\n          <p className=\"text-2xl font-semibold\">{stats?.bookings ?? 0}</p>\n        </div>\n        <div className=\"rounded-lg border p-4\">\n          <p className=\"text-sm text-text-secondary\">\n            {t('ggnomad.dashboard.stats.monthlyRevenue', 'Monthly Revenue')}\n          </p>\n          <p className=\"text-2xl font-semibold\">\n            ${Number(stats?.monthlyRevenue ?? 0).toLocaleString()}\n          </p>\n        </div>\n      </section>\n\n      <section className=\"grid gap-4 lg:grid-cols-2\">\n        <div className=\"rounded-lg border p-4\">\n          <h2 className=\"mb-3 text-lg font-medium\">\n            {t('ggnomad.dashboard.sections.recentBookings', 'Recent bookings')}\n          </h2>\n          <ul className=\"space-y-2 text-sm\">\n            {(bookings.data?.ggnomadBookings ?? []).map(\n              (booking: {\n                id: string;\n                referenceCode: string;\n                itemName: string;\n                status: string;\n              }) => (\n                <li\n                  key={booking.id}\n                  className=\"flex items-center justify-between rounded border p-2\"\n                >\n                  <span>\n                    {booking.referenceCode} - {booking.itemName}\n                  </span>\n                  <span className=\"text-text-secondary\">{booking.status}</span>\n                </li>\n              )\n            )}\n          </ul>\n        </div>\n        <div className=\"rounded-lg border p-4\">\n          <h2 className=\"mb-3 text-lg font-medium\">\n            {t('ggnomad.dashboard.sections.featuredInventory', 'Featured inventory')}\n          </h2>\n          <div className=\"grid gap-2 text-sm\">\n            <p>\n              {t('ggnomad.dashboard.inventory.properties', 'Properties')}:{' '}\n              {properties.data?.ggnomadProperties?.length ?? 0}\n            </p>\n            <p>\n              {t('ggnomad.dashboard.inventory.tours', 'Tours')}:{' '}\n              {tours.data?.ggnomadTours?.length ?? 0}\n            </p>\n            <p>\n              {t('ggnomad.dashboard.inventory.events', 'Events')}:{' '}\n              {events.data?.ggnomadEvents?.length ?? 0}\n            </p>\n            <p className=\"text-text-secondary\">\n              {t(\n                'ggnomad.dashboard.inventory.liveDataNotice',\n                'Data is live from `wspace-ggnomad-svc` GraphQL APIs.'\n              )}\n            </p>\n          </div>\n        </div>\n      </section>\n    </PageShell>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/ggnomad/pages/DashboardPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport type { TypedDocumentNode } from '@apollo/client';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Building, CalendarCheck, Compass, DollarSign, Hotel, Search, Users } from 'lucide-react';\nimport { useNavigate } from 'react-router-dom';\nimport {\n  EmphasisPanel,\n  IllustratedEmptyState,\n  NextSteps,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\n\nimport {\n  GGNOMAD_OVERVIEW_QUERY,\n  GGNOMAD_BOOKINGS_QUERY,\n  GGNOMAD_PROPERTIES_QUERY,\n  GGNOMAD_TOURS_QUERY,\n  GGNOMAD_EVENTS_QUERY,\n} from '../graphql';\nimport { PageShell } from './PageShell';\nimport { SectionCard, StatCard, StatusBadge } from '../components';\n\nexport function DashboardPage() {\n  const { t } = useI18n();\n  const navigate = useNavigate();\n  const overview = useQuery(\n    GGNOMAD_OVERVIEW_QUERY as TypedDocumentNode<\n      {\n        ggnomadOverviewStats: {\n          users: number;\n          listings: number;\n          bookings: number;\n          monthlyRevenue: number;\n        };\n      },\n      Record<string, never>\n    >\n  );\n  const bookings = useQuery(\n    GGNOMAD_BOOKINGS_QUERY as TypedDocumentNode<\n      {\n        ggnomadBookings: Array<{\n          id: string;\n          referenceCode: string;\n          itemName: string;\n          status: string;\n        }>;\n      },\n      { first: number; skip: number }\n    >,\n    {\n      variables: { first: 5, skip: 0 },\n    }\n  );\n  const properties = useQuery(\n    GGNOMAD_PROPERTIES_QUERY as TypedDocumentNode<\n      { ggnomadProperties: Array<{ id: string }> },\n      { first: number; skip: number }\n    >,\n    { variables: { first: 4, skip: 0 } }\n  );\n  const tours = useQuery(\n    GGNOMAD_TOURS_QUERY as TypedDocumentNode<\n      { ggnomadTours: Array<{ id: string }> },\n      { first: number; skip: number }\n    >,\n    {\n      variables: { first: 4, skip: 0 },\n    }\n  );\n  const events = useQuery(\n    GGNOMAD_EVENTS_QUERY as TypedDocumentNode<\n      { ggnomadEvents: Array<{ id: string }> },\n      { first: number; skip: number }\n    >,\n    {\n      variables: { first: 4, skip: 0 },\n    }\n  );\n\n  const stats = overview.data?.ggnomadOverviewStats;\n  const recentBookings = bookings.data?.ggnomadBookings ?? [];\n\n  return (\n    <PageShell\n      hero\n      title={t('ggnomad.dashboard.title', 'GGNomad Dashboard')}\n      titleAccent={t('ggnomad.dashboard.title.accent', 'GGNomad')}\n      subtitle={t(\n        'ggnomad.dashboard.subtitle',\n        'Unified travel, hospitality, tourism and entertainment operations'\n      )}\n    >\n      <PagePurpose icon={<Compass className=\"size-4\" />}>\n        {t(\n          'ggnomad.dashboard.purpose',\n          'Your command centre for the whole GGNomad marketplace — see live revenue, users, listings and bookings across travel, hospitality, tourism and entertainment in one place, and jump straight into the area you want to work on.'\n        )}\n      </PagePurpose>\n\n      <NextSteps\n        storageKey=\"ggnomad-dashboard\"\n        steps={[\n          {\n            id: 'search',\n            label: t('ggnomad.dashboard.next.search', 'Search the catalogue'),\n            description: t(\n              'ggnomad.dashboard.next.searchDesc',\n              'Find inventory across every domain at once.'\n            ),\n            icon: <Search className=\"size-4\" />,\n            onClick: () => navigate('search'),\n          },\n          {\n            id: 'stays',\n            label: t('ggnomad.dashboard.next.stays', 'Browse places to stay'),\n            description: t(\n              'ggnomad.dashboard.next.staysDesc',\n              'Explore hospitality listings and open a property.'\n            ),\n            icon: <Hotel className=\"size-4\" />,\n            onClick: () => navigate('hospitality'),\n          },\n          {\n            id: 'tourism',\n            label: t('ggnomad.dashboard.next.tourism', 'Discover tours & activities'),\n            description: t(\n              'ggnomad.dashboard.next.tourismDesc',\n              'Plan what to do at each destination.'\n            ),\n            icon: <Compass className=\"size-4\" />,\n            onClick: () => navigate('tourism'),\n          },\n          {\n            id: 'bookings',\n            label: t('ggnomad.dashboard.next.bookings', 'Manage bookings'),\n            description: t(\n              'ggnomad.dashboard.next.bookingsDesc',\n              'Track and cancel reservations in real time.'\n            ),\n            icon: <CalendarCheck className=\"size-4\" />,\n            onClick: () => navigate('bookings'),\n          },\n        ]}\n      />\n\n      <section className=\"grid gap-4 sm:grid-cols-2 xl:grid-cols-4\">\n        <StatCard\n          hero\n          label={t('ggnomad.dashboard.stats.monthlyRevenue', 'Monthly Revenue')}\n          value={`$${Number(stats?.monthlyRevenue ?? 0).toLocaleString()}`}\n          icon={<DollarSign />}\n        />\n        <StatCard\n          label={t('ggnomad.dashboard.stats.users', 'Users')}\n          value={Number(stats?.users ?? 0).toLocaleString()}\n          icon={<Users />}\n        />\n        <StatCard\n          label={t('ggnomad.dashboard.stats.listings', 'Listings')}\n          value={Number(stats?.listings ?? 0).toLocaleString()}\n          icon={<Building />}\n        />\n        <StatCard\n          label={t('ggnomad.dashboard.stats.bookings', 'Bookings')}\n          value={Number(stats?.bookings ?? 0).toLocaleString()}\n          icon={<CalendarCheck />}\n        />\n      </section>\n\n      <EmphasisPanel>\n        <div className=\"grid gap-4 sm:grid-cols-3\">\n          <div>\n            <p className=\"text-sm text-text-secondary\">\n              {t('ggnomad.dashboard.inventory.properties', 'Properties')}\n            </p>\n            <p className=\"mt-1 text-2xl font-semibold tabular-nums text-text-primary\">\n              {properties.data?.ggnomadProperties?.length ?? 0}\n            </p>\n          </div>\n          <div>\n            <p className=\"text-sm text-text-secondary\">\n              {t('ggnomad.dashboard.inventory.tours', 'Tours')}\n            </p>\n            <p className=\"mt-1 text-2xl font-semibold tabular-nums text-text-primary\">\n              {tours.data?.ggnomadTours?.length ?? 0}\n            </p>\n          </div>\n          <div>\n            <p className=\"text-sm text-text-secondary\">\n              {t('ggnomad.dashboard.inventory.events', 'Events')}\n            </p>\n            <p className=\"mt-1 text-2xl font-semibold tabular-nums text-text-primary\">\n              {events.data?.ggnomadEvents?.length ?? 0}\n            </p>\n          </div>\n        </div>\n        <p className=\"mt-4 text-sm text-text-secondary\">\n          {t(\n            'ggnomad.dashboard.inventory.liveDataNotice',\n            'Data is live from `wspace-ggnomad-svc` GraphQL APIs.'\n          )}\n        </p>\n      </EmphasisPanel>\n\n      <SectionCard title={t('ggnomad.dashboard.sections.recentBookings', 'Recent bookings')}>\n        {recentBookings.length === 0 ? (\n          <IllustratedEmptyState\n            illustration=\"empty-data\"\n            title={t('ggnomad.dashboard.recentBookings.emptyTitle', 'No recent bookings')}\n            description={t(\n              'ggnomad.dashboard.recentBookings.emptyDescription',\n              'New bookings across travel, hospitality and tourism will appear here.'\n            )}\n          />\n        ) : (\n          <ul className=\"space-y-2 text-sm\">\n            {recentBookings.map((booking) => (\n              <li\n                key={booking.id}\n                className=\"flex items-center justify-between gap-3 rounded-lg border border-border-seam bg-bg-surface/40 p-3\"\n              >\n                <span className=\"min-w-0 truncate text-text-primary\">\n                  {booking.referenceCode} — {booking.itemName}\n                </span>\n                <StatusBadge status={booking.status} />\n              </li>\n            ))}\n          </ul>\n        )}\n      </SectionCard>\n    </PageShell>\n  );\n}\n"],"mappings":"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"}

package/dist/ggnomad/pages/EntertainmentPage.js

@@ -1,43 +1,50 @@
 import { GGNOMAD_EVENTS_QUERY as e } from "../graphql.js";
 import { PageShell as t } from "./PageShell.js";
-import { Link as n } from "react-router-dom";
-import { useQuery as r } from "@apollo/client/react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { EntityCard as n } from "../components/EntityCard.js";
+import "../components/index.js";
+import { Ticket as r } from "lucide-react";
+import { useI18n as i } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useQuery as a } from "@apollo/client/react";
+import { GlassCard as o, IllustratedEmptyState as s, PagePurpose as c } from "@burdenoff/fe-libs/ui";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/ggnomad/pages/EntertainmentPage.tsx
-function o() {
-	let { data: o } = r(e, { variables: {
+function d() {
+	let { t: d } = i(), { data: f } = a(e, { variables: {
 		first: 20,
 		skip: 0
-	} });
-	return /* @__PURE__ */ i(t, {
-		title: "Entertainment",
-		subtitle: "Events and live experiences",
-		children: /* @__PURE__ */ i("div", {
-			className: "grid gap-3 md:grid-cols-2",
-			children: (o?.ggnomadEvents ?? []).map((e) => /* @__PURE__ */ a(n, {
-				to: e.id,
-				className: "rounded-lg border p-4 text-sm hover:bg-bg-sunken/30",
-				children: [
-					/* @__PURE__ */ i("p", {
-						className: "font-medium",
-						children: e.name
-					}),
-					/* @__PURE__ */ i("p", {
-						className: "text-text-secondary",
-						children: e.category
-					}),
-					/* @__PURE__ */ i("p", { children: new Date(e.startsAt).toLocaleString() }),
-					/* @__PURE__ */ a("p", { children: [
-						e.currency,
-						" ",
-						Number(e.price).toFixed(2)
-					] })
-				]
-			}, e.id))
-		})
+	} }), p = f?.ggnomadEvents ?? [];
+	return /* @__PURE__ */ u(t, {
+		title: d("ggnomad.entertainment.title", "Entertainment"),
+		titleAccent: d("ggnomad.entertainment.title.accent", "Entertainment"),
+		subtitle: d("ggnomad.entertainment.subtitle", "Events and live experiences"),
+		children: [/* @__PURE__ */ l(c, {
+			icon: /* @__PURE__ */ l(r, { className: "size-4" }),
+			children: d("ggnomad.entertainment.purpose", "Find live events and experiences — concerts, shows and local happenings. Open an event to see its lineup, venue and timing, then book tickets for your trip dates.")
+		}), p.length === 0 ? /* @__PURE__ */ l(s, {
+			illustration: "empty-data",
+			title: d("ggnomad.entertainment.emptyTitle", "No events scheduled"),
+			description: d("ggnomad.entertainment.emptyDescription", "Upcoming events and live experiences will be listed here.")
+		}) : /* @__PURE__ */ u(o, {
+			treatment: "glass",
+			glow: !0,
+			className: "border-border-seam p-5",
+			children: [/* @__PURE__ */ l("h2", {
+				className: "mb-4 text-lg font-medium tracking-tight text-text-primary",
+				children: d("ggnomad.entertainment.upcomingEvents", "Upcoming events")
+			}), /* @__PURE__ */ l("div", {
+				className: "grid gap-3 sm:grid-cols-2 xl:grid-cols-3",
+				children: p.map((e) => /* @__PURE__ */ l(n, {
+					to: e.id,
+					title: e.name,
+					meta: e.category,
+					price: `${e.currency} ${Number(e.price).toFixed(2)}`,
+					footer: new Date(e.startsAt).toLocaleString()
+				}, e.id))
+			})]
+		})]
 	});
 }
 //#endregion
-export { o as EntertainmentPage };
+export { d as EntertainmentPage };
 
 //# sourceMappingURL=EntertainmentPage.js.map

package/dist/ggnomad/pages/EntertainmentPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntertainmentPage.js","names":[],"sources":["../../../src/ggnomad/pages/EntertainmentPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport { Link } from 'react-router-dom';\n\nimport { GGNOMAD_EVENTS_QUERY } from '../graphql';\nimport { PageShell } from './PageShell';\n\nexport function EntertainmentPage() {\n  const { data } = useQuery<{\n    ggnomadEvents: Array<{\n      id: string;\n      name: string;\n      category: string;\n      startsAt: string;\n      price: number;\n      currency: string;\n    }>;\n  }>(GGNOMAD_EVENTS_QUERY, { variables: { first: 20, skip: 0 } });\n  const events = data?.ggnomadEvents ?? [];\n\n  return (\n    <PageShell title=\"Entertainment\" subtitle=\"Events and live experiences\">\n      <div className=\"grid gap-3 md:grid-cols-2\">\n        {events.map(\n          (event: {\n            id: string;\n            name: string;\n            category: string;\n            startsAt: string;\n            price: number;\n            currency: string;\n          }) => (\n            <Link\n              key={event.id}\n              to={event.id}\n              className=\"rounded-lg border p-4 text-sm hover:bg-bg-sunken/30\"\n            >\n              <p className=\"font-medium\">{event.name}</p>\n              <p className=\"text-text-secondary\">{event.category}</p>\n              <p>{new Date(event.startsAt).toLocaleString()}</p>\n              <p>\n                {event.currency} {Number(event.price).toFixed(2)}\n              </p>\n            </Link>\n          )\n        )}\n      </div>\n    </PageShell>\n  );\n}\n"],"mappings":";;;;;;AAMA,SAAgB,IAAoB;CAClC,IAAM,EAAE,YAAS,EASd,GAAsB,EAAE,WAAW;EAAE,OAAO;EAAI,MAAM;EAAG,EAAE,CAAC;AAG/D,QACE,kBAAC,GAAD;EAAW,OAAM;EAAgB,UAAS;YACxC,kBAAC,OAAD;GAAK,WAAU;cAJJ,GAAM,iBAAiB,EAAE,EAK1B,KACL,MAQC,kBAAC,GAAD;IAEE,IAAI,EAAM;IACV,WAAU;cAHZ;KAKE,kBAAC,KAAD;MAAG,WAAU;gBAAe,EAAM;MAAS,CAAA;KAC3C,kBAAC,KAAD;MAAG,WAAU;gBAAuB,EAAM;MAAa,CAAA;KACvD,kBAAC,KAAD,EAAA,UAAI,IAAI,KAAK,EAAM,SAAS,CAAC,gBAAgB,EAAK,CAAA;KAClD,kBAAC,KAAD,EAAA,UAAA;MACG,EAAM;MAAS;MAAE,OAAO,EAAM,MAAM,CAAC,QAAQ,EAAE;MAC9C,EAAA,CAAA;KACC;MAVA,EAAM,GAUN,CAEV;GACG,CAAA;EACI,CAAA"}
+{"version":3,"file":"EntertainmentPage.js","names":[],"sources":["../../../src/ggnomad/pages/EntertainmentPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport type { TypedDocumentNode } from '@apollo/client';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Ticket } from 'lucide-react';\nimport { GlassCard, IllustratedEmptyState, PagePurpose } from '@burdenoff/fe-libs/ui';\n\nimport { GGNOMAD_EVENTS_QUERY } from '../graphql';\nimport { PageShell } from './PageShell';\nimport { EntityCard } from '../components';\n\nexport function EntertainmentPage() {\n  const { t } = useI18n();\n  const { data } = useQuery(\n    GGNOMAD_EVENTS_QUERY as TypedDocumentNode<\n      {\n        ggnomadEvents: Array<{\n          id: string;\n          name: string;\n          category: string;\n          startsAt: string;\n          price: number;\n          currency: string;\n        }>;\n      },\n      { first: number; skip: number }\n    >,\n    { variables: { first: 20, skip: 0 } }\n  );\n  const events = data?.ggnomadEvents ?? [];\n\n  return (\n    <PageShell\n      title={t('ggnomad.entertainment.title', 'Entertainment')}\n      titleAccent={t('ggnomad.entertainment.title.accent', 'Entertainment')}\n      subtitle={t('ggnomad.entertainment.subtitle', 'Events and live experiences')}\n    >\n      <PagePurpose icon={<Ticket className=\"size-4\" />}>\n        {t(\n          'ggnomad.entertainment.purpose',\n          'Find live events and experiences — concerts, shows and local happenings. Open an event to see its lineup, venue and timing, then book tickets for your trip dates.'\n        )}\n      </PagePurpose>\n\n      {events.length === 0 ? (\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title={t('ggnomad.entertainment.emptyTitle', 'No events scheduled')}\n          description={t(\n            'ggnomad.entertainment.emptyDescription',\n            'Upcoming events and live experiences will be listed here.'\n          )}\n        />\n      ) : (\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam p-5\">\n          <h2 className=\"mb-4 text-lg font-medium tracking-tight text-text-primary\">\n            {t('ggnomad.entertainment.upcomingEvents', 'Upcoming events')}\n          </h2>\n          <div className=\"grid gap-3 sm:grid-cols-2 xl:grid-cols-3\">\n            {events.map((event) => (\n              <EntityCard\n                key={event.id}\n                to={event.id}\n                title={event.name}\n                meta={event.category}\n                price={`${event.currency} ${Number(event.price).toFixed(2)}`}\n                footer={new Date(event.startsAt).toLocaleString()}\n              />\n            ))}\n          </div>\n        </GlassCard>\n      )}\n    </PageShell>\n  );\n}\n"],"mappings":";;;;;;;;;;AAUA,SAAgB,IAAoB;CAClC,IAAM,EAAE,SAAM,GAAS,EACjB,EAAE,YAAS,EACf,GAaA,EAAE,WAAW;EAAE,OAAO;EAAI,MAAM;EAAG,EAAE,CACtC,EACK,IAAS,GAAM,iBAAiB,EAAE;AAExC,QACE,kBAAC,GAAD;EACE,OAAO,EAAE,+BAA+B,gBAAgB;EACxD,aAAa,EAAE,sCAAsC,gBAAgB;EACrE,UAAU,EAAE,kCAAkC,8BAA8B;YAH9E,CAKE,kBAAC,GAAD;GAAa,MAAM,kBAAC,GAAD,EAAQ,WAAU,UAAW,CAAA;aAC7C,EACC,iCACA,qKACD;GACW,CAAA,EAEb,EAAO,WAAW,IACjB,kBAAC,GAAD;GACE,cAAa;GACb,OAAO,EAAE,oCAAoC,sBAAsB;GACnE,aAAa,EACX,0CACA,4DACD;GACD,CAAA,GAEF,kBAAC,GAAD;GAAW,WAAU;GAAQ,MAAA;GAAK,WAAU;aAA5C,CACE,kBAAC,MAAD;IAAI,WAAU;cACX,EAAE,wCAAwC,kBAAkB;IAC1D,CAAA,EACL,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAO,KAAK,MACX,kBAAC,GAAD;KAEE,IAAI,EAAM;KACV,OAAO,EAAM;KACb,MAAM,EAAM;KACZ,OAAO,GAAG,EAAM,SAAS,GAAG,OAAO,EAAM,MAAM,CAAC,QAAQ,EAAE;KAC1D,QAAQ,IAAI,KAAK,EAAM,SAAS,CAAC,gBAAgB;KACjD,EANK,EAAM,GAMX,CACF;IACE,CAAA,CACI;KAEJ"}

package/dist/ggnomad/pages/EventDetailsPage.js

@@ -1,49 +1,96 @@
 import { GGNOMAD_EVENT_QUERY as e } from "../graphql.js";
 import { PageShell as t } from "./PageShell.js";
-import { useParams as n } from "react-router-dom";
-import { useQuery as r } from "@apollo/client/react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { SectionCard as n } from "../components/SectionCard.js";
+import { DetailRow as r } from "../components/DetailRow.js";
+import "../components/index.js";
+import { CalendarCheck as i, Mic2 as a, Ticket as o } from "lucide-react";
+import { useI18n as s } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useNavigate as c, useParams as l } from "react-router-dom";
+import { useQuery as u } from "@apollo/client/react";
+import { GlassCard as d, IllustratedEmptyState as f, NextSteps as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
 //#region src/ggnomad/pages/EventDetailsPage.tsx
-function o() {
-	let { id: o = "" } = n(), { data: s } = r(e, {
-		variables: { id: o },
-		skip: !o
-	}), c = s?.ggnomadEvent;
-	return /* @__PURE__ */ i(t, {
-		title: c?.name ?? "Event details",
-		subtitle: "Live event details, venue and lineup",
-		children: c ? /* @__PURE__ */ a("div", {
-			className: "grid gap-4 md:grid-cols-2 text-sm",
-			children: [/* @__PURE__ */ a("div", {
-				className: "rounded-lg border p-4",
-				children: [
-					/* @__PURE__ */ a("p", { children: ["Category: ", c.category] }),
-					/* @__PURE__ */ a("p", { children: ["Starts: ", new Date(c.startsAt).toLocaleString()] }),
-					/* @__PURE__ */ a("p", { children: ["Ends: ", c.endsAt ? new Date(c.endsAt).toLocaleString() : "N/A"] }),
-					/* @__PURE__ */ a("p", { children: [
-						"Price: ",
-						c.currency,
-						" ",
-						Number(c.price).toFixed(2)
-					] })
-				]
-			}), /* @__PURE__ */ a("div", {
-				className: "rounded-lg border p-4",
-				children: [/* @__PURE__ */ i("p", {
-					className: "font-medium",
-					children: "Performers"
-				}), /* @__PURE__ */ i("ul", {
-					className: "list-inside list-disc",
-					children: (c.performers ?? []).map((e) => /* @__PURE__ */ i("li", { children: e }, e))
+function v() {
+	let { t: v } = s(), y = c(), { id: b = "" } = l(), { data: x } = u(e, {
+		variables: { id: b },
+		skip: !b
+	}), S = x?.ggnomadEvent;
+	return /* @__PURE__ */ g(t, {
+		title: S?.name ?? v("ggnomad.event.fallbackTitle", "Event details"),
+		subtitle: v("ggnomad.event.subtitle", "Live event details, venue and lineup"),
+		children: S ? /* @__PURE__ */ _(h, { children: [
+			/* @__PURE__ */ g(m, {
+				icon: /* @__PURE__ */ g(o, { className: "size-4" }),
+				children: v("ggnomad.event.purpose", "All the details for this live event in one place — category, start and end times, ticket price and the full lineup — so you can decide and book tickets before they sell out.")
+			}),
+			/* @__PURE__ */ g(p, {
+				storageKey: "ggnomad-event-detail",
+				steps: [{
+					id: "book",
+					label: v("ggnomad.event.next.book", "Book tickets"),
+					description: v("ggnomad.event.next.bookDesc", "Reserve seats and track them under Bookings."),
+					icon: /* @__PURE__ */ g(i, { className: "size-4" }),
+					onClick: () => y("../../bookings")
+				}, {
+					id: "browse",
+					label: v("ggnomad.event.next.browse", "See more events"),
+					description: v("ggnomad.event.next.browseDesc", "Return to Entertainment for other live experiences."),
+					icon: /* @__PURE__ */ g(o, { className: "size-4" }),
+					onClick: () => y("..")
+				}]
+			}),
+			/* @__PURE__ */ _("div", {
+				className: "grid gap-4 lg:grid-cols-2",
+				children: [/* @__PURE__ */ _(d, {
+					treatment: "glass",
+					glow: !0,
+					className: "border-border-seam p-5",
+					children: [/* @__PURE__ */ g("h2", {
+						className: "mb-4 text-lg font-medium tracking-tight text-text-primary",
+						children: v("ggnomad.event.details", "Details")
+					}), /* @__PURE__ */ _("dl", {
+						className: "space-y-2 text-sm",
+						children: [
+							/* @__PURE__ */ g(r, {
+								label: v("ggnomad.event.category", "Category"),
+								value: S.category
+							}),
+							/* @__PURE__ */ g(r, {
+								label: v("ggnomad.event.starts", "Starts"),
+								value: new Date(S.startsAt).toLocaleString()
+							}),
+							/* @__PURE__ */ g(r, {
+								label: v("ggnomad.event.ends", "Ends"),
+								value: S.endsAt ? new Date(S.endsAt).toLocaleString() : v("ggnomad.event.na", "N/A")
+							}),
+							/* @__PURE__ */ g(r, {
+								label: v("ggnomad.event.price", "Price"),
+								value: `${S.currency} ${Number(S.price).toFixed(2)}`
+							})
+						]
+					})]
+				}), /* @__PURE__ */ g(n, {
+					title: v("ggnomad.event.performers", "Performers"),
+					children: /* @__PURE__ */ g("ul", {
+						className: "space-y-2 text-sm",
+						children: (S.performers ?? []).map((e) => /* @__PURE__ */ _("li", {
+							className: "flex items-start gap-2 text-text-primary",
+							children: [/* @__PURE__ */ g(a, {
+								className: "mt-0.5 size-4 flex-shrink-0 text-action-primary-bg",
+								"aria-hidden": "true"
+							}), e]
+						}, e))
+					})
 				})]
-			})]
-		}) : /* @__PURE__ */ i("div", {
-			className: "rounded-lg border p-4 text-text-secondary",
-			children: "No event found."
+			})
+		] }) : /* @__PURE__ */ g(f, {
+			illustration: "empty-data",
+			title: v("ggnomad.event.notFoundTitle", "No event found"),
+			description: v("ggnomad.event.notFoundDescription", "This event is unavailable or may have been removed.")
 		})
 	});
 }
 //#endregion
-export { o as EventDetailsPage };
+export { v as EventDetailsPage };
 
 //# sourceMappingURL=EventDetailsPage.js.map

package/dist/ggnomad/pages/EventDetailsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"EventDetailsPage.js","names":[],"sources":["../../../src/ggnomad/pages/EventDetailsPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport { useParams } from 'react-router-dom';\n\nimport { GGNOMAD_EVENT_QUERY } from '../graphql';\nimport { PageShell } from './PageShell';\n\nexport function EventDetailsPage() {\n  const { id = '' } = useParams();\n  const { data } = useQuery<{\n    ggnomadEvent: {\n      name: string;\n      category: string;\n      startsAt: string;\n      endsAt?: string;\n      currency: string;\n      price: number;\n      performers: string[];\n    } | null;\n  }>(GGNOMAD_EVENT_QUERY, { variables: { id }, skip: !id });\n  const event = data?.ggnomadEvent;\n\n  return (\n    <PageShell\n      title={event?.name ?? 'Event details'}\n      subtitle=\"Live event details, venue and lineup\"\n    >\n      {!event ? (\n        <div className=\"rounded-lg border p-4 text-text-secondary\">No event found.</div>\n      ) : (\n        <div className=\"grid gap-4 md:grid-cols-2 text-sm\">\n          <div className=\"rounded-lg border p-4\">\n            <p>Category: {event.category}</p>\n            <p>Starts: {new Date(event.startsAt).toLocaleString()}</p>\n            <p>Ends: {event.endsAt ? new Date(event.endsAt).toLocaleString() : 'N/A'}</p>\n            <p>\n              Price: {event.currency} {Number(event.price).toFixed(2)}\n            </p>\n          </div>\n          <div className=\"rounded-lg border p-4\">\n            <p className=\"font-medium\">Performers</p>\n            <ul className=\"list-inside list-disc\">\n              {(event.performers ?? []).map((performer: string) => (\n                <li key={performer}>{performer}</li>\n              ))}\n            </ul>\n          </div>\n        </div>\n      )}\n    </PageShell>\n  );\n}\n"],"mappings":";;;;;;AAMA,SAAgB,IAAmB;CACjC,IAAM,EAAE,QAAK,OAAO,GAAW,EACzB,EAAE,YAAS,EAUd,GAAqB;EAAE,WAAW,EAAE,OAAI;EAAE,MAAM,CAAC;EAAI,CAAC,EACnD,IAAQ,GAAM;AAEpB,QACE,kBAAC,GAAD;EACE,OAAO,GAAO,QAAQ;EACtB,UAAS;YAEP,IAGA,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,KAAD,EAAA,UAAA,CAAG,cAAW,EAAM,SAAa,EAAA,CAAA;KACjC,kBAAC,KAAD,EAAA,UAAA,CAAG,YAAS,IAAI,KAAK,EAAM,SAAS,CAAC,gBAAgB,CAAK,EAAA,CAAA;KAC1D,kBAAC,KAAD,EAAA,UAAA,CAAG,UAAO,EAAM,SAAS,IAAI,KAAK,EAAM,OAAO,CAAC,gBAAgB,GAAG,MAAU,EAAA,CAAA;KAC7E,kBAAC,KAAD,EAAA,UAAA;MAAG;MACO,EAAM;MAAS;MAAE,OAAO,EAAM,MAAM,CAAC,QAAQ,EAAE;MACrD,EAAA,CAAA;KACA;OACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,KAAD;KAAG,WAAU;eAAc;KAAc,CAAA,EACzC,kBAAC,MAAD;KAAI,WAAU;gBACV,EAAM,cAAc,EAAE,EAAE,KAAK,MAC7B,kBAAC,MAAD,EAAA,UAAqB,GAAe,EAA3B,EAA2B,CACpC;KACC,CAAA,CACD;MACF;OAnBN,kBAAC,OAAD;GAAK,WAAU;aAA4C;GAAqB,CAAA;EAqBxE,CAAA"}
+{"version":3,"file":"EventDetailsPage.js","names":[],"sources":["../../../src/ggnomad/pages/EventDetailsPage.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client/react';\nimport type { TypedDocumentNode } from '@apollo/client';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { useNavigate, useParams } from 'react-router-dom';\nimport { CalendarCheck, Mic2, Ticket } from 'lucide-react';\nimport { GlassCard, IllustratedEmptyState, NextSteps, PagePurpose } from '@burdenoff/fe-libs/ui';\n\nimport { GGNOMAD_EVENT_QUERY } from '../graphql';\nimport { PageShell } from './PageShell';\nimport { DetailRow, SectionCard } from '../components';\n\nexport function EventDetailsPage() {\n  const { t } = useI18n();\n  const navigate = useNavigate();\n  const { id = '' } = useParams();\n  const { data } = useQuery(\n    GGNOMAD_EVENT_QUERY as TypedDocumentNode<\n      {\n        ggnomadEvent: {\n          name: string;\n          category: string;\n          startsAt: string;\n          endsAt?: string;\n          currency: string;\n          price: number;\n          performers: string[];\n        } | null;\n      },\n      { id: string }\n    >,\n    { variables: { id }, skip: !id }\n  );\n  const event = data?.ggnomadEvent;\n\n  return (\n    <PageShell\n      title={event?.name ?? t('ggnomad.event.fallbackTitle', 'Event details')}\n      subtitle={t('ggnomad.event.subtitle', 'Live event details, venue and lineup')}\n    >\n      {!event ? (\n        <IllustratedEmptyState\n          illustration=\"empty-data\"\n          title={t('ggnomad.event.notFoundTitle', 'No event found')}\n          description={t(\n            'ggnomad.event.notFoundDescription',\n            'This event is unavailable or may have been removed.'\n          )}\n        />\n      ) : (\n        <>\n          <PagePurpose icon={<Ticket className=\"size-4\" />}>\n            {t(\n              'ggnomad.event.purpose',\n              'All the details for this live event in one place — category, start and end times, ticket price and the full lineup — so you can decide and book tickets before they sell out.'\n            )}\n          </PagePurpose>\n\n          <NextSteps\n            storageKey=\"ggnomad-event-detail\"\n            steps={[\n              {\n                id: 'book',\n                label: t('ggnomad.event.next.book', 'Book tickets'),\n                description: t(\n                  'ggnomad.event.next.bookDesc',\n                  'Reserve seats and track them under Bookings.'\n                ),\n                icon: <CalendarCheck className=\"size-4\" />,\n                onClick: () => navigate('../../bookings'),\n              },\n              {\n                id: 'browse',\n                label: t('ggnomad.event.next.browse', 'See more events'),\n                description: t(\n                  'ggnomad.event.next.browseDesc',\n                  'Return to Entertainment for other live experiences.'\n                ),\n                icon: <Ticket className=\"size-4\" />,\n                onClick: () => navigate('..'),\n              },\n            ]}\n          />\n\n          <div className=\"grid gap-4 lg:grid-cols-2\">\n            <GlassCard treatment=\"glass\" glow className=\"border-border-seam p-5\">\n              <h2 className=\"mb-4 text-lg font-medium tracking-tight text-text-primary\">\n                {t('ggnomad.event.details', 'Details')}\n              </h2>\n              <dl className=\"space-y-2 text-sm\">\n                <DetailRow label={t('ggnomad.event.category', 'Category')} value={event.category} />\n                <DetailRow\n                  label={t('ggnomad.event.starts', 'Starts')}\n                  value={new Date(event.startsAt).toLocaleString()}\n                />\n                <DetailRow\n                  label={t('ggnomad.event.ends', 'Ends')}\n                  value={\n                    event.endsAt\n                      ? new Date(event.endsAt).toLocaleString()\n                      : t('ggnomad.event.na', 'N/A')\n                  }\n                />\n                <DetailRow\n                  label={t('ggnomad.event.price', 'Price')}\n                  value={`${event.currency} ${Number(event.price).toFixed(2)}`}\n                />\n              </dl>\n            </GlassCard>\n            <SectionCard title={t('ggnomad.event.performers', 'Performers')}>\n              <ul className=\"space-y-2 text-sm\">\n                {(event.performers ?? []).map((performer) => (\n                  <li key={performer} className=\"flex items-start gap-2 text-text-primary\">\n                    <Mic2\n                      className=\"mt-0.5 size-4 flex-shrink-0 text-action-primary-bg\"\n                      aria-hidden=\"true\"\n                    />\n                    {performer}\n                  </li>\n                ))}\n              </ul>\n            </SectionCard>\n          </div>\n        </>\n      )}\n    </PageShell>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAWA,SAAgB,IAAmB;CACjC,IAAM,EAAE,SAAM,GAAS,EACjB,IAAW,GAAa,EACxB,EAAE,QAAK,OAAO,GAAW,EACzB,EAAE,YAAS,EACf,GAcA;EAAE,WAAW,EAAE,OAAI;EAAE,MAAM,CAAC;EAAI,CACjC,EACK,IAAQ,GAAM;AAEpB,QACE,kBAAC,GAAD;EACE,OAAO,GAAO,QAAQ,EAAE,+BAA+B,gBAAgB;EACvE,UAAU,EAAE,0BAA0B,uCAAuC;YAE3E,IAUA,kBAAA,GAAA,EAAA,UAAA;GACE,kBAAC,GAAD;IAAa,MAAM,kBAAC,GAAD,EAAQ,WAAU,UAAW,CAAA;cAC7C,EACC,yBACA,gLACD;IACW,CAAA;GAEd,kBAAC,GAAD;IACE,YAAW;IACX,OAAO,CACL;KACE,IAAI;KACJ,OAAO,EAAE,2BAA2B,eAAe;KACnD,aAAa,EACX,+BACA,+CACD;KACD,MAAM,kBAAC,GAAD,EAAe,WAAU,UAAW,CAAA;KAC1C,eAAe,EAAS,iBAAiB;KAC1C,EACD;KACE,IAAI;KACJ,OAAO,EAAE,6BAA6B,kBAAkB;KACxD,aAAa,EACX,iCACA,sDACD;KACD,MAAM,kBAAC,GAAD,EAAQ,WAAU,UAAW,CAAA;KACnC,eAAe,EAAS,KAAK;KAC9B,CACF;IACD,CAAA;GAEF,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD;KAAW,WAAU;KAAQ,MAAA;KAAK,WAAU;eAA5C,CACE,kBAAC,MAAD;MAAI,WAAU;gBACX,EAAE,yBAAyB,UAAU;MACnC,CAAA,EACL,kBAAC,MAAD;MAAI,WAAU;gBAAd;OACE,kBAAC,GAAD;QAAW,OAAO,EAAE,0BAA0B,WAAW;QAAE,OAAO,EAAM;QAAY,CAAA;OACpF,kBAAC,GAAD;QACE,OAAO,EAAE,wBAAwB,SAAS;QAC1C,OAAO,IAAI,KAAK,EAAM,SAAS,CAAC,gBAAgB;QAChD,CAAA;OACF,kBAAC,GAAD;QACE,OAAO,EAAE,sBAAsB,OAAO;QACtC,OACE,EAAM,SACF,IAAI,KAAK,EAAM,OAAO,CAAC,gBAAgB,GACvC,EAAE,oBAAoB,MAAM;QAElC,CAAA;OACF,kBAAC,GAAD;QACE,OAAO,EAAE,uBAAuB,QAAQ;QACxC,OAAO,GAAG,EAAM,SAAS,GAAG,OAAO,EAAM,MAAM,CAAC,QAAQ,EAAE;QAC1D,CAAA;OACC;QACK;QACZ,kBAAC,GAAD;KAAa,OAAO,EAAE,4BAA4B,aAAa;eAC7D,kBAAC,MAAD;MAAI,WAAU;iBACV,EAAM,cAAc,EAAE,EAAE,KAAK,MAC7B,kBAAC,MAAD;OAAoB,WAAU;iBAA9B,CACE,kBAAC,GAAD;QACE,WAAU;QACV,eAAY;QACZ,CAAA,EACD,EACE;SANI,EAMJ,CACL;MACC,CAAA;KACO,CAAA,CACV;;GACL,EAAA,CAAA,GAlFH,kBAAC,GAAD;GACE,cAAa;GACb,OAAO,EAAE,+BAA+B,iBAAiB;GACzD,aAAa,EACX,qCACA,sDACD;GACD,CAAA;EA6EM,CAAA"}