React redux store's state not saved - reactjs

Question

I created a store with redux to experiment with the app state management in react. So far I'm just trying to make a fake authentication behavior when clicking on the "sign in" button on the login page, which is working because my isLogged state change to true. But then when I try to access a path that I protected by checking if isLogged is true, I get false... why is the state of isLogged not saved when routing with react-router_dom?
index.js
const store = createStore(
allReducers,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
ReactDOM.render(
<React.StrictMode>
<Provider store={store}>
<App/>
</Provider>
</React.StrictMode>,
document.getElementById('root')
);
App.js
class App extends Component {
render() {
return (
<Box style={{width: "99.6vw", height: "95.6vh"}}>
<Router>
<SideNavBar/>
<Switch>
<Route exact path={"/"} render={() => <Redirect to={"/login"}/>}/>
<Route path={"/login"} component={LoginPage}/>
<ProtectedRoute path={"/somepage"} component={somePage}/>
</Switch>
</Router>
</Box>
);
}
}
LoginPage.js
class LoginPage extends Component {
render() {
const {dispatch} = this.props;
return (
<LoginPageContainer>
<img src={logo} alt={""} height={"350rem"}/>
<FilledInput placeholder={"Login or email"}/>
<FilledInput placeholder={"Password"}/>
<Button onClick={() => dispatch({ type: "SIGN_IN" })}>
Sign in
</Button>
</LoginPageContainer>
);
}
}
export default connect(null, null)(LoginPage);
ProtectedRoute.js
import {connectProtectedRoute as connect} from "../redux/connectProtectedRoute";
class ProtectedRoute extends Component {
render() {
const {isLogged, component} = this.props;
return (
<Route render={
() => {
if (isLogged)
return (component);
else
return (<Redirect to={"/login"}/>);
}
}/>
);
}
}
ProtectedRoute.propTypes = {
component: PropTypes.elementType.isRequired
};
export default connect(ProtectedRoute);
connectProtectedRoute.js
import {connect} from "react-redux";
function mapStateToProps(state) {
return ({
isLogged: state.isLogged
});
}
export const connectProtectedRoute = connect(mapStateToProps, null);
reducers.js
const allReducers = combineReducers({
isLogged: isLoggedReducer
});
export default allReducers;
isLoggedReducer.js
const isLoggedReducer = (state = false, action) => {
switch (action.type) {
case "SIGN_IN": return true;
case "SIGN_OUT": return false;
default: return state;
}
}
export default isLoggedReducer;

Answer 1

So I was just unaware of the losing state fact upon refresh. Comment from original post said it all, here they are for anyone ending here:
Modifying the URL manually (outside of react router) will cause a full page refresh and all state will be lost (unless you persist it in local storage or by some other method). This is your problem, nothing in the code looks wrong. – Brian Thompson
Modifying the url causes the page refresh and follows the rerunning the app, so all data in store are removed. Try to use history for page navigation. Here is how to use it. reacttraining.com/react-router/web/api/Hooks/usehistory – TopWebGhost