Как предотвратить закрытие Popup при изменении состояния?

Question

gooseNjuice () @gooseNjuice

JavaScript Fullstack

Как предотвратить закрытие Popup при изменении состояния?

Использую библиотеку react-leaflet, пытаюсь сделать так, чтобы контент в Popup динамически менялся в зависимости от состояния. Но когда целевое состояние меняется, Popup автоматически закрывается, и это раздражает. Как избавиться от такого поведения?
Пробовал вместо своих элементов вписать в Popup просто две разных кнопки, одна меняет mock-состояние по клику на false и отображается когда оно == true. Вторая такая же, но меняет состояние на true и рендерится, когда оно равно false. Почему-то всё было нормально, всплывающее окно не закрывалось нежданно-негаданно. Прошу помощи!

VpnMonitors

// непосредственно сама карта
const VpnMonitors = () => {
    const [vpns, setVpns] = useState([]);
    const [isVpnSelected, setIsVpnSelected] = useState({isSelected: false, ami: ''});

    useEffect(async () => {
        const res = await axios.get('/api/admin/vpn');
        setVpns(res.data);
    }, []);

// возвращает массив объектов, где ключ - имя региона, значение - массив инстансов
    const regions = getVpnListsByRegions(vpns);

    return (<MapContainer id="map">

//просто слой, нужный для отображения всей карты на английском, вместо локальных языков регионов
                <TileLayer id="layer"
                           url="https://api.maptiler.com/maps/basic/256/{z}/{x}/{y}.png?key=JRwZP23ovmihSHEGkrvu"
                />

//создаём маркер на карте для каждого региона
                {Object.keys(regions).map((elem) => {
                        return <LocationMarker elem={regions[elem]}
                                               setIsVpnChanged={setIsVpnSelected} isVpnChanged={isVpnSelected}
                                               key={uuidv4()}
                        />;
                    }
                )}
            </MapContainer>
    );
};

LocationMarker

const LocationMarker = ({elem, setIsVpnChanged, isVpnChanged, handleVpnStatus, removeVpn, setIsUserListOpened}) => {

    return (<Marker position={elem[0].position} className="marker__down">

// чисто наугад пробовал разные параметы, навроде autoClose, проблему не решило
        <Popup style={{width: 'fit-content'}}  autoClose={false} closeOnEscapeKey={false} closeOnClick={false}>
// если конкретный инстанс не выбран (по умолчанию так), то отображается список инстансов, доступных в этом регионе. Когда пользователь выбирает его, то в Popup должен отобразиться уже не список, а сам инстанс с разными деталями
        {!isVpnChanged.isSelected ?
            <InstancesList elem={elem} setIsVpnChanged={setIsVpnChanged} isVpnChanged={isVpnChanged}
                           /> :
            <InstanceDetails elem={elem} setIsVpnChanged={setIsVpnChanged} isVpnChanged={isVpnChanged}
                             />}
    </Popup>
</Marker>)};