#598 Add Confetti On Application Submission And Acceptance

[cielbellerose]

Closes #598

Summary

• Adds a celebratory confetti burst at two moments: a successful application submission (AP-9) and a reviewer moving an application to accepted (PM-11 / PM-14).
• Client-side only, fire-and-forget visual effect — no schema or server-action changes.

Changes

• lib/confetti.ts — new 'use client' module exporting fireConfetti(). Gates on prefers-reduced-motion, typeof window, and an in-flight flag before ever downloading the canvas-confetti chunk; owns its own <canvas> appended to document.body (outside the React root, so it survives the stepper's router.replace); lazily import()s canvas-confetti; fires with useWorker: false (the app's CSP has no worker-src) and resize: true; derives its palette from the --chart-1…--chart-5 design tokens (falls back to library defaults if fewer than two parse); swallows any failure silently (decorative effect, degrading beats throwing).
• components/features/application-stepper.tsx — fires on the submitApplication success branch, right after the "Application submitted"/"Application resubmitted" toast and before the redirect.
• components/features/use-application-status-move.ts — fires in performMove, after the "Moved to Accepted" toast, only when target === 'accepted'. This is the single choke point behind the header quick action, the status-override dialog, and the queue-table row menu, so one call covers all three reviewer entry points.
• package.json / package-lock.json — adds canvas-confetti and @types/canvas-confetti (dev).
• docs/WORKFLOWS.md — one clause each in AP-9, PM-11, and PM-14 happy paths, plus a note in PM-12 that bulk accept deliberately does not fire.

Testing plan

• Sign in as an applicant, complete a draft, Submit → confetti fires alongside "Application submitted" and keeps animating across the redirect to /my-applications/[id].
• Withdraw that application, Edit & resubmit → confetti fires with "Application resubmitted".
• Submit with a required question blank → error toast, no confetti.
• As a manager on /applications/[id], use the header Accept quick action → confirm → confetti fires with "Moved to Accepted".
• From the ⋯ status dialog, pick Accepted in the Select → Apply → confirm → confetti fires while the dialog is still open and is not hidden behind the overlay.
• From the /applications queue row menu, Accept → confetti fires there too.
• Move an application to Reviewing, then Rejected, then Undo → toast only, no confetti in any of them.
• Reject an application (either entry point) → toast only, no confetti.
• Bulk-select rows on /applications and Accept via the bulk bar → toast only, no confetti (deliberately out of scope).
• DevTools → Rendering → Emulate prefers-reduced-motion: reduce, repeat one submit and one accept → toasts appear, no confetti, and no canvas-confetti chunk in the Network tab.
• With the console open during a burst, confirm no CSP violation ("Refused to create a worker…") and no errors.
• After a burst finishes, confirm the injected <canvas> is gone (document.querySelectorAll('canvas')) and clicking through the area still works during the animation.
• Toggle dark mode and fire once — confetti picks up the dark --chart-* values, not the light ones.
• Accept two applications back to back — the second reuses the in-flight animation rather than stacking a second canvas.
• As a non-manager/unauthenticated user, confirm no behavior change to auth/role gating on either surface (this PR touches no server actions or guards).

Automated checks

• npm run prettier:check — pass
• npm run eslint:check — pass
• npm run tsc:check — pass
• npm run test:unit — 227 passed (Postgres unavailable locally, so the db project was not run; no DB-touching code changed)

Notes

• No automated coverage for the animation itself — both vitest projects run with environment: 'node' and no DOM harness; adding jsdom for a decorative effect isn't worth it, per the plan's risk note. Verified manually per the checklist above.
• Rejected the library's default global confetti() export: it defaults to useWorker: true (blocked by this app's CSP) and its canvas has no aria-hidden. Owning the canvas avoided both.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
aplio	Ready	Preview	Aug 25, 2026 6:29pm

[cielbellerose]

Code Review — Cycle 1 · needs revision

3 open — 1 🟠 Medium, 1 🟡 Low, 1 ⚪ Nit (see inline)

[cielbellerose]

Revision — Cycle 1

fixed R1-M1, R1-L1, R1-N1 · b89d2b4

[cielbellerose]

Code Review — Cycle 2 · approved

0 open — clean