import {MenuProps, Modal} from 'antd';
import {LogoutOutlined} from '@ant-design/icons';
import {useStore} from 'zustand';
import {userStore} from '@stores';
import {useNavigate} from 'react-router-dom';
import {LOGIN_PATH} from '@routes';

export const items: MenuProps['items'] = [
  {key: 'logout', icon: <LogoutOutlined />, label: '退出登录'},
];

export function useLogout() {
  const logout = useStore(userStore, state => state.logout);
  const navigate = useNavigate();

  function onClick({key}: {key: string}) {
    if (key === 'logout')
      Modal.confirm({
        title: '退出登录',
        content: '你确定要退出登录吗？',
        okText: '确定',
        cancelText: '取消',
        onOk() {
          logout();
          navigate(LOGIN_PATH);
        },
      });
  }

  return onClick;
}
