Full site redesign, help system, and dashboard stats fixes
Multi-phase visual facelift (design tokens, dashboards, sidebar/navbar shell, per-page help guides, and a layout/content pass across every remaining page) plus backend fixes to the dashboard KPI stats: - Admin/Supervisor dashboard KPIs (revenue, donations, registrations, tickets sold) now use a rolling trailing-month window (today back one calendar month, e.g. 9 May - 8 June if today is 8 June) instead of calendar month-to-date, which under-counted for most of the month. The comparison window shifts the same way, so like is still compared with like. - Reports deep-links from those stat tiles now match the same window (range=trailing_month, replacing range=this_month). - Design tokens (brand-* Tailwind scale + shadcn CSS variables), a site-wide contextual help button, fixed dashboard sidebar/navbar, Admin/Supervisor/Staff/User dashboard rebuilds backed by a new GET /api/stats/overview endpoint, a dedicated Contact page, Site Settings restyle with WhatsApp config folded in, and an Account activity feed backed by a new SecurityEvent model. - Every remaining page (home, events, registration flow, auth, legal, payment results, and every Admin/Supervisor/Staff/User tool page) restyled onto the same design tokens, several with real layout upgrades (home hero, events list/detail, donate page, auth pages). - 20+ new dedicated help guides so the whole site has page-specific help content instead of falling back to a generic guide. - Assorted fixes surfaced along the way: donation-leg double-counting in payment stats, donations not counting toward revenue, refund netting in per-method report breakdowns, and donation over-allocation after a refund. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Claude Sonnet 5
@@ -6,6 +6,7 @@ import { useRouter } from "next/navigation";
|
||||
import { apiFetch } from "@/lib/api";
|
||||
import { scoreUser } from "@/lib/fuzzyMatch";
|
||||
import { useDismissingState } from "@/hooks/useDismissingState";
|
||||
import { DoorOpen } from "lucide-react";
|
||||
|
||||
type Mode = "registration" | "payment" | "checkin" | "tickets" | "refund";
|
||||
|
||||
@@ -343,7 +344,12 @@ export default function AtTheDoorPage() {
|
||||
<div className="max-w-6xl mx-auto w-full p-4 sm:p-6">
|
||||
|
||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2 mb-4">
|
||||
<h1 className="text-2xl font-semibold shrink-0">At The Door</h1>
|
||||
<div className="flex items-center gap-3 shrink-0">
|
||||
<div className="w-10 h-10 rounded-xl bg-brand-50 flex items-center justify-center shrink-0">
|
||||
<DoorOpen className="w-5 h-5 text-brand-600" />
|
||||
</div>
|
||||
<h1 className="text-2xl font-semibold text-gray-900">At The Door</h1>
|
||||
</div>
|
||||
<select
|
||||
className="border rounded px-3 py-2 text-sm w-full sm:w-72 max-w-full"
|
||||
value={eventId}
|
||||
@@ -392,7 +398,7 @@ export default function AtTheDoorPage() {
|
||||
mode === m
|
||||
? m === "refund"
|
||||
? "bg-red-600 text-white border-red-600"
|
||||
: "bg-indigo-600 text-white border-indigo-600"
|
||||
: "bg-brand-600 text-white border-brand-600"
|
||||
: "bg-white hover:bg-gray-50"
|
||||
}`}
|
||||
>
|
||||
@@ -538,7 +544,7 @@ function DoorRegistrationPanel({ token, eventId, onCreated, onSelected, onEditRe
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<button onClick={() => onSelected(r)} className="px-2 py-1 text-xs rounded bg-indigo-600 text-white">Open</button>
|
||||
<button onClick={() => onSelected(r)} className="px-2 py-1 text-xs rounded bg-brand-600 text-white">Open</button>
|
||||
<button onClick={() => onEditRegistration(r)} className="px-2 py-1 text-xs rounded bg-emerald-600 text-white">Edit</button>
|
||||
<button onClick={() => onDonation(r.user)} className="px-2 py-1 text-xs rounded bg-amber-500 text-white">Donation</button>
|
||||
</div>
|
||||
@@ -712,7 +718,7 @@ function DoorPaymentPanel({ token, registration, onSuccess, setError }: any) {
|
||||
{balance > 0 && (
|
||||
<button
|
||||
onClick={() => setAmount(String(balance))}
|
||||
className="px-4 rounded bg-indigo-600 text-white text-sm font-medium"
|
||||
className="px-4 rounded bg-brand-600 text-white text-sm font-medium"
|
||||
>
|
||||
Full
|
||||
</button>
|
||||
@@ -747,7 +753,7 @@ function DoorPaymentPanel({ token, registration, onSuccess, setError }: any) {
|
||||
<div className="mt-4 flex gap-2">
|
||||
<button
|
||||
onClick={() => onSuccess(registration)}
|
||||
className="flex-1 py-3 rounded bg-indigo-600 text-white text-sm font-medium"
|
||||
className="flex-1 py-3 rounded bg-brand-600 text-white text-sm font-medium"
|
||||
>
|
||||
Print Tickets
|
||||
</button>
|
||||
@@ -1113,7 +1119,7 @@ function DoorCheckInPanel({ token, eventId, registration, setError, setInfo }: a
|
||||
<button
|
||||
onClick={() => commit(t)}
|
||||
disabled={submittingId === t.id}
|
||||
className="ml-auto px-4 py-2 text-sm rounded bg-indigo-600 text-white disabled:opacity-50"
|
||||
className="ml-auto px-4 py-2 text-sm rounded bg-brand-600 text-white disabled:opacity-50"
|
||||
>
|
||||
{submittingId === t.id ? "Checking in…" : `Check In ${qty}`}
|
||||
</button>
|
||||
@@ -1175,7 +1181,7 @@ function OptionsModal({ open, onClose, options, quantities, setQuantities, minQu
|
||||
<div key={opt.id} className="border rounded-xl overflow-hidden">
|
||||
<div className="px-4 py-2 bg-gray-50 border-b font-medium text-sm">
|
||||
{opt.name}
|
||||
{opt.isMainTicket && <span className="ml-1.5 text-xs text-blue-600 font-normal">• Main</span>}
|
||||
{opt.isMainTicket && <span className="ml-1.5 text-xs text-brand-600 font-normal">• Main</span>}
|
||||
</div>
|
||||
{(opt.variants as any[]).map((v: any) => {
|
||||
const unit = effectiveVariantUnit(opt, v);
|
||||
@@ -1424,7 +1430,7 @@ function SendTicketsModal({ open, onClose, token, registration, setError, setInf
|
||||
className={`flex-1 py-2 rounded border text-sm font-medium ${
|
||||
channel === c
|
||||
? c === "whatsapp" ? "bg-green-600 text-white border-green-600"
|
||||
: c === "both" ? "bg-indigo-600 text-white border-indigo-600"
|
||||
: c === "both" ? "bg-brand-600 text-white border-brand-600"
|
||||
: "bg-blue-600 text-white border-blue-600"
|
||||
: "bg-white text-gray-700 border-gray-300 hover:bg-gray-50"
|
||||
}`}
|
||||
@@ -1472,7 +1478,7 @@ function SendTicketsModal({ open, onClose, token, registration, setError, setInf
|
||||
type="button"
|
||||
onClick={send}
|
||||
disabled={sending}
|
||||
className="flex-1 py-2 rounded bg-indigo-600 text-white text-sm font-medium disabled:opacity-60"
|
||||
className="flex-1 py-2 rounded bg-brand-600 text-white text-sm font-medium disabled:opacity-60"
|
||||
>
|
||||
{sending ? "Sending…" : "Send Tickets"}
|
||||
</button>
|
||||
@@ -1872,7 +1878,7 @@ function NewAttendeeModal({ open, onClose, seed, onConfirm }: {
|
||||
className={`flex-1 py-2 transition-colors ${
|
||||
notifPref === p
|
||||
? p === "whatsapp" ? "bg-green-600 text-white"
|
||||
: p === "both" ? "bg-indigo-600 text-white"
|
||||
: p === "both" ? "bg-brand-600 text-white"
|
||||
: "bg-blue-600 text-white"
|
||||
: "bg-white text-gray-600 hover:bg-gray-50"
|
||||
}`}
|
||||
|
||||
Reference in New Issue
Block a user