bots-frontend/components/Layout/DesktopLayout/DesktopLayoutHeader.js
2022-11-11 17:03:31 +07:00

62 lines
2.1 KiB
JavaScript

import React, {useState} from 'react';
import {Button, Layout, Menu, Popover, Typography} from "antd";
import {UserOutlined} from "@ant-design/icons";
const {Sider, Header, Content, Footer} = Layout;
const {Paragraph, Text} = Typography;
const DesktopLayoutHeader = (props) => {
const [clicked, setClicked] = useState(false);
return (
<Header className={"flex items-center justify-end"}>
<Popover
autoAdjustOverflow={true}
placement="bottomRight"
content={
<Menu
type={"line"}
inlineIndent={0}
theme="light"
className={"bg-transparent border-r-0"}
mode="inline"
>
<Menu.Item>
<span>Profile</span>
</Menu.Item>
<Menu.Item
onClick={() => {
// store.authentication.logout();
// return history.push("/login");
}}
>
<span>Sign out</span>
</Menu.Item>
</Menu>
}
title={
<Text>
<span className={"font-semibold"}>info@bangun-kreatif.com</span>
<Paragraph type={"secondary-dark"}>
Administrator
</Paragraph>
</Text>
}
trigger="click"
visible={clicked}
onVisibleChange={() => setClicked(!clicked)}
>
<Button
size={"default"}
style={{}}
icon={
<UserOutlined className={"text-sm"}/>
}
/>
</Popover>
</Header>
);
};
export default DesktopLayoutHeader;