Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Inconsistent Datepicker Weekday Labels #1044

Closed
2 tasks done
Ncookiez opened this issue Oct 4, 2023 · 5 comments · Fixed by #1173 or #1325
Closed
2 tasks done

Inconsistent Datepicker Weekday Labels #1044

Ncookiez opened this issue Oct 4, 2023 · 5 comments · Fixed by #1173 or #1325
Labels
🐛 bug Something isn't working needs info Further information is requested

Comments

@Ncookiez
Copy link
Contributor

Ncookiez commented Oct 4, 2023

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

  1. Go to https://www.flowbite-react.com/docs/components/datepicker
  2. Click on the first datepicker example to view selector

Current behavior

The datepicker component is currently showing different weekdays for different users.

User A:
image

User B:
image

Expected behavior

Ideally these are always correct regardless of timezone, locale, or browser.

In this case, weekday labels should be starting on Sunday, and ending on Saturday to match correctly with the numbers below.

Context

In my case I fall into the "User A" category, seeing the wrong weekday labels. Can replicate this on Edge and Brave Browser (both Chromium-based). I am currently on GMT-4 timezone-wise. English locale.

This could be caused by a variety of issues as hinted above - the default weekStart on the component is set to Sunday, and I don't see this being overwritten on the docs app, so maybe something is wrong with how context is being gathered here, either due to locale or timezone specifics.

Alternatively, this could be due to timezone or locale issues on the getWeekDays() function here, although somewhat unlikely.

@rluders rluders added needs info Further information is requested 🐛 bug Something isn't working labels Oct 4, 2023
@Cesron
Copy link

Cesron commented Oct 5, 2023

In my case, the output I receive is as follows:

image

I'm using the Edge browser with UTC-6 time zone and Spanish locale.

I've also noticed that in the original Flowbite library, it works perfectly with the same browser and time zone configuration:

image

There's another problem, but I'm not sure if it's related. The issue is that when I open the decades menu, I'm not able to click on any decade other than the one is selected at the initial render:

image

@matheusalxds
Copy link

I have exactly the same problem.

@matheusalxds
Copy link

Is there any udpdate?

@AdilsonDevTech
Copy link

No updates yet 😢

markhker added a commit to markhker/flowbite-react that referenced this issue Dec 6, 2023
Updating the WeekStart enum to be aligned with the values Javascript Date object uses allows to
simplify the code and maintain compaitbility. Fixed the off-by-one error

BREAKING CHANGE: As the WeekStart enum changed order to be aligned with Javascript Date object, now
you have to change your weekStart attribute to be -1, so for Monday you should put 1, instead of 2.
But it wasn't working before as the values were incorrectly rendered in the first place.

fix themesberg#1044
@markhker
Copy link
Contributor

markhker commented Dec 6, 2023

This should fix it: #1173

tulup-conner pushed a commit to markhker/flowbite-react that referenced this issue Dec 7, 2023
Updating the WeekStart enum to be aligned with the values Javascript Date object uses allows to
simplify the code and maintain compaitbility. Fixed the off-by-one error

BREAKING CHANGE: As the WeekStart enum changed order to be aligned with Javascript Date object, now
you have to change your weekStart attribute to be -1, so for Monday you should put 1, instead of 2.
But it wasn't working before as the values were incorrectly rendered in the first place.

fix themesberg#1044
tulup-conner pushed a commit that referenced this issue Dec 7, 2023
Updating the WeekStart enum to be aligned with the values Javascript Date object uses allows to
simplify the code and maintain compaitbility. Fixed the off-by-one error

BREAKING CHANGE: As the WeekStart enum changed order to be aligned with Javascript Date object, now
you have to change your weekStart attribute to be -1, so for Monday you should put 1, instead of 2.
But it wasn't working before as the values were incorrectly rendered in the first place.

fix #1044
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐛 bug Something isn't working needs info Further information is requested
Projects
None yet
6 participants