Skip to content

NOMINEE_PAGES_FIXED.md

Latest commit

 

History

History
43 lines (33 loc) · 1.93 KB

NOMINEE_PAGES_FIXED.md

File metadata and controls

43 lines (33 loc) · 1.93 KB
Raw

Nominee Pages Fixed ✅

Issue

The nominee live pages were not working properly - they were loading but showing skeleton/loading state instead of actual nominee content.

Root Cause

The nominee page was implemented as a client-side component that fetched data via API calls, but the client-side fetch was failing or not completing properly, leaving the page stuck in the loading state.

Solution

  1. Converted to Server-Side Rendering: Changed the nominee page from a client component to a server component that fetches data directly from the database during server-side rendering.

  2. Fixed API Route: Updated the API route to use the public_nominees view instead of the raw nominations table to get proper vote counts.

  3. Improved Data Structure: Enhanced the data transformation to include both nominee and company information properly.

Files Modified

/src/app/nominee/[slug]/page.tsx

  • Converted from client component to server component
  • Removed client-side fetch logic
  • Added direct database query using Supabase server client
  • Improved error handling with notFound() for missing nominees

/src/app/api/nominee/[slug]/route.ts

  • Changed query from nominations table to public_nominees view
  • Added company information to the response
  • Ensured vote counts are properly included

Testing Results

✅ All 46 approved nominee pages now load correctly ✅ Pages show proper nominee information including:

  • Name, title, country
  • Company information
  • Vote counts
  • "Why vote for me" content ✅ Server-side rendering ensures fast initial page loads ✅ Proper error handling for non-existent nominees

Benefits

  • Faster Loading: Server-side rendering eliminates client-side fetch delays
  • Better SEO: Content is available immediately for search engines
  • Improved UX: No more loading states or skeleton screens
  • More Reliable: Direct database queries are more reliable than client-side API calls