joshua/hope-events
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Help guide opens on demand only; add At the door to admin quick actions

Browse Source 
- The site-wide help guide no longer auto-opens on first visit to a page
  — it only opens when the help button is clicked. Removed the
  now-pointless "Don't show this again" checkbox and the per-page
  dismissal tracking it drove.
- Admin dashboard quick actions was missing "At the door" (walk-in
  registration, payments, ticket printing), which Supervisor already had.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
joshua
2026-08-06 15:17:12 +02:00
co-authored by Claude Sonnet 5
parent 8e6cb542d9
commit 0f2b5afa74
6 changed files with 19 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/shared/HelpGuideModal.tsx
+6 -11
View File
@@ -5,9 +5,8 @@ import Link from "next/link";
import { X, Mail, MessageCircleQuestion } from "lucide-react";
import type { HelpContent } from "@/content/help/types";
export default function HelpGuideModal({ content, onClose }: { content: HelpContent; onClose: (dontShowAgain: boolean) => void }) {
export default function HelpGuideModal({ content, onClose }: { content: HelpContent; onClose: () => void }) {
const [tab, setTab] = useState(content.tabs[0]?.key);
const [dontShowAgain, setDontShowAgain] = useState(false);
const activeTab = content.tabs.find(t => t.key === tab) || content.tabs[0];
return (
@@ -15,7 +14,7 @@ export default function HelpGuideModal({ content, onClose }: { content: HelpCont
// page-level popup (e.g. the report viewer at z-[60]), since the guide
// can be opened from the FAB while another overlay is showing.
<div className="fixed inset-0 z-[70]">
<div className="absolute inset-0 bg-black/40 animate-in fade-in duration-200" onClick={() => onClose(dontShowAgain)} />
<div className="absolute inset-0 bg-black/40 animate-in fade-in duration-200" onClick={onClose} />
<div className="absolute inset-0 flex items-center justify-center p-4">
<div
className="w-full max-w-3xl bg-white rounded-2xl shadow-2xl animate-in fade-in zoom-in-95 slide-in-from-bottom-2 duration-200 overflow-hidden"
@@ -31,7 +30,7 @@ export default function HelpGuideModal({ content, onClose }: { content: HelpCont
<p className="text-xs text-gray-500">{content.subtitle}</p>
</div>
</div>
<button className="p-1.5 rounded-full hover:bg-gray-100 transition-colors" onClick={() => onClose(dontShowAgain)} aria-label="Close">
<button className="p-1.5 rounded-full hover:bg-gray-100 transition-colors" onClick={onClose} aria-label="Close">
<X className="w-5 h-5" />
</button>
</div>
@@ -42,7 +41,7 @@ export default function HelpGuideModal({ content, onClose }: { content: HelpCont
<Link
key={link.href}
href={link.href}
onClick={() => onClose(dontShowAgain)}
onClick={onClose}
className="inline-flex items-center gap-1.5 text-xs font-medium px-3 py-1.5 rounded-full border border-brand-200 bg-white text-brand-700 hover:bg-brand-100 hover:border-brand-300 transition-colors"
>
{link.icon && <link.icon className="w-3.5 h-3.5" />}
@@ -90,12 +89,8 @@ export default function HelpGuideModal({ content, onClose }: { content: HelpCont
</span>
</div>
)}
<div className="flex items-center justify-between">
<label className="flex items-center gap-2 text-xs text-gray-600 cursor-pointer">
<input type="checkbox" checked={dontShowAgain} onChange={e => setDontShowAgain(e.target.checked)} className="rounded accent-brand-600" />
Don&apos;t show this again
</label>
<button className="px-4 py-2 text-sm rounded-lg bg-brand-600 text-white hover:bg-brand-700 transition-colors shadow-sm" onClick={() => onClose(dontShowAgain)}>
<div className="flex items-center justify-end">
<button className="px-4 py-2 text-sm rounded-lg bg-brand-600 text-white hover:bg-brand-700 transition-colors shadow-sm" onClick={onClose}>
Got it
</button>
</div>