weekStartsOn not recognised

[chrisclausen90]

Subject of the issue

adding a custom number on weekStartsOn property is not changing the default calendar weeks ordering (from Sunday to Monday).

[BUG] Bug Reproduce Steps

add weekStartsOn={1} to <DateRangePicker weekStartsOn={1} ranges={[{ startDate, endDate, key: 'selection', }]} />

[BUG] Expected behaviour

Should change the default start of the week from Sunday to Monday

Environment

Package Version: ^1.0.3 React version: ^16.13.1 Node version: v13.7.0 Browser: Brave

[nerycordova]

Hi @chrisclausen90 :wave:

It works for me in the same environment. Can you try the code below?

const App = () => {

  const [startsOn, setStartsOn] = React.useState(0);
  const days = [0,1,2,3,4,5,6];

  return (
     <>
     Week starts on:
      <select value={startsOn} 
              onChange={ event => setStartsOn(parseInt(event.target.value))  }>
        {days.map ( item => <option value={item} key={item}> {item} </option> )}
      </select> <br />
      <DateRangePicker
              onChange={ (event) => { console.log(event) }}
              ranges={[{selection:{}}]}
              direction="horizontal"
              weekStartsOn={startsOn}
          />
      </>
  )
}

You can also see a live demo here.

[chrisclausen90]

Hi @nerychucuy

Thanks for your answer. I tried to use your code as well but still not working. We're using moment and are setting moment.locale to change the localisation based on the user settings. I have a feeling that the moment is causing the problem.

I'll let you know if I solved the issue

[nerycordova]

Thanks, @chrisclausen90 . Hope you get it to work. If you happen to have some time to share a demo of your use case, would be great.

[ayxos]

@nerychucuy I think the problem is with date-fns

The version of react-date-range is: react-date-range": "github:arthot/react-date-range#next-fns-1 which is not the standard, neither the latest

and this version uses as peerDep date-fns: 1.30.0

and this version apparently does not have the same structure and that is why weekStartsOn does not work

[chrisclausen90]

Closed issue. Updating module works