Uh oh!
There was an error while loading. Please reload this page.
feat(home): personalized dashboard for logged-in users - #58
Conversation
Logged-in visitors now see a personalized dashboard on `/` instead of the marketing home. Logged-out visitors and crawlers still get the same server-rendered, indexable marketing page. Auth lives only in localStorage, so it's unknown during SSR. HomeGate keeps the marketing content as the SSR default and swaps in the dashboard on the client once `useAuth` reports `ready && auth` — no hydration mismatch, no SEO regression. The dashboard surfaces: - greeting band with avatar, name and stats (hackatones / proyectos) - an engagement CTA that adapts to the featured hackathon's state (active / upcoming / none) to nudge continued participation - "Mis hackatones" — hackathons played, grouped into cards with status badges and project rows, plus an encouraging empty state - quick-action tiles (proyectos, perfil, explorar, soldados) and the existing newsletter CTA Extracts the user-projects fetch + hackathon grouping into a shared `useUserHackathons` hook, reused by both the new dashboard and the existing `/dashboard/hackathones` page (which is refactored onto it). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughA shared ChangesHackathon Hook and Home Dashboard
Estimated code review effort: 3 (Moderate) | ~25 minutes Sequence Diagram(s)sequenceDiagram
participant Page as app/page.tsx
participant HomeGate
participant useAuth
participant HomeDashboard
participant useUserHackathons
participant fetchUserProjects
Page->>HomeGate: render(children)
HomeGate->>useAuth: check ready/auth
useAuth-->>HomeGate: { ready, auth }
alt ready && auth
HomeGate->>HomeDashboard: render
HomeDashboard->>useUserHackathons: call(readPubkey)
useUserHackathons->>fetchUserProjects: fetch projects
fetchUserProjects-->>useUserHackathons: projects
useUserHackathons-->>HomeDashboard: { groups, loading }
HomeDashboard-->>Page: rendered dashboard
else not authenticated
HomeGate-->>Page: render children
end
Suggested labels: frontend, refactor, feature Suggested reviewers: none identified 🐰 Hopping through hooks, both new and old, 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
🧹 Nitpick comments (1)
app/page.tsx (1)
34-49: 🚀 Performance & Scalability | 🔵 TrivialFull marketing tree — including data-fetching components — still renders server-side for authenticated users before being discarded.
HomeVotingHero(with"use cache", plusgetCachedVotingPeriod) and other marketing children are always rendered on the server insideHomeGate'schildren, even though logged-in users will immediately swap toHomeDashboardclient-side and never see them. This is an accepted tradeoff per the PR's hydration-safety design, but worth flagging: every authenticated home-page load pays the cost of computing/streaming content that's thrown away client-side. SinceHomeVotingHerois cached ("use cache") the marginal per-request cost is likely low, but it's worth confirming the other marketing children (GamingHackathonBanner,HomeBenefits,HomeScroll) don't do uncached per-request work.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@app/page.tsx` around lines 34 - 49, The authenticated home path still renders the full marketing tree inside HomeGate on the server before swapping to HomeDashboard client-side, so review the marketing children for avoidable per-request work. Check HomeVotingHero, GamingHackathonBanner, HomeBenefits, and HomeScroll for any uncached data fetching or expensive server-side computation, and move or cache that work if needed while preserving the current hydration-safety behavior in HomeGate and app/page.tsx.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@app/page.tsx`:
- Around line 34-49: The authenticated home path still renders the full
marketing tree inside HomeGate on the server before swapping to HomeDashboard
client-side, so review the marketing children for avoidable per-request work.
Check HomeVotingHero, GamingHackathonBanner, HomeBenefits, and HomeScroll for
any uncached data fetching or expensive server-side computation, and move or
cache that work if needed while preserving the current hydration-safety behavior
in HomeGate and app/page.tsx.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 2e83f1b6-e2fb-484d-af6e-5e6b4c3a03fe
📒 Files selected for processing (5)
app/dashboard/hackathones/MisHackatonesClient.tsxapp/page.tsxcomponents/home/HomeDashboard.tsxcomponents/home/HomeGate.tsxlib/useUserHackathons.ts
What
When a user is logged in, the home page (
/) now renders a personalized dashboard instead of the marketing page. Logged-out visitors and crawlers still get the exact same server-rendered, indexable marketing home.Why
The home page was purely marketing with no auth awareness. Returning users benefit from a panel that shows the hackathons they've played and nudges them to keep participating — while preserving SEO for anonymous traffic.
How
Auth lives only in
localStorage, so it's unknown during SSR. A small client gate keeps the marketing content as the SSR default and swaps in the dashboard on the client onceuseAuthreportsready && auth. Because the server and first client render both show the marketing content, there's no hydration mismatch and no SEO regression.New files
components/home/HomeGate.tsx— client gate: renders the marketingchildrenuntil logged in, then swaps to the dashboard.components/home/HomeDashboard.tsx— the logged-in view:lib/useUserHackathons.ts— shared hook that loads a user's Nostr projects (cache-first, then relays) and groups the hackathon ones.Edited
app/page.tsx— wraps the marketing content in<HomeGate>.app/dashboard/hackathones/MisHackatonesClient.tsx— refactored onto the shared hook (dedupes the fetch + grouping logic the new dashboard also needs).Testing
tsc --noEmit→ clean./projects/<slug>./dashboard/hackathonesstill works via the shared hook.Reviewer notes
/homeroute in this app — the home page is/, which is what changed.🤖 Generated with Claude Code
Summary by CodeRabbit