import { ArrowRightOutlined, LogoutOutlined } from "@ant-design/icons";
import { Button, Popover, Tooltip } from "antd";

export function SignOut() {
  // const { data } = useQuery(["profile"], async () => {
  //   const { data } = await api.get("https://postamates.spatialsystems.ru/api/me/");
  //   return data;
  // });

  return (
    <div className="absolute top-[20px] right-[20px]">
      <Popover
        content={
          <>
            {/* <Title text={data?.username} classNameText={"lowercase"} /> */}
            <Button type="primary" block>
              <span className="mr-1">Выйти</span>
              <ArrowRightOutlined />
            </Button>
          </>
        }
        trigger="click"
        placement={"bottomRight"}
      >
        <Tooltip title="Выйти" placement={"left"}>
          <Button icon={<LogoutOutlined />} type="primary" size="large" />
        </Tooltip>
      </Popover>
    </div>
  );
}
