PrivateRoute is directing to the same component - reactjs

Question

I have two Private Routes in my application but they keep pointing to the same dashboard component.
App.js
function App() {
return (
<Router>
<AuthProvider>
<Header />
<div>
<Switch>
<Route path="/" exact component={Home}/>
<RegistrationRoute path="/signup" component={SignUp} />
<RegistrationRoute path="/login" component={Login} />
<PrivateRoute path="/user/name" component={DetailForm} exact={true}/>
<PrivateRoute path="/dash" component={Dashboard}/>
</Switch>
</div>
<Footer />
</AuthProvider>
</Router>
);
}
PrivateRoute
import React from 'react'
import { Route, Redirect } from 'react-router-dom';
import { useAuth } from '../contexts/AuthContext';
const PrivateRoute = ({ component: Component, ...rest }) => {
const { isAuth, currentUser, loading } = useAuth();
console.log(rest)
return (
<Route
{...rest}
render={props => {
return isAuth ? <Component {...props} /> : <Redirect to="/login" />
}}/>
)
}
RegistrationRoute
import React from 'react'
import { useAuth } from '../contexts/AuthContext';
import { Route, Redirect } from 'react-router-dom';
const RegistrationRoute = ({ component: Component, ...rest }) => {
const { isAuth } = useAuth();
return (
<Route
{...rest}
render={props => !isAuth ? <Component {...props} /> : <Redirect to="/dash" />}>
</Route>
)
}
My login function pushes to "/dash"
My SignUp function is trying to go to "/user/name"
but I keep getting redirected to /dash
Help me please and thank you <3
EDIT: AuthContext
import React, { useContext, useState, useEffect } from 'react'
import { useHistory } from 'react-router-dom';
import axios from 'axios';
import { login, signup, logout, checkAuth } from '../util/AuthRoutes';
const AuthContext = React.createContext();
export const useAuth = () => {
return useContext(AuthContext);
}
export const AuthProvider = ({ children }) => {
const [isAuth, setIsAuth] = useState();
const [currentUser, setCurrentUser] = useState();
const [loading, setLoading] = useState(false);
const [error, setError] = useState('');
const history = useHistory();
const signUp = async (signUpInfo) => {
const result = await signup(signUpInfo);
if(result.data.auth) {
setCurrentUser(result.data.user);
setIsAuth(true);
history.push("/user/name");
}
}
const logIn = async (loginInfo) => {
setLoading(true);
const result = await login(loginInfo);
console.log(result);
if(result.data.auth) {
setLoading(false);
setCurrentUser(result.data.user);
setIsAuth(true);
history.push("/dash");
}
}
const logOut = () => {
setIsAuth(false);
setLoading(true)
axios.get('http://localhost:4000/logout', { withCredentials: true })
.then(res => {
setLoading(false);
console.log(res);
setCurrentUser(null);
history.push("/");
})
.catch(err => {
console.log(err);
})
}
useEffect(() => {
setLoading(true);
axios.get('http://localhost:4000/checkauth', { withCredentials: true })
.then(res => {
if(res.data.auth){
setCurrentUser(res.data.session.user);
setLoading(false);
setIsAuth(true);
console.log(res);
}
}).catch(err => {
console.log(err);
setLoading(false);
history.push("/")
})
}, [isAuth]);
const value = {
currentUser,
setCurrentUser,
signUp,
logIn,
logOut,
error,
loading,
isAuth
}
return (
<AuthContext.Provider value={value}>
{!loading && children}
</AuthContext.Provider>
)
}
export default AuthContext