Работа с куками в мобильном браузере на react js

Всем привет! Разрабатываю маркетплейс на react и возникла проблема при авторизации пользователя на мобильном браузере, не важно ios/android. Проблема в том, что в браузере 'ПК' (в различных разрешениях включая 'мобильное') TOKEN записывается в куки и авторизация идет, но как только пытаюсь авторизоваться на РЕАЛЬНОМ мобильном android/ios нет никакого продвижения.

Признаком того, что пользователь авторизован является HEADER, в котором фото и тд пользователя отображается в том случае, если authState = true. А в authState использую useEffect для выставления 'true' значения если токен есть в куках.

Вопрос: Есть ли какая то особенность при реализации хранения токена в куках в мобильных браузерах и если есть то какая?

Запись токена в куки:

function setCookie(name, value, options = {}) {

options = {
    path: '/',
    ...options
};

if (options.expires instanceof Date) {
    options.expires = options.expires.toUTCString();
}

let updatedCookie = encodeURIComponent(name) + "=" + encodeURIComponent(value);

for (let optionKey in options) {
    updatedCookie += "; " + optionKey;
    let optionValue = options[optionKey];
    if (optionValue !== true) {
        updatedCookie += "=" + optionValue;
    }
}

document.cookie = updatedCookie;}

Выставление значений true/false в authState:

const cookies = getCookie('userInfo')
useEffect(()=>{
    if(cookies !== ''){
        setAuthState(prev => {
            return {
                ...prev,
                authed:true
            }
        })
    }
    if(cookies === '' || cookies === undefined ){
        setAuthState(prev => {
            return {
                ...prev,
                authed:false
            }
        })
    }
},[cookies])

Отображение в мобильном header если authState true:

if(authState.authed === true){
        return (
            <div className='userAuthedIcons'>
                <Link to='/postAd' className='postAdIcon'>
                    <img src={postAdIcon} alt="icon"/>
                </Link>
                <Link to='/userPage/favorities'>
                    <img src={favoritePageIcon} alt="icon"/>
                </Link>
                <Link to='/userPage/notifications'>
                    <img src={notificationsPageIcon} alt="icon"/>
                </Link>
                <Link to='/userPage/profile'>
                    <img src={useIcon} alt="icon" className='userAuthedIcon'/>
                </Link>
            </div>
        )
    }
    else if(authState.authed === false) {
        return (
            <Link to='/userPage/favorities'>
                <img src={favoritePageIcon} alt="icon"/>
            </Link>
        )
    }

Отображение в desktop header если authState true:

if(authState.authed === true){
        return (
            <Link to='/userPage/profile'>
                <div className='header__profileImg'>
                    <img src={useIcon} alt='img' />
                </div>
            </Link>
        )
    }
    else if(authState.authed === false) {
        return (
            <button
                id='signin__out'
                onClick={() =>
                    setAuthState(prev => {
                        return {
                            ...prev,
                            mainModal: true,
                            logInModal: true,
                        }
                    })
                }
            >
                <p>Вход/Регистрация</p>
            </button>
        )
    }

Ответы (0 шт):