48 lines
1.7 KiB
TypeScript
48 lines
1.7 KiB
TypeScript
import React from 'react';
|
|
import logo from '../resources/logo.svg';
|
|
import { useSelector } from 'react-redux';
|
|
import { RootState } from '../store/reducers/root';
|
|
import { Config } from '../config';
|
|
|
|
export function Navbar() {
|
|
const isAuthenticated = useSelector<RootState>(state => state.auth.isAuthenticated);
|
|
|
|
return (
|
|
<nav className="navbar" role="navigation" aria-label="main navigation">
|
|
<div className="container is-fluid">
|
|
<div className="navbar-brand">
|
|
<a className="navbar-item" href="#/">
|
|
<img src={logo} style={{marginRight:'5px',width:'28px',height:'28px'}} />
|
|
<h1 className="is-size-4">Daddy</h1>
|
|
</a>
|
|
<a role="button" className="navbar-burger" aria-label="menu" aria-expanded="false">
|
|
<span aria-hidden="true"></span>
|
|
<span aria-hidden="true"></span>
|
|
<span aria-hidden="true"></span>
|
|
</a>
|
|
</div>
|
|
<div className="navbar-menu">
|
|
<div className="navbar-end">
|
|
<div className="navbar-item">
|
|
{
|
|
isAuthenticated ?
|
|
<a className="button is-small" href={Config.logoutURL}>
|
|
<span className="icon">
|
|
<i className="fas fa-sign-out-alt"></i>
|
|
</span>
|
|
<span>Se déconnecter</span>
|
|
</a> :
|
|
<a className="button is-small" href={Config.loginURL}>
|
|
<span className="icon">
|
|
<i className="fas fa-sign-in-alt"></i>
|
|
</span>
|
|
<span>Se connecter</span>
|
|
</a>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
);
|
|
}; |