Add onboarding flow for new users without username

[Copilot]

New users signing up via OAuth need to set a username before using protected features. Previously, users could access the app without completing their profile.

Changes

New Onboarding Page (/onboarding)

• Form collecting username (required), display name (required), bio (optional), avatar (optional)
• Username validation: 3-20 chars, alphanumeric + underscore only
• Framer Motion animations with staggered delays for smooth UX
• Theme-aware styling matching existing design system
• Reuses existing /api/user PATCH endpoint and /api/upload for avatar

Auth Flow Integration

• Added pages.newUser: "/onboarding" to NextAuth config - redirects new OAuth users automatically
• Created middleware to prevent users with existing usernames from accessing /onboarding
• Updated /settings to redirect incomplete profiles to onboarding

User Flow

New user → Google OAuth → /onboarding → Complete profile → /home
Existing user → /onboarding → Redirect to /home
User without username → /settings → Redirect to /onboarding

Files Changed

• app/onboarding/ (new): Page and component implementation
• middleware.ts (new): Route protection logic
• lib/auth.ts: Added newUser page config
• app/settings/settings.tsx: Added onboarding redirect check

Database schema already has unique constraint on handle field, enforcing username uniqueness at DB level.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• checkpoint.prisma.io
  • Triggering command: /usr/local/bin/node /usr/local/bin/node /home/REDACTED/work/maps/maps/node_modules/prisma/build/child {"product":"prisma","version":"6.18.0","cli_install_type":"local","information":"","local_timestamp":"2025-11-23T11:13:41Z","project_hash":"13c2e2a5","cli_path":"/home/REDACTED/work/maps/maps/node_modules/.bin/prisma","cli_path_hash":"7608c006","endpoint":" (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Onboarding process for all new users</issue_title>
<issue_description>Onboarding at /onboarding for all new users that sign up without a username.</issue_description>

<agent_instructions>Add an onboarding process for new users when they dont have a username, basically i want a page at /onboarding with all the animations, and sticking to my site theme as it is with onboarding for new users to set username, display name, and bio and avatar. (bio & avatar optional).</agent_instructions>

Comments on the Issue (you are @copilot in this section)

• Fixes Onboarding process for all new users #14

---

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.