Проверка авторизации , настройка прелоадера , защита роутингов в Next : "13.5.6",

Всем привет! . Прошу помочь решить мне проблему связанную с NEXT 13.5.6

Проблема заключается в том что у меня при проверки авторизации после проверки прокидывается сайд еффект пустой страницы. Из предположений, что это выплевывает сам Next со своим SSR.

Как работает сервис:

Если токен мертв или отсутствует: Открываем ресурс ===> Включается крутилка ===> Крутилка Выключается ===> Прокидывается пустая страница (которая не должна) ===> Мы попадаем на страницу логина

Если токен живой: Открываем ресурс ===> Включается крутилка ===> Крутилка Выключается ===> Прокидывается пустая страница (которая не должна) ===> Мы попадаем на страницу с данными которую хотим допусти http://localhost:3000/projects/

В обоих случаях мне надо добиться того, что бы у меня не было прокидывание этой пустой странички.

Как настроена проверка: Есть AuthProvider в котором есть проверка токена. Есть ProtectedRoute который смотрит куда разрешать и куда не разрешать . Токен хранится в localstorage. Вот собственно сам код.

Это _App

<Provider store={store}>
        <SnackbarProvider maxSnack={6}>
          **<AuthProvider initialUser={pageProps.user}>**
            **<ProtectedRoute>**
              <SettingsProvider {...(setConfig ? { pageSettings: setConfig() } : {})}>
                <SettingsConsumer>
                  {({ settings }) => {
                    return (
                      <ThemeComponent settings={settings}>
                        {getLayout(<Component {...pageProps} />)
                        <ReactHotToast>
                          <Toaster position={settings.toastPosition} toastOptions={{ className: 'react-hot-toast' }} />
                        </ReactHotToast>
                      </ThemeComponent>
                    )
                  }}
                </SettingsConsumer>
              </SettingsProvider>
            **</ProtectedRoute>**
          **</AuthProvider>**
        </SnackbarProvider>
      </Provider>

Это контекст:

'use client'

import { createContext, useState, useEffect, useContext } from 'react'
import axios from 'axios'
import { useRouter } from 'next/router'
import Spinner from '../@core/components/spinner'

const AuthContext = createContext()

const defaultProvider = {
  isAuthenticated: false,
  inLogin: false,
  setInLogin: () => Boolean,
  authChecked: false,
  user: null,
  loading: true,
  setUser: () => null,
  setLoading: () => Boolean,
  checkTokenValidity: () => Promise.resolve(),
  logout: () => Promise.resolve(),
}


const AuthProvider = ({ children,initialUser  }) => {
  // debugger
  const [authChecked, setAuthChecked] = useState(defaultProvider.authChecked)
  const [user, setUser] = useState(initialUser || defaultProvider.user)
  const [loading, setLoading] = useState(!initialUser)
  const [isAuthenticated, setIsAuthenticated] = useState(defaultProvider.isAuthenticated);
  const [inLogin, setInLogin] = useState(defaultProvider.inLogin);
  const router = useRouter()

  const publicPaths = ['/login', '/register']

  useEffect(() => {
    const checkAuth = async () => {
      // debugger
      try {
        const storedToken = window.localStorage.getItem('access_token')
        if (storedToken) {
          const response = await axios.get(`${БЕК}/api/user-token`, {
            headers: {
              Authorization: `Bearer ${storedToken}`,
            },
          })
          setUser(response.data)
          setAuthChecked(true)
        } else {
          if (!publicPaths.includes(router.pathname)) {
            router.push('/login')
          }
            setAuthChecked(true)
        }
      } catch (error) {
        console.error('Ошибка проверки аутентификации:', error)
        if (!publicPaths.includes(router.pathname)) {
          router.push('/login')
        }
        setAuthChecked(true)
      } finally {
        setLoading(false)
      }
    }

    if (!authChecked) {
      checkAuth()
    } else {
      setLoading(false)
    }
  }, [authChecked, router, publicPaths])

  const handleLogout = () => {

    setUser(null)
    setAuthChecked(false)
    setInLogin(false)
    window.localStorage.removeItem('user')
    window.localStorage.removeItem('access_token')
    window.localStorage.removeItem('refresh_token')
    router.push('/login')
  }


  const authValues = {
    user,
    loading,
    authChecked,
    setUser,
    setLoading,
    inLogin,
    setInLogin,
    logout: handleLogout,
  }


  return (
    <AuthContext.Provider value={authValues}>
      {children}
    </AuthContext.Provider>
  )
}

export { AuthContext, AuthProvider }

Это ProtectedRoute

import { useEffect } from 'react'
import { useRouter } from 'next/router'
import { useAuth } from '../../hooks/useAuth'
import Spinner from '../../@core/components/spinner'

const ProtectedRoute = ({ children }) => {
  const { user, loading, authChecked,inLogin } = useAuth()
  const router = useRouter()

  useEffect(() => {
    if (authChecked && !loading) {
      if (!inLogin && !user && !['/login', '/register', '/forgot-password'].includes(router.pathname)) {
        router.push('/login');
      } else if (user && ['/login', '/register'].includes(router.pathname)) {
        router.push('/');
      }
    }
  }, [loading, authChecked, user, router]);


  if (loading || !authChecked) {
    return <Spinner />
  }

  return children
}

export default ProtectedRoute

Но повторюсь , этот код отрабатывает . Кажется только мешает то, что в ненужный момент вмешивается SSR и выплевывает нам данные (Пустую страничку, ту на котором пути я нахожусь, только без данных)