Externalize sexp to .sexpr files + render() API
Replace all 676 inline sexp() string calls across 7 services with render(component_name, **kwargs) calls backed by 46 external .sexpr component definition files (587 defcomps total). - Add render() function to shared/sexp/jinja_bridge.py - Add load_service_components() helper and update load_sexp_dir() for *.sexpr - Update parser keyword regex to support HTMX hx-on::event syntax - Convert remaining inline HTML in route files to render() calls - Add shared/sexp/templates/misc.sexp for cross-service utility components Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -66,7 +66,8 @@ def register():
|
||||
try:
|
||||
await svc_create_calendar(g.s, post_id, name)
|
||||
except Exception as e:
|
||||
return await make_response(f'<div class="text-red-600 text-sm">{e}</div>', 422)
|
||||
from shared.sexp.jinja_bridge import render as render_comp
|
||||
return await make_response(render_comp("error-inline", message=str(e)), 422)
|
||||
|
||||
from shared.sexp.page import get_template_context
|
||||
from sexp.sexp_components import render_calendars_list_panel
|
||||
|
||||
@@ -37,7 +37,7 @@ def register():
|
||||
async def _container_nav_handler():
|
||||
from quart import current_app
|
||||
from shared.infrastructure.urls import events_url
|
||||
from shared.sexp.jinja_bridge import sexp as render_sexp
|
||||
from shared.sexp.jinja_bridge import render as render_comp
|
||||
|
||||
container_type = request.args.get("container_type", "page")
|
||||
container_id = int(request.args.get("container_id", 0))
|
||||
@@ -65,21 +65,21 @@ def register():
|
||||
date_str = entry.start_at.strftime("%b %d, %Y at %H:%M")
|
||||
if entry.end_at:
|
||||
date_str += f" – {entry.end_at.strftime('%H:%M')}"
|
||||
html_parts.append(render_sexp(
|
||||
'(~calendar-entry-nav :href href :name name :date-str date-str :nav-class nav-class)',
|
||||
html_parts.append(render_comp(
|
||||
"calendar-entry-nav",
|
||||
href=events_url(entry_path), name=entry.name,
|
||||
**{"date-str": date_str, "nav-class": nav_class},
|
||||
date_str=date_str, nav_class=nav_class,
|
||||
))
|
||||
# Infinite scroll sentinel (kept as raw HTML — HTMX-specific)
|
||||
if has_more and paginate_url_base:
|
||||
html_parts.append(
|
||||
f'<div id="entries-load-sentinel-{page}"'
|
||||
f' hx-get="{paginate_url_base}?page={page + 1}"'
|
||||
f' hx-trigger="intersect once"'
|
||||
f' hx-swap="beforebegin"'
|
||||
f' _="on htmx:afterRequest trigger scroll on #associated-entries-container"'
|
||||
f' class="flex-shrink-0 w-1"></div>'
|
||||
)
|
||||
html_parts.append(render_comp(
|
||||
"htmx-sentinel",
|
||||
id=f"entries-load-sentinel-{page}",
|
||||
hx_get=f"{paginate_url_base}?page={page + 1}",
|
||||
hx_trigger="intersect once",
|
||||
hx_swap="beforebegin",
|
||||
**{"class": "flex-shrink-0 w-1"},
|
||||
))
|
||||
|
||||
# Calendar links nav
|
||||
if not any(e.startswith("calendar") for e in excludes):
|
||||
@@ -88,9 +88,9 @@ def register():
|
||||
)
|
||||
for cal in calendars:
|
||||
href = events_url(f"/{post_slug}/{cal.slug}/")
|
||||
html_parts.append(render_sexp(
|
||||
'(~calendar-link-nav :href href :name name :nav-class nav-class)',
|
||||
href=href, name=cal.name, **{"nav-class": nav_class},
|
||||
html_parts.append(render_comp(
|
||||
"calendar-link-nav",
|
||||
href=href, name=cal.name, nav_class=nav_class,
|
||||
))
|
||||
|
||||
return "\n".join(html_parts)
|
||||
@@ -125,6 +125,7 @@ def register():
|
||||
async def _account_nav_item_handler():
|
||||
from quart import current_app
|
||||
from shared.infrastructure.urls import account_url
|
||||
from shared.sexp.jinja_bridge import render as render_comp
|
||||
|
||||
styles = current_app.jinja_env.globals.get("styles", {})
|
||||
nav_class = styles.get("nav_button", "")
|
||||
@@ -138,12 +139,10 @@ def register():
|
||||
# hx-* attributes that don't map neatly to a reusable component.
|
||||
parts = []
|
||||
for href, label in [(tickets_url, "tickets"), (bookings_url, "bookings")]:
|
||||
parts.append(
|
||||
f'<div class="relative nav-group">'
|
||||
f'<a href="{href}" hx-get="{href}" hx-target="#main-panel"'
|
||||
f' hx-select="{hx_select}" hx-swap="outerHTML"'
|
||||
f' hx-push-url="true" class="{nav_class}">{label}</a></div>'
|
||||
)
|
||||
parts.append(render_comp(
|
||||
"nav-group-link",
|
||||
href=href, hx_select=hx_select, nav_class=nav_class, label=label,
|
||||
))
|
||||
return "\n".join(parts)
|
||||
|
||||
_handlers["account-nav-item"] = _account_nav_item_handler
|
||||
@@ -176,7 +175,7 @@ def register():
|
||||
|
||||
async def _link_card_handler():
|
||||
from shared.infrastructure.urls import events_url
|
||||
from shared.sexp.jinja_bridge import sexp as render_sexp
|
||||
from shared.sexp.jinja_bridge import render as render_comp
|
||||
|
||||
slug = request.args.get("slug", "")
|
||||
keys_raw = request.args.get("keys", "")
|
||||
@@ -194,8 +193,8 @@ def register():
|
||||
g.s, "page", post.id,
|
||||
)
|
||||
cal_names = ", ".join(c.name for c in calendars) if calendars else ""
|
||||
parts.append(render_sexp(
|
||||
'(~link-card :title title :image image :subtitle subtitle :link link)',
|
||||
parts.append(render_comp(
|
||||
"link-card",
|
||||
title=post.title, image=post.feature_image,
|
||||
subtitle=cal_names, link=events_url(f"/{post.slug}"),
|
||||
))
|
||||
@@ -212,8 +211,8 @@ def register():
|
||||
g.s, "page", post.id,
|
||||
)
|
||||
cal_names = ", ".join(c.name for c in calendars) if calendars else ""
|
||||
return render_sexp(
|
||||
'(~link-card :title title :image image :subtitle subtitle :link link)',
|
||||
return render_comp(
|
||||
"link-card",
|
||||
title=post.title, image=post.feature_image,
|
||||
subtitle=cal_names, link=events_url(f"/{post.slug}"),
|
||||
)
|
||||
|
||||
@@ -50,7 +50,8 @@ def register():
|
||||
try:
|
||||
await svc_create_market(g.s, post_id, name)
|
||||
except Exception as e:
|
||||
return await make_response(f'<div class="text-red-600 text-sm">{e}</div>', 422)
|
||||
from shared.sexp.jinja_bridge import render as render_comp
|
||||
return await make_response(render_comp("error-inline", message=str(e)), 422)
|
||||
|
||||
from shared.sexp.page import get_template_context
|
||||
from sexp.sexp_components import render_markets_list_panel
|
||||
|
||||
96
events/sexp/admin.sexpr
Normal file
96
events/sexp/admin.sexpr
Normal file
@@ -0,0 +1,96 @@
|
||||
;; Events admin components
|
||||
|
||||
(defcomp ~events-calendar-admin-panel (&key description-html csrf description)
|
||||
(section :class "max-w-3xl mx-auto p-4 space-y-10"
|
||||
(div
|
||||
(h2 :class "text-xl font-semibold" "Calendar configuration")
|
||||
(div :id "cal-put-errors" :class "mt-2 text-sm text-red-600")
|
||||
(div (label :class "block text-sm font-medium text-stone-700" "Description")
|
||||
(raw! description-html))
|
||||
(form :id "calendar-form" :method "post" :hx-target "#main-panel" :hx-select "#main-panel"
|
||||
:hx-on::before-request "document.querySelector('#cal-put-errors').textContent='';"
|
||||
:hx-on::response-error "document.querySelector('#cal-put-errors').innerHTML = event.detail.xhr.responseText;"
|
||||
:hx-on::after-request "if (event.detail.successful) this.reset()"
|
||||
:class "hidden space-y-4 mt-4" :autocomplete "off"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(div (label :class "block text-sm font-medium text-stone-700" "Description")
|
||||
(div description)
|
||||
(textarea :name "description" :autocomplete "off" :rows "4" :class "w-full p-2 border rounded" description))
|
||||
(div (button :class "px-3 py-2 rounded bg-stone-800 text-white" "Save"))))
|
||||
(hr :class "border-stone-200")))
|
||||
|
||||
(defcomp ~events-entry-admin-link (&key href)
|
||||
(a :href href :class "inline-flex items-center gap-1 px-2 py-1 text-xs text-stone-500 hover:text-stone-700 hover:bg-stone-100 rounded"
|
||||
(i :class "fa fa-cog" :aria-hidden "true") " Admin"))
|
||||
|
||||
(defcomp ~events-entry-field (&key label content-html)
|
||||
(div :class "flex flex-col mb-4"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" label)
|
||||
(raw! content-html)))
|
||||
|
||||
(defcomp ~events-entry-name-field (&key name)
|
||||
(div :class "mt-1 text-lg font-medium" name))
|
||||
|
||||
(defcomp ~events-entry-slot-assigned (&key slot-name flex-label)
|
||||
(div :class "mt-1"
|
||||
(span :class "px-2 py-1 rounded text-sm bg-blue-100 text-blue-700" slot-name)
|
||||
(span :class "ml-2 text-xs text-stone-500" flex-label)))
|
||||
|
||||
(defcomp ~events-entry-slot-none ()
|
||||
(div :class "mt-1" (span :class "text-sm text-stone-400" "No slot assigned")))
|
||||
|
||||
(defcomp ~events-entry-time-field (&key time-str)
|
||||
(div :class "mt-1" time-str))
|
||||
|
||||
(defcomp ~events-entry-state-field (&key entry-id badge-html)
|
||||
(div :class "mt-1" (div :id (str "entry-state-" entry-id) (raw! badge-html))))
|
||||
|
||||
(defcomp ~events-entry-cost-field (&key cost-html)
|
||||
(div :class "mt-1" (span :class "font-medium text-green-600" (raw! cost-html))))
|
||||
|
||||
(defcomp ~events-entry-tickets-field (&key entry-id tickets-config-html)
|
||||
(div :class "mt-1" :id (str "entry-tickets-" entry-id) (raw! tickets-config-html)))
|
||||
|
||||
(defcomp ~events-entry-date-field (&key date-str)
|
||||
(div :class "mt-1" date-str))
|
||||
|
||||
(defcomp ~events-entry-posts-field (&key entry-id posts-panel-html)
|
||||
(div :class "mt-1" :id (str "entry-posts-" entry-id) (raw! posts-panel-html)))
|
||||
|
||||
(defcomp ~events-entry-panel (&key entry-id list-container name-html slot-html time-html state-html cost-html
|
||||
tickets-html buy-html date-html posts-html options-html pre-action edit-url)
|
||||
(section :id (str "entry-" entry-id) :class list-container
|
||||
(raw! name-html) (raw! slot-html) (raw! time-html) (raw! state-html) (raw! cost-html)
|
||||
(raw! tickets-html) (raw! buy-html) (raw! date-html) (raw! posts-html)
|
||||
(div :class "flex gap-2 mt-6"
|
||||
(raw! options-html)
|
||||
(button :type "button" :class pre-action
|
||||
:hx-get edit-url :hx-target (str "#entry-" entry-id) :hx-swap "outerHTML"
|
||||
"Edit"))))
|
||||
|
||||
(defcomp ~events-entry-title (&key name badge-html)
|
||||
(<> (i :class "fa fa-clock") " " name " " (raw! badge-html)))
|
||||
|
||||
(defcomp ~events-entry-times (&key time-str)
|
||||
(div :class "text-sm text-gray-600" time-str))
|
||||
|
||||
(defcomp ~events-entry-optioned-oob (&key entry-id title-html state-html)
|
||||
(<> (div :id (str "entry-title-" entry-id) :hx-swap-oob "innerHTML" (raw! title-html))
|
||||
(div :id (str "entry-state-" entry-id) :hx-swap-oob "innerHTML" (raw! state-html))))
|
||||
|
||||
(defcomp ~events-entry-options (&key entry-id buttons-html)
|
||||
(div :id (str "calendar_entry_options_" entry-id) :class "flex flex-col md:flex-row gap-1"
|
||||
(raw! buttons-html)))
|
||||
|
||||
(defcomp ~events-entry-option-button (&key url target csrf btn-type action-btn confirm-title confirm-text
|
||||
label is-btn)
|
||||
(form :hx-post url :hx-select target :hx-target target :hx-swap "outerHTML"
|
||||
:hx-trigger (if is-btn "confirmed" nil)
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(button :type btn-type :class action-btn
|
||||
:data-confirm "true" :data-confirm-title confirm-title
|
||||
:data-confirm-text confirm-text :data-confirm-icon "question"
|
||||
:data-confirm-confirm-text (str "Yes, " label " it")
|
||||
:data-confirm-cancel-text "Cancel"
|
||||
:data-confirm-event (if is-btn "confirmed" nil)
|
||||
(i :class "fa-solid fa-rotate mr-2" :aria-hidden "true") label)))
|
||||
102
events/sexp/calendar.sexpr
Normal file
102
events/sexp/calendar.sexpr
Normal file
@@ -0,0 +1,102 @@
|
||||
;; Events calendar components
|
||||
|
||||
(defcomp ~events-calendar-nav-arrow (&key pill-cls href label)
|
||||
(a :class (str pill-cls " text-xl") :href href
|
||||
:hx-get href :hx-target "#main-panel" :hx-select "#main-panel" :hx-swap "outerHTML" :hx-push-url "true" label))
|
||||
|
||||
(defcomp ~events-calendar-month-label (&key month-name year)
|
||||
(div :class "px-3 font-medium" (str month-name " " year)))
|
||||
|
||||
(defcomp ~events-calendar-weekday (&key name)
|
||||
(div :class "py-1" name))
|
||||
|
||||
(defcomp ~events-calendar-day-short (&key day-str)
|
||||
(span :class "sm:hidden text-[16px] text-stone-500" day-str))
|
||||
|
||||
(defcomp ~events-calendar-day-num (&key pill-cls href num)
|
||||
(a :class pill-cls :href href :hx-get href :hx-target "#main-panel" :hx-select "#main-panel"
|
||||
:hx-swap "outerHTML" :hx-push-url "true" num))
|
||||
|
||||
(defcomp ~events-calendar-entry-badge (&key bg-cls name state-label)
|
||||
(div :class (str "flex items-center justify-between gap-1 text-[11px] rounded px-1 py-0.5 " bg-cls)
|
||||
(span :class "truncate" name)
|
||||
(span :class "shrink-0 text-[10px] font-semibold uppercase tracking-tight" state-label)))
|
||||
|
||||
(defcomp ~events-calendar-cell (&key cell-cls day-short-html day-num-html badges-html)
|
||||
(div :class cell-cls
|
||||
(div :class "flex justify-between items-center"
|
||||
(div :class "flex flex-col" (raw! day-short-html) (raw! day-num-html)))
|
||||
(div :class "mt-1 space-y-0.5" (raw! badges-html))))
|
||||
|
||||
(defcomp ~events-calendar-grid (&key arrows-html weekdays-html cells-html)
|
||||
(section :class "bg-orange-100"
|
||||
(header :class "flex items-center justify-center mt-2"
|
||||
(nav :class "flex items-center gap-2 text-2xl" (raw! arrows-html)))
|
||||
(div :class "rounded-2xl border border-stone-200 bg-white/80 p-4"
|
||||
(div :class "hidden sm:grid grid-cols-7 text-center text-md font-semibold text-stone-700 mb-2" (raw! weekdays-html))
|
||||
(div :class "grid grid-cols-1 sm:grid-cols-7 gap-px bg-stone-200 rounded-xl overflow-hidden" (raw! cells-html)))))
|
||||
|
||||
(defcomp ~events-calendars-create-form (&key create-url csrf)
|
||||
(<>
|
||||
(div :id "cal-create-errors" :class "mt-2 text-sm text-red-600")
|
||||
(form :class "mt-4 flex gap-2 items-end" :hx-post create-url
|
||||
:hx-target "#calendars-list" :hx-select "#calendars-list" :hx-swap "outerHTML"
|
||||
:hx-on::before-request "document.querySelector('#cal-create-errors').textContent='';"
|
||||
:hx-on::response-error "document.querySelector('#cal-create-errors').innerHTML = event.detail.xhr.responseText;"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(div :class "flex-1"
|
||||
(label :class "block text-sm text-gray-600" "Name")
|
||||
(input :name "name" :type "text" :required true :class "w-full border rounded px-3 py-2"
|
||||
:placeholder "e.g. Events, Gigs, Meetings"))
|
||||
(button :type "submit" :class "border rounded px-3 py-2" "Add calendar"))))
|
||||
|
||||
(defcomp ~events-calendars-panel (&key form-html list-html)
|
||||
(section :class "p-4"
|
||||
(raw! form-html)
|
||||
(div :id "calendars-list" :class "mt-6" (raw! list-html))))
|
||||
|
||||
(defcomp ~events-calendars-empty ()
|
||||
(p :class "text-gray-500 mt-4" "No calendars yet. Create one above."))
|
||||
|
||||
(defcomp ~events-calendars-item (&key href cal-name cal-slug del-url csrf-hdr)
|
||||
(div :class "mt-6 border rounded-lg p-4"
|
||||
(div :class "flex items-center justify-between gap-3"
|
||||
(a :class "flex items-baseline gap-3" :href href
|
||||
:hx-get href :hx-target "#main-panel" :hx-select "#main-panel" :hx-swap "outerHTML" :hx-push-url "true"
|
||||
(h3 :class "font-semibold" cal-name)
|
||||
(h4 :class "text-gray-500" (str "/" cal-slug "/")))
|
||||
(button :class "text-sm border rounded px-3 py-1 hover:bg-red-50 hover:border-red-400"
|
||||
:data-confirm true :data-confirm-title "Delete calendar?"
|
||||
:data-confirm-text "Entries will be hidden (soft delete)"
|
||||
:data-confirm-icon "warning" :data-confirm-confirm-text "Yes, delete it"
|
||||
:data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
|
||||
:hx-delete del-url :hx-trigger "confirmed"
|
||||
:hx-target "#calendars-list" :hx-select "#calendars-list" :hx-swap "outerHTML"
|
||||
:hx-headers csrf-hdr
|
||||
(i :class "fa-solid fa-trash")))))
|
||||
|
||||
(defcomp ~events-calendar-description-display (&key description edit-url)
|
||||
(div :id "calendar-description"
|
||||
(if description
|
||||
(p :class "text-stone-700 whitespace-pre-line break-all" description)
|
||||
(p :class "text-stone-400 italic" "No description yet."))
|
||||
(button :type "button" :class "mt-2 text-xs underline"
|
||||
:hx-get edit-url :hx-target "#calendar-description" :hx-swap "outerHTML"
|
||||
(i :class "fas fa-edit"))))
|
||||
|
||||
(defcomp ~events-calendar-description-title-oob (&key description)
|
||||
(div :id "calendar-description-title" :hx-swap-oob "outerHTML"
|
||||
:class "text-base font-normal break-words whitespace-normal min-w-0 break-all w-full text-center block"
|
||||
description))
|
||||
|
||||
(defcomp ~events-calendar-description-edit-form (&key save-url cancel-url csrf description)
|
||||
(div :id "calendar-description"
|
||||
(form :hx-post save-url :hx-target "#calendar-description" :hx-swap "outerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(textarea :name "description" :autocomplete "off" :rows "4"
|
||||
:class "w-full p-2 border rounded" description)
|
||||
(div :class "mt-2 flex gap-2 text-xs"
|
||||
(button :type "submit" :class "px-3 py-1 rounded bg-stone-800 text-white" "Save")
|
||||
(button :type "button" :class "px-3 py-1 rounded border"
|
||||
:hx-get cancel-url :hx-target "#calendar-description" :hx-swap "outerHTML"
|
||||
"Cancel")))))
|
||||
84
events/sexp/day.sexpr
Normal file
84
events/sexp/day.sexpr
Normal file
@@ -0,0 +1,84 @@
|
||||
;; Events day components
|
||||
|
||||
(defcomp ~events-day-entry-link (&key href name time-str)
|
||||
(a :href href :class "flex items-center gap-2 px-3 py-2 hover:bg-stone-100 rounded transition text-sm border sm:whitespace-nowrap sm:flex-shrink-0"
|
||||
(div :class "flex-1 min-w-0"
|
||||
(div :class "font-medium truncate" name)
|
||||
(div :class "text-xs text-stone-600 truncate" time-str))))
|
||||
|
||||
(defcomp ~events-day-entries-nav (&key inner-html)
|
||||
(div :class "flex flex-col sm:flex-row sm:items-center gap-2 border-r border-stone-200 mr-2 sm:max-w-2xl"
|
||||
:id "day-entries-nav-wrapper"
|
||||
(div :class "flex overflow-x-auto gap-1 scrollbar-thin"
|
||||
(raw! inner-html))))
|
||||
|
||||
(defcomp ~events-day-table (&key list-container rows-html pre-action add-url)
|
||||
(section :id "day-entries" :class list-container
|
||||
(table :class "w-full text-sm border table-fixed"
|
||||
(thead :class "bg-stone-100"
|
||||
(tr
|
||||
(th :class "p-2 text-left w-2/6" "Name")
|
||||
(th :class "text-left p-2 w-1/6" "Slot/Time")
|
||||
(th :class "text-left p-2 w-1/6" "State")
|
||||
(th :class "text-left p-2 w-1/6" "Cost")
|
||||
(th :class "text-left p-2 w-1/6" "Tickets")
|
||||
(th :class "text-left p-2 w-1/6" "Actions")))
|
||||
(tbody (raw! rows-html)))
|
||||
(div :id "entry-add-container" :class "mt-4"
|
||||
(button :type "button" :class pre-action
|
||||
:hx-get add-url :hx-target "#entry-add-container" :hx-swap "innerHTML"
|
||||
"+ Add entry"))))
|
||||
|
||||
(defcomp ~events-day-empty-row ()
|
||||
(tr (td :colspan "6" :class "p-3 text-stone-500" "No entries yet.")))
|
||||
|
||||
(defcomp ~events-day-row-name (&key href pill-cls name)
|
||||
(td :class "p-2 align-top w-2/6" (div :class "font-medium"
|
||||
(a :href href :class pill-cls :hx-get href :hx-target "#main-panel" :hx-select "#main-panel"
|
||||
:hx-swap "outerHTML" :hx-push-url "true" name))))
|
||||
|
||||
(defcomp ~events-day-row-slot (&key href pill-cls slot-name time-str)
|
||||
(td :class "p-2 align-top w-1/6" (div :class "text-xs font-medium"
|
||||
(a :href href :class pill-cls :hx-get href :hx-target "#main-panel" :hx-select "#main-panel"
|
||||
:hx-swap "outerHTML" :hx-push-url "true" slot-name)
|
||||
(span :class "text-stone-600 font-normal" (raw! time-str)))))
|
||||
|
||||
(defcomp ~events-day-row-time (&key start end)
|
||||
(td :class "p-2 align-top w-1/6" (div :class "text-xs text-stone-600" (str start end))))
|
||||
|
||||
(defcomp ~events-day-row-state (&key state-id badge-html)
|
||||
(td :class "p-2 align-top w-1/6" (div :id state-id (raw! badge-html))))
|
||||
|
||||
(defcomp ~events-day-row-cost (&key cost-str)
|
||||
(td :class "p-2 align-top w-1/6" (span :class "font-medium text-green-600" cost-str)))
|
||||
|
||||
(defcomp ~events-day-row-tickets (&key price-str count-str)
|
||||
(td :class "p-2 align-top w-1/6" (div :class "text-xs space-y-1"
|
||||
(div :class "font-medium text-green-600" price-str)
|
||||
(div :class "text-stone-600" count-str))))
|
||||
|
||||
(defcomp ~events-day-row-no-tickets ()
|
||||
(td :class "p-2 align-top w-1/6" (span :class "text-xs text-stone-400" "No tickets")))
|
||||
|
||||
(defcomp ~events-day-row-actions ()
|
||||
(td :class "p-2 align-top w-1/6"))
|
||||
|
||||
(defcomp ~events-day-row (&key tr-cls name-html slot-html state-html cost-html tickets-html actions-html)
|
||||
(tr :class tr-cls (raw! name-html) (raw! slot-html) (raw! state-html) (raw! cost-html) (raw! tickets-html) (raw! actions-html)))
|
||||
|
||||
(defcomp ~events-day-admin-panel ()
|
||||
(div :class "p-4 text-sm text-stone-500" "Admin options"))
|
||||
|
||||
(defcomp ~events-day-entries-nav-oob-empty ()
|
||||
(div :id "day-entries-nav-wrapper" :hx-swap-oob "true"))
|
||||
|
||||
(defcomp ~events-day-entries-nav-oob (&key items-html)
|
||||
(div :class "flex flex-col sm:flex-row sm:items-center gap-2 border-r border-stone-200 mr-2 sm:max-w-2xl"
|
||||
:id "day-entries-nav-wrapper" :hx-swap-oob "true"
|
||||
(div :class "flex overflow-x-auto gap-1 scrollbar-thin" (raw! items-html))))
|
||||
|
||||
(defcomp ~events-day-nav-entry (&key href nav-btn name time-str)
|
||||
(a :href href :class nav-btn
|
||||
(div :class "flex-1 min-w-0"
|
||||
(div :class "font-medium truncate" name)
|
||||
(div :class "text-xs text-stone-600 truncate" time-str))))
|
||||
103
events/sexp/entries.sexpr
Normal file
103
events/sexp/entries.sexpr
Normal file
@@ -0,0 +1,103 @@
|
||||
;; Events entry card components (all events / page summary)
|
||||
|
||||
(defcomp ~events-state-badge (&key cls label)
|
||||
(span :class (str "inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium " cls) label))
|
||||
|
||||
(defcomp ~events-entry-title-linked (&key href name)
|
||||
(a :href href :class "hover:text-emerald-700"
|
||||
(h2 :class "text-lg font-semibold text-stone-900" name)))
|
||||
|
||||
(defcomp ~events-entry-title-plain (&key name)
|
||||
(h2 :class "text-lg font-semibold text-stone-900" name))
|
||||
|
||||
(defcomp ~events-entry-title-tile-linked (&key href name)
|
||||
(a :href href :class "hover:text-emerald-700"
|
||||
(h2 :class "text-base font-semibold text-stone-900 line-clamp-2" name)))
|
||||
|
||||
(defcomp ~events-entry-title-tile-plain (&key name)
|
||||
(h2 :class "text-base font-semibold text-stone-900 line-clamp-2" name))
|
||||
|
||||
(defcomp ~events-entry-page-badge (&key href title)
|
||||
(a :href href :class "inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-amber-100 text-amber-800 hover:bg-amber-200" title))
|
||||
|
||||
(defcomp ~events-entry-cal-badge (&key name)
|
||||
(span :class "inline-block px-2 py-0.5 rounded-full text-xs font-medium bg-sky-100 text-sky-700" name))
|
||||
|
||||
(defcomp ~events-entry-time-linked (&key href date-str)
|
||||
(<> (a :href href :class "hover:text-stone-700" date-str) (raw! " · ")))
|
||||
|
||||
(defcomp ~events-entry-time-plain (&key date-str)
|
||||
(<> (span date-str) (raw! " · ")))
|
||||
|
||||
(defcomp ~events-entry-cost (&key cost-html)
|
||||
(div :class "mt-1 text-sm font-medium text-green-600" (raw! cost-html)))
|
||||
|
||||
(defcomp ~events-entry-card (&key title-html badges-html time-parts cost-html widget-html)
|
||||
(article :class "rounded-xl bg-white shadow-sm border border-stone-200 p-4"
|
||||
(div :class "flex flex-col sm:flex-row sm:items-start justify-between gap-3"
|
||||
(div :class "flex-1 min-w-0"
|
||||
(raw! title-html)
|
||||
(div :class "flex flex-wrap items-center gap-1.5 mt-1" (raw! badges-html))
|
||||
(div :class "mt-1 text-sm text-stone-500" (raw! time-parts))
|
||||
(raw! cost-html))
|
||||
(raw! widget-html))))
|
||||
|
||||
(defcomp ~events-entry-card-tile (&key title-html badges-html time-html cost-html widget-html)
|
||||
(article :class "rounded-xl bg-white shadow-sm border border-stone-200 overflow-hidden"
|
||||
(div :class "p-3"
|
||||
(raw! title-html)
|
||||
(div :class "flex flex-wrap items-center gap-1 mt-1" (raw! badges-html))
|
||||
(div :class "mt-1 text-xs text-stone-500" (raw! time-html))
|
||||
(raw! cost-html))
|
||||
(raw! widget-html)))
|
||||
|
||||
(defcomp ~events-entry-tile-widget-wrapper (&key widget-html)
|
||||
(div :class "border-t border-stone-100 px-3 py-2" (raw! widget-html)))
|
||||
|
||||
(defcomp ~events-entry-widget-wrapper (&key widget-html)
|
||||
(div :class "shrink-0" (raw! widget-html)))
|
||||
|
||||
(defcomp ~events-date-separator (&key date-str)
|
||||
(div :class "pt-2 pb-1"
|
||||
(h3 :class "text-sm font-semibold text-stone-500 uppercase tracking-wide" date-str)))
|
||||
|
||||
(defcomp ~events-sentinel (&key page next-url)
|
||||
(div :id (str "sentinel-" page) :class "h-4 opacity-0 pointer-events-none"
|
||||
:hx-get next-url :hx-trigger "intersect once delay:250ms" :hx-swap "outerHTML"
|
||||
:role "status" :aria-hidden "true"
|
||||
(div :class "text-center text-xs text-stone-400" "loading...")))
|
||||
|
||||
(defcomp ~events-list-svg ()
|
||||
(svg :xmlns "http://www.w3.org/2000/svg" :class "h-5 w-5" :fill "none"
|
||||
:viewBox "0 0 24 24" :stroke "currentColor" :stroke-width "2"
|
||||
(path :stroke-linecap "round" :stroke-linejoin "round" :d "M4 6h16M4 12h16M4 18h16")))
|
||||
|
||||
(defcomp ~events-tile-svg ()
|
||||
(svg :xmlns "http://www.w3.org/2000/svg" :class "h-5 w-5" :fill "none"
|
||||
:viewBox "0 0 24 24" :stroke "currentColor" :stroke-width "2"
|
||||
(path :stroke-linecap "round" :stroke-linejoin "round"
|
||||
:d "M4 5a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM14 5a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1V5zM4 15a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1H5a1 1 0 01-1-1v-4zM14 15a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z")))
|
||||
|
||||
(defcomp ~events-view-toggle (&key list-href tile-href hx-select list-active tile-active list-svg tile-svg)
|
||||
(div :class "hidden md:flex justify-end px-3 pt-3 gap-1"
|
||||
(a :href list-href :hx-get list-href :hx-target "#main-panel" :hx-select hx-select
|
||||
:hx-swap "outerHTML" :hx-push-url "true"
|
||||
:class (str "p-1.5 rounded " list-active) :title "List view"
|
||||
:_ "on click js localStorage.removeItem('events_view') end"
|
||||
(raw! list-svg))
|
||||
(a :href tile-href :hx-get tile-href :hx-target "#main-panel" :hx-select hx-select
|
||||
:hx-swap "outerHTML" :hx-push-url "true"
|
||||
:class (str "p-1.5 rounded " tile-active) :title "Tile view"
|
||||
:_ "on click js localStorage.setItem('events_view','tile') end"
|
||||
(raw! tile-svg))))
|
||||
|
||||
(defcomp ~events-grid (&key grid-cls cards-html)
|
||||
(div :class grid-cls (raw! cards-html)))
|
||||
|
||||
(defcomp ~events-empty ()
|
||||
(div :class "px-3 py-12 text-center text-stone-400"
|
||||
(i :class "fa fa-calendar-xmark text-4xl mb-3" :aria-hidden "true")
|
||||
(p :class "text-lg" "No upcoming events")))
|
||||
|
||||
(defcomp ~events-main-panel-body (&key toggle-html body-html)
|
||||
(<> (raw! toggle-html) (raw! body-html) (div :class "pb-8")))
|
||||
46
events/sexp/header.sexpr
Normal file
46
events/sexp/header.sexpr
Normal file
@@ -0,0 +1,46 @@
|
||||
;; Events header components
|
||||
|
||||
(defcomp ~events-oob-header (&key parent-id child-id row-html)
|
||||
(div :id parent-id :hx-swap-oob "outerHTML" :class "w-full"
|
||||
(div :class "w-full"
|
||||
(raw! row-html)
|
||||
(div :id child-id))))
|
||||
|
||||
(defcomp ~events-post-label (&key feature-image title)
|
||||
(<> (when feature-image (img :src feature-image :class "h-8 w-8 rounded-full object-cover border border-stone-300 flex-shrink-0"))
|
||||
(span title)))
|
||||
|
||||
(defcomp ~events-post-cart-link (&key href count)
|
||||
(a :href href :class "relative inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border border-emerald-300 bg-emerald-50 text-emerald-800 hover:bg-emerald-100 transition"
|
||||
(i :class "fa fa-shopping-cart" :aria-hidden "true")
|
||||
(span count)))
|
||||
|
||||
(defcomp ~events-calendars-label ()
|
||||
(<> (i :class "fa fa-calendar" :aria-hidden "true") (div "Calendars")))
|
||||
|
||||
(defcomp ~events-markets-label ()
|
||||
(<> (i :class "fa fa-shopping-bag" :aria-hidden "true") (div "Markets")))
|
||||
|
||||
(defcomp ~events-payments-label ()
|
||||
(<> (i :class "fa fa-credit-card" :aria-hidden "true") (div "Payments")))
|
||||
|
||||
(defcomp ~events-calendar-label (&key name description)
|
||||
(div :class "flex flex-col md:flex-row md:gap-2 items-center min-w-0"
|
||||
(div :class "flex flex-row items-center gap-2"
|
||||
(i :class "fa fa-calendar")
|
||||
(div :class "shrink-0" name))
|
||||
(div :id "calendar-description-title"
|
||||
:class "text-base font-normal break-words whitespace-normal min-w-0 break-all w-full text-center block"
|
||||
description)))
|
||||
|
||||
(defcomp ~events-day-label (&key date-str)
|
||||
(div :class "flex gap-1 items-center"
|
||||
(i :class "fa fa-calendar-day")
|
||||
(span date-str)))
|
||||
|
||||
(defcomp ~events-entry-label (&key entry-id title-html times-html)
|
||||
(div :id (str "entry-title-" entry-id) :class "flex gap-1 items-center"
|
||||
(raw! title-html) (raw! times-html)))
|
||||
|
||||
(defcomp ~events-header-child (&key inner-html)
|
||||
(div :id "root-header-child" :class "w-full" (raw! inner-html)))
|
||||
386
events/sexp/page.sexpr
Normal file
386
events/sexp/page.sexpr
Normal file
@@ -0,0 +1,386 @@
|
||||
;; Events page-level components (slots, ticket types, buy form, cart, posts nav)
|
||||
|
||||
(defcomp ~events-slot-days-pills (&key days-inner-html)
|
||||
(div :class "flex flex-wrap gap-1" (raw! days-inner-html)))
|
||||
|
||||
(defcomp ~events-slot-day-pill (&key day)
|
||||
(span :class "px-2 py-0.5 rounded-full text-xs bg-slate-200" day))
|
||||
|
||||
(defcomp ~events-slot-no-days ()
|
||||
(span :class "text-xs text-slate-400" "No days"))
|
||||
|
||||
(defcomp ~events-slot-panel (&key slot-id list-container days-html flexible time-str cost-str pre-action edit-url)
|
||||
(section :id (str "slot-" slot-id) :class list-container
|
||||
(div :class "flex flex-col"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" "Days")
|
||||
(div :class "mt-1" (raw! days-html)))
|
||||
(div :class "flex flex-col"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" "Flexible")
|
||||
(div :class "mt-1" flexible))
|
||||
(div :class "grid grid-cols-1 sm:grid-cols-2 gap-4 text-sm"
|
||||
(div :class "flex flex-col"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" "Time")
|
||||
(div :class "mt-1" time-str))
|
||||
(div :class "flex flex-col"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" "Cost")
|
||||
(div :class "mt-1" cost-str)))
|
||||
(button :type "button" :class pre-action :hx-get edit-url
|
||||
:hx-target (str "#slot-" slot-id) :hx-swap "outerHTML" "Edit")))
|
||||
|
||||
(defcomp ~events-slot-description-oob (&key description)
|
||||
(div :id "slot-description-title" :hx-swap-oob "outerHTML"
|
||||
:class "text-base font-normal break-words whitespace-normal min-w-0 break-all w-full text-center block"
|
||||
description))
|
||||
|
||||
(defcomp ~events-slots-empty-row ()
|
||||
(tr (td :colspan "5" :class "p-3 text-stone-500" "No slots yet.")))
|
||||
|
||||
(defcomp ~events-slots-row (&key tr-cls slot-href pill-cls hx-select slot-name description
|
||||
flexible days-html time-str cost-str action-btn del-url csrf-hdr)
|
||||
(tr :class tr-cls
|
||||
(td :class "p-2 align-top w-1/6"
|
||||
(div :class "font-medium"
|
||||
(a :href slot-href :class pill-cls :hx-get slot-href :hx-target "#main-panel"
|
||||
:hx-select hx-select :hx-swap "outerHTML" :hx-push-url "true" slot-name))
|
||||
(p :class "text-stone-500 whitespace-pre-line break-all w-full" description))
|
||||
(td :class "p-2 align-top w-1/6" flexible)
|
||||
(td :class "p-2 align-top w-1/6" (raw! days-html))
|
||||
(td :class "p-2 align-top w-1/6" time-str)
|
||||
(td :class "p-2 align-top w-1/6" cost-str)
|
||||
(td :class "p-2 align-top w-1/6"
|
||||
(button :class action-btn :type "button"
|
||||
:data-confirm "true" :data-confirm-title "Delete slot?"
|
||||
:data-confirm-text "This action cannot be undone."
|
||||
:data-confirm-icon "warning" :data-confirm-confirm-text "Yes, delete it"
|
||||
:data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
|
||||
:hx-delete del-url :hx-target "#slots-table" :hx-select "#slots-table"
|
||||
:hx-swap "outerHTML" :hx-headers csrf-hdr :hx-trigger "confirmed"
|
||||
(i :class "fa-solid fa-trash")))))
|
||||
|
||||
(defcomp ~events-slots-table (&key list-container rows-html pre-action add-url)
|
||||
(section :id "slots-table" :class list-container
|
||||
(table :class "w-full text-sm border table-fixed"
|
||||
(thead :class "bg-stone-100"
|
||||
(tr (th :class "p-2 text-left w-1/6" "Name")
|
||||
(th :class "p-2 text-left w-1/6" "Flexible")
|
||||
(th :class "text-left p-2 w-1/6" "Days")
|
||||
(th :class "text-left p-2 w-1/6" "Time")
|
||||
(th :class "text-left p-2 w-1/6" "Cost")
|
||||
(th :class "text-left p-2 w-1/6" "Actions")))
|
||||
(tbody (raw! rows-html)))
|
||||
(div :id "slot-add-container" :class "mt-4"
|
||||
(button :type "button" :class pre-action
|
||||
:hx-get add-url :hx-target "#slot-add-container" :hx-swap "innerHTML"
|
||||
"+ Add slot"))))
|
||||
|
||||
(defcomp ~events-ticket-type-col (&key label value)
|
||||
(div :class "flex flex-col"
|
||||
(div :class "text-xs font-semibold uppercase tracking-wide text-stone-500" label)
|
||||
(div :class "mt-1" value)))
|
||||
|
||||
(defcomp ~events-ticket-type-panel (&key ticket-id list-container c1 c2 c3 pre-action edit-url)
|
||||
(section :id (str "ticket-" ticket-id) :class list-container
|
||||
(div :class "grid grid-cols-1 sm:grid-cols-3 gap-4 text-sm"
|
||||
(raw! c1) (raw! c2) (raw! c3))
|
||||
(button :type "button" :class pre-action :hx-get edit-url
|
||||
:hx-target (str "#ticket-" ticket-id) :hx-swap "outerHTML" "Edit")))
|
||||
|
||||
(defcomp ~events-ticket-types-empty-row ()
|
||||
(tr (td :colspan "4" :class "p-3 text-stone-500" "No ticket types yet.")))
|
||||
|
||||
(defcomp ~events-ticket-types-row (&key tr-cls tt-href pill-cls hx-select tt-name cost-str count
|
||||
action-btn del-url csrf-hdr)
|
||||
(tr :class tr-cls
|
||||
(td :class "p-2 align-top w-1/3"
|
||||
(div :class "font-medium"
|
||||
(a :href tt-href :class pill-cls :hx-get tt-href :hx-target "#main-panel"
|
||||
:hx-select hx-select :hx-swap "outerHTML" :hx-push-url "true" tt-name)))
|
||||
(td :class "p-2 align-top w-1/4" cost-str)
|
||||
(td :class "p-2 align-top w-1/4" count)
|
||||
(td :class "p-2 align-top w-1/6"
|
||||
(button :class action-btn :type "button"
|
||||
:data-confirm "true" :data-confirm-title "Delete ticket type?"
|
||||
:data-confirm-text "This action cannot be undone."
|
||||
:data-confirm-icon "warning" :data-confirm-confirm-text "Yes, delete it"
|
||||
:data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
|
||||
:hx-delete del-url :hx-target "#tickets-table" :hx-select "#tickets-table"
|
||||
:hx-swap "outerHTML" :hx-headers csrf-hdr :hx-trigger "confirmed"
|
||||
(i :class "fa-solid fa-trash")))))
|
||||
|
||||
(defcomp ~events-ticket-types-table (&key list-container rows-html action-btn add-url)
|
||||
(section :id "tickets-table" :class list-container
|
||||
(table :class "w-full text-sm border table-fixed"
|
||||
(thead :class "bg-stone-100"
|
||||
(tr (th :class "p-2 text-left w-1/3" "Name")
|
||||
(th :class "text-left p-2 w-1/4" "Cost")
|
||||
(th :class "text-left p-2 w-1/4" "Count")
|
||||
(th :class "text-left p-2 w-1/6" "Actions")))
|
||||
(tbody (raw! rows-html)))
|
||||
(div :id "ticket-add-container" :class "mt-4"
|
||||
(button :class action-btn :hx-get add-url :hx-target "#ticket-add-container" :hx-swap "innerHTML"
|
||||
(i :class "fa fa-plus") " Add ticket type"))))
|
||||
|
||||
(defcomp ~events-ticket-config-display (&key price-str count-str show-js)
|
||||
(div :class "space-y-2"
|
||||
(div :class "flex items-center gap-2"
|
||||
(span :class "text-sm font-medium text-stone-700" "Price:")
|
||||
(span :class "font-medium text-green-600" (raw! price-str)))
|
||||
(div :class "flex items-center gap-2"
|
||||
(span :class "text-sm font-medium text-stone-700" "Available:")
|
||||
(span :class "font-medium text-blue-600" count-str))
|
||||
(button :type "button" :class "text-xs text-blue-600 hover:text-blue-800 underline"
|
||||
:onclick show-js "Edit ticket config")))
|
||||
|
||||
(defcomp ~events-ticket-config-none (&key show-js)
|
||||
(div :class "space-y-2"
|
||||
(span :class "text-sm text-stone-400" "No tickets configured")
|
||||
(button :type "button" :class "block text-xs text-blue-600 hover:text-blue-800 underline"
|
||||
:onclick show-js "Configure tickets")))
|
||||
|
||||
(defcomp ~events-ticket-config-form (&key entry-id hidden-cls update-url csrf price-val count-val hide-js)
|
||||
(form :id (str "ticket-form-" entry-id) :class (str hidden-cls " space-y-3 mt-2 p-3 border rounded bg-stone-50")
|
||||
:hx-post update-url :hx-target (str "#entry-tickets-" entry-id) :hx-swap "innerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(div (label :for (str "ticket-price-" entry-id) :class "block text-sm font-medium text-stone-700 mb-1"
|
||||
(raw! "Ticket Price (£)"))
|
||||
(input :type "number" :id (str "ticket-price-" entry-id) :name "ticket_price"
|
||||
:step "0.01" :min "0" :value price-val
|
||||
:class "w-full px-3 py-2 border rounded focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
:placeholder "e.g., 5.00"))
|
||||
(div (label :for (str "ticket-count-" entry-id) :class "block text-sm font-medium text-stone-700 mb-1"
|
||||
"Total Tickets")
|
||||
(input :type "number" :id (str "ticket-count-" entry-id) :name "ticket_count"
|
||||
:min "0" :value count-val
|
||||
:class "w-full px-3 py-2 border rounded focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
:placeholder "Leave empty for unlimited"))
|
||||
(div :class "flex gap-2"
|
||||
(button :type "submit" :class "px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 text-sm" "Save")
|
||||
(button :type "button" :class "px-4 py-2 bg-stone-200 text-stone-700 rounded hover:bg-stone-300 text-sm"
|
||||
:onclick hide-js "Cancel"))))
|
||||
|
||||
(defcomp ~events-buy-not-confirmed (&key entry-id)
|
||||
(div :id (str "ticket-buy-" entry-id) :class "rounded-xl border border-stone-200 bg-stone-50 p-4 text-sm text-stone-500"
|
||||
(i :class "fa fa-ticket mr-1" :aria-hidden "true")
|
||||
"Tickets available once this event is confirmed."))
|
||||
|
||||
(defcomp ~events-buy-info-sold (&key count)
|
||||
(span (str count " sold")))
|
||||
|
||||
(defcomp ~events-buy-info-remaining (&key count)
|
||||
(span (str count " remaining")))
|
||||
|
||||
(defcomp ~events-buy-info-basket (&key count)
|
||||
(span :class "text-emerald-600 font-medium"
|
||||
(i :class "fa fa-shopping-cart text-[0.6rem]" :aria-hidden "true")
|
||||
(str " " count " in basket")))
|
||||
|
||||
(defcomp ~events-buy-info-bar (&key items-html)
|
||||
(div :class "flex items-center gap-3 mb-3 text-xs text-stone-500" (raw! items-html)))
|
||||
|
||||
(defcomp ~events-buy-type-item (&key type-name cost-str adjust-controls-html)
|
||||
(div :class "flex items-center justify-between p-3 rounded-lg bg-stone-50 border border-stone-100"
|
||||
(div (div :class "font-medium text-sm" type-name)
|
||||
(div :class "text-xs text-stone-500" cost-str))
|
||||
(raw! adjust-controls-html)))
|
||||
|
||||
(defcomp ~events-buy-types-wrapper (&key items-html)
|
||||
(div :class "space-y-2" (raw! items-html)))
|
||||
|
||||
(defcomp ~events-buy-default (&key price-str adjust-controls-html)
|
||||
(<> (div :class "flex items-center justify-between mb-4"
|
||||
(div (span :class "font-medium text-green-600" price-str)
|
||||
(span :class "text-sm text-stone-500 ml-2" "per ticket")))
|
||||
(raw! adjust-controls-html)))
|
||||
|
||||
(defcomp ~events-buy-panel (&key entry-id info-html body-html)
|
||||
(div :id (str "ticket-buy-" entry-id) :class "rounded-xl border border-stone-200 bg-white p-4"
|
||||
(h3 :class "text-sm font-semibold text-stone-700 mb-3"
|
||||
(i :class "fa fa-ticket mr-1" :aria-hidden "true") "Tickets")
|
||||
(raw! info-html) (raw! body-html)))
|
||||
|
||||
(defcomp ~events-adjust-form (&key adjust-url target extra-cls csrf entry-id tt-html count-val btn-html)
|
||||
(form :hx-post adjust-url :hx-target target :hx-swap "outerHTML" :class extra-cls
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(input :type "hidden" :name "entry_id" :value entry-id)
|
||||
(raw! tt-html)
|
||||
(input :type "hidden" :name "count" :value count-val)
|
||||
(raw! btn-html)))
|
||||
|
||||
(defcomp ~events-adjust-tt-hidden (&key ticket-type-id)
|
||||
(input :type "hidden" :name "ticket_type_id" :value ticket-type-id))
|
||||
|
||||
(defcomp ~events-adjust-cart-plus ()
|
||||
(button :type "submit"
|
||||
:class "relative inline-flex items-center justify-center text-sm font-medium text-stone-500 hover:bg-emerald-50 rounded p-1"
|
||||
(i :class "fa fa-cart-plus text-2xl" :aria-hidden "true")))
|
||||
|
||||
(defcomp ~events-adjust-minus ()
|
||||
(button :type "submit"
|
||||
:class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl"
|
||||
"-"))
|
||||
|
||||
(defcomp ~events-adjust-plus ()
|
||||
(button :type "submit"
|
||||
:class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl"
|
||||
"+"))
|
||||
|
||||
(defcomp ~events-adjust-cart-icon (&key href count)
|
||||
(a :class "relative inline-flex items-center justify-center text-emerald-700" :href href
|
||||
(span :class "relative inline-flex items-center justify-center"
|
||||
(i :class "fa-solid fa-shopping-cart text-2xl" :aria-hidden "true")
|
||||
(span :class "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none"
|
||||
(span :class "flex items-center justify-center bg-black text-white rounded-full w-4 h-4 text-xs font-bold" count)))))
|
||||
|
||||
(defcomp ~events-adjust-controls (&key minus-html cart-icon-html plus-html)
|
||||
(div :class "flex items-center gap-2" (raw! minus-html) (raw! cart-icon-html) (raw! plus-html)))
|
||||
|
||||
(defcomp ~events-buy-result (&key entry-id count-label tickets-html remaining-html my-tickets-href)
|
||||
(div :id (str "ticket-buy-" entry-id) :class "rounded-xl border border-emerald-200 bg-emerald-50 p-4"
|
||||
(div :class "flex items-center gap-2 mb-3"
|
||||
(i :class "fa fa-check-circle text-emerald-600" :aria-hidden "true")
|
||||
(span :class "font-semibold text-emerald-800" count-label))
|
||||
(div :class "space-y-2 mb-4" (raw! tickets-html))
|
||||
(raw! remaining-html)
|
||||
(div :class "mt-3 flex gap-2"
|
||||
(a :href my-tickets-href :class "text-sm text-emerald-700 hover:text-emerald-900 underline"
|
||||
"View all my tickets"))))
|
||||
|
||||
(defcomp ~events-buy-result-ticket (&key href code-short)
|
||||
(a :href href :class "flex items-center justify-between p-2 rounded-lg bg-white border border-emerald-100 hover:border-emerald-300 transition text-sm"
|
||||
(div :class "flex items-center gap-2"
|
||||
(i :class "fa fa-ticket text-emerald-500" :aria-hidden "true")
|
||||
(span :class "font-mono text-xs text-stone-500" code-short))
|
||||
(span :class "text-xs text-emerald-600 font-medium" "View ticket")))
|
||||
|
||||
(defcomp ~events-buy-result-remaining (&key text)
|
||||
(p :class "text-xs text-stone-500" text))
|
||||
|
||||
(defcomp ~events-cart-icon-logo (&key blog-href logo)
|
||||
(div :id "cart-mini" :hx-swap-oob "true"
|
||||
(div :class "h-12 w-12 rounded-full overflow-hidden border border-stone-300 flex-shrink-0"
|
||||
(a :href blog-href :class "h-full w-full font-bold text-5xl flex-shrink-0 flex flex-row items-center gap-1"
|
||||
(img :src logo :class "h-full w-full rounded-full object-cover border border-stone-300 flex-shrink-0")))))
|
||||
|
||||
(defcomp ~events-cart-icon-badge (&key cart-href count)
|
||||
(div :id "cart-mini" :hx-swap-oob "true"
|
||||
(a :href cart-href :class "relative inline-flex items-center justify-center text-stone-700 hover:text-emerald-700"
|
||||
(i :class "fa fa-shopping-cart text-5xl" :aria-hidden "true")
|
||||
(span :class "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 inline-flex items-center justify-center rounded-full bg-emerald-600 text-white text-sm w-5 h-5"
|
||||
count))))
|
||||
|
||||
;; Inline ticket widget (for all-events/page-summary cards)
|
||||
(defcomp ~events-tw-form (&key ticket-url target csrf entry-id count-val btn-html)
|
||||
(form :action ticket-url :method "post" :hx-post ticket-url :hx-target target :hx-swap "outerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(input :type "hidden" :name "entry_id" :value entry-id)
|
||||
(input :type "hidden" :name "count" :value count-val)
|
||||
(raw! btn-html)))
|
||||
|
||||
(defcomp ~events-tw-cart-plus ()
|
||||
(button :type "submit" :class "relative inline-flex items-center justify-center text-stone-500 hover:bg-emerald-50 rounded p-1"
|
||||
(i :class "fa fa-cart-plus text-2xl" :aria-hidden "true")))
|
||||
|
||||
(defcomp ~events-tw-minus ()
|
||||
(button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "-"))
|
||||
|
||||
(defcomp ~events-tw-plus ()
|
||||
(button :type "submit" :class "inline-flex items-center justify-center w-8 h-8 text-sm font-medium rounded-full border border-emerald-600 text-emerald-700 hover:bg-emerald-50 text-xl" "+"))
|
||||
|
||||
(defcomp ~events-tw-cart-icon (&key qty)
|
||||
(span :class "relative inline-flex items-center justify-center text-emerald-700"
|
||||
(span :class "relative inline-flex items-center justify-center"
|
||||
(i :class "fa-solid fa-shopping-cart text-xl" :aria-hidden "true")
|
||||
(span :class "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none"
|
||||
(span :class "flex items-center justify-center bg-black text-white rounded-full w-4 h-4 text-xs font-bold" qty)))))
|
||||
|
||||
(defcomp ~events-tw-widget (&key entry-id price-html inner-html)
|
||||
(div :id (str "page-ticket-" entry-id) :class "flex items-center gap-2"
|
||||
(span :class "text-green-600 font-medium text-sm" (raw! price-html))
|
||||
(raw! inner-html)))
|
||||
|
||||
;; Entry posts panel
|
||||
(defcomp ~events-entry-posts-panel (&key posts-html search-url entry-id)
|
||||
(div :class "space-y-2"
|
||||
(raw! posts-html)
|
||||
(div :class "mt-3 pt-3 border-t"
|
||||
(label :class "block text-xs font-medium text-stone-700 mb-1" "Add Post")
|
||||
(input :type "text" :placeholder "Search posts..."
|
||||
:class "w-full px-3 py-2 border rounded text-sm"
|
||||
:hx-get search-url :hx-trigger "keyup changed delay:300ms, load"
|
||||
:hx-target (str "#post-search-results-" entry-id) :hx-swap "innerHTML" :name "q")
|
||||
(div :id (str "post-search-results-" entry-id) :class "mt-2 max-h-96 overflow-y-auto border rounded"))))
|
||||
|
||||
(defcomp ~events-entry-posts-list (&key items-html)
|
||||
(div :class "space-y-2" (raw! items-html)))
|
||||
|
||||
(defcomp ~events-entry-posts-none ()
|
||||
(p :class "text-sm text-stone-400" "No posts associated"))
|
||||
|
||||
(defcomp ~events-entry-post-item (&key img-html title del-url entry-id csrf-hdr)
|
||||
(div :class "flex items-center justify-between gap-3 p-2 bg-stone-50 rounded border"
|
||||
(raw! img-html) (span :class "text-sm flex-1" title)
|
||||
(button :type "button" :class "text-xs text-red-600 hover:text-red-800 flex-shrink-0"
|
||||
:data-confirm "true" :data-confirm-title "Remove post?"
|
||||
:data-confirm-text (str "This will remove " title " from this entry")
|
||||
:data-confirm-icon "warning" :data-confirm-confirm-text "Yes, remove it"
|
||||
:data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
|
||||
:hx-delete del-url :hx-trigger "confirmed"
|
||||
:hx-target (str "#entry-posts-" entry-id) :hx-swap "innerHTML"
|
||||
:hx-headers csrf-hdr
|
||||
(i :class "fa fa-times") " Remove")))
|
||||
|
||||
(defcomp ~events-post-img (&key src alt)
|
||||
(img :src src :alt alt :class "w-8 h-8 rounded-full object-cover flex-shrink-0"))
|
||||
|
||||
(defcomp ~events-post-img-placeholder ()
|
||||
(div :class "w-8 h-8 rounded-full bg-stone-200 flex-shrink-0"))
|
||||
|
||||
;; Entry posts nav OOB
|
||||
(defcomp ~events-entry-posts-nav-oob-empty ()
|
||||
(div :id "entry-posts-nav-wrapper" :hx-swap-oob "true"))
|
||||
|
||||
(defcomp ~events-entry-posts-nav-oob (&key items-html)
|
||||
(div :class "flex flex-col sm:flex-row sm:items-center gap-2 border-r border-stone-200 mr-2 sm:max-w-2xl"
|
||||
:id "entry-posts-nav-wrapper" :hx-swap-oob "true"
|
||||
(div :class "flex overflow-x-auto gap-1 scrollbar-thin" (raw! items-html))))
|
||||
|
||||
(defcomp ~events-entry-nav-post (&key href nav-btn img-html title)
|
||||
(a :href href :class nav-btn (raw! img-html) (div :class "flex-1 min-w-0" (div :class "font-medium truncate" title))))
|
||||
|
||||
;; Post nav entries OOB
|
||||
(defcomp ~events-post-nav-oob-empty ()
|
||||
(div :id "entries-calendars-nav-wrapper" :hx-swap-oob "true"))
|
||||
|
||||
(defcomp ~events-post-nav-entry (&key href nav-btn name time-str)
|
||||
(a :href href :class nav-btn
|
||||
(div :class "w-8 h-8 rounded bg-stone-200 flex-shrink-0")
|
||||
(div :class "flex-1 min-w-0"
|
||||
(div :class "font-medium truncate" name)
|
||||
(div :class "text-xs text-stone-600 truncate" time-str))))
|
||||
|
||||
(defcomp ~events-post-nav-calendar (&key href nav-btn name)
|
||||
(a :href href :class nav-btn
|
||||
(i :class "fa fa-calendar" :aria-hidden "true")
|
||||
(div name)))
|
||||
|
||||
(defcomp ~events-post-nav-wrapper (&key items-html hyperscript)
|
||||
(div :class "flex flex-col sm:flex-row sm:items-center gap-2 border-r border-stone-200 mr-2 sm:max-w-2xl"
|
||||
:id "entries-calendars-nav-wrapper" :hx-swap-oob "true"
|
||||
(button :class "entries-nav-arrow hidden flex-shrink-0 p-2 hover:bg-stone-200 rounded"
|
||||
:aria-label "Scroll left"
|
||||
:_ "on click set #associated-items-container.scrollLeft to #associated-items-container.scrollLeft - 200"
|
||||
(i :class "fa fa-chevron-left"))
|
||||
(div :id "associated-items-container"
|
||||
:class "overflow-y-auto sm:overflow-x-auto sm:overflow-y-visible scrollbar-hide max-h-[50vh] sm:max-h-none"
|
||||
:style "scroll-behavior: smooth;" :_ hyperscript
|
||||
(div :class "flex flex-col sm:flex-row gap-1" (raw! items-html)))
|
||||
(style ".scrollbar-hide::-webkit-scrollbar { display: none; } .scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }")
|
||||
(button :class "entries-nav-arrow hidden flex-shrink-0 p-2 hover:bg-stone-200 rounded"
|
||||
:aria-label "Scroll right"
|
||||
:_ "on click set #associated-items-container.scrollLeft to #associated-items-container.scrollLeft + 200"
|
||||
(i :class "fa fa-chevron-right"))))
|
||||
|
||||
;; Entry nav post link (with image)
|
||||
(defcomp ~events-entry-nav-post-link (&key href img-html title)
|
||||
(a :href href :class "flex items-center gap-2 px-3 py-2 hover:bg-stone-100 rounded transition text-sm border sm:whitespace-nowrap sm:flex-shrink-0"
|
||||
(raw! img-html) (div :class "flex-1 min-w-0" (div :class "font-medium truncate" title))))
|
||||
59
events/sexp/payments.sexpr
Normal file
59
events/sexp/payments.sexpr
Normal file
@@ -0,0 +1,59 @@
|
||||
;; Events payments components
|
||||
|
||||
(defcomp ~events-payments-panel (&key update-url csrf merchant-code placeholder input-cls sumup-configured checkout-prefix)
|
||||
(section :class "p-4 max-w-lg mx-auto"
|
||||
(div :id "payments-panel" :class "space-y-4 p-4 bg-white rounded-lg border border-stone-200"
|
||||
(h3 :class "text-lg font-semibold text-stone-800"
|
||||
(i :class "fa fa-credit-card text-purple-600 mr-1") " SumUp Payment")
|
||||
(p :class "text-xs text-stone-400" "Configure per-page SumUp credentials. Leave blank to use the global merchant account.")
|
||||
(form :hx-put update-url :hx-target "#payments-panel" :hx-swap "outerHTML" :hx-select "#payments-panel" :class "space-y-3"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(div (label :class "block text-xs font-medium text-stone-600 mb-1" "Merchant Code")
|
||||
(input :type "text" :name "merchant_code" :value merchant-code :placeholder "e.g. ME4J6100" :class input-cls))
|
||||
(div (label :class "block text-xs font-medium text-stone-600 mb-1" "API Key")
|
||||
(input :type "password" :name "api_key" :value "" :placeholder placeholder :class input-cls)
|
||||
(when sumup-configured (p :class "text-xs text-stone-400 mt-0.5" "Key is set. Leave blank to keep current key.")))
|
||||
(div (label :class "block text-xs font-medium text-stone-600 mb-1" "Checkout Reference Prefix")
|
||||
(input :type "text" :name "checkout_prefix" :value checkout-prefix :placeholder "e.g. ROSE-" :class input-cls))
|
||||
(button :type "submit" :class "px-4 py-1.5 text-sm font-medium text-white bg-purple-600 rounded hover:bg-purple-700 focus:ring-2 focus:ring-purple-500"
|
||||
"Save SumUp Settings")
|
||||
(when sumup-configured (span :class "ml-2 text-xs text-green-600"
|
||||
(i :class "fa fa-check-circle") " Connected"))))))
|
||||
|
||||
(defcomp ~events-markets-create-form (&key create-url csrf)
|
||||
(<>
|
||||
(div :id "market-create-errors" :class "mt-2 text-sm text-red-600")
|
||||
(form :class "mt-4 flex gap-2 items-end" :hx-post create-url
|
||||
:hx-target "#markets-list" :hx-select "#markets-list" :hx-swap "outerHTML"
|
||||
:hx-on::before-request "document.querySelector('#market-create-errors').textContent='';"
|
||||
:hx-on::response-error "document.querySelector('#market-create-errors').innerHTML = event.detail.xhr.responseText;"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(div :class "flex-1"
|
||||
(label :class "block text-sm text-gray-600" "Name")
|
||||
(input :name "name" :type "text" :required true :class "w-full border rounded px-3 py-2"
|
||||
:placeholder "e.g. Farm Shop, Bakery"))
|
||||
(button :type "submit" :class "border rounded px-3 py-2" "Add market"))))
|
||||
|
||||
(defcomp ~events-markets-panel (&key form-html list-html)
|
||||
(section :class "p-4"
|
||||
(raw! form-html)
|
||||
(div :id "markets-list" :class "mt-6" (raw! list-html))))
|
||||
|
||||
(defcomp ~events-markets-empty ()
|
||||
(p :class "text-gray-500 mt-4" "No markets yet. Create one above."))
|
||||
|
||||
(defcomp ~events-markets-item (&key href market-name market-slug del-url csrf-hdr)
|
||||
(div :class "mt-6 border rounded-lg p-4"
|
||||
(div :class "flex items-center justify-between gap-3"
|
||||
(a :class "flex items-baseline gap-3" :href href
|
||||
(h3 :class "font-semibold" market-name)
|
||||
(h4 :class "text-gray-500" (str "/" market-slug "/")))
|
||||
(button :class "text-sm border rounded px-3 py-1 hover:bg-red-50 hover:border-red-400"
|
||||
:data-confirm true :data-confirm-title "Delete market?"
|
||||
:data-confirm-text "Products will be hidden (soft delete)"
|
||||
:data-confirm-icon "warning" :data-confirm-confirm-text "Yes, delete it"
|
||||
:data-confirm-cancel-text "Cancel" :data-confirm-event "confirmed"
|
||||
:hx-delete del-url :hx-trigger "confirmed"
|
||||
:hx-target "#markets-list" :hx-select "#markets-list" :hx-swap "outerHTML"
|
||||
:hx-headers csrf-hdr
|
||||
(i :class "fa-solid fa-trash")))))
|
||||
File diff suppressed because it is too large
Load Diff
206
events/sexp/tickets.sexpr
Normal file
206
events/sexp/tickets.sexpr
Normal file
@@ -0,0 +1,206 @@
|
||||
;; Events ticket components
|
||||
|
||||
(defcomp ~events-ticket-card (&key href entry-name type-name time-str cal-name badge-html code-prefix)
|
||||
(a :href href :class "block rounded-xl border border-stone-200 bg-white p-4 hover:shadow-md transition"
|
||||
(div :class "flex items-start justify-between gap-4"
|
||||
(div :class "flex-1 min-w-0"
|
||||
(div :class "font-semibold text-lg truncate" entry-name)
|
||||
(when type-name (div :class "text-sm text-stone-600 mt-0.5" type-name))
|
||||
(when time-str (div :class "text-sm text-stone-500 mt-1" time-str))
|
||||
(when cal-name (div :class "text-xs text-stone-400 mt-0.5" cal-name)))
|
||||
(div :class "flex flex-col items-end gap-1 flex-shrink-0"
|
||||
(raw! badge-html)
|
||||
(span :class "text-xs text-stone-400 font-mono" (str code-prefix "..."))))))
|
||||
|
||||
(defcomp ~events-tickets-panel (&key list-container has-tickets cards-html)
|
||||
(section :id "tickets-list" :class list-container
|
||||
(h1 :class "text-2xl font-bold mb-6" "My Tickets")
|
||||
(if has-tickets
|
||||
(div :class "space-y-4" (raw! cards-html))
|
||||
(div :class "text-center py-12 text-stone-500"
|
||||
(i :class "fa fa-ticket text-4xl mb-4 block" :aria-hidden "true")
|
||||
(p :class "text-lg" "No tickets yet")
|
||||
(p :class "text-sm mt-1" "Tickets will appear here after you purchase them.")))))
|
||||
|
||||
(defcomp ~events-ticket-detail (&key list-container back-href header-bg entry-name badge-html
|
||||
type-name code time-date time-range cal-name
|
||||
type-desc checkin-str qr-script)
|
||||
(section :id "ticket-detail" :class (str list-container " max-w-lg mx-auto")
|
||||
(a :href back-href :class "inline-flex items-center gap-1 text-sm text-stone-500 hover:text-stone-700 mb-4"
|
||||
(i :class "fa fa-arrow-left" :aria-hidden "true") " Back to my tickets")
|
||||
(div :class "rounded-2xl border border-stone-200 bg-white overflow-hidden"
|
||||
(div :class (str "px-6 py-4 border-b border-stone-100 " header-bg)
|
||||
(div :class "flex items-center justify-between"
|
||||
(h1 :class "text-xl font-bold" entry-name)
|
||||
(raw! badge-html))
|
||||
(when type-name (div :class "text-sm text-stone-600 mt-1" type-name)))
|
||||
(div :class "px-6 py-8 flex flex-col items-center border-b border-stone-100"
|
||||
(div :id (str "ticket-qr-" code) :class "bg-white p-4 rounded-lg border border-stone-200")
|
||||
(p :class "text-xs text-stone-400 mt-3 font-mono select-all" code))
|
||||
(div :class "px-6 py-4 space-y-3"
|
||||
(when time-date (div :class "flex items-start gap-3"
|
||||
(i :class "fa fa-calendar text-stone-400 mt-0.5" :aria-hidden "true")
|
||||
(div (div :class "text-sm font-medium" time-date)
|
||||
(div :class "text-sm text-stone-500" time-range))))
|
||||
(when cal-name (div :class "flex items-start gap-3"
|
||||
(i :class "fa fa-map-pin text-stone-400 mt-0.5" :aria-hidden "true")
|
||||
(div :class "text-sm" cal-name)))
|
||||
(when type-desc (div :class "flex items-start gap-3"
|
||||
(i :class "fa fa-tag text-stone-400 mt-0.5" :aria-hidden "true")
|
||||
(div :class "text-sm" type-desc)))
|
||||
(when checkin-str (div :class "flex items-start gap-3"
|
||||
(i :class "fa fa-check-circle text-blue-500 mt-0.5" :aria-hidden "true")
|
||||
(div :class "text-sm text-blue-700" checkin-str)))))
|
||||
(script :src "https://cdn.jsdelivr.net/npm/qrcode@1.5.3/build/qrcode.min.js")
|
||||
(script qr-script)))
|
||||
|
||||
(defcomp ~events-ticket-admin-stat (&key border bg text-cls label-cls value label)
|
||||
(div :class (str "rounded-xl border " border " " bg " p-4 text-center")
|
||||
(div :class (str "text-2xl font-bold " text-cls) value)
|
||||
(div :class (str "text-xs " label-cls " uppercase tracking-wide") label)))
|
||||
|
||||
(defcomp ~events-ticket-admin-date (&key date-str)
|
||||
(div :class "text-xs text-stone-500" date-str))
|
||||
|
||||
(defcomp ~events-ticket-admin-checkin-form (&key checkin-url code csrf)
|
||||
(form :hx-post checkin-url :hx-target (str "#ticket-row-" code) :hx-swap "outerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(button :type "submit" :class "px-3 py-1 bg-blue-600 text-white text-xs rounded hover:bg-blue-700 transition"
|
||||
(i :class "fa fa-check mr-1" :aria-hidden "true") "Check in")))
|
||||
|
||||
(defcomp ~events-ticket-admin-checked-in (&key time-str)
|
||||
(span :class "text-xs text-blue-600"
|
||||
(i :class "fa fa-check-circle" :aria-hidden "true") (str " " time-str)))
|
||||
|
||||
(defcomp ~events-ticket-admin-row (&key code code-short entry-name date-html type-name badge-html action-html)
|
||||
(tr :class "hover:bg-stone-50 transition" :id (str "ticket-row-" code)
|
||||
(td :class "px-4 py-3" (span :class "font-mono text-xs" code-short))
|
||||
(td :class "px-4 py-3" (div :class "font-medium" entry-name) (raw! date-html))
|
||||
(td :class "px-4 py-3 text-sm" type-name)
|
||||
(td :class "px-4 py-3" (raw! badge-html))
|
||||
(td :class "px-4 py-3" (raw! action-html))))
|
||||
|
||||
(defcomp ~events-ticket-admin-panel (&key list-container stats-html lookup-url has-tickets rows-html)
|
||||
(section :id "ticket-admin" :class list-container
|
||||
(h1 :class "text-2xl font-bold mb-6" "Ticket Admin")
|
||||
(div :class "grid grid-cols-2 sm:grid-cols-4 gap-3 mb-8" (raw! stats-html))
|
||||
(div :class "rounded-xl border border-stone-200 bg-white p-6 mb-8"
|
||||
(h2 :class "text-lg font-semibold mb-4"
|
||||
(i :class "fa fa-qrcode mr-2" :aria-hidden "true") "Scan / Look Up Ticket")
|
||||
(div :class "flex gap-3 mb-4"
|
||||
(input :type "text" :id "ticket-code-input" :name "code"
|
||||
:placeholder "Enter or scan ticket code..."
|
||||
:class "flex-1 px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||
:hx-get lookup-url :hx-trigger "keyup changed delay:300ms"
|
||||
:hx-target "#lookup-result" :hx-include "this" :autofocus "true")
|
||||
(button :type "button"
|
||||
:class "px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition"
|
||||
:onclick "document.getElementById('ticket-code-input').dispatchEvent(new Event('keyup'))"
|
||||
(i :class "fa fa-search" :aria-hidden "true")))
|
||||
(div :id "lookup-result"
|
||||
(div :class "text-sm text-stone-400 text-center py-4" "Enter a ticket code to look it up")))
|
||||
(div :class "rounded-xl border border-stone-200 bg-white overflow-hidden"
|
||||
(h2 :class "text-lg font-semibold px-6 py-4 border-b border-stone-100" "Recent Tickets")
|
||||
(if has-tickets
|
||||
(div :class "overflow-x-auto"
|
||||
(table :class "w-full text-sm"
|
||||
(thead :class "bg-stone-50"
|
||||
(tr (th :class "px-4 py-3 text-left font-medium text-stone-600" "Code")
|
||||
(th :class "px-4 py-3 text-left font-medium text-stone-600" "Event")
|
||||
(th :class "px-4 py-3 text-left font-medium text-stone-600" "Type")
|
||||
(th :class "px-4 py-3 text-left font-medium text-stone-600" "State")
|
||||
(th :class "px-4 py-3 text-left font-medium text-stone-600" "Actions")))
|
||||
(tbody :class "divide-y divide-stone-100" (raw! rows-html))))
|
||||
(div :class "px-6 py-8 text-center text-stone-500" "No tickets yet")))))
|
||||
|
||||
(defcomp ~events-checkin-error (&key message)
|
||||
(div :class "rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-800"
|
||||
(i :class "fa fa-exclamation-circle mr-2" :aria-hidden "true") message))
|
||||
|
||||
(defcomp ~events-checkin-success-row (&key code code-short entry-name date-html type-name badge-html time-str)
|
||||
(tr :class "bg-blue-50" :id (str "ticket-row-" code)
|
||||
(td :class "px-4 py-3" (span :class "font-mono text-xs" code-short))
|
||||
(td :class "px-4 py-3" (div :class "font-medium" entry-name) (raw! date-html))
|
||||
(td :class "px-4 py-3 text-sm" type-name)
|
||||
(td :class "px-4 py-3" (raw! badge-html))
|
||||
(td :class "px-4 py-3"
|
||||
(span :class "text-xs text-blue-600"
|
||||
(i :class "fa fa-check-circle" :aria-hidden "true") (str " " time-str)))))
|
||||
|
||||
(defcomp ~events-lookup-error (&key message)
|
||||
(div :class "rounded-lg border border-red-200 bg-red-50 p-4 text-sm text-red-800"
|
||||
(i :class "fa fa-exclamation-circle mr-2" :aria-hidden "true") message))
|
||||
|
||||
(defcomp ~events-lookup-info (&key entry-name)
|
||||
(div :class "font-semibold text-lg" entry-name))
|
||||
|
||||
(defcomp ~events-lookup-type (&key type-name)
|
||||
(div :class "text-sm text-stone-600" type-name))
|
||||
|
||||
(defcomp ~events-lookup-date (&key date-str)
|
||||
(div :class "text-sm text-stone-500 mt-1" date-str))
|
||||
|
||||
(defcomp ~events-lookup-cal (&key cal-name)
|
||||
(div :class "text-xs text-stone-400 mt-0.5" cal-name))
|
||||
|
||||
(defcomp ~events-lookup-status (&key badge-html code)
|
||||
(div :class "mt-2" (raw! badge-html) (span :class "text-xs text-stone-400 ml-2 font-mono" code)))
|
||||
|
||||
(defcomp ~events-lookup-checkin-time (&key date-str)
|
||||
(div :class "text-xs text-blue-600 mt-1" (str "Checked in: " date-str)))
|
||||
|
||||
(defcomp ~events-lookup-checkin-btn (&key checkin-url code csrf)
|
||||
(form :hx-post checkin-url :hx-target (str "#checkin-action-" code) :hx-swap "innerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(button :type "submit"
|
||||
:class "px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition font-semibold text-lg"
|
||||
(i :class "fa fa-check mr-2" :aria-hidden "true") "Check In")))
|
||||
|
||||
(defcomp ~events-lookup-checked-in ()
|
||||
(div :class "text-blue-600 text-center"
|
||||
(i :class "fa fa-check-circle text-3xl" :aria-hidden "true")
|
||||
(div :class "text-sm font-medium mt-1" "Checked In")))
|
||||
|
||||
(defcomp ~events-lookup-cancelled ()
|
||||
(div :class "text-red-600 text-center"
|
||||
(i :class "fa fa-times-circle text-3xl" :aria-hidden "true")
|
||||
(div :class "text-sm font-medium mt-1" "Cancelled")))
|
||||
|
||||
(defcomp ~events-lookup-card (&key info-html code action-html)
|
||||
(div :class "rounded-lg border border-stone-200 bg-stone-50 p-4"
|
||||
(div :class "flex items-start justify-between gap-4"
|
||||
(div :class "flex-1" (raw! info-html))
|
||||
(div :id (str "checkin-action-" code) (raw! action-html)))))
|
||||
|
||||
(defcomp ~events-entry-tickets-admin-row (&key code code-short type-name badge-html action-html)
|
||||
(tr :class "hover:bg-stone-50" :id (str "entry-ticket-row-" code)
|
||||
(td :class "px-4 py-2 font-mono text-xs" code-short)
|
||||
(td :class "px-4 py-2" type-name)
|
||||
(td :class "px-4 py-2" (raw! badge-html))
|
||||
(td :class "px-4 py-2" (raw! action-html))))
|
||||
|
||||
(defcomp ~events-entry-tickets-admin-checkin (&key checkin-url code csrf)
|
||||
(form :hx-post checkin-url :hx-target (str "#entry-ticket-row-" code) :hx-swap "outerHTML"
|
||||
(input :type "hidden" :name "csrf_token" :value csrf)
|
||||
(button :type "submit" :class "px-3 py-1 bg-blue-600 text-white text-xs rounded hover:bg-blue-700"
|
||||
"Check in")))
|
||||
|
||||
(defcomp ~events-entry-tickets-admin-table (&key rows-html)
|
||||
(div :class "overflow-x-auto rounded-xl border border-stone-200"
|
||||
(table :class "w-full text-sm"
|
||||
(thead :class "bg-stone-50"
|
||||
(tr (th :class "px-4 py-2 text-left font-medium text-stone-600" "Code")
|
||||
(th :class "px-4 py-2 text-left font-medium text-stone-600" "Type")
|
||||
(th :class "px-4 py-2 text-left font-medium text-stone-600" "State")
|
||||
(th :class "px-4 py-2 text-left font-medium text-stone-600" "Actions")))
|
||||
(tbody :class "divide-y divide-stone-100" (raw! rows-html)))))
|
||||
|
||||
(defcomp ~events-entry-tickets-admin-empty ()
|
||||
(div :class "text-center py-6 text-stone-500 text-sm" "No tickets for this entry"))
|
||||
|
||||
(defcomp ~events-entry-tickets-admin-panel (&key entry-name count-label body-html)
|
||||
(div :class "space-y-4"
|
||||
(div :class "flex items-center justify-between"
|
||||
(h3 :class "text-lg font-semibold" (str "Tickets for: " entry-name))
|
||||
(span :class "text-sm text-stone-500" count-label))
|
||||
(raw! body-html)))
|
||||
Reference in New Issue
Block a user