122 lines
4.0 KiB
JavaScript
122 lines
4.0 KiB
JavaScript
import { Avatar, Col, Icon, Menu, Row } from "antd";
|
|
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { Link } from "react-router-dom";
|
|
import UserImage from "../../assets/User.svg";
|
|
import { signOutStart } from "../../redux/user/user.actions";
|
|
import ManageSignInButton from "../manage-sign-in-button/manage-sign-in-button.component";
|
|
|
|
export default ({
|
|
landingHeader,
|
|
selectedNavItem,
|
|
logo,
|
|
handleMenuClick,
|
|
currentUser
|
|
}) => {
|
|
const { t } = useTranslation();
|
|
//TODO Add
|
|
return (
|
|
<Row type='flex' justify='space-around' align='middle'>
|
|
{logo ? (
|
|
<Col span={4}>
|
|
<img alt='Shop Logo' src={logo} style={{ height: "40px" }} />
|
|
</Col>
|
|
) : null}
|
|
<Col span={14}>
|
|
<Menu
|
|
theme='dark'
|
|
className='header'
|
|
selectedKeys={selectedNavItem}
|
|
mode='horizontal'
|
|
onClick={handleMenuClick}>
|
|
<Menu.Item key='home'>
|
|
<Link to='/manage'>
|
|
<Icon type='home' />
|
|
{t("menus.header.home")}
|
|
</Link>
|
|
</Menu.Item>
|
|
<Menu.SubMenu title={t("menus.header.jobs")}>
|
|
<Menu.Item key='schedule'>
|
|
<Link to='/manage/schedule'>
|
|
<Icon type='calendar' />
|
|
{t("menus.header.schedule")}
|
|
</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key='activejobs'>
|
|
<Link to='/manage/jobs'>{t("menus.header.activejobs")}</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key='availablejobs'>
|
|
<Link to='/manage/available'>
|
|
{t("menus.header.availablejobs")}
|
|
</Link>
|
|
</Menu.Item>
|
|
</Menu.SubMenu>
|
|
|
|
<Menu.SubMenu title={t("menus.header.customers")}>
|
|
<Menu.Item key='owners'>
|
|
<Link to='/manage/owners'>
|
|
<Icon type='team' />
|
|
{t("menus.header.owners")}
|
|
</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key='vehicles'>
|
|
<Link to='/manage/vehicles'>
|
|
<Icon type='car' />
|
|
{t("menus.header.vehicles")}
|
|
</Link>
|
|
</Menu.Item>
|
|
</Menu.SubMenu>
|
|
<Menu.SubMenu title={t("menus.header.shop")}>
|
|
<Menu.Item key='shop'>
|
|
<Link to='/manage/shop'>{t("menus.header.shop_config")}</Link>
|
|
</Menu.Item>
|
|
<Menu.Item key='shop-vendors'>
|
|
<Link to='/manage/shop/vendors'>
|
|
{t("menus.header.shop_vendors")}
|
|
</Link>
|
|
</Menu.Item>
|
|
</Menu.SubMenu>
|
|
|
|
<Menu.SubMenu
|
|
title={
|
|
<div>
|
|
<Avatar
|
|
size='medium'
|
|
alt='Avatar'
|
|
src={currentUser.photoURL ? currentUser.photoURL : UserImage}
|
|
style={{ margin: "10px" }}
|
|
/>
|
|
{currentUser.displayName || t("general.labels.unknown")}
|
|
</div>
|
|
}>
|
|
<Menu.Item onClick={signOutStart()}>
|
|
{t("user.actions.signout")}
|
|
</Menu.Item>
|
|
<Menu.Item>
|
|
<Link to='/manage/profile'>{t("menus.currentuser.profile")}</Link>
|
|
</Menu.Item>
|
|
<Menu.SubMenu
|
|
title={
|
|
<span>
|
|
<Icon type='global' />
|
|
<span>{t("menus.currentuser.languageselector")}</span>
|
|
</span>
|
|
}>
|
|
<Menu.Item actiontype='lang-select' key='en_us'>
|
|
{t("general.languages.english")}
|
|
</Menu.Item>
|
|
<Menu.Item actiontype='lang-select' key='fr'>
|
|
{t("general.languages.french")}
|
|
</Menu.Item>
|
|
<Menu.Item actiontype='lang-select' key='es'>
|
|
{t("general.languages.spanish")}
|
|
</Menu.Item>
|
|
</Menu.SubMenu>
|
|
</Menu.SubMenu>
|
|
</Menu>
|
|
</Col>
|
|
<Col span={4}>{!landingHeader ? null : <ManageSignInButton />}</Col>
|
|
</Row>
|
|
);
|
|
};
|