Skip to content

Conversation

@Sinaloense
Copy link

@Sinaloense Sinaloense commented Jul 6, 2025

Problem explanation:

  • My local time zone is GMT-7.
  • When selecting an expiration date: 07/08/2025
  • The database stores it as: 2025-07-08 00:00:00
  • However, when displaying expirationTime using formatTime(item.expirationTime, 'date'), it appears as 07/07/2025 (one day earlier).
  • This happens because the date is not stored in UTC, and converting to local time shifts the date.

Solution:
Store the date always in UTC to avoid timezone-related mismatches.
Change input date to datetime-local.

  • Change the input to datetime-local to support hours and minutes.
    PC:
    image

    Android:
    image

Bonus:

  • Add support for the Clear button, which now properly set the field to 01/01/2099 12:00 AM and value to null.
    image

  • Show the expiration date with hours and minutes in the table.
    image

@tananaev
Copy link
Member

tananaev commented Jul 6, 2025

I don't think storing in UTC is the right approach. I think what we should do is send full ISO time with the timezone, like we do in other places, like reports.

@Sinaloense
Copy link
Author

I realized I incorrectly named this as "UTC", when in fact it's being sent as an ISO.
The database stores it like: 2025-07-13 07:00:00

export const formatLocalTimeToUTC = (value) => {
  if (value) {
    return dayjs(value).utc().toISOString();
  }

  return '';
}

But I now see this can be simplified by using dayjs().format()
So instead of:
setItem({ ...item, expirationTime: formatLocalTimeToUTC(e.target.value) });
I can just do:
setItem({ ...item, expirationTime: dayjs(e.target.value).format() });

I’ve made the changes, please review it when you have time.

@Sinaloense
Copy link
Author

I have now reverted to using toISOString() for expirationTime:
setItem({ ...item, expirationTime: new Date(e.target.value).toISOString() });

The issue was caused by using an input of type "date".
Switching to type "datetime-local" resolves the problem.

@Sinaloense Sinaloense changed the title Store expirationTime as UTC, use datetime-local input, support clear button, show expiration time with minutes Use datetime-local input, support clear button, show expiration time with minutes Jul 6, 2025
@tananaev
Copy link
Member

tananaev commented Jul 6, 2025

I would prefer to keep the date only. Sounds like the right fix would be to just format the date in a full ISO format. That way timezone info will be preserved.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants