diff --git a/src/components/AuthUser/Dashboard/HomePage/NavBarLogin.tsx b/src/components/AuthUser/Dashboard/HomePage/NavBarLogin.tsx
index 92d00454f5ddc811637f6353b520f89db0cbcebe..b81244dc57a0854d76edbd50dd069e58e6286f93 100644
--- a/src/components/AuthUser/Dashboard/HomePage/NavBarLogin.tsx
+++ b/src/components/AuthUser/Dashboard/HomePage/NavBarLogin.tsx
@@ -3,6 +3,9 @@ import { makeStyles } from '@material-ui/core/styles';
 import { Tabs, Tab } from '@material-ui/core';
 import LockIcon from '@material-ui/icons/Lock';
 
+import { Link, useHistory } from 'react-router-dom';
+import { NonAuthRoutes } from 'api/routes';
+
 const useStyles = makeStyles(() => ({
   tabs: {
     color: 'white',
@@ -26,15 +29,19 @@ const useStyles = makeStyles(() => ({
 }));
 
 export const NavBarLogin: FC = () => {
+  const history = useHistory();
+
   const classes = useStyles();
 
-  const [value, setValue] = React.useState(0);
+  const [value, setValue] = React.useState('');
 
   const handleChange = (
     event: React.ChangeEvent<unknown>,
-    newValue: number,
+    newValue: string,
   ): void => {
     setValue(newValue);
+    history.replace(newValue);
+    console.log(newValue);
   };
 
   return (
@@ -45,8 +52,8 @@ export const NavBarLogin: FC = () => {
       className={classes.tabs}
       TabIndicatorProps={{ style: { display: 'none' } }}
     >
-      <Tab label="" className={classes.tabPan} />
       <Tab
+        value={`/auth${NonAuthRoutes.signIn}`}
         label="Login"
         icon={<LockIcon className={classes.tabIcon} />}
         className={`${classes.tabPan} ${classes.rightAlign}`}