Closing one popover and opening an other after a certain amount of time

I am currently trying to make a popover tutorial for an app. My problem is that I need to show a popover and when clicking on the "Next" button, close the current popover and opening an other after some time. When trying to set the new state, the current popover is closing but the next one is not opening. I am using react-native-popover-view. Here is my code:

const Details = props => {

  const [popoverDetails, setPopoverDetails] = useState([
    {
      mainText: 'popover 1',
      textPopover: 'popover 1',
      visible: false,
    },
    {
      mainText: 'popover 2',
      textPopover: 'popover 2',
      visible: false,
    },
    {
      mainText: 'popover 3',
      textPopover: 'popover 3',
      visible: false,
    },
  ]);

  useEffect(() => {
    setTimeout(() => {
      let tmp = [...popoverDetails];
      tmp[0].visible = true;
      setPopoverDetails(tmp);
    }, 1000);
  }, []);

  const nextTuto = i => {
    console.log('i : ', i);
    let tmp = [...popoverDetails];
    tmp[i].visible = false;
    tmp[i + 1].visible = true;

    setPopoverDetails(tmp)
    console.log('tmp : ', tmp);
    console.log('popverdetails : ', popoverDetails);
  };

  return (
    <View style={{flex: 1}}>
      <Text>Ranking page</Text>

      {popoverDetails.map((pD, i) => (
        <Popover
          isVisible={pD.visible}
          onRequestClose={() => {
            let tmp = [...popoverDetails];
            tmp[i].visible = false;
            setPopoverDetails(tmp);
          }}
          from={
            <TouchableOpacity
              onPress={() => {
                setShowPopover1(true);

                let tmp = [...popoverDetails];
                tmp[i].visible = true;
                setPopoverDetails(tmp);
              }}>
              <Text>{pD.mainText}</Text>
            </TouchableOpacity>
          }>
          <Text>{pD.textPopover}</Text>
          <Button onPress={() => nextTuto(i)} title="Next" />
        </Popover>
      ))}
    </View>
  );
};

The tmp and popoverDetails are the same. I also tried putting a setTimeout but it doesn't seem to work. Any suggestions on how to perform this ?

SteffeyDev / react-native-popover-view

Closing one popover and opening an other after a certain amount of time #114