2020-07-24 04:56:55 +02:00
|
|
|
import React from 'react';
|
2020-08-05 07:45:05 +02:00
|
|
|
import { useSelector } from 'react-redux';
|
|
|
|
import classNames from 'classnames';
|
2020-08-08 05:36:57 +02:00
|
|
|
import Link from 'components/common/Link';
|
|
|
|
import UserButton from '../common/UserButton';
|
|
|
|
import Icon from '../common/Icon';
|
2020-08-07 07:03:02 +02:00
|
|
|
import Logo from 'assets/logo.svg';
|
2020-08-05 07:45:05 +02:00
|
|
|
import styles from './Header.module.css';
|
2020-07-24 04:56:55 +02:00
|
|
|
|
|
|
|
export default function Header() {
|
2020-08-05 07:45:05 +02:00
|
|
|
const user = useSelector(state => state.user);
|
|
|
|
|
2020-07-24 04:56:55 +02:00
|
|
|
return (
|
2020-08-15 10:17:15 +02:00
|
|
|
<header className="container">
|
|
|
|
<div className={classNames(styles.header, 'row align-items-center')}>
|
2020-08-05 07:45:05 +02:00
|
|
|
<div className="col">
|
2020-08-07 07:03:02 +02:00
|
|
|
<div className={styles.title}>
|
2020-08-09 08:48:43 +02:00
|
|
|
<Icon icon={<Logo />} size="large" className={styles.logo} />
|
2020-08-07 07:03:02 +02:00
|
|
|
{user ? <Link href="/">umami</Link> : 'umami'}
|
|
|
|
</div>
|
2020-08-05 07:45:05 +02:00
|
|
|
</div>
|
|
|
|
{user && (
|
|
|
|
<div className="col">
|
|
|
|
<div className={styles.nav}>
|
2020-08-06 08:03:07 +02:00
|
|
|
<Link href="/dashboard">Dashboard</Link>
|
2020-08-05 07:45:05 +02:00
|
|
|
<Link href="/settings">Settings</Link>
|
2020-08-06 08:03:07 +02:00
|
|
|
<UserButton />
|
2020-08-05 07:45:05 +02:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
2020-07-24 04:56:55 +02:00
|
|
|
</header>
|
|
|
|
);
|
|
|
|
}
|