I have a set of code running that checks two dates. If those two dates/times occurred on the same day, one course of action is taken. If they are not, a different set of components are shown. The code initially renders server side and we noticed that there were cases where the server side did not match the client side and this led to a refresh of those components.
We noticed that if one date/time was after 7pm, the date-fns function isSameDay returned false when run on the server despite the two dates being on the same day. This did not happen on the client. Comparing those dates with the .getDate() function on the javascript object also showed different days for the same case.
I output the GMT string, the ISO string, and the date, month and year of a blank date object (current date/time) as well as the two date/time strings referred to as Date 2 and Date 1 using the code below …
<div>
<div>{new Date().toGMTString()}</div>
<Divider />
<div>{new Date(Date2).toGMTString()}</div>
<Divider />
<div>{Date1.toGMTString()}</div>
</div>
<div>
<div>{new Date().toISOString()}</div>
<Divider />
<div>{Date2.toISOString()}</div>
<Divider />
<div>{Date1.toISOString()}</div>
</div>
<div>
<div>{`${new Date().getDate()}-${new Date().getMonth()}-${new Date().getFullYear()}`}</div>
<Divider />
<div>{`${Date2.getDate()}-${Date2.getMonth()}-${Date2.getFullYear()}`}</div>
<Divider />
<div>{`${Date1.getDate()}-${Date1.getMonth()}-${Date1.getFullYear()}`}</div>
</div>
The strings used to create Date 1 and Date 2 are as follows :
Date1 – “2024-07-18T15:05:02.842Z”
Date2 – “2024-07-19T00:10:00Z”
Server Side Results
Item | Now | Date 2 | Date 1 |
---|---|---|---|
GMT | Tue, 05 Nov 2024 16:33:12 GMT | Fri, 19 Jul 2024 00:10:00 GMT | Thu, 18 Jul 2024 15:05:02 GMT |
ISO | 2024-11-05T16:33:12.035Z | 2024-07-19T00:10:00.000Z | 2024-07-18T15:05:02.842Z |
Day,month,year | 5-10-2024 | 19-6-2024 | 18-6-2024 |
Client Side Results
Item | Now | Date 2 | Date 1 |
---|---|---|---|
GMT | Tue, 05 Nov 2024 16:33:32 GMT | Fri, 19 Jul 2024 00:10:00 GMT | Thu, 18 Jul 2024 15:05:02 GMT |
ISO | 2024-11-05T16:33:32.820Z | 2024-07-19T00:10:00.000Z | 2024-07-18T15:05:02.842Z |
Day,month,year | 5-10-2024 | 18-6-2024 | 18-6-2024 |
The reason for the two interpretations is likely a timezone issue with my local timezone being 5 hours behind UTC.
The issue is that when Date2 was selected, 7pm on the 18th was selected and i’m not sure why it was stored improperly.
How do I address this? Can I convert “2024-07-19T00:10:00Z” to my local time zone?