Автоматическое обновление React js при доступе к компоненту

#reactjs

#reactjs

Вопрос:

Это Home

     function Home(){

  const [posts,setPosts] = useState([])
  const [isLogged,setActive] = useState(false)

  
  const history = useHistory()


  function handleSubmit(e)
  {
    e.preventDefault()
    
    history.push(`/${e.target.name}`)
    
    
  }

  function handleLogout(e){
    e.preventDefault()
    setActive(false)
    cookies.remove('blog')
  }
  
  useEffect(async ()=> {
  try{const res = await axios.get('/api/posts')
  setPosts(res.data)
  if(cookies.get('blog'))
  setActive(true)
  
  } catch(err){
    console.log('internal error')
  }
  },[])
  
  return (
    <div>
      <header className='h-head'>
        <div className='h-head-internal'>
          <h1 className='head-h1'>Travel Blog</h1>
            { isLogged ? null :  <button className='head-btn' name='Signup' onClick={handleSubmit}>Sign-Up</button>}
            { isLogged ? null :<button  className='head-btn' name='Signin' onClick={handleSubmit}>Sign-In</button>}
            { isLogged ? <button className='head-btn' name='Createpost' onClick={handleSubmit}>Create-Post</button>  : null }
            { isLogged ? <button className='head-btn' name='Logout' onClick={handleLogout}>LogOut</button>  : null }
        </div>
      </header>
      <h1 className='post'>POSTS</h1>
      <div className='container'>
        {posts.map(post => {
          return <Post title={post.title} author={post.author} description={post.description} image={post.image} />
        })}
      </div>
    </div>
  )
}

export default Home
 

При возвращении на домашнюю страницу регистрация и вход должны быть заменены выходом из системы и созданием записи, поскольку файлы cookie были сохранены в браузере, но они не обнаруживают его, если я не обновлю страницу итак, что делать

 function Signin(){

  const [data, setData] = useState({
    email:"",
    password:""
  })

  const history = useHistory()

  async function  signinpost(){

    const res = await axios.post('/api/signin',data)
    if(!res)
      return console.log(res)
    console.log(res)
    

  }

  
  function Redirecthandler(e) {
    e.preventDefault()
    history.push('/Signup')
  }

  function handleChange(e){
    const { name, value } = e.target
    setData(prev => {
      return {
        ...prev,
        [name]:value
      }
    }) }

  function handleSubmit(e){
    e.preventDefault()
    signinpost()
    history.push('/')
    
  }

  return (
  <React.Fragment>
  <div className='main flex'>
  <header className='head'>
    <h1>Travel Blog</h1>
    
  </header>
  <form className='flex form-top-pad' method='post'>
    <div>
    <label className='label label-left-pad' for='email'>EMAIL :</label>
    <input className='input' type='email' name='email' placeholder='Email' onChange={handleChange}/>
    </div>
    <div>
    <label className='label' for='password'>PASSWORD :</label>
   <input className='input' type='password'  name='password' placeholder='Password' onChange={handleChange} />
    </div>
   

   <input className='btn' type='submit' value='SIGNIN' onClick={handleSubmit} />
  
  <button className='under-btn' onClick={Redirecthandler}>
    New User ? Get Started
  </button>
  </form>
  
  </div>
  </React.Fragment>
  )
  
}

export default Signin
 

Я перенаправляю со страницы входа на главную страницу после установки файлов cookie в браузере, но кнопка входа и регистрации не отключается без обновления как я могу запускать автоматическое обновление при каждом доступе к домашнему компоненту, пожалуйста, помогите