@withpotter/pages-bookings 0.13.0-next.101

package/dist/dashboard/(bookings)/events/page.js

@@ -0,0 +1,214 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useItemLinks } from "@withpotter/lib/use-item-links";
+import { FLAT_CONTROL, TOOLBAR_H } from "@withpotter/ui-kit/toolbar-parts";
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { CalendarDays, LayoutGrid, List, Plus, Users } from "lucide-react";
+import {
+  ListPage,
+  ListFrame,
+  ListStates,
+  TableShell,
+  Th,
+  TableRow,
+  TablePagination,
+  Select,
+  Button,
+  ViewSwitch,
+  OverflowMenu,
+  OverflowItem,
+  StateView
+} from "@withpotter/ui-kit";
+import { StatusBadge } from "@withpotter/components/shared/status-badge";
+import { MobilePageHeader } from "@withpotter/components/mobile/mobile-page-header";
+import { useRegisterRefresh } from "@withpotter/components/mobile/pull-to-refresh-context";
+import { LIST_PAGE_SIZE } from "@withpotter/lib/list-page-size";
+import { useEventsData } from "./_hooks/use-events-data";
+import { EventGrid } from "./_components/event-grid";
+import { EventThumb } from "./_components/event-poster";
+import {
+  eventFacts,
+  eventPublicationStatus,
+  whenLabel
+} from "./_lib/event-facts";
+function EventsPage() {
+  const router = useRouter();
+  const links = useItemLinks();
+  const [view, setView] = useState("list");
+  const {
+    events,
+    total,
+    totalPages,
+    page,
+    setPage,
+    window,
+    setWindow,
+    loading,
+    error,
+    refetch
+  } = useEventsData();
+  useRegisterRefresh(refetch);
+  return /* @__PURE__ */ jsx(
+    ListPage,
+    {
+      largeTitle: true,
+      title: "Events",
+      mobileHeader: /* @__PURE__ */ jsx(
+        MobilePageHeader,
+        {
+          title: "Events",
+          action: {
+            label: "New event",
+            icon: Plus,
+            onClick: () => router.push("/dashboard/events/new?intent=event-tickets")
+          }
+        }
+      ),
+      actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          Select,
+          {
+            size: "sm",
+            value: window,
+            onChange: (value) => setWindow(value),
+            ariaLabel: "Which events to show",
+            options: [
+              { value: "all", label: "All events" },
+              { value: "upcoming", label: "Upcoming" },
+              { value: "past", label: "Past" }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ViewSwitch,
+          {
+            className: `${TOOLBAR_H} ${FLAT_CONTROL}`,
+            value: view,
+            onChange: setView,
+            "aria-label": "Show events as a list or a grid",
+            options: [
+              { value: "list", label: "List", icon: List },
+              { value: "grid", label: "Grid", icon: LayoutGrid }
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: `${TOOLBAR_H} ${FLAT_CONTROL}`,
+            icon: /* @__PURE__ */ jsx(Plus, {}),
+            onClick: () => router.push("/dashboard/events/new?intent=event-tickets"),
+            children: "New event"
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsx(ListFrame, { children: /* @__PURE__ */ jsx(
+        ListStates,
+        {
+          framed: true,
+          loading: loading && events.length === 0,
+          isEmpty: events.length === 0,
+          error,
+          onRetry: () => refetch(),
+          empty: (
+            /* The first-run state carries the act that resolves it, even
+                           though the header offers the same one: on an empty page the
+                           header button is small and in the far corner and this is in the
+                           middle of the screen, where the eye already is.
+            
+                           A NARROWED empty list says something else. Nobody arriving at
+                           "no past events" wants to be sold a new one — they want the
+                           window they came from. */
+            window === "all" ? /* @__PURE__ */ jsx(
+              StateView,
+              {
+                kind: "empty",
+                icon: CalendarDays,
+                title: "No events yet",
+                description: "Put on a night, sell the tickets, and see who is coming.",
+                action: {
+                  label: "New event",
+                  href: "/dashboard/events/new?intent=event-tickets"
+                }
+              }
+            ) : /* @__PURE__ */ jsx(
+              StateView,
+              {
+                kind: "empty",
+                icon: CalendarDays,
+                title: window === "upcoming" ? "Nothing coming up" : "Nothing has happened yet",
+                description: "Events with no date set are in All, which is where a half-written listing waits.",
+                action: {
+                  label: "Show all events",
+                  onClick: () => setWindow("all")
+                }
+              }
+            )
+          ),
+          children: view === "grid" ? /* @__PURE__ */ jsx("div", { className: "p-3", children: /* @__PURE__ */ jsx(EventGrid, { events }) }) : /* @__PURE__ */ jsx(
+            TableShell,
+            {
+              bare: true,
+              minWidth: 760,
+              footer: /* @__PURE__ */ jsx(
+                TablePagination,
+                {
+                  page,
+                  totalPages,
+                  pageSize: LIST_PAGE_SIZE,
+                  totalItems: total,
+                  entityName: "events",
+                  onPageChange: setPage
+                }
+              ),
+              head: /* @__PURE__ */ jsxs("tr", { className: "h-[44px]", children: [
+                /* @__PURE__ */ jsx(Th, { children: "Event" }),
+                /* @__PURE__ */ jsx(Th, { children: "When" }),
+                /* @__PURE__ */ jsx(Th, { children: "Tickets" }),
+                /* @__PURE__ */ jsx(Th, { children: "Status" }),
+                /* @__PURE__ */ jsx("th", { className: "w-12" })
+              ] }),
+              children: events.map((event) => {
+                const facts = eventFacts(event);
+                return /* @__PURE__ */ jsxs(
+                  TableRow,
+                  {
+                    onClick: () => router.push(links.detail(event.id)),
+                    children: [
+                      /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                        /* @__PURE__ */ jsx(EventThumb, { event }),
+                        /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                          /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-[var(--text-primary)]", children: event.title }),
+                          facts.venue && /* @__PURE__ */ jsx("div", { className: "text-xs text-[var(--text-tertiary)]", children: facts.venue })
+                        ] })
+                      ] }) }),
+                      /* @__PURE__ */ jsx("td", { className: "text-sm text-[var(--text-secondary)]", children: whenLabel(facts) }),
+                      /* @__PURE__ */ jsx("td", { className: "text-sm tabular-nums text-[var(--text-secondary)]", children: facts.capacity > 0 ? `${facts.sold} of ${facts.capacity}` : "\u2014" }),
+                      /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(StatusBadge, { status: eventPublicationStatus(event) }) }),
+                      /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(OverflowMenu, { children: /* @__PURE__ */ jsx(
+                        OverflowItem,
+                        {
+                          icon: /* @__PURE__ */ jsx(Users, {}),
+                          onClick: () => router.push(
+                            `/dashboard/bookings/attendees?contentId=${event.id}`
+                          ),
+                          children: "Who is coming"
+                        }
+                      ) }) })
+                    ]
+                  },
+                  event.id
+                );
+              })
+            }
+          )
+        }
+      ) })
+    }
+  );
+}
+export {
+  EventsPage as default
+};
+//# sourceMappingURL=page.js.map

package/dist/dashboard/(bookings)/events/page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/dashboard/%28bookings%29/events/page.tsx"],"sourcesContent":["'use client';\n\nimport { useItemLinks } from '@withpotter/lib/use-item-links';\nimport { FLAT_CONTROL, TOOLBAR_H } from '@withpotter/ui-kit/toolbar-parts';\nimport { useState } from 'react';\n\nimport { useRouter } from 'next/navigation';\nimport { CalendarDays, LayoutGrid, List, Plus, Users } from 'lucide-react';\nimport {\n  ListPage,\n  ListFrame,\n  ListStates,\n  TableShell,\n  Th,\n  TableRow,\n  TablePagination,\n  Select,\n  Button,\n  ViewSwitch,\n  OverflowMenu,\n  OverflowItem,\n  StateView,\n} from '@withpotter/ui-kit';\nimport { StatusBadge } from '@withpotter/components/shared/status-badge';\nimport { MobilePageHeader } from '@withpotter/components/mobile/mobile-page-header';\nimport { useRegisterRefresh } from '@withpotter/components/mobile/pull-to-refresh-context';\nimport { LIST_PAGE_SIZE } from '@withpotter/lib/list-page-size';\nimport { useEventsData, type EventWindow } from './_hooks/use-events-data';\nimport { EventGrid } from './_components/event-grid';\nimport { EventThumb } from './_components/event-poster';\nimport {\n  eventFacts,\n  eventPublicationStatus,\n  whenLabel,\n} from './_lib/event-facts';\n\n/**\n * EVERY EVENT THIS BUSINESS HAS PUT ON — John, 2026-09-03: *\"I need events I\n * have created, I need to be able to see all events I've created, so yes we\n * need a nav for that.\"*\n *\n * ── WHY THE CATALOGUE WAS NOT THIS ──\n *\n * An event IS a product with the `ticketed` behaviour, and the archetype's\n * catalogue row has always been called Event Listings, so on paper a ticket\n * business already had this page. Two things made it not one.\n *\n * The first is the axis. A shop reads its shelf by name and a venue reads its\n * diary by WHEN — what is on next, and what has been — and the catalogue could\n * not be asked either question: there was no event window in the API and no\n * sort by date on the screen. \"Show me past events\" meant scrolling the whole\n * catalogue.\n *\n * The second is the collapse. When a business runs tickets alongside anything\n * else, the sidebar folds the two catalogue rows into one — same destination,\n * so one row — and the merged row takes the generic noun. A shop that added\n * events got \"Products\", and its events stopped being nameable in the nav at\n * the moment it had two kinds of thing to tell apart. A separate destination\n * is what makes an Events row survive that, and the row is why this is a route\n * rather than a query parameter: `?intent=event-tickets` re-scopes the whole\n * shell, which is a different and much larger promise than \"show me my\n * events\".\n *\n * ── ATTENDEES ARE REACHED FROM AN EVENT ──\n *\n * Not from a global row of their own. An attendee is not a second kind of\n * person: it is a customer in relation to one night, and the identity belongs\n * in Customers where every other relationship this person has already lives.\n * What an operator needs on the door is the other thing entirely — this event's\n * 142, checked in or not — which is a view of an event and is where the row's\n * ⋯ sends you.\n */\nexport default function EventsPage() {\n  const router = useRouter();\n  const links = useItemLinks();\n  /**\n   * TABLE OR GRID — John, 2026-09-03: *\"the events page should have a grid\n   * view not just list.\"*\n   *\n   * A shop's stock list is read by name and reads well as rows. An event is a\n   * poster, and a promoter running six nights recognises theirs by the artwork\n   * long before they finish reading a title — which is the same argument the\n   * catalogue's own switch makes about products with photographs.\n   *\n   * `ViewSwitch`, because this is one set of records drawn two ways: the house\n   * primitive for exactly that, and not `OptionButton`, which is for a choice\n   * that narrows.\n   */\n  const [view, setView] = useState<'list' | 'grid'>('list');\n  const {\n    events,\n    total,\n    totalPages,\n    page,\n    setPage,\n    window,\n    setWindow,\n    loading,\n    error,\n    refetch,\n  } = useEventsData();\n\n  useRegisterRefresh(refetch);\n\n  return (\n    <ListPage\n      largeTitle\n      title=\"Events\"\n      mobileHeader={\n        <MobilePageHeader\n          title=\"Events\"\n          action={{\n            label: 'New event',\n            icon: Plus,\n            onClick: () =>\n              router.push('/dashboard/events/new?intent=event-tickets'),\n          }}\n        />\n      }\n      actions={\n        <>\n          {/* The window narrows the list, so it sits with the controls that\n              act on the list. Not a tab strip: the house rule is that a list\n              narrows in its filters, and a page-scoped pill row under a title\n              claims a line that belongs to the data. */}\n          <Select\n            size=\"sm\"\n            value={window}\n            onChange={(value) => setWindow(value as EventWindow)}\n            ariaLabel=\"Which events to show\"\n            options={[\n              { value: 'all', label: 'All events' },\n              { value: 'upcoming', label: 'Upcoming' },\n              { value: 'past', label: 'Past' },\n            ]}\n          />\n          {/* THE EDITOR, SCOPED TO EVENTS — not the plain product creator.\n              John, 2026-09-03: *\"when I click on create it goes to create\n              products.\"*\n\n              `ProductEditorPage` decides what it is making from whichever\n              archetype the workspace lists first, so a shop that later added\n              events pressed New event and got a form headed Product — no date,\n              no venue, no tiers. `?intent=event-tickets` is what\n              `useIntentConfig` reads to narrow that, which is exactly the\n              right promise on a create screen: this form is for one kind of\n              thing, and you have just said which. */}\n          <ViewSwitch\n            className={`${TOOLBAR_H} ${FLAT_CONTROL}`}\n            value={view}\n            onChange={setView}\n            aria-label=\"Show events as a list or a grid\"\n            options={[\n              { value: 'list', label: 'List', icon: List },\n              { value: 'grid', label: 'Grid', icon: LayoutGrid },\n            ]}\n          />\n          <Button\n            className={`${TOOLBAR_H} ${FLAT_CONTROL}`}\n            icon={<Plus />}\n            onClick={() =>\n              router.push('/dashboard/events/new?intent=event-tickets')\n            }\n          >\n            New event\n          </Button>\n        </>\n      }\n    >\n      <ListFrame>\n        <ListStates\n          framed\n          loading={loading && events.length === 0}\n          isEmpty={events.length === 0}\n          error={error}\n          onRetry={() => refetch()}\n          empty={\n            /* The first-run state carries the act that resolves it, even\n               though the header offers the same one: on an empty page the\n               header button is small and in the far corner and this is in the\n               middle of the screen, where the eye already is.\n\n               A NARROWED empty list says something else. Nobody arriving at\n               \"no past events\" wants to be sold a new one — they want the\n               window they came from. */\n            window === 'all' ? (\n              <StateView\n                kind=\"empty\"\n                icon={CalendarDays}\n                title=\"No events yet\"\n                description=\"Put on a night, sell the tickets, and see who is coming.\"\n                action={{\n                  label: 'New event',\n                  href: '/dashboard/events/new?intent=event-tickets',\n                }}\n              />\n            ) : (\n              <StateView\n                kind=\"empty\"\n                icon={CalendarDays}\n                title={\n                  window === 'upcoming'\n                    ? 'Nothing coming up'\n                    : 'Nothing has happened yet'\n                }\n                description=\"Events with no date set are in All, which is where a half-written listing waits.\"\n                action={{\n                  label: 'Show all events',\n                  onClick: () => setWindow('all'),\n                }}\n              />\n            )\n          }\n        >\n          {view === 'grid' ? (\n            <div className=\"p-3\">\n              <EventGrid events={events} />\n            </div>\n          ) : (\n            <TableShell\n              bare\n              minWidth={760}\n              footer={\n                <TablePagination\n                  page={page}\n                  totalPages={totalPages}\n                  pageSize={LIST_PAGE_SIZE}\n                  totalItems={total}\n                  entityName=\"events\"\n                  onPageChange={setPage}\n                />\n              }\n              head={\n                <tr className=\"h-[44px]\">\n                  <Th>Event</Th>\n                  <Th>When</Th>\n                  {/* Sold against what is on sale, which is the only number a\n                      venue is actually watching. A room's capacity is not it:\n                      seats held back were never for sale. */}\n                  <Th>Tickets</Th>\n                  <Th>Status</Th>\n                  <th className=\"w-12\" />\n                </tr>\n              }\n            >\n              {events.map((event) => {\n                const facts = eventFacts(event);\n                return (\n                  <TableRow\n                    key={event.id}\n                    onClick={() => router.push(links.detail(event.id))}\n                  >\n                    <td>\n                      <div className=\"flex items-center gap-3\">\n                        <EventThumb event={event} />\n                        <div className=\"min-w-0\">\n                          <div className=\"text-sm font-medium text-[var(--text-primary)]\">\n                            {event.title}\n                          </div>\n                          {facts.venue && (\n                            <div className=\"text-xs text-[var(--text-tertiary)]\">\n                              {facts.venue}\n                            </div>\n                          )}\n                        </div>\n                      </div>\n                    </td>\n                    <td className=\"text-sm text-[var(--text-secondary)]\">\n                      {whenLabel(facts)}\n                    </td>\n                    <td className=\"text-sm tabular-nums text-[var(--text-secondary)]\">\n                      {facts.capacity > 0\n                        ? `${facts.sold} of ${facts.capacity}`\n                        : '—'}\n                    </td>\n                    <td>\n                      <StatusBadge status={eventPublicationStatus(event)} />\n                    </td>\n                    <td>\n                      <OverflowMenu>\n                        <OverflowItem\n                          icon={<Users />}\n                          onClick={() =>\n                            router.push(\n                              `/dashboard/bookings/attendees?contentId=${event.id}`,\n                            )\n                          }\n                        >\n                          Who is coming\n                        </OverflowItem>\n                      </OverflowMenu>\n                    </td>\n                  </TableRow>\n                );\n              })}\n            </TableShell>\n          )}\n        </ListStates>\n      </ListFrame>\n    </ListPage>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/dashboard/(bookings)/resources/[resourceId]/layout.js

@@ -0,0 +1,36 @@
+"use client";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { useParams } from "next/navigation";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { resourcesApi } from "@withpotter/lib/api/resources";
+import { IntentScope } from "@withpotter/lib/intents/intent-scope";
+import { INTENTS } from "@withpotter/components/intents";
+import { ownerIntentOfResource } from "@withpotter/components/intents/item-owner";
+import { scopeLabelsFor } from "@withpotter/components/intents/scope-labels";
+function ResourceLayout({ children }) {
+  const { resourceId } = useParams();
+  const { tenant } = useAuth();
+  const { data: type } = useApiQuery(
+    ["resource", resourceId, "type"],
+    async (slug) => {
+      const res = await resourcesApi.get(slug, resourceId);
+      return res?.data?.type ?? res?.type ?? null;
+    },
+    { enabled: Boolean(resourceId && tenant?.slug) }
+  );
+  const owner = ownerIntentOfResource(type, INTENTS);
+  if (!owner) return /* @__PURE__ */ jsx(Fragment, { children });
+  return /* @__PURE__ */ jsx(
+    IntentScope,
+    {
+      intentKey: owner.key,
+      labels: scopeLabelsFor(owner, owner.nav.label),
+      children
+    }
+  );
+}
+export {
+  ResourceLayout as default
+};
+//# sourceMappingURL=layout.js.map

package/dist/dashboard/(bookings)/resources/[resourceId]/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/dashboard/%28bookings%29/resources/%5BresourceId%5D/layout.tsx"],"sourcesContent":["'use client';\n\nimport { useParams } from 'next/navigation';\nimport type { ReactNode } from 'react';\nimport { useAuth } from '@withpotter/lib/auth-context';\nimport { useApiQuery } from '@withpotter/hooks/use-api-query';\nimport { resourcesApi } from '@withpotter/lib/api/resources';\nimport { IntentScope } from '@withpotter/lib/intents/intent-scope';\nimport { INTENTS } from '@withpotter/components/intents';\nimport { ownerIntentOfResource } from '@withpotter/components/intents/item-owner';\nimport { scopeLabelsFor } from '@withpotter/components/intents/scope-labels';\n\n/**\n * A resource's screen, spoken in the words of the intent that manages it: a\n * table is a restaurant's, a room a rental's, a staff member a booking\n * business's. Each intent declares the resource types it manages, and the\n * resource says which it is. It shares the page's own query key.\n */\nexport default function ResourceLayout({ children }: { children: ReactNode }) {\n  const { resourceId } = useParams<{ resourceId: string }>();\n  const { tenant } = useAuth();\n\n  const { data: type } = useApiQuery<string | null>(\n    ['resource', resourceId, 'type'],\n    async (slug) => {\n      const res = (await resourcesApi.get(slug, resourceId)) as unknown as {\n        data?: { type?: string };\n        type?: string;\n      };\n      return res?.data?.type ?? res?.type ?? null;\n    },\n    { enabled: Boolean(resourceId && tenant?.slug) },\n  );\n\n  const owner = ownerIntentOfResource(type, INTENTS);\n  if (!owner) return <>{children}</>;\n\n  return (\n    <IntentScope\n      intentKey={owner.key}\n      labels={scopeLabelsFor(owner, owner.nav.label)}\n    >\n      {children}\n    </IntentScope>\n  );\n}\n"],"mappings":";AAmCqB;AAjCrB,SAAS,iBAAiB;AAE1B,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AACxB,SAAS,6BAA6B;AACtC,SAAS,sBAAsB;AAQhB,SAAR,eAAgC,EAAE,SAAS,GAA4B;AAC5E,QAAM,EAAE,WAAW,IAAI,UAAkC;AACzD,QAAM,EAAE,OAAO,IAAI,QAAQ;AAE3B,QAAM,EAAE,MAAM,KAAK,IAAI;AAAA,IACrB,CAAC,YAAY,YAAY,MAAM;AAAA,IAC/B,OAAO,SAAS;AACd,YAAM,MAAO,MAAM,aAAa,IAAI,MAAM,UAAU;AAIpD,aAAO,KAAK,MAAM,QAAQ,KAAK,QAAQ;AAAA,IACzC;AAAA,IACA,EAAE,SAAS,QAAQ,cAAc,QAAQ,IAAI,EAAE;AAAA,EACjD;AAEA,QAAM,QAAQ,sBAAsB,MAAM,OAAO;AACjD,MAAI,CAAC,MAAO,QAAO,gCAAG,UAAS;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,MAAM;AAAA,MACjB,QAAQ,eAAe,OAAO,MAAM,IAAI,KAAK;AAAA,MAE5C;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/dashboard/(bookings)/resources/[resourceId]/page.js

@@ -0,0 +1,351 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useItemLinks } from "@withpotter/lib/use-item-links";
+import { useEffect, useState } from "react";
+import { useParams, useRouter } from "next/navigation";
+import { Power, Trash2, Boxes } from "lucide-react";
+import { useAuth } from "@withpotter/lib/auth-context";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { useBusinessLocations } from "@withpotter/lib/use-business-locations";
+import { useDetailHeader } from "@withpotter/hooks/use-detail-header";
+import { useEntityLabel } from "@withpotter/lib/intents/use-entity-label";
+import { useModuleLabel } from "@withpotter/lib/use-module-label";
+import { resourceCategoriesApi } from "@withpotter/lib/api/resource-categories";
+import { resourcesApi } from "@withpotter/lib/api/resources";
+import { Button } from "@withpotter/ui-kit/button";
+import { DetailPage } from "@withpotter/ui-kit/detail-page";
+import { DetailStates } from "@withpotter/ui-kit/detail-states";
+import { EditorSection } from "@withpotter/ui-kit/editor-section";
+import { ErrorBanner } from "@withpotter/ui-kit/error-banner";
+import { Field } from "@withpotter/ui-kit/field";
+import { Input, NumberField, Select, Textarea } from "@withpotter/ui-kit";
+import { GeneratedAvatar } from "@withpotter/ui-kit/generated-avatar";
+import { OverflowMenu, OverflowItem } from "@withpotter/ui-kit/overflow-menu";
+import { StatusBadge } from "@withpotter/components/shared/status-badge";
+import { useConfirm } from "@withpotter/ui-kit/confirm-dialog";
+import { ImageUpload } from "@withpotter/components/image-upload";
+import { ScheduleEditor, getDefaultSchedule } from "../_components";
+import { availabilityWords } from "../_lib/shapes";
+function ResourceRecordPage() {
+  const params = useParams();
+  const router = useRouter();
+  const back = useItemLinks().resources;
+  const { tenant } = useAuth();
+  const confirm = useConfirm();
+  const resourceId = params.resourceId;
+  const slug = tenant?.slug ?? "";
+  const { locations, isMultiSite } = useBusinessLocations();
+  const resourceLabel = useEntityLabel("resource");
+  const listTitle = useModuleLabel("resources", resourceLabel.plural);
+  const {
+    data: resource,
+    isLoading,
+    error: loadError,
+    refetch
+  } = useApiQuery(["resource", resourceId], async (s) => {
+    const res = await resourcesApi.get(s, resourceId);
+    return res?.data ?? res ?? null;
+  });
+  const { data: categories } = useApiQuery(
+    ["resource-categories"],
+    (s) => resourceCategoriesApi.list(s)
+  );
+  const [categoryId, setCategoryId] = useState("");
+  const [locationId, setLocationId] = useState("");
+  const [name, setName] = useState("");
+  const [description, setDescription] = useState("");
+  const [imageUrl, setImageUrl] = useState("");
+  const [skills, setSkills] = useState("");
+  const [schedule, setSchedule] = useState(getDefaultSchedule());
+  const [defaultDuration, setDefaultDuration] = useState(60);
+  const [bufferMinutes, setBufferMinutes] = useState(0);
+  const [advanceBookingDays, setAdvanceBookingDays] = useState(30);
+  const [maxBookingsPerSlot, setMaxBookingsPerSlot] = useState(1);
+  const [price, setPrice] = useState("");
+  const [saving, setSaving] = useState(false);
+  const [saved, setSaved] = useState(false);
+  const [error, setError] = useState(null);
+  const groups = Array.isArray(categories) ? categories : [];
+  const category = groups.find((c) => c.id === categoryId) ?? null;
+  const kind = category?.kind ?? "person";
+  const { byTheNight } = availabilityWords(kind);
+  useEffect(() => {
+    if (!resource) return;
+    setCategoryId(resource.categoryId ?? "");
+    setLocationId(resource.locationId ?? "");
+    setName(resource.name);
+    setDescription(resource.description || "");
+    setImageUrl(resource.imageUrl || "");
+    setSkills(resource.skills?.join(", ") || "");
+    setSchedule(resource.schedule || getDefaultSchedule());
+    setDefaultDuration(resource.defaultDurationMinutes || 60);
+    setBufferMinutes(resource.bufferMinutes || 0);
+    setAdvanceBookingDays(resource.advanceBookingDays || 30);
+    setMaxBookingsPerSlot(resource.maxBookingsPerSlot || 1);
+    setPrice(resource.price != null ? String(resource.price) : "");
+  }, [resource]);
+  useDetailHeader({
+    title: resource?.name || resourceLabel.singular,
+    onBack: () => router.push(back)
+  });
+  const handleSave = async () => {
+    if (!resource) return;
+    if (!name.trim()) {
+      setError("Give it a name.");
+      return;
+    }
+    setSaving(true);
+    setError(null);
+    try {
+      await resourcesApi.update(slug, resource.id, {
+        ...categoryId ? { categoryId } : {},
+        // Omitted rather than sent empty: the API reads absence as the main
+        // location, which is not the same instruction as an empty string.
+        ...locationId ? { locationId } : {},
+        name: name.trim(),
+        description: description.trim() || void 0,
+        imageUrl: imageUrl.trim() || void 0,
+        skills: skills.split(",").map((s) => s.trim()).filter(Boolean),
+        schedule,
+        defaultDurationMinutes: defaultDuration,
+        bufferMinutes,
+        advanceBookingDays,
+        maxBookingsPerSlot,
+        price: price ? Number(price) : void 0
+      });
+      await refetch();
+      setSaved(true);
+      setTimeout(() => setSaved(false), 2e3);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "That did not save.");
+    } finally {
+      setSaving(false);
+    }
+  };
+  const handleToggleStatus = async () => {
+    if (!resource) return;
+    setError(null);
+    try {
+      if (resource.status === "active") {
+        await resourcesApi.deactivate(slug, resource.id);
+      } else {
+        await resourcesApi.activate(slug, resource.id);
+      }
+      await refetch();
+    } catch {
+      setError("Could not change whether it can be booked.");
+    }
+  };
+  const handleDelete = async () => {
+    if (!resource) return;
+    const ok = await confirm({
+      title: `Delete ${resource.name}?`,
+      description: "Bookings already taken keep their record. This cannot be undone.",
+      confirmLabel: "Delete",
+      tone: "danger"
+    });
+    if (!ok) return;
+    try {
+      await resourcesApi.delete(slug, resource.id);
+      router.push(back);
+    } catch {
+      setError("Could not delete it.");
+    }
+  };
+  if (isLoading || loadError || !resource) {
+    return /* @__PURE__ */ jsx(
+      DetailStates,
+      {
+        loading: isLoading,
+        error: loadError?.message,
+        notFoundLabel: `That ${resourceLabel.singular.toLowerCase()} is not here.`,
+        back: { href: back, label: listTitle },
+        onRetry: refetch,
+        maxWidth: "max-w-4xl"
+      }
+    );
+  }
+  const inactive = resource.status !== "active";
+  return /* @__PURE__ */ jsx(
+    DetailPage,
+    {
+      maxWidth: "max-w-4xl",
+      breadcrumbs: [
+        { label: listTitle, href: back, icon: /* @__PURE__ */ jsx(Boxes, {}) },
+        { label: resource.name }
+      ],
+      leading: resource.imageUrl ? (
+        // eslint-disable-next-line @next/next/no-img-element
+        /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: resource.imageUrl,
+            alt: "",
+            className: "size-10 squircle object-cover"
+          }
+        )
+      ) : /* @__PURE__ */ jsx(GeneratedAvatar, { name: resource.name, className: "size-10" }),
+      title: resource.name,
+      badges: /* @__PURE__ */ jsx(StatusBadge, { status: inactive ? "inactive" : "active" }),
+      actions: /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(OverflowMenu, { children: [
+          /* @__PURE__ */ jsx(OverflowItem, { icon: /* @__PURE__ */ jsx(Power, {}), onClick: handleToggleStatus, children: inactive ? "Make bookable" : "Take off the board" }),
+          /* @__PURE__ */ jsx(OverflowItem, { destructive: true, icon: /* @__PURE__ */ jsx(Trash2, {}), onClick: handleDelete, children: "Delete" })
+        ] }),
+        /* @__PURE__ */ jsx(Button, { onClick: handleSave, loading: saving, children: saved ? "Saved" : "Save" })
+      ] }),
+      children: /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsx(ErrorBanner, { children: error }),
+        /* @__PURE__ */ jsx(EditorSection, { title: "What a customer sees", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-4", children: [
+            kind === "person" && /* @__PURE__ */ jsx(
+              ImageUpload,
+              {
+                value: imageUrl || void 0,
+                onChange: (url) => setImageUrl(url ?? ""),
+                label: "Photo",
+                aspectRatio: "square",
+                size: "avatar"
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx(
+              Field,
+              {
+                label: kind === "person" ? "Full name" : "Name",
+                required: true,
+                children: /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    value: name,
+                    onChange: (e) => setName(e.target.value)
+                  }
+                )
+              }
+            ) })
+          ] }),
+          groups.length > 0 && // Bottom-aligned with the name beside it: the photo makes that
+          // cell tall, and the name sits at its foot, so a top-aligned
+          // Group read a row higher than the field next to it.
+          /* @__PURE__ */ jsx("div", { className: kind === "person" ? "md:self-end" : void 0, children: /* @__PURE__ */ jsx(Field, { label: "Group", children: /* @__PURE__ */ jsx(
+            Select,
+            {
+              value: categoryId,
+              onChange: setCategoryId,
+              options: groups.map((g) => ({
+                value: g.id,
+                label: g.labelPlural
+              })),
+              placeholder: "In no group"
+            }
+          ) }) }),
+          isMultiSite && /* @__PURE__ */ jsx(Field, { label: "Where", children: /* @__PURE__ */ jsx(
+            Select,
+            {
+              value: locationId,
+              onChange: setLocationId,
+              options: locations.map((l) => ({
+                value: l.id,
+                label: l.name
+              })),
+              placeholder: "Main location"
+            }
+          ) }),
+          kind === "person" && /* @__PURE__ */ jsx(
+            Field,
+            {
+              label: "Skills",
+              hint: "Comma separated. A service can ask for one of these.",
+              children: /* @__PURE__ */ jsx(
+                Input,
+                {
+                  value: skills,
+                  onChange: (e) => setSkills(e.target.value),
+                  placeholder: "e.g. Coloring, Braids, Styling"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "md:col-span-2", children: /* @__PURE__ */ jsx(Field, { label: "Description", children: /* @__PURE__ */ jsx(
+            Textarea,
+            {
+              value: description,
+              onChange: (e) => setDescription(e.target.value),
+              rows: 3,
+              className: "resize-none"
+            }
+          ) }) }),
+          kind !== "person" && /* @__PURE__ */ jsx("div", { className: "md:col-span-2", children: /* @__PURE__ */ jsx(
+            ImageUpload,
+            {
+              value: imageUrl || void 0,
+              onChange: (url) => setImageUrl(url ?? ""),
+              label: "Image",
+              aspectRatio: "video"
+            }
+          ) })
+        ] }) }),
+        /* @__PURE__ */ jsx(EditorSection, { title: "How it is booked", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4 md:grid-cols-4", children: [
+          !byTheNight && /* @__PURE__ */ jsx(Field, { label: "Duration", hint: "Minutes", children: /* @__PURE__ */ jsx(
+            NumberField,
+            {
+              min: 5,
+              decimal: false,
+              value: defaultDuration,
+              onChange: (v) => setDefaultDuration(v ?? 5)
+            }
+          ) }),
+          !byTheNight && /* @__PURE__ */ jsx(Field, { label: "Gap after", hint: "Minutes", children: /* @__PURE__ */ jsx(
+            NumberField,
+            {
+              min: 0,
+              decimal: false,
+              value: bufferMinutes,
+              onChange: (v) => setBufferMinutes(v ?? 0)
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Field, { label: "Booked ahead", hint: "Days", children: /* @__PURE__ */ jsx(
+            NumberField,
+            {
+              min: 1,
+              decimal: false,
+              value: advanceBookingDays,
+              onChange: (v) => setAdvanceBookingDays(v ?? 1)
+            }
+          ) }),
+          /* @__PURE__ */ jsx(Field, { label: byTheNight ? "Price a night" : "Price", children: /* @__PURE__ */ jsx(
+            Input,
+            {
+              type: "number",
+              min: 0,
+              step: "0.01",
+              value: price,
+              onChange: (e) => setPrice(e.target.value),
+              placeholder: "0.00"
+            }
+          ) }),
+          (kind === "space" || kind === "equipment") && /* @__PURE__ */ jsx(Field, { label: "At once", hint: "How many can share it", children: /* @__PURE__ */ jsx(
+            NumberField,
+            {
+              min: 1,
+              decimal: false,
+              value: maxBookingsPerSlot,
+              onChange: (v) => setMaxBookingsPerSlot(v ?? 1)
+            }
+          ) })
+        ] }) }),
+        !byTheNight && /* @__PURE__ */ jsx(EditorSection, { title: "The week it works", children: /* @__PURE__ */ jsx(
+          ScheduleEditor,
+          {
+            title: null,
+            schedule,
+            onChange: setSchedule
+          }
+        ) })
+      ] })
+    }
+  );
+}
+export {
+  ResourceRecordPage as default
+};
+//# sourceMappingURL=page.js.map