feat: display dates in user's browser timezone #109
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add nullable varchar(50) timezone column to store user's preferred timezone as IANA timezone strings (e.g., "America/New_York"). Updates v_users view to include the new timezone column. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update formatDate and formatDateTime to accept an optional timezone parameter that defaults to UTC. The formatDateTime function now dynamically displays the timezone abbreviation instead of hardcoding UTC. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add TimezoneSettings React component that allows users to select their preferred timezone from a dropdown. Uses React Hook Form with Zod validation and integrates with the existing updateUser server action. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update the UpcomingDeadlines component to format deadline dates using the user's preferred timezone from their profile settings. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update the CompetitionPropView component to format forecast and resolution due dates using the user's preferred timezone. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Convert ResolvedPropCard to a client component and update resolution date display to use the user's preferred timezone. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Replace date-fns format() calls with timezone-aware formatDate() and formatDateTime() functions from time-utils. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Use the authenticated user's timezone preference for displaying competition dates in the server-rendered competitions list page. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Update the admin competition row component to format competition dates using the user's preferred timezone from their profile. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
…tart-end Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
…onents Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
…ed-prop-card to server component - Renamed useUserTimezone to getBrowserTimezone since it's a plain function, not a React hook - Reverted resolved-prop-card.tsx to a server component by using <LocalDate> instead of the hook directly, reducing client bundle size - Restored missing blank line in account-details.tsx Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Server renders UTC, client renders browser timezone — the mismatch is intentional, so suppressHydrationWarning is the correct approach. Co-Authored-By: Claude (claude-opus-4-6) <noreply@anthropic.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
getBrowserTimezone()helper that detects the browser's timezone viaIntl.DateTimeFormatformatDate()andformatDateTime()inlib/time-utils.ts, both accepting an optional timezone parameter (defaulting to UTC)<LocalDate>client component for timezone-aware dates in server components (withsuppressHydrationWarningfor the intentional server/client mismatch)Approach
Uses browser-native
Intl.DateTimeFormat().resolvedOptions().timeZonefor detection — no database column or user settings needed. Server-rendered pages show UTC initially, then hydrate to the user's local timezone via the<LocalDate>client component.Test plan
formatDateandformatDateTime(4 tests inlib/time-utils.test.ts)🤖 Generated with Claude Code