Приложение. js визуализируется дважды, и аутентификация не работает должным образом

Question

У меня проблема с моими маршрутами, и я не знаю, как это исправить. Я использую redux и localstorage для хранения своего токена, и у меня есть значение isAuthenticated, которое проверяет, есть ли у меня токен, сейчас я проверяю свои маршруты.

В любом случае я проверяю props.isAuthenticated и всякий раз, когда я залогинился у меня есть доступ к банкам по маршруту. ОДНАКО, когда я обновляю sh страницу, она перенаправляет меня на домашнюю страницу, и это главная проблема, я хочу, чтобы она оставалась на той же странице. Я записал в консоль значение props и всякий раз, когда я обновляю sh любую страницу, я получаю два реквизита, первый раз isAuthenticated имеет значение false, а второй - true, поэтому по какой-то причине он рендерит дважды. Если вам нужна дополнительная информация, пожалуйста, дайте мне знать.

Приложение. js

import React, { useEffect, Suspense } from 'react';
import { Route, Switch, withRouter, Redirect } from 'react-router-dom';
import { connect } from 'react-redux';

import Layout from './hoc/Layout/Layout';
import Home from './containers/Home/Home';
import Logout from './containers/Auth/Logout/Logout';
import * as actions from './store/actions/index';

const Auth = React.lazy(() => {
  return import('./containers/Auth/Auth');
});

const Banks = React.lazy(() => {
  return import('./containers/Banks/Banks');
});

const App = props => {
  const { onTryAutoSignup } = props;

  useEffect(() => {
    onTryAutoSignup();
  }, [onTryAutoSignup]);

  let routes = (
    <Switch>
      <Route path='/login' render={props => <Auth {...props} />} />
      <Route path='/' exact component={Home} />
      <Redirect to='/' />
    </Switch>
  );

  if (props.isAuthenticated) {
    routes = (
      <Switch>
        <Route path='/logout' component={Logout} />
        <Route path='/login' render={props => <Auth {...props} />} />
        <Route path='/banks' render={props => <Banks {...props} />} />
        <Route path='/' exact component={Home} />
        <Redirect to='/' />
      </Switch>
    );
  }

  return (
    <div>
      <Layout>
        <Suspense fallback={<p>Loading...</p>}>{routes}</Suspense>
      </Layout>
    </div>
  );
};

const mapStateToProps = state => {
  return {
    isAuthenticated: state.auth.token !== null
  };
};

const mapDispatchToProps = dispatch => {
  return {
    onTryAutoSignup: () => dispatch(actions.authCheckState())
  };
};

export default withRouter(
  connect(
    mapStateToProps,
    mapDispatchToProps
  )(App)
);

Это мое действие authCheckState

export const authCheckState = () => {
  return dispatch => {
    const token = localStorage.getItem('token')
    const refreshToken = localStorage.getItem('refreshToken')
    if (!token && !refreshToken) {
      dispatch(logout())
    } else {
      const expirationDate = new Date(localStorage.getItem('expirationDate'))
      if (expirationDate <= new Date() && !refreshToken) {
        dispatch(refreshAuth(refreshToken))
      } else {
        dispatch(authSuccess(token, refreshToken))
      }   
    }
  }
}