We are working on Jami Social Commerce. Please implement the Fan Flow + Fan Dashboard as described in the product brief:
Flow Requirements:
Entry Point (Purchase / Tip Flow)
Fan enters phone number or email when purchasing or tipping.
On submit, show a success message (“Magic link sent”) — for now, just fake this without backend integration.
Add // TODO integrate with backend: send magic link where the real API call will go.
Magic Link Handling
Simulate fan clicking the link and being authenticated (temporary session).
Add // TODO integrate with backend: handle magic link auth + session.
Fan Dashboard (Accessible After Auth)
Dashboard sections:
Tip History (list of tips with date + amount)
Purchases (digital/physical/service items bought, with status)
Downloads (button for digital products → fake download for now)
Submissions & Replies (for AMA, Dares, Confessions, etc. → show status)
Service Bookings (status: pending/fulfilled)
Magic Link Management (button to “Resend link” or “Share access link”)
UI/UX Notes
Keep it lightweight, clean, session-based (no permanent profile).
Use tabs or a sidebar to switch between sections.
For missing real data, use mock JSON (place in /data/fanDashboardMock.json).
Add clear // TODO integrate with backend comments at every point where API calls will eventually be added (fetching tips, purchases, resending link, etc.).
Accessibility
Follow Svelte a11y rules (labels with controls, mouseover with focus, etc.).
Ensure keyboard navigation works across the dashboard.
