[d8b6c91] | 1 | import {Link, NavLink} from "react-router-dom";
|
---|
| 2 | import "./Header.css"
|
---|
| 3 | import {useDispatch, useSelector} from 'react-redux';
|
---|
| 4 | import {useEffect, useState} from "react";
|
---|
| 5 | import {AuthActions} from "../../redux/actions/authActions";
|
---|
| 6 | import Roles from "../../enumerations/Roles";
|
---|
| 7 |
|
---|
| 8 | export const Header = () => {
|
---|
| 9 |
|
---|
| 10 | const auth = useSelector(state => state.auth.currentUser);
|
---|
| 11 | const dispatch = useDispatch();
|
---|
| 12 |
|
---|
| 13 | const [role, setRole] = useState(null);
|
---|
| 14 | const [username, setUsername] = useState(null);
|
---|
| 15 |
|
---|
| 16 | const signOut = () => {
|
---|
| 17 | dispatch(AuthActions.signOut());
|
---|
| 18 | window.location = "/";
|
---|
| 19 | }
|
---|
| 20 |
|
---|
| 21 | useEffect(() => {
|
---|
| 22 |
|
---|
| 23 | if (auth) {
|
---|
| 24 | setRole(auth.role);
|
---|
| 25 | setUsername(auth.name);
|
---|
| 26 | }
|
---|
| 27 | }, [auth]);
|
---|
| 28 |
|
---|
| 29 | return (
|
---|
| 30 | <nav className="navbar navbar-expand-lg bg-light">
|
---|
| 31 | <div className="container-fluid">
|
---|
| 32 | <Link to="/" className="logo navbar-brand" />
|
---|
| 33 | <Link to="/" className="brand-name navbar-brand" />
|
---|
| 34 | <div className="collapse navbar-collapse" id="navbarSupportedContent">
|
---|
| 35 | <ul className="navbar-nav me-auto mb-2 mb-lg-0">
|
---|
| 36 | <NavLink to="/" className="nav-item nav-link" activeClassName="active">Home</NavLink>
|
---|
| 37 | {role==Roles.JOBSEEKER &&
|
---|
| 38 | <>
|
---|
| 39 | <NavLink to="/applications" className="nav-item nav-link" activeClassName="active">Applications</NavLink>
|
---|
| 40 | <NavLink to="/favoritejobs" className="nav-item nav-link" activeClassName="active">Saved</NavLink>
|
---|
| 41 | </>
|
---|
| 42 |
|
---|
| 43 | }
|
---|
| 44 | {role==Roles.RECRUITER &&
|
---|
| 45 | <>
|
---|
| 46 | <NavLink to="/jobadvertisements" className="nav-item nav-link" activeClassName="active">Job Advertisements</NavLink>
|
---|
| 47 | <NavLink to="/favoritejobs" className="nav-item nav-link" activeClassName="active">Saved</NavLink>
|
---|
| 48 | </>
|
---|
| 49 | }
|
---|
| 50 | <NavLink to="/about" className="nav-item nav-link">About</NavLink>
|
---|
| 51 | <NavLink to="/contact" className="nav-item nav-link">Contact</NavLink>
|
---|
| 52 | </ul>
|
---|
| 53 |
|
---|
| 54 | {auth ?
|
---|
| 55 | <>
|
---|
| 56 | <img src="/images/user.png" width="45" height="45"/>
|
---|
| 57 | <div className="auth-box">
|
---|
| 58 | <p className="user"><b>{username}</b></p>
|
---|
| 59 | <p className="role">{role==Roles.RECRUITER ? "Recruiter" : "Job Seeker"}</p>
|
---|
| 60 | </div>
|
---|
| 61 |
|
---|
| 62 |
|
---|
| 63 | <Link onClick={signOut} className="btn btn-outline-secondary">Log out</Link>
|
---|
| 64 | </> :
|
---|
| 65 | <>
|
---|
| 66 | <Link to="/signin" className="btn btn-outline-secondary">Sign in</Link>
|
---|
| 67 | </>
|
---|
| 68 | }
|
---|
| 69 |
|
---|
| 70 | </div>
|
---|
| 71 | </div>
|
---|
| 72 | </nav>
|
---|
| 73 |
|
---|
| 74 | )
|
---|
| 75 | } |
---|