Can I create two instances of the <Calendar.List /> with useDateRange hooks ?

[ioeldev]

I have two screens with the Calendar.List but when one update the state of useDateRange it gets reflected on the second component, even though the Calendar.List have two different "key" props. Is it possible to instantiate the useDateRange twice ?

[MarceloPrado]

The useDateRange hook is a plain React hook that exposes a useState's value + some setters. Did you try something like this?

const YourApp = ({ currentScreen }) => {
  const dateRangePropsForFirstScreen = useDateRange()
  const dateRangePropsForSecondScreen = useDateRange()

  return currentScreen === 'one' ? 
    <ScreenOne {...dateRangePropsForFirstScreen} /> : 
    <ScreenTwo {...dateRangePropsForSecondScreen} />;
}

[ioeldev]

Will try, it's just that i am initializing the useDateRange inside of each components so i thought i wouldn't interfere

[MarceloPrado]

A repro example would be helpful to understand what's going on