'use client';
import { AdjustmentsHorizontalIcon, InboxStackIcon } from '@heroicons/react/24/outline';
import classNames from 'classnames';
import type { FC, ReactNode } from 'react';
import { useCallback, useContext } from 'react';
import { DeviceContext } from '@/context/DeviceContext';
import { MenuContext, MenuKey } from '@/context/MenuContext';
import { useDarkMode } from '@/hooks/useDarkMode';
import { sleep } from '@/utils/sleep';
import { LoginButton } from './buttons/LoginButton';
import { MenuEntryButton } from './buttons/MenuEntryButton';
import { History } from './History';
import { Settings } from './Settings';
/**
* 菜单栏
*/
export const Menu = () => {
const { isWeChat } = useContext(DeviceContext)!;
const { isMenuShow } = useContext(MenuContext)!;
useDarkMode();
return (
<>
);
};
/**
* 菜单栏蒙层
*/
const MenuMask: FC<{ children: ReactNode }> = ({ children }) => {
const { windowHeight, isMobile } = useContext(DeviceContext)!;
const { isMenuShow, setIsMenuShow } = useContext(MenuContext)!;
const onTouchMask = useCallback(async () => {
setIsMenuShow(false);
// 由于 transform 的 fixed 定位失效问题，这里需要手动设置和取消 form-container 的 top
await sleep(300);
const formContainer = document.getElementById('form-container');
if (formContainer) {
formContainer.style.top = 'unset';
}
}, [setIsMenuShow]);
return (
<>
);
};
const IconMap = {
[MenuKey.InboxStack]: InboxStackIcon,
[MenuKey.AdjustmentsHorizontal]: AdjustmentsHorizontalIcon,
};
/**
* 菜单栏 tabs
*/
const MenuTabs = () => {
const { currentMenu, setCurrentMenu } = useContext(MenuContext)!;
return (
);
};
/**
* 菜单栏 tabs 内容
*/
const MenuTabsContent = () => {
const { currentMenu } = useContext(MenuContext)!;
return (
{currentMenu === MenuKey.InboxStack && }
{currentMenu === MenuKey.AdjustmentsHorizontal && }
);
};
/**
* 菜单栏底部
*/
const MenuFooter = () => {
return (
);
};