feat: complete router navigation

5 files changed, 16 insertions, 16 deletions

diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
index a6c54b0..17e377a 100644
--- a/src/pages/HomePage/HomePage.tsx
+++ b/src/pages/HomePage/HomePage.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
 import {
   Typography,
   Divider,
@@ -12,7 +13,6 @@ import TrendingUpIcon from '@material-ui/icons/TrendingUp';
 import { Rating } from '@material-ui/lab';
 import { Feedback } from 'which-types';
 
-import { useNavigate } from '../../hooks/useNavigate';
 import { useAuth } from '../../hooks/useAuth';
 import { get } from '../../requests';
 import ReviewCard from '../../components/ReviewCard/ReviewCard';
@@ -43,7 +43,7 @@ const useStyles = makeStyles(theme => ({
 const HomePage: React.FC = () => {
   const [feedbacks, setFeedbacks] = useState<Feedback[]>([]);
   const classes = useStyles();
-  const { navigate } = useNavigate();
+  const history = useHistory();
   const { isAuthenticated, user } = useAuth();
   const theme = useTheme();
   const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
@@ -60,11 +60,11 @@ const HomePage: React.FC = () => {
   }, []);
 
   const handleLetsGo = () => {
-    navigate('feed');
+    history.push('/feed');
   };
 
   const handleSignUp = () => {
-    navigate('auth');
+    history.push('/registration');
   };
 
   const GithubLink = <Link href="https://github.com/which-ecosystem">GitHub</Link>;
diff --git a/src/pages/HomePage/ReviewForm.tsx b/src/pages/HomePage/ReviewForm.tsx
index 248e36e..b626ce2 100644
--- a/src/pages/HomePage/ReviewForm.tsx
+++ b/src/pages/HomePage/ReviewForm.tsx
@@ -1,11 +1,11 @@
 import React, { useState } from 'react';
+import { useHistory } from 'react-router-dom';
 import { makeStyles } from '@material-ui/core/styles';
 import { TextField, Button } from '@material-ui/core';
 import { Rating } from '@material-ui/lab';
 import { useSnackbar } from 'notistack';
 
 import { post } from '../../requests';
-import { useNavigate } from '../../hooks/useNavigate';
 
 const version = 'v1.0.0';
 
@@ -23,7 +23,7 @@ const ReviewForm: React.FC = () => {
   const [contents, setContents] = useState<string>('');
   const [score, setScore] = useState<number>(0);
   const classes = useStyles();
-  const { navigate } = useNavigate();
+  const history = useHistory();
   const { enqueueSnackbar } = useSnackbar();
 
   const handleSubmit = (): void => {
@@ -32,7 +32,7 @@ const ReviewForm: React.FC = () => {
         enqueueSnackbar('Your feedback has been submitted!', {
           variant: 'success'
         });
-        navigate('feed');
+        history.push('/feed');
       });
     }
   };
diff --git a/src/pages/LoginPage/LoginPage.tsx b/src/pages/LoginPage/LoginPage.tsx
index ef31491..367ed6b 100644
--- a/src/pages/LoginPage/LoginPage.tsx
+++ b/src/pages/LoginPage/LoginPage.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
 import { makeStyles } from '@material-ui/core/styles';
 import {
   TextField,
@@ -7,7 +8,6 @@ import {
   Switch
 } from '@material-ui/core';
 import { useAuth } from '../../hooks/useAuth';
-import { useNavigate } from '../../hooks/useNavigate';
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -33,7 +33,7 @@ const LoginPage: React.FC = () => {
   const nameRef = useRef<HTMLInputElement>();
   const passwordRef = useRef<HTMLInputElement>();
   const { login } = useAuth();
-  const { navigate } = useNavigate();
+  const history = useHistory();
 
   const handleCheck = () => {
     setRemember(!remember);
@@ -44,7 +44,7 @@ const LoginPage: React.FC = () => {
     const password = passwordRef.current?.value;
     if (name && password) {
       login(name, password, remember).then(success => {
-        if (success) navigate('profile');
+        if (success) history.push(`/profile/${login}`);
         else setError(true);
       });
     }
diff --git a/src/pages/ProfilePage/MoreMenu.tsx b/src/pages/ProfilePage/MoreMenu.tsx
index 4e681f5..1f41879 100644
--- a/src/pages/ProfilePage/MoreMenu.tsx
+++ b/src/pages/ProfilePage/MoreMenu.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
+import { useHistory } from 'react-router-dom';
 import IconButton from '@material-ui/core/IconButton';
 import Menu from '@material-ui/core/Menu';
 import MenuItem from '@material-ui/core/MenuItem';
 import MoreHorizIcon from '@material-ui/icons/MoreHoriz';
 import { makeStyles } from '@material-ui/core';
 import { useAuth } from '../../hooks/useAuth';
-import { useNavigate } from '../../hooks/useNavigate';
 
 const ITEM_HEIGHT = 48;
 
@@ -21,7 +21,7 @@ const MoreMenu: React.FC = () => {
   const classes = useStyles();
   const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);
   const { logout } = useAuth();
-  const { navigate } = useNavigate();
+  const history = useHistory();
 
   const open = Boolean(anchorEl);
 
@@ -31,7 +31,7 @@ const MoreMenu: React.FC = () => {
 
   const handleLogout = () => {
     logout();
-    navigate('auth');
+    history.push('/login');
   };
 
   const handleClose = () => {
diff --git a/src/pages/RegistrationPage/RegistrationPage.tsx b/src/pages/RegistrationPage/RegistrationPage.tsx
index e283a0e..9e081ca 100644
--- a/src/pages/RegistrationPage/RegistrationPage.tsx
+++ b/src/pages/RegistrationPage/RegistrationPage.tsx
@@ -1,10 +1,10 @@
 import React, { useState, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
 import { makeStyles } from '@material-ui/core/styles';
 import TextField from '@material-ui/core/TextField';
 import Button from '@material-ui/core/Button';
 import { post } from '../../requests';
 import { useAuth } from '../../hooks/useAuth';
-import { useNavigate } from '../../hooks/useNavigate';
 
 
 const useStyles = makeStyles(theme => ({
@@ -31,7 +31,7 @@ const RegistrationPage: React.FC = () => {
   const emailRef = useRef<HTMLInputElement>();
   const passwordRef = useRef<HTMLInputElement>();
   const { login } = useAuth();
-  const { navigate } = useNavigate();
+  const history = useHistory();
 
   const onClick = () => {
     const username = usernameRef.current?.value;
@@ -40,7 +40,7 @@ const RegistrationPage: React.FC = () => {
     if (username && password) {
       post('/users', { username, password, email })
         .then(() => login(username, password))
-        .then(() => navigate('profile'));
+        .then(() => history.push(`/profile/${username}`));
     } else setError(true);
   };