Siva - feature for timezone standardization in EventCard by pavanputti · Pull Request #4633 · OneCommunityGlobal/HighestGoodNetworkApp

pavanputti · 2025-12-27T01:04:07Z

Standardize Event Time Display Based on User Timezone on Event Cards

Description

Related PRs (if any):

This frontend PR is related to the development backend PR. To test this frontend PR, you need to checkout the development backend PR.

Main changes explained:

Created src/utils/timezoneUtils.js - Utility module with getUserTimezone(), convertToUserTimezone(), getTimezoneAbbreviation(), and formatDateTimeWithTimezone() functions for automatic timezone detection and conversion
Updated src/components/CommunityPortal/CPDashboard.jsx - Integrated timezone utilities to display event times in user's local timezone with abbreviations, added location placeholder handling
Updated src/components/CommunityPortal/Event/EventCard/EventCard.jsx - Integrated timezone conversion for event start/end times, improved date/time formatting with error handling
Updated src/components/CommunityPortal/CPDashboard.module.css - Improved alignment for event date/time and location icons, added styles for stacked date and time display
Code Quality - Replaced isNaN() with Number.isNaN(), added proper error handling, removed unnecessary comments

How to test:

Check out branch and run npm install && npm run start:local
Navigate to Community Portal → Dashboard
Verify event times display with timezone abbreviations (e.g., "2:00 PM PST") and are converted to your local timezone
Verify "Location TBD" appears for events without location
Test in dark mode

Screenshots or videos of changes:

Before:

After:

- Added comment indicating where timezone conversion will be implemented - This is the initial step for standardizing event time display based on user timezone

netlify · 2025-12-27T01:05:44Z

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	`0aa4819`
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/69d88c81f87318000871903c
😎 Deploy Preview	https://deploy-preview-4633--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Phase 2 - Setup & Preparation: - Created timezoneUtils.js file with skeleton functions - Added placeholder functions: getUserTimezone, convertToUserTimezone, getTimezoneAbbreviation, formatDateTimeWithTimezone - Added TODO comments explaining what each function will do - No implementation yet - structure only

Phase 3 improvements: - Implemented getUserTimezone() function using Intl.DateTimeFormat API - Added exploration functions for testing date-fns-tz vs moment-timezone approaches - Added comments in EventCard showing where timezone conversion will be implemented - Added import comment (commented out) for future use - Explored conversion options: moment-timezone (already in use) vs date-fns-tz (available) - No full implementation yet - exploration phase only

Phase 4 improvements: - Added moment-timezone import for testing conversion approaches - Enhanced getUserTimezone() with validation and error handling - Implemented test functions for both moment-timezone and date-fns-tz approaches - Added bug fixes: null checks, validation, error handling - Tested timezone detection across browsers (Chrome, Firefox, Safari, Edge) - Documented testing results: decided to use moment-timezone for consistency - Fixed issues found during testing: invalid date handling, null checks - No full implementation yet - testing phase only

- Implemented complete timezone conversion using moment-timezone - Added formatDateTimeWithTimezone function with timezone abbreviation - Updated EventCard to use timezone utilities for time display - Added location placeholder 'Location TBD' for empty locations - Added error handling for date formatting - Removed exploration functions from timezoneUtils - Event times now display in user's local timezone with abbreviation (e.g., '2:00 PM PST')

- Updated timezoneUtils to use current date for timezone abbreviation (ensures all events show same PST/PDT) - Fixed CPDashboard to use timezone utilities for consistent time display - Improved event card alignment for date, time, and location with icons - Fixed EventCard import path - All events now show consistent timezone abbreviation across all cards

…bility

…th Number.isNaN

…lay, resolve CPDashboard conflict Co-authored-by: Cursor <cursoragent@cursor.com>

… display in eventsContent Co-authored-by: Cursor <cursoragent@cursor.com>

HemanthNidamanuru

Hi,

I tested this PR locally and everything works as expected. In dark mode, the date and time text are a bit hard to identify. Could you please check this?

Anusha-Gali

Hi Siva,

I have reviewed your PR locally and have identified the below issues;

I do not see any mention / example of "Location TBD" in any events
as you can see below the before and after, how is that the same time in two different events is converted to different times in EDT
Before

**After**

cannot see the date and time clearly in dark mode

…dark mode readability

…Comments.jsx conflicts

pavanputti · 2026-03-15T00:38:19Z

Hi Siva,

I have reviewed your PR locally and have identified the below issues;

I do not see any mention / example of "Location TBD" in any events

as you can see below the before and after, how is that the same time in two different events is converted to different times in EDT
Before

After

cannot see the date and time clearly in dark mode

Hi @Anusha-Gali ,
Why the time was wrong on development (before)
On the development branch, the time shown comes from the event’s date field (e.g. 2025-03-01T08:00:00.000Z), which is 08:00 UTC. In Eastern that becomes 3:00 AM, so you see “3:00 AM.” The actual event time is in startTime (e.g. 5:00 PM Pacific = 8:00 PM EDT). Because development uses date instead of startTime for the time, it shows the wrong time.
After the changes in this branch
We use startTime for the displayed time and convert it to the user’s timezone with a label (e.g. “8:00 PM EDT”). So the time now matches the real event time instead of the date value.
Location TBD
It only shows when location is empty, null, or "TBD". Right now all events have a location set, so you don’t see it. To verify, set one event’s location to "" in the DB and reload.
Dark mode
I’ve fixed dark mode so date, time, location, and organizer are readable on the dark background.
Thanks for reviewing.

pavanputti · 2026-03-15T00:41:51Z

Hi,

I tested this PR locally and everything works as expected. In dark mode, the date and time text are a bit hard to identify. Could you please check this?

Hi @HemanthNidamanuru
Thank you for testing the PR and for pointing this out. I’ve updated the dark mode styles to improve the visibility of the date and time text. Could you please check the latest changes when you get a chance? Thanks!

rohanrastogi311

Hi Siva,

Well done with this implementation.

Anusha-Gali

Hi Siva,

Thanks for the update on location and for making the updates. I have re-reviewed your PR locally and it works as per requirement.

naznin07 · 2026-03-18T14:23:46Z

src/components/CommunityPortal/Event/EventCard/EventCard.jsx

+    }
+  };
+
+  const formatDateTime = (eventDate, timeString) => {


Critical bug in formatDateTime.

Vishnu10-hub

Hi,

I have reviewed the implementation locally, and everything is working perfectly as expected. Great job!

…e-timezone-conversion - toFullEventDatetime was calling moment(eventDate) which parsed the date in the local machine timezone. formatDateTimeWithTimezone then called .tz(userTimezone) on this already-offset value, causing double conversion and producing different (wrong) times across different machines. - Fixed by switching to moment.utc(eventDate) and returning dateM.toISOString() so the combined datetime is strictly UTC. The single .tz() call in formatDateTimeWithTimezone then performs the correct, consistent conversion. - Tightened looksLikeFullDatetime heuristic to only match strings containing 'T' (strict ISO 8601). The previous check (s.includes('-') && s.length > 12) falsely matched time-only strings with offsets (e.g. '17:00-05:00'), bypassing the date-anchoring logic entirely. - Added eventDate guard in EventCard formatDateTime: if eventDate is missing, return 'Date not set' instead of silently falling back to local-time parsing. Fixes reviewer feedback from naznin07 on PR #4633.

All four catch blocks were flagged by SonarQube rule 'Handle this exception or don't catch it at all' (CWE error-handling): - fetchEvents catch: err was caught but never referenced — added console.error so the error variable is explicitly used before setting the user-facing error message. - formatDate catch: renamed 'error' -> 'err' for consistency and confirmed it is passed to console.error. - formatTime catch: same rename as formatDate. - parseEventDate catch: already used err in console.error, improved the message to be more descriptive ('Error parsing event date'). All blocks retain their graceful-degradation behaviour (fallback return values) so no functional change to the UI.

… features

sonarqubecloud · 2026-04-10T05:38:11Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

one-community · 2026-04-10T23:36:41Z

Thank you all, merging!

feat: Add TODO comment for timezone standardization in EventCard

7410528

- Added comment indicating where timezone conversion will be implemented - This is the initial step for standardizing event time display based on user timezone

pavanputti added the do not review Do not review or look at code without full context label Dec 27, 2025

pavanputti force-pushed the feature/standardize-event-timezone-display branch from eff1ef7 to f67d61e Compare December 27, 2025 07:16

pavanputti added 10 commits December 27, 2025 02:18

Refine search logic structure and improve code documentation

e343574

Fix SonarQube issue: Replace isNaN with Number.isNaN for better relia…

2d9bf50

…bility

Fix SonarQube issue: Replace isNaN with Number.isNaN in EventCard.jsx

a0dfacc

Fix SonarQube issues: Handle exceptions properly and replace isNaN wi…

c1c00c8

…th Number.isNaN

removed unnecessary comments

0116f9e

pavanputti changed the title ~~feat: Add TODO comment for timezone standardization in EventCard~~ Siva - feature for timezone standardization in EventCard Jan 25, 2026

pavanputti added Medium Priority and removed do not review Do not review or look at code without full context labels Jan 25, 2026

pavanputti and others added 2 commits February 7, 2026 01:34

Merge origin/development into feature/standardize-event-timezone-disp…

ab8aa71

…lay, resolve CPDashboard conflict Co-authored-by: Cursor <cursoragent@cursor.com>

Merge origin/development: resolve CPDashboard conflict, keep timezone…

84c03ab

… display in eventsContent Co-authored-by: Cursor <cursoragent@cursor.com>

one-community added High Priority - Please Review First This is an important PR we'd like to get merged as soon as possible and removed Medium Priority labels Mar 8, 2026

HemanthNidamanuru requested changes Mar 10, 2026

View reviewed changes

Anusha-Gali requested changes Mar 11, 2026

View reviewed changes

pavanputti added 2 commits March 14, 2026 19:42

Fix reviewer feedback: Location TBD, consistent timezone conversion, …

b2cf11a

…dark mode readability

Merge origin/development: resolve CPDashboard.module.css and Activity…

f7e332e

…Comments.jsx conflicts

rohanrastogi311 previously approved these changes Mar 15, 2026

View reviewed changes

Anusha-Gali previously approved these changes Mar 17, 2026

View reviewed changes

naznin07 suggested changes Mar 18, 2026

View reviewed changes

Vishnu10-hub approved these changes Mar 20, 2026

View reviewed changes

pavanputti dismissed stale reviews from Anusha-Gali and rohanrastogi311 via 35f7c07 April 10, 2026 03:56

pavanputti added 2 commits April 10, 2026 01:00

Merge origin/development: resolve CPDashboard conflict, keep timezone…

0aa4819

… features

one-community merged commit d8ec064 into development Apr 10, 2026
10 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Siva - feature for timezone standardization in EventCard#4633

Siva - feature for timezone standardization in EventCard#4633
one-community merged 18 commits intodevelopmentfrom
feature/standardize-event-timezone-display

pavanputti commented Dec 27, 2025 •

edited

Loading

Uh oh!

netlify bot commented Dec 27, 2025 •

edited

Loading

Uh oh!

HemanthNidamanuru left a comment

Uh oh!

Anusha-Gali left a comment

Uh oh!

pavanputti commented Mar 15, 2026

Uh oh!

pavanputti commented Mar 15, 2026

Uh oh!

rohanrastogi311 left a comment

Uh oh!

Anusha-Gali left a comment

Uh oh!

naznin07 Mar 18, 2026 •

edited

Loading

Uh oh!

Vishnu10-hub left a comment

Uh oh!

sonarqubecloud bot commented Apr 10, 2026

Uh oh!

one-community commented Apr 10, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Uh oh!

Conversation

pavanputti commented Dec 27, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Standardize Event Time Display Based on User Timezone on Event Cards

Description

Related PRs (if any):

Main changes explained:

How to test:

Screenshots or videos of changes:

Before:

After:

Uh oh!

netlify bot commented Dec 27, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for highestgoodnetwork-dev ready!

Uh oh!

HemanthNidamanuru left a comment

Choose a reason for hiding this comment

Uh oh!

Anusha-Gali left a comment

Choose a reason for hiding this comment

Uh oh!

pavanputti commented Mar 15, 2026

Uh oh!

pavanputti commented Mar 15, 2026

Uh oh!

rohanrastogi311 left a comment

Choose a reason for hiding this comment

Uh oh!

Anusha-Gali left a comment

Choose a reason for hiding this comment

Uh oh!

naznin07 Mar 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Vishnu10-hub left a comment

Choose a reason for hiding this comment

Uh oh!

sonarqubecloud bot commented Apr 10, 2026

Quality Gate passed

Uh oh!

one-community commented Apr 10, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

pavanputti commented Dec 27, 2025 •

edited

Loading

netlify bot commented Dec 27, 2025 •

edited

Loading

naznin07 Mar 18, 2026 •

edited

Loading