art-dag/mono
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Convert cart sexp_components.py from f-string HTML to pure sexp() calls

Browse Source 
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
giles
2026-02-28 14:08:36 +00:00
parent 16da08ff05
commit f0a100fd77
1 changed files with 370 additions and 260 deletions
Download Patch File Download Diff File Expand all files Collapse all files

630
cart/sexp/sexp_components.py
View File

@@ -35,18 +35,17 @@ def _page_cart_header_html(ctx: dict, page_post: Any, *, oob: bool = False) -> s
"""Build the per-page cart header row."""
slug = page_post.slug if page_post else ""
title = ((page_post.title if page_post else None) or "")[:160]
img_html = ""
label_html = ""
if page_post and page_post.feature_image:
img_html = (
f'<img src="{page_post.feature_image}"'
f' class="h-8 w-8 rounded-full object-cover border border-stone-300 flex-shrink-0">'
label_html += sexp(
'(img :src fi :class "h-8 w-8 rounded-full object-cover border border-stone-300 flex-shrink-0")',
fi=page_post.feature_image,
)
label_html = f'{img_html}<span>{title}</span>'
label_html += sexp('(span t)', t=title)
nav_html = sexp(
'(a :href h :class "inline-flex items-center gap-1.5 px-3 py-1.5 text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"'
' (raw! i) "All carts")',
' (i :class "fa fa-arrow-left text-xs" :aria-hidden "true") "All carts")',
h=call_url(ctx, "cart_url", "/"),
i='<i class="fa fa-arrow-left text-xs" aria-hidden="true"></i>',
)
return sexp(
'(~menu-row :id "page-cart-row" :level 2 :colour "sky"'
@@ -83,6 +82,16 @@ def _orders_header_html(ctx: dict, list_url: str) -> str:
# Cart overview
# ---------------------------------------------------------------------------
def _badge_html(icon: str, count: int, label: str) -> str:
"""Render a count badge."""
s = "s" if count != 1 else ""
return sexp(
'(span :class "inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-stone-100"'
' (i :class ic :aria-hidden "true") txt)',
ic=icon, txt=f"{count} {label}{s}",
)
def _page_group_card_html(grp: Any, ctx: dict) -> str:
"""Render a single page group card for cart overview."""
post = grp.get("post") if isinstance(grp, dict) else getattr(grp, "post", None)
@@ -99,88 +108,102 @@ def _page_group_card_html(grp: Any, ctx: dict) -> str:
return ""
# Count badges
badges = []
badges = ""
if product_count > 0:
s = "s" if product_count != 1 else ""
badges.append(
f'<span class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-stone-100">'
f'<i class="fa fa-box-open" aria-hidden="true"></i> {product_count} item{s}</span>'
)
badges += _badge_html("fa fa-box-open", product_count, "item")
if calendar_count > 0:
s = "s" if calendar_count != 1 else ""
badges.append(
f'<span class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-stone-100">'
f'<i class="fa fa-calendar" aria-hidden="true"></i> {calendar_count} booking{s}</span>'
)
badges += _badge_html("fa fa-calendar", calendar_count, "booking")
if ticket_count > 0:
s = "s" if ticket_count != 1 else ""
badges.append(
f'<span class="inline-flex items-center gap-1 px-2 py-0.5 rounded-full bg-stone-100">'
f'<i class="fa fa-ticket" aria-hidden="true"></i> {ticket_count} ticket{s}</span>'
)
badges_html = '<div class="mt-1 flex flex-wrap gap-2 text-xs text-stone-600">' + "".join(badges) + '</div>'
badges += _badge_html("fa fa-ticket", ticket_count, "ticket")
badges_html = sexp(
'(div :class "mt-1 flex flex-wrap gap-2 text-xs text-stone-600" (raw! b))',
b=badges,
)
if post:
slug = post.slug if hasattr(post, "slug") else post.get("slug", "")
title = post.title if hasattr(post, "title") else post.get("title", "")
feature_image = post.feature_image if hasattr(post, "feature_image") else post.get("feature_image")
cart_url = call_url(ctx, "cart_url", f"/{slug}/")
cart_href = call_url(ctx, "cart_url", f"/{slug}/")
if feature_image:
img = f'<img src="{feature_image}" alt="{title}" class="h-16 w-16 rounded-xl object-cover border border-stone-200 flex-shrink-0">'
img = sexp(
'(img :src fi :alt t :class "h-16 w-16 rounded-xl object-cover border border-stone-200 flex-shrink-0")',
fi=feature_image, t=title,
)
else:
img = '<div class="h-16 w-16 rounded-xl bg-stone-100 flex items-center justify-center flex-shrink-0"><i class="fa fa-store text-stone-400 text-xl" aria-hidden="true"></i></div>'
img = sexp(
'(div :class "h-16 w-16 rounded-xl bg-stone-100 flex items-center justify-center flex-shrink-0"'
' (i :class "fa fa-store text-stone-400 text-xl" :aria-hidden "true"))',
)
mp_name = ""
mp_sub = ""
if market_place:
mp_name = market_place.name if hasattr(market_place, "name") else market_place.get("name", "")
mp_sub = f'<p class="text-xs text-stone-500 truncate">{title}</p>'
mp_sub = sexp('(p :class "text-xs text-stone-500 truncate" t)', t=title)
display_title = mp_name or title
return (
f'<a href="{cart_url}" class="block rounded-2xl border border-stone-200 bg-white shadow-sm hover:shadow-md hover:border-stone-300 transition p-4 sm:p-5">'
f'<div class="flex items-start gap-4">{img}'
f'<div class="flex-1 min-w-0"><h3 class="text-base sm:text-lg font-semibold text-stone-900 truncate">{display_title}</h3>{mp_sub}{badges_html}</div>'
f'<div class="text-right flex-shrink-0"><div class="text-lg font-bold text-stone-900">&pound;{total:.2f}</div>'
f'<div class="mt-1 text-xs text-emerald-700 font-medium">View cart &rarr;</div></div></div></a>'
return sexp(
'(a :href ch :class "block rounded-2xl border border-stone-200 bg-white shadow-sm hover:shadow-md hover:border-stone-300 transition p-4 sm:p-5"'
' (div :class "flex items-start gap-4"'
' (raw! img)'
' (div :class "flex-1 min-w-0"'
' (h3 :class "text-base sm:text-lg font-semibold text-stone-900 truncate" dt)'
' (raw! ms) (raw! bh))'
' (div :class "text-right flex-shrink-0"'
' (div :class "text-lg font-bold text-stone-900" tt)'
' (div :class "mt-1 text-xs text-emerald-700 font-medium" "View cart \u2192"))))',
ch=cart_href, img=img, dt=display_title, ms=mp_sub, bh=badges_html,
tt=f"\u00a3{total:.2f}",
)
else:
# Orphan items
badges_html_amber = badges_html.replace("bg-stone-100", "bg-amber-100")
return (
f'<div class="rounded-2xl border border-dashed border-amber-300 bg-amber-50/60 p-4 sm:p-5">'
f'<div class="flex items-start gap-4">'
f'<div class="h-16 w-16 rounded-xl bg-amber-100 flex items-center justify-center flex-shrink-0">'
f'<i class="fa fa-shopping-cart text-amber-500 text-xl" aria-hidden="true"></i></div>'
f'<div class="flex-1 min-w-0"><h3 class="text-base sm:text-lg font-semibold text-stone-900">Other items</h3>{badges_html_amber}</div>'
f'<div class="text-right flex-shrink-0"><div class="text-lg font-bold text-stone-900">&pound;{total:.2f}</div></div></div></div>'
# Orphan items — use amber badges
badges_amber = badges.replace("bg-stone-100", "bg-amber-100")
badges_html_amber = sexp(
'(div :class "mt-1 flex flex-wrap gap-2 text-xs text-stone-600" (raw! b))',
b=badges_amber,
)
return sexp(
'(div :class "rounded-2xl border border-dashed border-amber-300 bg-amber-50/60 p-4 sm:p-5"'
' (div :class "flex items-start gap-4"'
' (div :class "h-16 w-16 rounded-xl bg-amber-100 flex items-center justify-center flex-shrink-0"'
' (i :class "fa fa-shopping-cart text-amber-500 text-xl" :aria-hidden "true"))'
' (div :class "flex-1 min-w-0"'
' (h3 :class "text-base sm:text-lg font-semibold text-stone-900" "Other items")'
' (raw! bh))'
' (div :class "text-right flex-shrink-0"'
' (div :class "text-lg font-bold text-stone-900" tt))))',
bh=badges_html_amber, tt=f"\u00a3{total:.2f}",
)
def _empty_cart_html() -> str:
"""Empty cart state."""
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :class "rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center"'
' (div :class "inline-flex h-10 w-10 sm:h-12 sm:w-12 items-center justify-center rounded-full bg-stone-100 mb-3"'
' (i :class "fa fa-shopping-cart text-stone-500 text-sm sm:text-base" :aria-hidden "true"))'
' (p :class "text-base sm:text-lg font-medium text-stone-800" "Your cart is empty")))',
)
def _overview_main_panel_html(page_groups: list, ctx: dict) -> str:
"""Cart overview main panel."""
if not page_groups:
return (
'<div class="max-w-full px-3 py-3 space-y-3">'
'<div class="rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center">'
'<div class="inline-flex h-10 w-10 sm:h-12 sm:w-12 items-center justify-center rounded-full bg-stone-100 mb-3">'
'<i class="fa fa-shopping-cart text-stone-500 text-sm sm:text-base" aria-hidden="true"></i></div>'
'<p class="text-base sm:text-lg font-medium text-stone-800">Your cart is empty</p></div></div>'
)
return _empty_cart_html()
cards = [_page_group_card_html(grp, ctx) for grp in page_groups]
has_items = any(c for c in cards)
if not has_items:
return (
'<div class="max-w-full px-3 py-3 space-y-3">'
'<div class="rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center">'
'<div class="inline-flex h-10 w-10 sm:h-12 sm:w-12 items-center justify-center rounded-full bg-stone-100 mb-3">'
'<i class="fa fa-shopping-cart text-stone-500 text-sm sm:text-base" aria-hidden="true"></i></div>'
'<p class="text-base sm:text-lg font-medium text-stone-800">Your cart is empty</p></div></div>'
)
return _empty_cart_html()
return '<div class="max-w-full px-3 py-3 space-y-3"><div class="space-y-4">' + "".join(cards) + '</div></div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :class "space-y-4" (raw! c)))',
c="".join(cards),
)
# ---------------------------------------------------------------------------
@@ -202,52 +225,78 @@ def _cart_item_html(item: Any, ctx: dict) -> str:
prod_url = market_product_url(slug)
if p.image:
img = f'<img src="{p.image}" alt="{p.title}" class="w-24 h-24 sm:w-32 sm:h-28 object-cover rounded-xl border border-stone-100" loading="lazy">'
img = sexp(
'(img :src im :alt t :class "w-24 h-24 sm:w-32 sm:h-28 object-cover rounded-xl border border-stone-100" :loading "lazy")',
im=p.image, t=p.title,
)
else:
img = '<div class="w-24 h-24 sm:w-32 sm:h-28 rounded-xl border border-dashed border-stone-300 flex items-center justify-center text-xs text-stone-400">No image</div>'
img = sexp(
'(div :class "w-24 h-24 sm:w-32 sm:h-28 rounded-xl border border-dashed border-stone-300 flex items-center justify-center text-xs text-stone-400"'
' "No image")',
)
price_html = ""
if unit_price:
price_html = f'<p class="text-sm sm:text-base font-semibold text-stone-900">{symbol}{unit_price:.2f}</p>'
price_html = sexp(
'(p :class "text-sm sm:text-base font-semibold text-stone-900" ps)',
ps=f"{symbol}{unit_price:.2f}",
)
if p.special_price and p.special_price != p.regular_price:
price_html += f'<p class="text-xs text-stone-400 line-through">{symbol}{p.regular_price:.2f}</p>'
price_html += sexp(
'(p :class "text-xs text-stone-400 line-through" ps)',
ps=f"{symbol}{p.regular_price:.2f}",
)
else:
price_html = '<p class="text-xs text-stone-500">No price</p>'
price_html = sexp('(p :class "text-xs text-stone-500" "No price")')
deleted_html = ""
if getattr(item, "is_deleted", False):
deleted_html = (
'<p class="mt-2 inline-flex items-center gap-1 text-[0.65rem] sm:text-xs font-medium text-amber-700 bg-amber-50 border border-amber-200 rounded-full px-2 py-0.5">'
'<i class="fa-solid fa-triangle-exclamation text-[0.6rem]" aria-hidden="true"></i>'
' This item is no longer available or price has changed</p>'
deleted_html = sexp(
'(p :class "mt-2 inline-flex items-center gap-1 text-[0.65rem] sm:text-xs font-medium text-amber-700 bg-amber-50 border border-amber-200 rounded-full px-2 py-0.5"'
' (i :class "fa-solid fa-triangle-exclamation text-[0.6rem]" :aria-hidden "true")'
' " This item is no longer available or price has changed")',
)
brand_html = f'<p class="mt-0.5 text-[0.7rem] sm:text-xs text-stone-500">{p.brand}</p>' if getattr(p, "brand", None) else ""
brand_html = ""
if getattr(p, "brand", None):
brand_html = sexp('(p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" br)', br=p.brand)
line_total_html = ""
if unit_price:
lt = unit_price * item.quantity
line_total_html = f'<p class="text-sm sm:text-base font-semibold text-stone-900">Line total: {symbol}{lt:.2f}</p>'
line_total_html = sexp(
'(p :class "text-sm sm:text-base font-semibold text-stone-900" lt)',
lt=f"Line total: {symbol}{lt:.2f}",
)
return (
f'<article id="cart-item-{slug}" class="flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4 md:p-5">'
f'<div class="w-full sm:w-32 shrink-0 flex justify-center sm:block">{img}</div>'
f'<div class="flex-1 min-w-0">'
f'<div class="flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3">'
f'<div class="min-w-0"><h2 class="text-sm sm:text-base md:text-lg font-semibold text-stone-900">'
f'<a href="{prod_url}" class="hover:text-emerald-700">{p.title}</a></h2>{brand_html}{deleted_html}</div>'
f'<div class="text-left sm:text-right">{price_html}</div></div>'
f'<div class="mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4">'
f'<div class="flex items-center gap-2 text-xs sm:text-sm text-stone-700">'
f'<span class="text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500">Quantity</span>'
f'<form action="{qty_url}" method="post" hx-post="{qty_url}" hx-swap="none">'
f'<input type="hidden" name="csrf_token" value="{csrf}"><input type="hidden" name="count" value="{item.quantity - 1}">'
f'<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">-</button></form>'
f'<span class="inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium">{item.quantity}</span>'
f'<form action="{qty_url}" method="post" hx-post="{qty_url}" hx-swap="none">'
f'<input type="hidden" name="csrf_token" value="{csrf}"><input type="hidden" name="count" value="{item.quantity + 1}">'
f'<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">+</button></form></div>'
f'<div class="flex items-center justify-between sm:justify-end gap-3">{line_total_html}</div></div></div></article>'
return sexp(
'(article :id aid :class "flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4 md:p-5"'
' (div :class "w-full sm:w-32 shrink-0 flex justify-center sm:block" (raw! img))'
' (div :class "flex-1 min-w-0"'
' (div :class "flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3"'
' (div :class "min-w-0"'
' (h2 :class "text-sm sm:text-base md:text-lg font-semibold text-stone-900"'
' (a :href pu :class "hover:text-emerald-700" pt))'
' (raw! brh) (raw! dh))'
' (div :class "text-left sm:text-right" (raw! ph)))'
' (div :class "mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4"'
' (div :class "flex items-center gap-2 text-xs sm:text-sm text-stone-700"'
' (span :class "text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500" "Quantity")'
' (form :action qu :method "post" :hx-post qu :hx-swap "none"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (input :type "hidden" :name "count" :value 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" "-"))'
' (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" qty)'
' (form :action qu :method "post" :hx-post qu :hx-swap "none"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (input :type "hidden" :name "count" :value 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" "+")))'
' (div :class "flex items-center justify-between sm:justify-end gap-3" (raw! lth)))))',
aid=f"cart-item-{slug}", img=img, pu=prod_url, pt=p.title,
brh=brand_html, dh=deleted_html, ph=price_html,
qu=qty_url, csrf=csrf, minus=str(item.quantity - 1),
qty=str(item.quantity), plus=str(item.quantity + 1),
lth=line_total_html,
)
@@ -255,23 +304,25 @@ def _calendar_entries_html(entries: list) -> str:
"""Render calendar booking entries in cart."""
if not entries:
return ""
items = []
items = ""
for e in entries:
name = getattr(e, "name", None) or getattr(e, "calendar_name", "")
start = e.start_at if hasattr(e, "start_at") else ""
end = getattr(e, "end_at", None)
cost = getattr(e, "cost", 0) or 0
end_html = f" \u2013 {end}" if end else ""
items.append(
f'<li class="flex items-start justify-between text-sm">'
f'<div><div class="font-medium">{name}</div>'
f'<div class="text-xs text-stone-500">{start}{end_html}</div></div>'
f'<div class="ml-4 font-medium">\u00a3{cost:.2f}</div></li>'
end_str = f" \u2013 {end}" if end else ""
items += sexp(
'(li :class "flex items-start justify-between text-sm"'
' (div (div :class "font-medium" nm)'
' (div :class "text-xs text-stone-500" ds))'
' (div :class "ml-4 font-medium" cs))',
nm=name, ds=f"{start}{end_str}", cs=f"\u00a3{cost:.2f}",
)
return (
'<div class="mt-6 border-t border-stone-200 pt-4">'
'<h2 class="text-base font-semibold mb-2">Calendar bookings</h2>'
f'<ul class="space-y-2">{"".join(items)}</ul></div>'
return sexp(
'(div :class "mt-6 border-t border-stone-200 pt-4"'
' (h2 :class "text-base font-semibold mb-2" "Calendar bookings")'
' (ul :class "space-y-2" (raw! items)))',
items=items,
)
@@ -284,9 +335,7 @@ def _ticket_groups_html(ticket_groups: list, ctx: dict) -> str:
csrf = generate_csrf_token()
qty_url = url_for("cart_global.update_ticket_quantity")
parts = ['<div class="mt-6 border-t border-stone-200 pt-4">',
'<h2 class="text-base font-semibold mb-2"><i class="fa fa-ticket mr-1" aria-hidden="true"></i> Event tickets</h2>',
'<div class="space-y-3">']
items = ""
for tg in ticket_groups:
name = tg.entry_name if hasattr(tg, "entry_name") else tg.get("entry_name", "")
@@ -303,34 +352,51 @@ def _ticket_groups_html(ticket_groups: list, ctx: dict) -> str:
if end_at:
date_str += f" \u2013 {end_at.strftime('%-d %b %Y, %H:%M')}"
tt_name_html = f'<p class="mt-0.5 text-[0.7rem] sm:text-xs text-stone-500">{tt_name}</p>' if tt_name else ""
tt_hidden = f'<input type="hidden" name="ticket_type_id" value="{tt_id}">' if tt_id else ""
tt_name_html = sexp('(p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" tn)', tn=tt_name) if tt_name else ""
tt_hidden = sexp('(input :type "hidden" :name "ticket_type_id" :value tid)', tid=str(tt_id)) if tt_id else ""
parts.append(
f'<article class="flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4">'
f'<div class="flex-1 min-w-0">'
f'<div class="flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3">'
f'<div class="min-w-0"><h3 class="text-sm sm:text-base font-semibold text-stone-900">{name}</h3>{tt_name_html}'
f'<p class="mt-0.5 text-[0.7rem] sm:text-xs text-stone-500">{date_str}</p></div>'
f'<div class="text-left sm:text-right"><p class="text-sm sm:text-base font-semibold text-stone-900">\u00a3{price or 0:.2f}</p></div></div>'
f'<div class="mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4">'
f'<div class="flex items-center gap-2 text-xs sm:text-sm text-stone-700">'
f'<span class="text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500">Quantity</span>'
f'<form action="{qty_url}" method="post" hx-post="{qty_url}" hx-swap="none">'
f'<input type="hidden" name="csrf_token" value="{csrf}"><input type="hidden" name="entry_id" value="{entry_id}">{tt_hidden}'
f'<input type="hidden" name="count" value="{max(quantity - 1, 0)}">'
f'<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">-</button></form>'
f'<span class="inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium">{quantity}</span>'
f'<form action="{qty_url}" method="post" hx-post="{qty_url}" hx-swap="none">'
f'<input type="hidden" name="csrf_token" value="{csrf}"><input type="hidden" name="entry_id" value="{entry_id}">{tt_hidden}'
f'<input type="hidden" name="count" value="{quantity + 1}">'
f'<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">+</button></form></div>'
f'<div class="flex items-center justify-between sm:justify-end gap-3">'
f'<p class="text-sm sm:text-base font-semibold text-stone-900">Line total: \u00a3{line_total:.2f}</p></div></div></div></article>'
items += sexp(
'(article :class "flex flex-col sm:flex-row gap-3 sm:gap-4 rounded-2xl bg-white shadow-sm border border-stone-200 p-3 sm:p-4"'
' (div :class "flex-1 min-w-0"'
' (div :class "flex flex-col sm:flex-row sm:items-start justify-between gap-2 sm:gap-3"'
' (div :class "min-w-0"'
' (h3 :class "text-sm sm:text-base font-semibold text-stone-900" nm)'
' (raw! tnh)'
' (p :class "mt-0.5 text-[0.7rem] sm:text-xs text-stone-500" ds))'
' (div :class "text-left sm:text-right"'
' (p :class "text-sm sm:text-base font-semibold text-stone-900" ps)))'
' (div :class "mt-3 flex flex-col sm:flex-row sm:items-center justify-between gap-2 sm:gap-4"'
' (div :class "flex items-center gap-2 text-xs sm:text-sm text-stone-700"'
' (span :class "text-[0.65rem] sm:text-xs uppercase tracking-wide text-stone-500" "Quantity")'
' (form :action qu :method "post" :hx-post qu :hx-swap "none"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (input :type "hidden" :name "entry_id" :value eid)'
' (raw! tth)'
' (input :type "hidden" :name "count" :value 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" "-"))'
' (span :class "inline-flex items-center justify-center px-2 py-1 rounded-full bg-stone-100 text-[0.7rem] sm:text-xs font-medium" qty)'
' (form :action qu :method "post" :hx-post qu :hx-swap "none"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (input :type "hidden" :name "entry_id" :value eid)'
' (raw! tth)'
' (input :type "hidden" :name "count" :value 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" "+")))'
' (div :class "flex items-center justify-between sm:justify-end gap-3"'
' (p :class "text-sm sm:text-base font-semibold text-stone-900" lt)))))',
nm=name, tnh=tt_name_html, ds=date_str,
ps=f"\u00a3{price or 0:.2f}", qu=qty_url, csrf=csrf,
eid=str(entry_id), tth=tt_hidden,
minus=str(max(quantity - 1, 0)), qty=str(quantity),
plus=str(quantity + 1), lt=f"Line total: \u00a3{line_total:.2f}",
)
parts.append('</div></div>')
return "".join(parts)
return sexp(
'(div :class "mt-6 border-t border-stone-200 pt-4"'
' (h2 :class "text-base font-semibold mb-2"'
' (i :class "fa fa-ticket mr-1" :aria-hidden "true") " Event tickets")'
' (div :class "space-y-3" (raw! items)))',
items=items,
)
def _cart_summary_html(ctx: dict, cart: list, cal_entries: list, tickets: list,
@@ -365,28 +431,36 @@ def _cart_summary_html(ctx: dict, cart: list, cal_entries: list, tickets: list,
action = url_for("cart_global.checkout")
from shared.utils import route_prefix
action = route_prefix() + action
checkout_html = (
f'<form method="post" action="{action}" class="w-full">'
f'<input type="hidden" name="csrf_token" value="{csrf}">'
f'<button type="submit" class="w-full inline-flex items-center justify-center px-4 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition">'
f'<i class="fa-solid fa-credit-card mr-2" aria-hidden="true"></i> Checkout as {user.email}</button></form>'
checkout_html = sexp(
'(form :method "post" :action act :class "w-full"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (button :type "submit" :class "w-full inline-flex items-center justify-center px-4 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition"'
' (i :class "fa-solid fa-credit-card mr-2" :aria-hidden "true") lbl))',
act=action, csrf=csrf, lbl=f" Checkout as {user.email}",
)
else:
href = login_url(request.url)
checkout_html = (
f'<div class="w-full flex"><a href="{href}" class="w-full cursor-pointer flex flex-row items-center justify-center p-3 gap-2 rounded bg-stone-200 text-black hover:bg-stone-300 transition">'
f'<i class="fa-solid fa-key"></i><span>sign in or register to checkout</span></a></div>'
checkout_html = sexp(
'(div :class "w-full flex"'
' (a :href h :class "w-full cursor-pointer flex flex-row items-center justify-center p-3 gap-2 rounded bg-stone-200 text-black hover:bg-stone-300 transition"'
' (i :class "fa-solid fa-key") (span "sign in or register to checkout")))',
h=href,
)
return (
f'<aside id="cart-summary" class="lg:pl-2"><div class="rounded-2xl bg-white shadow-sm border border-stone-200 p-4 sm:p-5">'
f'<h2 class="text-sm sm:text-base font-semibold text-stone-900 mb-3 sm:mb-4">Order summary</h2>'
f'<dl class="space-y-2 text-xs sm:text-sm">'
f'<div class="flex items-center justify-between"><dt class="text-stone-600">Items</dt><dd class="text-stone-900">{item_count}</dd></div>'
f'<div class="flex items-center justify-between"><dt class="text-stone-600">Subtotal</dt><dd class="text-stone-900">{symbol}{grand:.2f}</dd></div></dl>'
f'<div class="flex flex-col items-center w-full"><h1 class="text-5xl mt-2">This is a test - it will not take actual money</h1>'
f'<div>use dummy card number: 5555 5555 5555 4444</div></div>'
f'<div class="mt-4 sm:mt-5">{checkout_html}</div></div></aside>'
return sexp(
'(aside :id "cart-summary" :class "lg:pl-2"'
' (div :class "rounded-2xl bg-white shadow-sm border border-stone-200 p-4 sm:p-5"'
' (h2 :class "text-sm sm:text-base font-semibold text-stone-900 mb-3 sm:mb-4" "Order summary")'
' (dl :class "space-y-2 text-xs sm:text-sm"'
' (div :class "flex items-center justify-between"'
' (dt :class "text-stone-600" "Items") (dd :class "text-stone-900" ic))'
' (div :class "flex items-center justify-between"'
' (dt :class "text-stone-600" "Subtotal") (dd :class "text-stone-900" st)))'
' (div :class "flex flex-col items-center w-full"'
' (h1 :class "text-5xl mt-2" "This is a test - it will not take actual money")'
' (div "use dummy card number: 5555 5555 5555 4444"))'
' (div :class "mt-4 sm:mt-5" (raw! ch))))',
ic=str(item_count), st=f"{symbol}{grand:.2f}", ch=checkout_html,
)
@@ -396,12 +470,13 @@ def _page_cart_main_panel_html(ctx: dict, cart: list, cal_entries: list,
ticket_total_fn: Any) -> str:
"""Page cart main panel."""
if not cart and not cal_entries and not tickets:
return (
'<div class="max-w-full px-3 py-3 space-y-3">'
'<div id="cart"><div class="rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center">'
'<div class="inline-flex h-10 w-10 sm:h-12 sm:w-12 items-center justify-center rounded-full bg-stone-100 mb-3">'
'<i class="fa fa-shopping-cart text-stone-500 text-sm sm:text-base" aria-hidden="true"></i></div>'
'<p class="text-base sm:text-lg font-medium text-stone-800">Your cart is empty</p></div></div></div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :id "cart"'
' (div :class "rounded-2xl border border-dashed border-stone-300 bg-white/80 p-6 sm:p-8 text-center"'
' (div :class "inline-flex h-10 w-10 sm:h-12 sm:w-12 items-center justify-center rounded-full bg-stone-100 mb-3"'
' (i :class "fa fa-shopping-cart text-stone-500 text-sm sm:text-base" :aria-hidden "true"))'
' (p :class "text-base sm:text-lg font-medium text-stone-800" "Your cart is empty"))))',
)
items_html = "".join(_cart_item_html(item, ctx) for item in cart)
@@ -409,10 +484,12 @@ def _page_cart_main_panel_html(ctx: dict, cart: list, cal_entries: list,
tickets_html = _ticket_groups_html(ticket_groups, ctx)
summary_html = _cart_summary_html(ctx, cart, cal_entries, tickets, total_fn, cal_total_fn, ticket_total_fn)
return (
f'<div class="max-w-full px-3 py-3 space-y-3"><div id="cart">'
f'<div><section class="space-y-3 sm:space-y-4">{items_html}{cal_html}{tickets_html}</section>'
f'{summary_html}</div></div></div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :id "cart"'
' (div (section :class "space-y-3 sm:space-y-4" (raw! ih) (raw! ch) (raw! th))'
' (raw! sh))))',
ih=items_html, ch=cal_html, th=tickets_html, sh=summary_html,
)
@@ -432,22 +509,36 @@ def _order_row_html(order: Any, detail_url: str) -> str:
created = order.created_at.strftime("%-d %b %Y, %H:%M") if order.created_at else "\u2014"
total = f"{order.currency or 'GBP'} {order.total_amount or 0:.2f}"
return (
f'<tr class="hidden sm:table-row border-t border-stone-100 hover:bg-stone-50/60">'
f'<td class="px-3 py-2 align-top"><span class="font-mono text-[11px] sm:text-xs">#{order.id}</span></td>'
f'<td class="px-3 py-2 align-top text-stone-700 text-xs sm:text-sm">{created}</td>'
f'<td class="px-3 py-2 align-top text-stone-700 text-xs sm:text-sm">{order.description or ""}</td>'
f'<td class="px-3 py-2 align-top text-stone-700 text-xs sm:text-sm">{total}</td>'
f'<td class="px-3 py-2 align-top"><span class="inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] sm:text-xs {pill}">{status}</span></td>'
f'<td class="px-3 py-0.5 align-top text-right"><a href="{detail_url}" class="inline-flex items-center px-3 py-1.5 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition">View</a></td></tr>'
f'<tr class="sm:hidden border-t border-stone-100"><td colspan="5" class="px-3 py-3"><div class="flex flex-col gap-2 text-xs">'
f'<div class="flex items-center justify-between gap-2"><span class="font-mono text-[11px] text-stone-700">#{order.id}</span>'
f'<span class="inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] {pill}">{status}</span></div>'
f'<div class="text-[11px] text-stone-500 break-words">{created}</div>'
f'<div class="flex items-center justify-between gap-2"><div class="font-medium text-stone-800">{total}</div>'
f'<a href="{detail_url}" class="inline-flex items-center px-2 py-1 text-[11px] rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition shrink-0">View</a></div></div></td></tr>'
desktop = sexp(
'(tr :class "hidden sm:table-row border-t border-stone-100 hover:bg-stone-50/60"'
' (td :class "px-3 py-2 align-top" (span :class "font-mono text-[11px] sm:text-xs" oid))'
' (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" cr)'
' (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" desc)'
' (td :class "px-3 py-2 align-top text-stone-700 text-xs sm:text-sm" tot)'
' (td :class "px-3 py-2 align-top" (span :class (str "inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] sm:text-xs " pill) st))'
' (td :class "px-3 py-0.5 align-top text-right"'
' (a :href du :class "inline-flex items-center px-3 py-1.5 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition" "View")))',
oid=f"#{order.id}", cr=created, desc=order.description or "",
tot=total, pill=pill, st=status, du=detail_url,
)
mobile = sexp(
'(tr :class "sm:hidden border-t border-stone-100"'
' (td :colspan "5" :class "px-3 py-3"'
' (div :class "flex flex-col gap-2 text-xs"'
' (div :class "flex items-center justify-between gap-2"'
' (span :class "font-mono text-[11px] text-stone-700" oid)'
' (span :class (str "inline-flex items-center rounded-full border px-2 py-0.5 text-[11px] " pill) st))'
' (div :class "text-[11px] text-stone-500 break-words" cr)'
' (div :class "flex items-center justify-between gap-2"'
' (div :class "font-medium text-stone-800" tot)'
' (a :href du :class "inline-flex items-center px-2 py-1 text-[11px] rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition shrink-0" "View")))))',
oid=f"#{order.id}", pill=pill, st=status, cr=created,
tot=total, du=detail_url,
)
return desktop + mobile
def _orders_rows_html(orders: list, page: int, total_pages: int,
url_for_fn: Any, qs_fn: Any) -> str:
@@ -467,7 +558,9 @@ def _orders_rows_html(orders: list, page: int, total_pages: int,
u=next_url, p=page, **{"total-pages": total_pages},
))
else:
parts.append('<tr><td colspan="5" class="px-3 py-4 text-center text-xs text-stone-400">End of results</td></tr>')
parts.append(sexp(
'(tr (td :colspan "5" :class "px-3 py-4 text-center text-xs text-stone-400" "End of results"))',
))
return "".join(parts)
@@ -475,33 +568,36 @@ def _orders_rows_html(orders: list, page: int, total_pages: int,
def _orders_main_panel_html(orders: list, rows_html: str) -> str:
"""Main panel for orders list."""
if not orders:
return (
'<div class="max-w-full px-3 py-3 space-y-3">'
'<div class="rounded-2xl border border-dashed border-stone-300 bg-white/80 p-4 sm:p-6 text-sm text-stone-700">'
'No orders yet.</div></div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :class "rounded-2xl border border-dashed border-stone-300 bg-white/80 p-4 sm:p-6 text-sm text-stone-700"'
' "No orders yet."))',
)
return (
'<div class="max-w-full px-3 py-3 space-y-3">'
'<div class="overflow-x-auto rounded-2xl border border-stone-200 bg-white/80">'
'<table class="min-w-full text-xs sm:text-sm">'
'<thead class="bg-stone-50 border-b border-stone-200 text-stone-600"><tr>'
'<th class="px-3 py-2 text-left font-medium">Order</th>'
'<th class="px-3 py-2 text-left font-medium">Created</th>'
'<th class="px-3 py-2 text-left font-medium">Description</th>'
'<th class="px-3 py-2 text-left font-medium">Total</th>'
'<th class="px-3 py-2 text-left font-medium">Status</th>'
'<th class="px-3 py-2 text-left font-medium"></th>'
f'</tr></thead><tbody>{rows_html}</tbody></table></div></div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-3"'
' (div :class "overflow-x-auto rounded-2xl border border-stone-200 bg-white/80"'
' (table :class "min-w-full text-xs sm:text-sm"'
' (thead :class "bg-stone-50 border-b border-stone-200 text-stone-600"'
' (tr'
' (th :class "px-3 py-2 text-left font-medium" "Order")'
' (th :class "px-3 py-2 text-left font-medium" "Created")'
' (th :class "px-3 py-2 text-left font-medium" "Description")'
' (th :class "px-3 py-2 text-left font-medium" "Total")'
' (th :class "px-3 py-2 text-left font-medium" "Status")'
' (th :class "px-3 py-2 text-left font-medium")))'
' (tbody (raw! rh)))))',
rh=rows_html,
)
def _orders_summary_html(ctx: dict) -> str:
"""Filter section for orders list."""
return (
'<header class="mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4">'
'<div class="space-y-1"><p class="text-xs sm:text-sm text-stone-600">Recent orders placed via the checkout.</p></div>'
f'<div class="md:hidden">{search_mobile_html(ctx)}</div>'
'</header>'
return sexp(
'(header :class "mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4"'
' (div :class "space-y-1"'
' (p :class "text-xs sm:text-sm text-stone-600" "Recent orders placed via the checkout."))'
' (div :class "md:hidden" (raw! sm)))',
sm=search_mobile_html(ctx),
)
@@ -513,29 +609,36 @@ def _order_items_html(order: Any) -> str:
"""Render order items list."""
if not order or not order.items:
return ""
items = []
items = ""
for item in order.items:
prod_url = market_product_url(item.product_slug)
img = (
f'<img src="{item.product_image}" alt="{item.product_title or "Product image"}"'
f' class="w-full h-full object-contain object-center" loading="lazy" decoding="async">'
if item.product_image else
'<div class="w-full h-full flex items-center justify-center text-[9px] text-stone-400">No image</div>'
if item.product_image:
img = sexp(
'(img :src pi :alt pt :class "w-full h-full object-contain object-center" :loading "lazy" :decoding "async")',
pi=item.product_image, pt=item.product_title or "Product image",
)
else:
img = sexp(
'(div :class "w-full h-full flex items-center justify-center text-[9px] text-stone-400" "No image")',
)
items += sexp(
'(li (a :class "w-full py-2 flex gap-3" :href pu'
' (div :class "w-12 h-12 sm:w-14 sm:h-14 rounded-md bg-stone-100 flex-shrink-0 overflow-hidden" (raw! img))'
' (div :class "flex-1 flex justify-between gap-3"'
' (div (p :class "font-medium" pt)'
' (p :class "text-[11px] text-stone-500" pid))'
' (div :class "text-right whitespace-nowrap"'
' (p qty) (p pr)))))',
pu=prod_url, img=img, pt=item.product_title or "Unknown product",
pid=f"Product ID: {item.product_id}",
qty=f"Qty: {item.quantity}",
pr=f"{item.currency or order.currency or 'GBP'} {item.unit_price or 0:.2f}",
)
items.append(
f'<li><a class="w-full py-2 flex gap-3" href="{prod_url}">'
f'<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-md bg-stone-100 flex-shrink-0 overflow-hidden">{img}</div>'
f'<div class="flex-1 flex justify-between gap-3">'
f'<div><p class="font-medium">{item.product_title or "Unknown product"}</p>'
f'<p class="text-[11px] text-stone-500">Product ID: {item.product_id}</p></div>'
f'<div class="text-right whitespace-nowrap"><p>Qty: {item.quantity}</p>'
f'<p>{item.currency or order.currency or "GBP"} {item.unit_price or 0:.2f}</p>'
f'</div></div></a></li>'
)
return (
'<div class="rounded-2xl border border-stone-200 bg-white/80 p-4 sm:p-6">'
'<h2 class="text-sm sm:text-base font-semibold mb-3">Items</h2>'
f'<ul class="divide-y divide-stone-100 text-xs sm:text-sm">{"".join(items)}</ul></div>'
return sexp(
'(div :class "rounded-2xl border border-stone-200 bg-white/80 p-4 sm:p-6"'
' (h2 :class "text-sm sm:text-base font-semibold mb-3" "Items")'
' (ul :class "divide-y divide-stone-100 text-xs sm:text-sm" (raw! items)))',
items=items,
)
@@ -554,7 +657,7 @@ def _order_calendar_items_html(calendar_entries: list | None) -> str:
"""Render calendar bookings for an order."""
if not calendar_entries:
return ""
items = []
items = ""
for e in calendar_entries:
st = e.state or ""
pill = (
@@ -566,25 +669,29 @@ def _order_calendar_items_html(calendar_entries: list | None) -> str:
ds = e.start_at.strftime("%-d %b %Y, %H:%M") if e.start_at else ""
if e.end_at:
ds += f" \u2013 {e.end_at.strftime('%-d %b %Y, %H:%M')}"
items.append(
f'<li class="px-4 py-3 flex items-start justify-between text-sm">'
f'<div><div class="font-medium flex items-center gap-2">{e.name}'
f'<span class="inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium {pill}">'
f'{st.capitalize()}</span></div>'
f'<div class="text-xs text-stone-500">{ds}</div></div>'
f'<div class="ml-4 font-medium">\u00a3{e.cost or 0:.2f}</div></li>'
items += sexp(
'(li :class "px-4 py-3 flex items-start justify-between text-sm"'
' (div (div :class "font-medium flex items-center gap-2"'
' nm (span :class (str "inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium " pill) sc))'
' (div :class "text-xs text-stone-500" ds))'
' (div :class "ml-4 font-medium" cs))',
nm=e.name, pill=pill, sc=st.capitalize(), ds=ds, cs=f"\u00a3{e.cost or 0:.2f}",
)
return (
'<section class="mt-6 space-y-3">'
'<h2 class="text-base sm:text-lg font-semibold">Calendar bookings in this order</h2>'
f'<ul class="divide-y divide-stone-200 rounded-2xl border border-stone-200 bg-white/80">{"".join(items)}</ul></section>'
return sexp(
'(section :class "mt-6 space-y-3"'
' (h2 :class "text-base sm:text-lg font-semibold" "Calendar bookings in this order")'
' (ul :class "divide-y divide-stone-200 rounded-2xl border border-stone-200 bg-white/80" (raw! items)))',
items=items,
)
def _order_main_html(order: Any, calendar_entries: list | None) -> str:
"""Main panel for single order detail."""
summary = _order_summary_html(order)
return f'<div class="max-w-full px-3 py-3 space-y-4">{summary}{_order_items_html(order)}{_order_calendar_items_html(calendar_entries)}</div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-4" (raw! s) (raw! oi) (raw! ci))',
s=summary, oi=_order_items_html(order), ci=_order_calendar_items_html(calendar_entries),
)
def _order_filter_html(order: Any, list_url: str, recheck_url: str,
@@ -592,20 +699,29 @@ def _order_filter_html(order: Any, list_url: str, recheck_url: str,
"""Filter section for single order detail."""
created = order.created_at.strftime("%-d %b %Y, %H:%M") if order.created_at else "\u2014"
status = order.status or "pending"
pay = (
f'<a href="{pay_url}" class="inline-flex items-center px-3 py-2 text-xs sm:text-sm '
f'rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition">'
f'<i class="fa fa-credit-card mr-2" aria-hidden="true"></i>Open payment page</a>'
) if status != "paid" else ""
return (
'<header class="mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4">'
f'<div class="space-y-1"><p class="text-xs sm:text-sm text-stone-600">Placed {created} &middot; Status: {status}</p></div>'
'<div class="flex w-full sm:w-auto justify-start sm:justify-end gap-2">'
f'<a href="{list_url}" class="inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"><i class="fa-solid fa-list mr-2" aria-hidden="true"></i>All orders</a>'
f'<form method="post" action="{recheck_url}" class="inline"><input type="hidden" name="csrf_token" value="{csrf_token}">'
f'<button type="submit" class="inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"><i class="fa-solid fa-rotate mr-2" aria-hidden="true"></i>Re-check status</button></form>'
f'{pay}</div></header>'
pay = ""
if status != "paid":
pay = sexp(
'(a :href pu :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition"'
' (i :class "fa fa-credit-card mr-2" :aria-hidden "true") "Open payment page")',
pu=pay_url,
)
return sexp(
'(header :class "mb-6 sm:mb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-3 sm:gap-4"'
' (div :class "space-y-1"'
' (p :class "text-xs sm:text-sm text-stone-600" info))'
' (div :class "flex w-full sm:w-auto justify-start sm:justify-end gap-2"'
' (a :href lu :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"'
' (i :class "fa-solid fa-list mr-2" :aria-hidden "true") "All orders")'
' (form :method "post" :action ru :class "inline"'
' (input :type "hidden" :name "csrf_token" :value csrf)'
' (button :type "submit" :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"'
' (i :class "fa-solid fa-rotate mr-2" :aria-hidden "true") "Re-check status"))'
' (raw! pay)))',
info=f"Placed {created} \u00b7 Status: {status}",
lu=list_url, ru=recheck_url, csrf=csrf_token, pay=pay,
)
@@ -810,13 +926,11 @@ async def render_order_oob(ctx: dict, order: Any,
# ---------------------------------------------------------------------------
def _checkout_error_filter_html() -> str:
return (
'<header class="mb-6 sm:mb-8">'
'<h1 class="text-xl sm:text-2xl md:text-3xl font-semibold tracking-tight">'
'Checkout error</h1>'
'<p class="text-xs sm:text-sm text-stone-600">'
'We tried to start your payment with SumUp but hit a problem.</p>'
'</header>'
return sexp(
'(header :class "mb-6 sm:mb-8"'
' (h1 :class "text-xl sm:text-2xl md:text-3xl font-semibold tracking-tight" "Checkout error")'
' (p :class "text-xs sm:text-sm text-stone-600"'
' "We tried to start your payment with SumUp but hit a problem."))',
)
@@ -824,25 +938,21 @@ def _checkout_error_content_html(error: str | None, order: Any | None) -> str:
err_msg = error or "Unexpected error while creating the hosted checkout session."
order_html = ""
if order:
order_html = (
f'<p class="text-xs text-rose-800/80">'
f'Order ID: <span class="font-mono">#{order.id}</span></p>'
order_html = sexp(
'(p :class "text-xs text-rose-800/80"'
' "Order ID: " (span :class "font-mono" oid))',
oid=f"#{order.id}",
)
back_url = cart_url("/")
return (
'<div class="max-w-full px-3 py-3 space-y-4">'
'<div class="rounded-2xl border border-rose-200 bg-rose-50/80 p-4 sm:p-6 text-sm text-rose-900 space-y-2">'
f'<p class="font-medium">Something went wrong.</p>'
f'<p>{err_msg}</p>'
f'{order_html}'
'</div>'
'<div>'
f'<a href="{back_url}"'
' class="inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition">'
'<i class="fa fa-shopping-cart mr-2" aria-hidden="true"></i>'
'Back to cart</a>'
'</div>'
'</div>'
return sexp(
'(div :class "max-w-full px-3 py-3 space-y-4"'
' (div :class "rounded-2xl border border-rose-200 bg-rose-50/80 p-4 sm:p-6 text-sm text-rose-900 space-y-2"'
' (p :class "font-medium" "Something went wrong.")'
' (p em)'
' (raw! oh))'
' (div (a :href bu :class "inline-flex items-center px-3 py-2 text-xs sm:text-sm rounded-full border border-stone-300 bg-white hover:bg-stone-50 transition"'
' (i :class "fa fa-shopping-cart mr-2" :aria-hidden "true") "Back to cart")))',
em=err_msg, oh=order_html, bu=back_url,
)