@withpotter/pages-bookings 0.13.0-next.101

package/dist/dashboard/(bookings)/bookings/_components/bookings-table.js

@@ -0,0 +1,192 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useItemLinks } from "@withpotter/lib/use-item-links";
+import Link from "next/link";
+import { CreditCard, ChevronRight, Video } from "lucide-react";
+import { joinLabelOf, meetingLinkOf } from "@withpotter/lib/booking-meeting-link";
+import { TableShell, Th, TableRow } from "@withpotter/ui-kit/table-shell";
+import { StatusBadge } from "@withpotter/components/shared/status-badge";
+import { useEntityLabel } from "@withpotter/lib/intents/use-entity-label";
+import {
+  useBookingStatusConfig
+} from "./booking-constants";
+function shortDate(dateString) {
+  return new Date(dateString).toLocaleString("en-US", {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit"
+  });
+}
+function JoinLink({ link }) {
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href: link,
+      target: "_blank",
+      rel: "noreferrer",
+      onClick: (e) => e.stopPropagation(),
+      className: "mt-1 inline-flex items-center gap-1 text-xs font-medium text-[var(--text-link)] underline-offset-2 hover:underline",
+      children: [
+        /* @__PURE__ */ jsx(Video, {}),
+        joinLabelOf(link)
+      ]
+    }
+  );
+}
+function bookingAmountOf(booking) {
+  return booking.data?.paymentAmount || booking.data?.total || booking.content?.price || 0;
+}
+function BookingsTable({
+  bookings,
+  formatCurrency,
+  formatDate,
+  formatTime,
+  onSelectRow,
+  footer,
+  toolbar
+}) {
+  const links = useItemLinks();
+  const statuses = useBookingStatusConfig();
+  const bookingLabel = useEntityLabel("booking");
+  const itemLabel = useEntityLabel("item");
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsx(
+      TableShell,
+      {
+        bare: true,
+        toolbar,
+        footer,
+        minWidth: 780,
+        head: /* @__PURE__ */ jsxs("tr", { className: "h-[44px]", children: [
+          /* @__PURE__ */ jsx(Th, { children: bookingLabel.singular }),
+          /* @__PURE__ */ jsx(Th, { children: "Customer" }),
+          /* @__PURE__ */ jsx(Th, { children: itemLabel.singular }),
+          /* @__PURE__ */ jsx(Th, { children: "Date & Time" }),
+          /* @__PURE__ */ jsx(Th, { children: "Status" }),
+          /* @__PURE__ */ jsx(Th, { children: "Payment" }),
+          /* @__PURE__ */ jsx(Th, { align: "right", children: "Amount" }),
+          /* @__PURE__ */ jsx("th", { className: "w-12" })
+        ] }),
+        children: bookings.map((booking) => {
+          const rowStatuses = statuses(booking.type);
+          const statusConfig = rowStatuses[booking.status] || rowStatuses.pending;
+          const isPaid = booking.data?.isPaid === true;
+          const bookingAmount = bookingAmountOf(booking);
+          const meetingLink = meetingLinkOf(booking);
+          return /* @__PURE__ */ jsxs(TableRow, { onClick: () => onSelectRow?.(booking), children: [
+            /* @__PURE__ */ jsxs("td", { children: [
+              /* @__PURE__ */ jsxs("div", { className: "text-sm font-medium text-[var(--text-primary)]", children: [
+                "#",
+                booking.bookingNumber
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "text-xs text-[var(--text-tertiary)] mt-0.5", children: formatDate(booking.createdAt) })
+            ] }),
+            /* @__PURE__ */ jsxs("td", { children: [
+              /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-[var(--text-primary)]", children: booking.customerName || "Guest" }),
+              booking.customerEmail && /* @__PURE__ */ jsx("div", { className: "text-xs text-[var(--text-tertiary)] truncate", children: booking.customerEmail })
+            ] }),
+            /* @__PURE__ */ jsx("td", { className: "text-sm text-[var(--text-primary)]", children: booking.content?.title || "\u2014" }),
+            /* @__PURE__ */ jsxs("td", { children: [
+              /* @__PURE__ */ jsx("div", { className: "text-sm text-[var(--text-primary)]", children: formatDate(booking.date) }),
+              /* @__PURE__ */ jsxs("div", { className: "text-xs text-[var(--text-tertiary)]", children: [
+                booking.startTime && formatTime(booking.startTime),
+                booking.endTime && ` \u2013 ${formatTime(booking.endTime)}`
+              ] }),
+              meetingLink && /* @__PURE__ */ jsx(JoinLink, { link: meetingLink })
+            ] }),
+            /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+              StatusBadge,
+              {
+                neutral: true,
+                status: booking.status,
+                icon: statusConfig.icon,
+                label: statusConfig.label
+              }
+            ) }),
+            /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(
+              StatusBadge,
+              {
+                neutral: true,
+                status: isPaid ? "paid" : "unpaid",
+                icon: /* @__PURE__ */ jsx(CreditCard, {}),
+                label: isPaid ? "Paid" : "Unpaid"
+              }
+            ) }),
+            /* @__PURE__ */ jsx("td", { className: "text-right text-sm font-medium text-[var(--text-primary)]", children: bookingAmount > 0 ? formatCurrency(bookingAmount) : "\u2014" }),
+            /* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4 text-[var(--text-muted)]" }) })
+          ] }, booking.id);
+        })
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsx("div", { className: "bg-[var(--bg-subtle)] rounded-ios-lg overflow-hidden divide-y divide-[var(--border-subtle)]", children: bookings.map((booking) => {
+      const rowStatuses = statuses(booking.type);
+      const statusConfig = rowStatuses[booking.status] || rowStatuses.pending;
+      const isPaid = booking.data?.isPaid === true;
+      const bookingAmount = bookingAmountOf(booking);
+      const meetingLink = meetingLinkOf(booking);
+      return (
+        /* The card is a link, so the Join cannot live inside it — an
+           anchor in an anchor is invalid, and React silently renders a
+           target nobody can press. It sits under the card instead, still
+           inside the one divided cell. */
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs(
+            Link,
+            {
+              href: links.bookingDetail(booking.id),
+              className: "flex items-center gap-3 px-3 py-3 active:bg-[var(--bg-muted)] transition-colors",
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--text-primary)] truncate block", children: booking.content?.title || `#${booking.bookingNumber}` }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5", children: [
+                    /* @__PURE__ */ jsx("span", { className: "text-sm text-[var(--text-secondary)] truncate", children: booking.customerName || "Guest" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-[var(--text-muted)] flex-shrink-0", children: "\xB7" }),
+                    /* @__PURE__ */ jsx("span", { className: "text-sm text-[var(--text-muted)] flex-shrink-0", children: shortDate(booking.date) }),
+                    bookingAmount > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx("span", { className: "text-[var(--text-muted)] flex-shrink-0", children: "\xB7" }),
+                      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--text-primary)] flex-shrink-0", children: formatCurrency(bookingAmount) })
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-2", children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: `inline-flex items-center px-2 py-0.5 rounded-full text-3xs font-medium ${statusConfig.bgColor} ${statusConfig.color}`,
+                        children: statusConfig.label
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: `inline-flex items-center px-2 py-0.5 rounded-full text-3xs font-medium ${isPaid ? "bg-[var(--success-bg)] text-[var(--success)]" : "bg-[var(--warning-bg)] text-[var(--warning)]"}`,
+                        children: isPaid ? "Paid" : "Unpaid"
+                      }
+                    )
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(ChevronRight, { className: "size-4 text-[var(--text-muted)] flex-shrink-0" })
+              ]
+            }
+          ),
+          meetingLink && /* @__PURE__ */ jsxs(
+            "a",
+            {
+              href: meetingLink,
+              target: "_blank",
+              rel: "noreferrer",
+              className: "flex items-center gap-1 px-3 pb-3 text-xs font-medium text-[var(--text-link)]",
+              children: [
+                /* @__PURE__ */ jsx(Video, {}),
+                joinLabelOf(meetingLink)
+              ]
+            }
+          )
+        ] }, booking.id)
+      );
+    }) }) })
+  ] });
+}
+export {
+  BookingsTable
+};
+//# sourceMappingURL=bookings-table.js.map

package/dist/dashboard/(bookings)/bookings/_components/bookings-table.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/dashboard/%28bookings%29/bookings/_components/bookings-table.tsx"],"sourcesContent":["import { useItemLinks } from '@withpotter/lib/use-item-links';\nimport Link from 'next/link';\nimport { CreditCard, ChevronRight, Video } from 'lucide-react';\nimport type { BookingItem } from '@withpotter/lib/api/types';\nimport { joinLabelOf, meetingLinkOf } from '@withpotter/lib/booking-meeting-link';\nimport { TableShell, Th, TableRow } from '@withpotter/ui-kit/table-shell';\nimport { StatusBadge } from '@withpotter/components/shared/status-badge';\nimport { useEntityLabel } from '@withpotter/lib/intents/use-entity-label';\nimport {\n  useBookingStatusConfig,\n  type BookingStatus,\n} from './booking-constants';\n\ninterface BookingsTableProps {\n  /** Pagination, rendered inside the table container rather than below it. */\n  footer?: React.ReactNode;\n  /**\n   * Search and filters, inside the table container above the rows — the same\n   * reasoning as `footer`, at the other end.\n   */\n  toolbar?: React.ReactNode;\n  bookings: BookingItem[];\n  formatCurrency: (amount: number) => string;\n  formatDate: (dateString: string) => string;\n  formatTime: (time?: string) => string;\n  /** Selecting a row opens the booking's detail page. */\n  onSelectRow?: (booking: BookingItem) => void;\n}\n\nfunction shortDate(dateString: string): string {\n  return new Date(dateString).toLocaleString('en-US', {\n    month: 'short',\n    day: 'numeric',\n    hour: 'numeric',\n    minute: '2-digit',\n  });\n}\n\n/**\n * The way into an online booking, on the row.\n *\n * A merchant running a day of consultations wants the list to BE the day: the\n * link is what the row is for at the hour it happens, and sending them into the\n * record to find it costs a screen each time. It sits under the time because\n * that is the fact it belongs to.\n *\n * `stopPropagation` because the row itself opens the booking — without it,\n * pressing Join opens the detail page behind the call.\n */\nfunction JoinLink({ link }: { link: string }) {\n  return (\n    <a\n      href={link}\n      target=\"_blank\"\n      rel=\"noreferrer\"\n      onClick={(e) => e.stopPropagation()}\n      className=\"mt-1 inline-flex items-center gap-1 text-xs font-medium text-[var(--text-link)] underline-offset-2 hover:underline\"\n    >\n      <Video />\n      {joinLabelOf(link)}\n    </a>\n  );\n}\n\nfunction bookingAmountOf(booking: BookingItem): number {\n  return (\n    (booking.data?.paymentAmount as number) ||\n    (booking.data?.total as number) ||\n    booking.content?.price ||\n    0\n  );\n}\n\nexport function BookingsTable({\n  bookings,\n  formatCurrency,\n  formatDate,\n  formatTime,\n  onSelectRow,\n  footer,\n  toolbar,\n}: BookingsTableProps) {\n  const links = useItemLinks();\n  const statuses = useBookingStatusConfig();\n  /* The merchant's nouns, not ours. A spa's list read \"Booking / Item\" over\n     columns it calls appointments and services. */\n  const bookingLabel = useEntityLabel('booking');\n  const itemLabel = useEntityLabel('item');\n\n  return (\n    <>\n      {/* Desktop Table — the shared quiet-table frame */}\n      <div className=\"hidden lg:block\">\n        <TableShell\n          bare\n          toolbar={toolbar}\n          footer={footer}\n          minWidth={780}\n          head={\n            <tr className=\"h-[44px]\">\n              <Th>{bookingLabel.singular}</Th>\n              <Th>Customer</Th>\n              <Th>{itemLabel.singular}</Th>\n              <Th>Date &amp; Time</Th>\n              <Th>Status</Th>\n              <Th>Payment</Th>\n              <Th align=\"right\">Amount</Th>\n              <th className=\"w-12\"></th>\n            </tr>\n          }\n        >\n          {bookings.map((booking) => {\n            // This row's own words: a table reads Served, an appointment does\n            // not, and a mixed business has both in one list.\n            const rowStatuses = statuses(booking.type);\n            const statusConfig =\n              rowStatuses[booking.status as BookingStatus] ||\n              rowStatuses.pending;\n            const isPaid = booking.data?.isPaid === true;\n            const bookingAmount = bookingAmountOf(booking);\n            const meetingLink = meetingLinkOf(booking);\n\n            return (\n              <TableRow key={booking.id} onClick={() => onSelectRow?.(booking)}>\n                <td>\n                  <div className=\"text-sm font-medium text-[var(--text-primary)]\">\n                    #{booking.bookingNumber}\n                  </div>\n                  <div className=\"text-xs text-[var(--text-tertiary)] mt-0.5\">\n                    {formatDate(booking.createdAt)}\n                  </div>\n                </td>\n                <td>\n                  <div className=\"text-sm font-medium text-[var(--text-primary)]\">\n                    {booking.customerName || 'Guest'}\n                  </div>\n                  {booking.customerEmail && (\n                    <div className=\"text-xs text-[var(--text-tertiary)] truncate\">\n                      {booking.customerEmail}\n                    </div>\n                  )}\n                </td>\n                <td className=\"text-sm text-[var(--text-primary)]\">\n                  {booking.content?.title || '—'}\n                </td>\n                <td>\n                  <div className=\"text-sm text-[var(--text-primary)]\">\n                    {formatDate(booking.date)}\n                  </div>\n                  <div className=\"text-xs text-[var(--text-tertiary)]\">\n                    {booking.startTime && formatTime(booking.startTime)}\n                    {booking.endTime && ` – ${formatTime(booking.endTime)}`}\n                  </div>\n                  {meetingLink && <JoinLink link={meetingLink} />}\n                </td>\n                {/* Two status columns, so both go neutral — the same rule\n                    orders settled on. Payment was the louder mistake: every\n                    unpaid booking rendered amber, so a page of ordinary future\n                    bookings read as a page of problems. */}\n                <td>\n                  <StatusBadge\n                    neutral\n                    status={booking.status}\n                    icon={statusConfig.icon}\n                    label={statusConfig.label}\n                  />\n                </td>\n                <td>\n                  <StatusBadge\n                    neutral\n                    status={isPaid ? 'paid' : 'unpaid'}\n                    icon={<CreditCard />}\n                    label={isPaid ? 'Paid' : 'Unpaid'}\n                  />\n                </td>\n                <td className=\"text-right text-sm font-medium text-[var(--text-primary)]\">\n                  {bookingAmount > 0 ? formatCurrency(bookingAmount) : '—'}\n                </td>\n                <td>\n                  <ChevronRight className=\"size-4 text-[var(--text-muted)]\" />\n                </td>\n              </TableRow>\n            );\n          })}\n        </TableShell>\n      </div>\n\n      {/* Mobile Card List */}\n      <div className=\"lg:hidden\">\n        <div className=\"bg-[var(--bg-subtle)] rounded-ios-lg overflow-hidden divide-y divide-[var(--border-subtle)]\">\n          {bookings.map((booking) => {\n            // This row's own words: a table reads Served, an appointment does\n            // not, and a mixed business has both in one list.\n            const rowStatuses = statuses(booking.type);\n            const statusConfig =\n              rowStatuses[booking.status as BookingStatus] ||\n              rowStatuses.pending;\n            const isPaid = booking.data?.isPaid === true;\n            const bookingAmount = bookingAmountOf(booking);\n            const meetingLink = meetingLinkOf(booking);\n\n            return (\n              /* The card is a link, so the Join cannot live inside it — an\n                 anchor in an anchor is invalid, and React silently renders a\n                 target nobody can press. It sits under the card instead, still\n                 inside the one divided cell. */\n              <div key={booking.id}>\n                <Link\n                  href={links.bookingDetail(booking.id)}\n                  className=\"flex items-center gap-3 px-3 py-3 active:bg-[var(--bg-muted)] transition-colors\"\n                >\n                  <div className=\"flex-1 min-w-0\">\n                    {/* Row 1: Service/item name */}\n                    <span className=\"text-sm font-medium text-[var(--text-primary)] truncate block\">\n                      {booking.content?.title || `#${booking.bookingNumber}`}\n                    </span>\n\n                    {/* Row 2: Customer · Date · Amount */}\n                    <div className=\"flex items-center gap-2 mt-0.5\">\n                      <span className=\"text-sm text-[var(--text-secondary)] truncate\">\n                        {booking.customerName || 'Guest'}\n                      </span>\n                      <span className=\"text-[var(--text-muted)] flex-shrink-0\">\n                        &middot;\n                      </span>\n                      <span className=\"text-sm text-[var(--text-muted)] flex-shrink-0\">\n                        {shortDate(booking.date)}\n                      </span>\n                      {bookingAmount > 0 && (\n                        <>\n                          <span className=\"text-[var(--text-muted)] flex-shrink-0\">\n                            &middot;\n                          </span>\n                          <span className=\"text-sm font-medium text-[var(--text-primary)] flex-shrink-0\">\n                            {formatCurrency(bookingAmount)}\n                          </span>\n                        </>\n                      )}\n                    </div>\n\n                    {/* Row 3: Status + Payment pills */}\n                    <div className=\"flex items-center gap-2 mt-2\">\n                      <span\n                        className={`inline-flex items-center px-2 py-0.5 rounded-full text-3xs font-medium ${statusConfig.bgColor} ${statusConfig.color}`}\n                      >\n                        {statusConfig.label}\n                      </span>\n                      <span\n                        className={`inline-flex items-center px-2 py-0.5 rounded-full text-3xs font-medium ${\n                          isPaid\n                            ? 'bg-[var(--success-bg)] text-[var(--success)]'\n                            : 'bg-[var(--warning-bg)] text-[var(--warning)]'\n                        }`}\n                      >\n                        {isPaid ? 'Paid' : 'Unpaid'}\n                      </span>\n                    </div>\n                  </div>\n\n                  <ChevronRight className=\"size-4 text-[var(--text-muted)] flex-shrink-0\" />\n                </Link>\n                {meetingLink && (\n                  <a\n                    href={meetingLink}\n                    target=\"_blank\"\n                    rel=\"noreferrer\"\n                    className=\"flex items-center gap-1 px-3 pb-3 text-xs font-medium text-[var(--text-link)]\"\n                  >\n                    <Video />\n                    {joinLabelOf(meetingLink)}\n                  </a>\n                )}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </>\n  );\n}\n"],"mappings":"AAmDI,SAkLoB,UA3KlB,KAPF;AAnDJ,SAAS,oBAAoB;AAC7B,OAAO,UAAU;AACjB,SAAS,YAAY,cAAc,aAAa;AAEhD,SAAS,aAAa,qBAAqB;AAC3C,SAAS,YAAY,IAAI,gBAAgB;AACzC,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,OAEK;AAkBP,SAAS,UAAU,YAA4B;AAC7C,SAAO,IAAI,KAAK,UAAU,EAAE,eAAe,SAAS;AAAA,IAClD,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,IACN,QAAQ;AAAA,EACV,CAAC;AACH;AAaA,SAAS,SAAS,EAAE,KAAK,GAAqB;AAC5C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,MAClC,WAAU;AAAA,MAEV;AAAA,4BAAC,SAAM;AAAA,QACN,YAAY,IAAI;AAAA;AAAA;AAAA,EACnB;AAEJ;AAEA,SAAS,gBAAgB,SAA8B;AACrD,SACG,QAAQ,MAAM,iBACd,QAAQ,MAAM,SACf,QAAQ,SAAS,SACjB;AAEJ;AAEO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAuB;AACrB,QAAM,QAAQ,aAAa;AAC3B,QAAM,WAAW,uBAAuB;AAGxC,QAAM,eAAe,eAAe,SAAS;AAC7C,QAAM,YAAY,eAAe,MAAM;AAEvC,SACE,iCAEE;AAAA,wBAAC,SAAI,WAAU,mBACb;AAAA,MAAC;AAAA;AAAA,QACC,MAAI;AAAA,QACJ;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV,MACE,qBAAC,QAAG,WAAU,YACZ;AAAA,8BAAC,MAAI,uBAAa,UAAS;AAAA,UAC3B,oBAAC,MAAG,sBAAQ;AAAA,UACZ,oBAAC,MAAI,oBAAU,UAAS;AAAA,UACxB,oBAAC,MAAG,yBAAe;AAAA,UACnB,oBAAC,MAAG,oBAAM;AAAA,UACV,oBAAC,MAAG,qBAAO;AAAA,UACX,oBAAC,MAAG,OAAM,SAAQ,oBAAM;AAAA,UACxB,oBAAC,QAAG,WAAU,QAAO;AAAA,WACvB;AAAA,QAGD,mBAAS,IAAI,CAAC,YAAY;AAGzB,gBAAM,cAAc,SAAS,QAAQ,IAAI;AACzC,gBAAM,eACJ,YAAY,QAAQ,MAAuB,KAC3C,YAAY;AACd,gBAAM,SAAS,QAAQ,MAAM,WAAW;AACxC,gBAAM,gBAAgB,gBAAgB,OAAO;AAC7C,gBAAM,cAAc,cAAc,OAAO;AAEzC,iBACE,qBAAC,YAA0B,SAAS,MAAM,cAAc,OAAO,GAC7D;AAAA,iCAAC,QACC;AAAA,mCAAC,SAAI,WAAU,kDAAiD;AAAA;AAAA,gBAC5D,QAAQ;AAAA,iBACZ;AAAA,cACA,oBAAC,SAAI,WAAU,8CACZ,qBAAW,QAAQ,SAAS,GAC/B;AAAA,eACF;AAAA,YACA,qBAAC,QACC;AAAA,kCAAC,SAAI,WAAU,kDACZ,kBAAQ,gBAAgB,SAC3B;AAAA,cACC,QAAQ,iBACP,oBAAC,SAAI,WAAU,gDACZ,kBAAQ,eACX;AAAA,eAEJ;AAAA,YACA,oBAAC,QAAG,WAAU,sCACX,kBAAQ,SAAS,SAAS,UAC7B;AAAA,YACA,qBAAC,QACC;AAAA,kCAAC,SAAI,WAAU,sCACZ,qBAAW,QAAQ,IAAI,GAC1B;AAAA,cACA,qBAAC,SAAI,WAAU,uCACZ;AAAA,wBAAQ,aAAa,WAAW,QAAQ,SAAS;AAAA,gBACjD,QAAQ,WAAW,WAAM,WAAW,QAAQ,OAAO,CAAC;AAAA,iBACvD;AAAA,cACC,eAAe,oBAAC,YAAS,MAAM,aAAa;AAAA,eAC/C;AAAA,YAKA,oBAAC,QACC;AAAA,cAAC;AAAA;AAAA,gBACC,SAAO;AAAA,gBACP,QAAQ,QAAQ;AAAA,gBAChB,MAAM,aAAa;AAAA,gBACnB,OAAO,aAAa;AAAA;AAAA,YACtB,GACF;AAAA,YACA,oBAAC,QACC;AAAA,cAAC;AAAA;AAAA,gBACC,SAAO;AAAA,gBACP,QAAQ,SAAS,SAAS;AAAA,gBAC1B,MAAM,oBAAC,cAAW;AAAA,gBAClB,OAAO,SAAS,SAAS;AAAA;AAAA,YAC3B,GACF;AAAA,YACA,oBAAC,QAAG,WAAU,6DACX,0BAAgB,IAAI,eAAe,aAAa,IAAI,UACvD;AAAA,YACA,oBAAC,QACC,8BAAC,gBAAa,WAAU,mCAAkC,GAC5D;AAAA,eAzDa,QAAQ,EA0DvB;AAAA,QAEJ,CAAC;AAAA;AAAA,IACH,GACF;AAAA,IAGA,oBAAC,SAAI,WAAU,aACb,8BAAC,SAAI,WAAU,+FACZ,mBAAS,IAAI,CAAC,YAAY;AAGzB,YAAM,cAAc,SAAS,QAAQ,IAAI;AACzC,YAAM,eACJ,YAAY,QAAQ,MAAuB,KAC3C,YAAY;AACd,YAAM,SAAS,QAAQ,MAAM,WAAW;AACxC,YAAM,gBAAgB,gBAAgB,OAAO;AAC7C,YAAM,cAAc,cAAc,OAAO;AAEzC;AAAA;AAAA;AAAA;AAAA;AAAA,QAKE,qBAAC,SACC;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,MAAM,cAAc,QAAQ,EAAE;AAAA,cACpC,WAAU;AAAA,cAEV;AAAA,qCAAC,SAAI,WAAU,kBAEb;AAAA,sCAAC,UAAK,WAAU,iEACb,kBAAQ,SAAS,SAAS,IAAI,QAAQ,aAAa,IACtD;AAAA,kBAGA,qBAAC,SAAI,WAAU,kCACb;AAAA,wCAAC,UAAK,WAAU,iDACb,kBAAQ,gBAAgB,SAC3B;AAAA,oBACA,oBAAC,UAAK,WAAU,0CAAyC,kBAEzD;AAAA,oBACA,oBAAC,UAAK,WAAU,kDACb,oBAAU,QAAQ,IAAI,GACzB;AAAA,oBACC,gBAAgB,KACf,iCACE;AAAA,0CAAC,UAAK,WAAU,0CAAyC,kBAEzD;AAAA,sBACA,oBAAC,UAAK,WAAU,gEACb,yBAAe,aAAa,GAC/B;AAAA,uBACF;AAAA,qBAEJ;AAAA,kBAGA,qBAAC,SAAI,WAAU,gCACb;AAAA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAW,0EAA0E,aAAa,OAAO,IAAI,aAAa,KAAK;AAAA,wBAE9H,uBAAa;AAAA;AAAA,oBAChB;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAW,0EACT,SACI,iDACA,8CACN;AAAA,wBAEC,mBAAS,SAAS;AAAA;AAAA,oBACrB;AAAA,qBACF;AAAA,mBACF;AAAA,gBAEA,oBAAC,gBAAa,WAAU,iDAAgD;AAAA;AAAA;AAAA,UAC1E;AAAA,UACC,eACC;AAAA,YAAC;AAAA;AAAA,cACC,MAAM;AAAA,cACN,QAAO;AAAA,cACP,KAAI;AAAA,cACJ,WAAU;AAAA,cAEV;AAAA,oCAAC,SAAM;AAAA,gBACN,YAAY,WAAW;AAAA;AAAA;AAAA,UAC1B;AAAA,aAhEM,QAAQ,EAkElB;AAAA;AAAA,IAEJ,CAAC,GACH,GACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/dashboard/(bookings)/bookings/_components/cannot-take-bookings.js

@@ -0,0 +1,34 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { CalendarClock } from "lucide-react";
+import { StateView } from "@withpotter/ui-kit/state-view";
+import { useApiQuery } from "@withpotter/hooks/use-api-query";
+import { tenantApi } from "@withpotter/lib/api/tenant";
+const BOOKING_KEYS = /* @__PURE__ */ new Set(["bookable", "schedulable"]);
+function CannotTakeBookings() {
+  const { data } = useApiQuery(
+    ["bookings-readiness"],
+    (slug) => tenantApi.readiness(slug)
+  );
+  const blockers = (data?.blockers ?? []).filter(
+    (b) => BOOKING_KEYS.has(b.key)
+  );
+  if (blockers.length === 0) return null;
+  return /* @__PURE__ */ jsx(
+    StateView,
+    {
+      kind: "first-run",
+      icon: CalendarClock,
+      title: "Your booking page is not ready yet",
+      description: "Add something customers can book, then choose when they can book it.",
+      action: {
+        label: "Create a session",
+        href: "/dashboard/catalog/new?intent=take-bookings"
+      }
+    }
+  );
+}
+export {
+  CannotTakeBookings
+};
+//# sourceMappingURL=cannot-take-bookings.js.map

package/dist/dashboard/(bookings)/bookings/_components/cannot-take-bookings.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/dashboard/%28bookings%29/bookings/_components/cannot-take-bookings.tsx"],"sourcesContent":["'use client';\n\nimport { CalendarClock } from 'lucide-react';\nimport { StateView } from '@withpotter/ui-kit/state-view';\nimport { useApiQuery } from '@withpotter/hooks/use-api-query';\nimport { tenantApi } from '@withpotter/lib/api/tenant';\nimport type { StorefrontReadiness } from '@withpotter/lib/api/types';\n\n/**\n * Why nobody can book, on the screen the merchant opens every morning.\n *\n * A booking page draws a fortnight of selectable days whether or not a single\n * session exists — the day strip comes from a date helper, and availability is\n * never called without a service to ask about. So an empty setup does not read\n * as broken: it reads as a business with no free time for two weeks. The\n * customer meets that, decides the place is full or the site is broken, and\n * leaves. Nothing anywhere told the merchant.\n *\n * That is the shape of the churn: every gap in this product fails politely in\n * the dashboard and loudly in front of the customer. This is the counterweight\n * — the same server-side readiness the publish gate reads, said on the daily\n * surface rather than only at the moment of going live, because a business can\n * become unbookable long after it launched (the last person's hours removed,\n * the last session unpublished).\n *\n * Only booking blockers. The shipping and payout answers belong to the go-live\n * gate and to Settings; repeating them here would turn a specific, actionable\n * warning into a second checklist nobody reads.\n */\n\nconst BOOKING_KEYS = new Set(['bookable', 'schedulable']);\n\nexport function CannotTakeBookings() {\n  const { data } = useApiQuery<StorefrontReadiness>(\n    ['bookings-readiness'],\n    (slug) => tenantApi.readiness(slug),\n  );\n\n  /**\n   * Not-asked is not not-ready.\n   *\n   * `data` is undefined while the check is in flight and on any API that does\n   * not serve the route, so anything written as \"warn unless proven ready\"\n   * would put a red banner across the top of every booking list on an older\n   * backend. It says something only about blockers it has actually been\n   * handed.\n   */\n  const blockers = (data?.blockers ?? []).filter((b) =>\n    BOOKING_KEYS.has(b.key),\n  );\n  if (blockers.length === 0) return null;\n\n  return (\n    <StateView\n      kind=\"first-run\"\n      icon={CalendarClock}\n      title=\"Your booking page is not ready yet\"\n      description=\"Add something customers can book, then choose when they can book it.\"\n      action={{\n        label: 'Create a session',\n        href: '/dashboard/catalog/new?intent=take-bookings',\n      }}\n    />\n  );\n}\n"],"mappings":";AAqDI;AAnDJ,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB;AAyB1B,MAAM,eAAe,oBAAI,IAAI,CAAC,YAAY,aAAa,CAAC;AAEjD,SAAS,qBAAqB;AACnC,QAAM,EAAE,KAAK,IAAI;AAAA,IACf,CAAC,oBAAoB;AAAA,IACrB,CAAC,SAAS,UAAU,UAAU,IAAI;AAAA,EACpC;AAWA,QAAM,YAAY,MAAM,YAAY,CAAC,GAAG;AAAA,IAAO,CAAC,MAC9C,aAAa,IAAI,EAAE,GAAG;AAAA,EACxB;AACA,MAAI,SAAS,WAAW,EAAG,QAAO;AAElC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,MAAM;AAAA,MACN,OAAM;AAAA,MACN,aAAY;AAAA,MACZ,QAAQ;AAAA,QACN,OAAO;AAAA,QACP,MAAM;AAAA,MACR;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/dashboard/(bookings)/bookings/_components/demo-data.js

@@ -0,0 +1,176 @@
+function mk(b) {
+  return b;
+}
+const DEMO_BOOKINGS = [
+  mk({
+    id: "demo-b1",
+    bookingNumber: "BK-2041",
+    type: "table",
+    status: "confirmed",
+    bookingMode: "reservation",
+    origin: "storefront",
+    actorType: "customer",
+    date: "2026-07-26",
+    startTime: "18:00",
+    endTime: "19:00",
+    durationMinutes: 60,
+    customerName: "Tunde Okafor",
+    customerEmail: "tunde.okafor@gmail.com",
+    customerPhone: "+2348032214408",
+    content: {
+      id: "c1",
+      title: "Braids \xB7 Medium",
+      slug: "court-1",
+      price: 1e4
+    },
+    data: { isPaid: true, total: 1e4, paymentAmount: 1e4 },
+    createdAt: "2026-07-24T09:12:00.000Z",
+    updatedAt: "2026-07-24T09:12:00.000Z"
+  }),
+  mk({
+    id: "demo-b2",
+    bookingNumber: "BK-2042",
+    type: "table",
+    status: "pending",
+    bookingMode: "reservation",
+    origin: "dashboard",
+    actorType: "staff",
+    date: "2026-07-26",
+    startTime: "19:00",
+    endTime: "20:00",
+    durationMinutes: 60,
+    customerName: "Amara Nwosu",
+    customerEmail: "amara.nwosu@gmail.com",
+    customerPhone: "+2348025541120",
+    content: {
+      id: "c2",
+      title: "Silk press",
+      slug: "court-2",
+      price: 12e3
+    },
+    // deposit taken, balance still due
+    data: { isPaid: false, total: 12e3, paymentAmount: 4e3 },
+    createdAt: "2026-07-25T14:40:00.000Z",
+    updatedAt: "2026-07-25T14:40:00.000Z"
+  }),
+  mk({
+    id: "demo-b3",
+    bookingNumber: "BK-2043",
+    type: "table",
+    status: "checked_in",
+    bookingMode: "reservation",
+    origin: "storefront",
+    actorType: "customer",
+    date: "2026-07-26",
+    startTime: "17:00",
+    endTime: "18:30",
+    durationMinutes: 90,
+    quantity: 4,
+    customerName: "Group \xB7 Emeka +3",
+    customerEmail: "emeka.obi@gmail.com",
+    customerPhone: "+2347061182093",
+    content: {
+      id: "c3",
+      title: "Locs retwist",
+      slug: "court-3",
+      price: 16e3
+    },
+    data: { isPaid: true, total: 16e3, paymentAmount: 16e3 },
+    createdAt: "2026-07-25T20:05:00.000Z",
+    updatedAt: "2026-07-26T16:58:00.000Z"
+  }),
+  mk({
+    id: "demo-b4",
+    bookingNumber: "BK-2039",
+    type: "appointment",
+    status: "completed",
+    bookingMode: "scheduled",
+    origin: "dashboard",
+    actorType: "staff",
+    date: "2026-07-25",
+    startTime: "10:00",
+    endTime: "11:00",
+    durationMinutes: 60,
+    customerName: "Ada Eze",
+    customerEmail: "ada.eze@yahoo.com",
+    customerPhone: "+2348094437781",
+    content: {
+      id: "c4",
+      title: "Coaching \xB7 Coach Zed",
+      slug: "coaching",
+      price: 15e3
+    },
+    data: { isPaid: true, total: 15e3, paymentAmount: 15e3 },
+    createdAt: "2026-07-22T08:00:00.000Z",
+    updatedAt: "2026-07-25T11:05:00.000Z"
+  }),
+  mk({
+    id: "demo-b5",
+    bookingNumber: "BK-2037",
+    type: "table",
+    status: "cancelled",
+    bookingMode: "reservation",
+    origin: "storefront",
+    actorType: "customer",
+    date: "2026-07-24",
+    startTime: "20:00",
+    endTime: "21:00",
+    durationMinutes: 60,
+    customerName: "Fatima Bello",
+    customerEmail: "fatima.bello@outlook.com",
+    customerPhone: "+2348119076621",
+    content: {
+      id: "c2",
+      title: "Silk press",
+      slug: "court-2",
+      price: 12e3
+    },
+    data: { isPaid: false, total: 12e3 },
+    createdAt: "2026-07-21T11:30:00.000Z",
+    updatedAt: "2026-07-23T18:12:00.000Z"
+  }),
+  mk({
+    id: "demo-b6",
+    bookingNumber: "BK-2035",
+    type: "table",
+    status: "no_show",
+    bookingMode: "reservation",
+    origin: "dashboard",
+    actorType: "staff",
+    date: "2026-07-23",
+    startTime: "07:00",
+    endTime: "08:00",
+    durationMinutes: 60,
+    customerName: "Ibrahim Sule",
+    customerEmail: "",
+    customerPhone: "+2348051129844",
+    content: {
+      id: "c1",
+      title: "Trim & style",
+      slug: "court-1",
+      price: 8e3
+    },
+    data: { isPaid: false, total: 8e3, paymentAmount: 2e3 },
+    createdAt: "2026-07-20T06:30:00.000Z",
+    updatedAt: "2026-07-23T08:10:00.000Z"
+  })
+];
+const DEMO_STATS = {
+  total: 23,
+  today: 6,
+  revenue: 268e3,
+  byStatus: {
+    pending: 3,
+    confirmed: 5,
+    checked_in: 2,
+    completed: 11,
+    cancelled: 1,
+    no_show: 1
+  },
+  byType: { table: 18, appointment: 5 }
+};
+export {
+  DEMO_BOOKINGS,
+  DEMO_STATS
+};
+//# sourceMappingURL=demo-data.js.map

package/dist/dashboard/(bookings)/bookings/_components/demo-data.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/dashboard/%28bookings%29/bookings/_components/demo-data.ts"],"sourcesContent":["import type { BookingItem } from '@withpotter/lib/api/types';\n\n/**\n * Demo bookings for UI design/preview only (activated by `?demo=1`).\n *\n * The backend only runs on staging, so this lets us design the Bookings\n * surface against realistic data. Shapes mirror the real `BookingItem`\n * contract (money lives under `data`, the bookable under `content`) so\n * nothing here is a facade of a different model; swap for live data on staging.\n *\n * Flavoured for a salon: named services and named people, because that is\n * what a bookings business books. Nothing here is vertical-specific in shape.\n */\nfunction mk(b: Partial<BookingItem> & { id: string }): BookingItem {\n  return b as unknown as BookingItem;\n}\n\nexport const DEMO_BOOKINGS: BookingItem[] = [\n  mk({\n    id: 'demo-b1',\n    bookingNumber: 'BK-2041',\n    type: 'table',\n    status: 'confirmed',\n    bookingMode: 'reservation',\n    origin: 'storefront',\n    actorType: 'customer',\n    date: '2026-07-26',\n    startTime: '18:00',\n    endTime: '19:00',\n    durationMinutes: 60,\n    customerName: 'Tunde Okafor',\n    customerEmail: 'tunde.okafor@gmail.com',\n    customerPhone: '+2348032214408',\n    content: {\n      id: 'c1',\n      title: 'Braids · Medium',\n      slug: 'court-1',\n      price: 10000,\n    },\n    data: { isPaid: true, total: 10000, paymentAmount: 10000 },\n    createdAt: '2026-07-24T09:12:00.000Z',\n    updatedAt: '2026-07-24T09:12:00.000Z',\n  }),\n  mk({\n    id: 'demo-b2',\n    bookingNumber: 'BK-2042',\n    type: 'table',\n    status: 'pending',\n    bookingMode: 'reservation',\n    origin: 'dashboard',\n    actorType: 'staff',\n    date: '2026-07-26',\n    startTime: '19:00',\n    endTime: '20:00',\n    durationMinutes: 60,\n    customerName: 'Amara Nwosu',\n    customerEmail: 'amara.nwosu@gmail.com',\n    customerPhone: '+2348025541120',\n    content: {\n      id: 'c2',\n      title: 'Silk press',\n      slug: 'court-2',\n      price: 12000,\n    },\n    // deposit taken, balance still due\n    data: { isPaid: false, total: 12000, paymentAmount: 4000 },\n    createdAt: '2026-07-25T14:40:00.000Z',\n    updatedAt: '2026-07-25T14:40:00.000Z',\n  }),\n  mk({\n    id: 'demo-b3',\n    bookingNumber: 'BK-2043',\n    type: 'table',\n    status: 'checked_in',\n    bookingMode: 'reservation',\n    origin: 'storefront',\n    actorType: 'customer',\n    date: '2026-07-26',\n    startTime: '17:00',\n    endTime: '18:30',\n    durationMinutes: 90,\n    quantity: 4,\n    customerName: 'Group · Emeka +3',\n    customerEmail: 'emeka.obi@gmail.com',\n    customerPhone: '+2347061182093',\n    content: {\n      id: 'c3',\n      title: 'Locs retwist',\n      slug: 'court-3',\n      price: 16000,\n    },\n    data: { isPaid: true, total: 16000, paymentAmount: 16000 },\n    createdAt: '2026-07-25T20:05:00.000Z',\n    updatedAt: '2026-07-26T16:58:00.000Z',\n  }),\n  mk({\n    id: 'demo-b4',\n    bookingNumber: 'BK-2039',\n    type: 'appointment',\n    status: 'completed',\n    bookingMode: 'scheduled',\n    origin: 'dashboard',\n    actorType: 'staff',\n    date: '2026-07-25',\n    startTime: '10:00',\n    endTime: '11:00',\n    durationMinutes: 60,\n    customerName: 'Ada Eze',\n    customerEmail: 'ada.eze@yahoo.com',\n    customerPhone: '+2348094437781',\n    content: {\n      id: 'c4',\n      title: 'Coaching · Coach Zed',\n      slug: 'coaching',\n      price: 15000,\n    },\n    data: { isPaid: true, total: 15000, paymentAmount: 15000 },\n    createdAt: '2026-07-22T08:00:00.000Z',\n    updatedAt: '2026-07-25T11:05:00.000Z',\n  }),\n  mk({\n    id: 'demo-b5',\n    bookingNumber: 'BK-2037',\n    type: 'table',\n    status: 'cancelled',\n    bookingMode: 'reservation',\n    origin: 'storefront',\n    actorType: 'customer',\n    date: '2026-07-24',\n    startTime: '20:00',\n    endTime: '21:00',\n    durationMinutes: 60,\n    customerName: 'Fatima Bello',\n    customerEmail: 'fatima.bello@outlook.com',\n    customerPhone: '+2348119076621',\n    content: {\n      id: 'c2',\n      title: 'Silk press',\n      slug: 'court-2',\n      price: 12000,\n    },\n    data: { isPaid: false, total: 12000 },\n    createdAt: '2026-07-21T11:30:00.000Z',\n    updatedAt: '2026-07-23T18:12:00.000Z',\n  }),\n  mk({\n    id: 'demo-b6',\n    bookingNumber: 'BK-2035',\n    type: 'table',\n    status: 'no_show',\n    bookingMode: 'reservation',\n    origin: 'dashboard',\n    actorType: 'staff',\n    date: '2026-07-23',\n    startTime: '07:00',\n    endTime: '08:00',\n    durationMinutes: 60,\n    customerName: 'Ibrahim Sule',\n    customerEmail: '',\n    customerPhone: '+2348051129844',\n    content: {\n      id: 'c1',\n      title: 'Trim & style',\n      slug: 'court-1',\n      price: 8000,\n    },\n    data: { isPaid: false, total: 8000, paymentAmount: 2000 },\n    createdAt: '2026-07-20T06:30:00.000Z',\n    updatedAt: '2026-07-23T08:10:00.000Z',\n  }),\n];\n\n/** Summary numbers for the 6 desktop stat cards in demo mode. */\nexport const DEMO_STATS = {\n  total: 23,\n  today: 6,\n  revenue: 268000,\n  byStatus: {\n    pending: 3,\n    confirmed: 5,\n    checked_in: 2,\n    completed: 11,\n    cancelled: 1,\n    no_show: 1,\n  },\n  byType: { table: 18, appointment: 5 },\n};\n"],"mappings":"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","names":[]}

package/dist/dashboard/(bookings)/bookings/_components/index.js

@@ -0,0 +1,9 @@
+import { BOOKING_STATUS_CONFIG } from "./booking-constants";
+import { StatCard } from "@withpotter/components/shared/stat-card";
+import { BookingsTable } from "./bookings-table";
+export {
+  BOOKING_STATUS_CONFIG,
+  BookingsTable,
+  StatCard
+};
+//# sourceMappingURL=index.js.map

package/dist/dashboard/(bookings)/bookings/_components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/dashboard/%28bookings%29/bookings/_components/index.ts"],"sourcesContent":["export { BOOKING_STATUS_CONFIG, type BookingStatus } from './booking-constants';\nexport { StatCard } from '@withpotter/components/shared/stat-card';\nexport { BookingsTable } from './bookings-table';\n"],"mappings":"AAAA,SAAS,6BAAiD;AAC1D,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;","names":[]}

package/dist/dashboard/(bookings)/bookings/_components/today/booking-card.js

@@ -0,0 +1,126 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import Link from "next/link";
+import { Check, Wallet, UserX } from "lucide-react";
+import { Button } from "@withpotter/ui-kit/button";
+import {
+  BOOKING_STATUS_CONFIG
+} from "../booking-constants";
+import { toMinutes, isPaid, bookingTotal } from "../../_hooks/use-today-data";
+function clock(min) {
+  if (min == null) return "";
+  const h = Math.floor(min / 60);
+  const m = min % 60;
+  const period = h >= 12 ? "PM" : "AM";
+  const h12 = h % 12 === 0 ? 12 : h % 12;
+  return `${h12}:${String(m).padStart(2, "0")} ${period}`;
+}
+function BookingCard({
+  booking,
+  formatCurrency,
+  pending,
+  onCheckIn,
+  onRecordPayment,
+  onNoShow
+}) {
+  const paid = isPaid(booking);
+  const status = booking.status;
+  const statusCfg = BOOKING_STATUS_CONFIG[status];
+  const isDone = status === "no_show" || status === "completed" || status === "cancelled";
+  const start = toMinutes(booking.startTime);
+  const end = toMinutes(booking.endTime) ?? (start != null ? start + (booking.durationMinutes ?? 60) : null);
+  const spansDays = !!booking.endDate && booking.endDate !== booking.date;
+  const span = spansDays && booking.endDate ? Math.max(
+    1,
+    Math.round(
+      (Date.parse(`${booking.endDate}T00:00:00Z`) - Date.parse(`${booking.date}T00:00:00Z`)) / 864e5
+    )
+  ) : 0;
+  const unit = booking.data?.rateUnit === "per-night" ? "night" : "day";
+  const stayLabel = (iso) => (/* @__PURE__ */ new Date(`${iso}T00:00:00`)).toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric"
+  });
+  const shell = isDone ? "border-[var(--border-subtle)] bg-[var(--bg-subtle)] opacity-70" : paid ? "border-[var(--border-default)] bg-[var(--bg-base)]" : "border-dashed border-[color:color-mix(in_srgb,var(--warning)_45%,transparent)] bg-[color:color-mix(in_srgb,var(--warning-bg)_40%,transparent)]";
+  const name = booking.customerName?.trim() || "Walk-in";
+  return /* @__PURE__ */ jsxs("div", { className: `rounded-md border p-3 ${shell}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "truncate font-mono text-xs tabular-nums text-[var(--text-secondary)]", children: spansDays ? (
+        // Arrival plus length, not both dates: the checkout date is implied,
+        // and spelling it out wrapped the line in a narrow lane and threw
+        // the status pill onto a second row.
+        /* @__PURE__ */ jsxs(Fragment, { children: [
+          stayLabel(booking.date),
+          " \xB7 ",
+          span,
+          " ",
+          unit,
+          span === 1 ? "" : "s"
+        ] })
+      ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        clock(start),
+        end != null ? ` \u2013 ${clock(end)}` : ""
+      ] }) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [
+        !paid && !isDone ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full bg-[var(--warning-bg)] px-2 py-0.5 text-3xs font-medium text-[var(--warning)]", children: "Unpaid" }) : null,
+        statusCfg ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: `inline-flex items-center rounded-full px-2 py-0.5 text-3xs font-medium ${statusCfg.bgColor} ${statusCfg.color}`,
+            children: statusCfg.label
+          }
+        ) : null
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(Link, { href: `/dashboard/bookings/${booking.id}`, className: "mt-2 block", children: [
+      /* @__PURE__ */ jsx("p", { className: "truncate text-md font-medium text-[var(--text-primary)] hover:text-brand-500", children: name }),
+      /* @__PURE__ */ jsxs("p", { className: "truncate text-xs text-[var(--text-tertiary)]", children: [
+        booking.customerPhone || booking.content?.title || booking.type,
+        bookingTotal(booking) > 0 ? ` \xB7 ${formatCurrency(bookingTotal(booking))}` : ""
+      ] })
+    ] }),
+    !isDone ? /* @__PURE__ */ jsxs("div", { className: "mt-3 flex flex-wrap items-center gap-2", children: [
+      !paid ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "primary",
+          size: "sm",
+          loading: pending === "payment",
+          disabled: pending != null,
+          icon: /* @__PURE__ */ jsx(Wallet, { className: "h-[13px] w-[13px]" }),
+          onClick: onRecordPayment,
+          children: "Record payment"
+        }
+      ) : null,
+      status === "confirmed" && !booking.checkedInAt ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: paid ? "primary" : "secondary",
+          size: "sm",
+          loading: pending === "checkin",
+          disabled: pending != null,
+          icon: /* @__PURE__ */ jsx(Check, { className: "h-[13px] w-[13px]" }),
+          onClick: onCheckIn,
+          children: "Check in"
+        }
+      ) : null,
+      !booking.checkedInAt ? /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          onClick: onNoShow,
+          disabled: pending != null,
+          className: "ml-auto inline-flex items-center gap-1 text-xs text-[var(--text-tertiary)] transition-colors hover:text-[var(--error)] disabled:opacity-50",
+          children: [
+            /* @__PURE__ */ jsx(UserX, {}),
+            "No-show"
+          ]
+        }
+      ) : null
+    ] }) : null
+  ] });
+}
+export {
+  BookingCard
+};
+//# sourceMappingURL=booking-card.js.map

package/dist/dashboard/(bookings)/bookings/_components/today/booking-card.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/dashboard/%28bookings%29/bookings/_components/today/booking-card.tsx"],"sourcesContent":["'use client';\n\nimport Link from 'next/link';\nimport { Check, Wallet, UserX } from 'lucide-react';\nimport { Button } from '@withpotter/ui-kit/button';\nimport {\n  BOOKING_STATUS_CONFIG,\n  type BookingStatus,\n} from '../booking-constants';\nimport type { BookingItem } from '@withpotter/lib/api/types';\nimport { toMinutes, isPaid, bookingTotal } from '../../_hooks/use-today-data';\n\nfunction clock(min: number | null): string {\n  if (min == null) return '';\n  const h = Math.floor(min / 60);\n  const m = min % 60;\n  const period = h >= 12 ? 'PM' : 'AM';\n  const h12 = h % 12 === 0 ? 12 : h % 12;\n  return `${h12}:${String(m).padStart(2, '0')} ${period}`;\n}\n\ntype Pending = 'checkin' | 'payment' | 'noshow' | null;\n\nexport function BookingCard({\n  booking,\n  formatCurrency,\n  pending,\n  onCheckIn,\n  onRecordPayment,\n  onNoShow,\n}: {\n  booking: BookingItem;\n  formatCurrency: (n: number, currency?: string) => string;\n  pending: Pending;\n  onCheckIn: () => void;\n  onRecordPayment: () => void;\n  onNoShow: () => void;\n}) {\n  const paid = isPaid(booking);\n  const status = booking.status as BookingStatus;\n  const statusCfg = BOOKING_STATUS_CONFIG[status];\n  const isDone =\n    status === 'no_show' || status === 'completed' || status === 'cancelled';\n  const start = toMinutes(booking.startTime);\n  const end =\n    toMinutes(booking.endTime) ??\n    (start != null ? start + (booking.durationMinutes ?? 60) : null);\n\n  /**\n   * A booking that runs over days is not an eight-hour appointment.\n   *\n   * Printing both clock times of a four-day reservation gave \"4:00 PM to\n   * 12:00 PM\", which reads as a single afternoon and is wrong in the one way\n   * that matters at a front desk.\n   *\n   * The unit comes from how the listing is let, because this archetype covers\n   * short-lets, holiday rentals AND venues and they do not measure the same\n   * way: a flat goes by the night, a hall booked Friday to Sunday is a two-day\n   * hire. Absent for hourly and flat-rate lets, where \"days\" is true of both.\n   */\n  const spansDays = !!booking.endDate && booking.endDate !== booking.date;\n  const span =\n    spansDays && booking.endDate\n      ? Math.max(\n          1,\n          Math.round(\n            (Date.parse(`${booking.endDate}T00:00:00Z`) -\n              Date.parse(`${booking.date}T00:00:00Z`)) /\n              86_400_000,\n          ),\n        )\n      : 0;\n  const unit =\n    (booking.data as { rateUnit?: string } | null | undefined)?.rateUnit ===\n    'per-night'\n      ? 'night'\n      : 'day';\n  const stayLabel = (iso: string) =>\n    new Date(`${iso}T00:00:00`).toLocaleDateString('en-US', {\n      month: 'short',\n      day: 'numeric',\n    });\n\n  // Weight follows truth: paid + active is solid; money-not-landed is dashed and\n  // wants attention; anything done is muted.\n  const shell = isDone\n    ? 'border-[var(--border-subtle)] bg-[var(--bg-subtle)] opacity-70'\n    : paid\n      ? 'border-[var(--border-default)] bg-[var(--bg-base)]'\n      : 'border-dashed border-[color:color-mix(in_srgb,var(--warning)_45%,transparent)] bg-[color:color-mix(in_srgb,var(--warning-bg)_40%,transparent)]';\n\n  const name = booking.customerName?.trim() || 'Walk-in';\n\n  return (\n    <div className={`rounded-md border p-3 ${shell}`}>\n      <div className=\"flex items-center justify-between gap-2\">\n        <span className=\"truncate font-mono text-xs tabular-nums text-[var(--text-secondary)]\">\n          {spansDays ? (\n            // Arrival plus length, not both dates: the checkout date is implied,\n            // and spelling it out wrapped the line in a narrow lane and threw\n            // the status pill onto a second row.\n            <>\n              {stayLabel(booking.date)} · {span} {unit}\n              {span === 1 ? '' : 's'}\n            </>\n          ) : (\n            <>\n              {clock(start)}\n              {end != null ? ` – ${clock(end)}` : ''}\n            </>\n          )}\n        </span>\n        <div className=\"flex shrink-0 items-center gap-2\">\n          {!paid && !isDone ? (\n            <span className=\"inline-flex items-center rounded-full bg-[var(--warning-bg)] px-2 py-0.5 text-3xs font-medium text-[var(--warning)]\">\n              Unpaid\n            </span>\n          ) : null}\n          {statusCfg ? (\n            <span\n              className={`inline-flex items-center rounded-full px-2 py-0.5 text-3xs font-medium ${statusCfg.bgColor} ${statusCfg.color}`}\n            >\n              {statusCfg.label}\n            </span>\n          ) : null}\n        </div>\n      </div>\n\n      <Link href={`/dashboard/bookings/${booking.id}`} className=\"mt-2 block\">\n        <p className=\"truncate text-md font-medium text-[var(--text-primary)] hover:text-brand-500\">\n          {name}\n        </p>\n        <p className=\"truncate text-xs text-[var(--text-tertiary)]\">\n          {booking.customerPhone || booking.content?.title || booking.type}\n          {bookingTotal(booking) > 0\n            ? ` · ${formatCurrency(bookingTotal(booking))}`\n            : ''}\n        </p>\n      </Link>\n\n      {!isDone ? (\n        <div className=\"mt-3 flex flex-wrap items-center gap-2\">\n          {!paid ? (\n            <Button\n              variant=\"primary\"\n              size=\"sm\"\n              loading={pending === 'payment'}\n              disabled={pending != null}\n              icon={<Wallet className=\"h-[13px] w-[13px]\" />}\n              onClick={onRecordPayment}\n            >\n              Record payment\n            </Button>\n          ) : null}\n          {status === 'confirmed' && !booking.checkedInAt ? (\n            <Button\n              variant={paid ? 'primary' : 'secondary'}\n              size=\"sm\"\n              loading={pending === 'checkin'}\n              disabled={pending != null}\n              icon={<Check className=\"h-[13px] w-[13px]\" />}\n              onClick={onCheckIn}\n            >\n              Check in\n            </Button>\n          ) : null}\n          {!booking.checkedInAt ? (\n            <button\n              type=\"button\"\n              onClick={onNoShow}\n              disabled={pending != null}\n              className=\"ml-auto inline-flex items-center gap-1 text-xs text-[var(--text-tertiary)] transition-colors hover:text-[var(--error)] disabled:opacity-50\"\n            >\n              <UserX />\n              No-show\n            </button>\n          ) : null}\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}