fix: resolve timezone offset issue in edit modal date display - #25
Merged
Conversation
When editing a subscription, the date in the modal was displaying one day earlier than expected. This occurred because the date string from the database (e.g., "2024-02-15") was being parsed with new Date(), which interprets it as UTC midnight. In timezones behind UTC (like EST), this caused the date to shift backward by one day when displayed in the user's local timezone. Fixed by replacing new Date() with parseISO() from date-fns, which properly handles ISO 8601 date strings without timezone interpretation issues. This matches the pattern already used in other components like CalendarGrid.tsx. Fixes issue where dates show correctly in the list and map but appear one day earlier in the edit modal.
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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
new Date()withparseISO()from date-fns for proper ISO 8601 date parsingProblem
When editing a subscription, the date would show correctly in the list and calendar but appear one day earlier in the edit modal. For example, a subscription saved on the 15th would show as the 14th when reopened for editing.
Root Cause
The date string from the database (e.g., "2024-02-15") was being parsed with
new Date(), which interprets it as UTC midnight. In timezones behind UTC (like EST/UTC-5), this caused the date to shift backward by one day when displayed in the user's local timezone.Solution
Used
parseISO()from the date-fns library (already in use elsewhere in the codebase) which properly handles ISO 8601 date strings without timezone interpretation issues.Testing
Files Changed
src/components/SubscriptionModal.tsx: Added parseISO import and replaced Date constructor calls