1
0
mirror of https://github.com/kremalicious/umami.git synced 2024-12-23 09:46:43 +01:00
umami/components/layout/Header.js
2020-09-09 16:43:37 -07:00

46 lines
1.5 KiB
JavaScript

import React from 'react';
import { FormattedMessage } from 'react-intl';
import { useSelector } from 'react-redux';
import classNames from 'classnames';
import Link from 'components/common/Link';
import UserButton from '../common/UserButton';
import Icon from '../common/Icon';
import Logo from 'assets/logo.svg';
import styles from './Header.module.css';
import LanguageButton from '../common/LanguageButton';
export default function Header() {
const user = useSelector(state => state.user);
return (
<header className="container">
<div className={classNames(styles.header, 'row align-items-center')}>
<div className="col-12 col-md-3">
<div className={styles.title}>
<Icon icon={<Logo />} size="large" className={styles.logo} />
<Link href={user ? '/' : 'https://umami.is'}>umami</Link>
</div>
</div>
<div className="col-12 col-md-9">
<div className={styles.nav}>
{user ? (
<>
<Link href="/dashboard">
<FormattedMessage id="header.nav.dashboard" defaultMessage="Dashboard" />
</Link>
<Link href="/settings">
<FormattedMessage id="header.nav.settings" defaultMessage="Settings" />
</Link>
<LanguageButton menuAlign="right" />
<UserButton />
</>
) : (
<LanguageButton menuAlign="right" />
)}
</div>
</div>
</div>
</header>
);
}