|
|
|
@@ -1,6 +1,5 @@ |
|
|
|
import { ReactComponent as TranslationIcon } from '@/assets/svg/translation.svg'; |
|
|
|
import { useTranslate } from '@/hooks/commonHooks'; |
|
|
|
import { GithubOutlined } from '@ant-design/icons'; |
|
|
|
import { DownOutlined, GithubOutlined } from '@ant-design/icons'; |
|
|
|
import { Dropdown, MenuProps, Space } from 'antd'; |
|
|
|
import camelCase from 'lodash/camelCase'; |
|
|
|
import React from 'react'; |
|
|
|
@@ -8,6 +7,7 @@ import User from '../user'; |
|
|
|
|
|
|
|
import { LanguageList } from '@/constants/common'; |
|
|
|
import { useChangeLanguage } from '@/hooks/logicHooks'; |
|
|
|
import { useSelector } from 'umi'; |
|
|
|
import styled from './index.less'; |
|
|
|
|
|
|
|
const Circle = ({ children, ...restProps }: React.PropsWithChildren) => { |
|
|
|
@@ -25,6 +25,7 @@ const handleGithubCLick = () => { |
|
|
|
const RightToolBar = () => { |
|
|
|
const { t } = useTranslate('common'); |
|
|
|
const changeLanguage = useChangeLanguage(); |
|
|
|
const { language = '' } = useSelector((state) => state.settingModel.userInfo); |
|
|
|
|
|
|
|
const handleItemClick: MenuProps['onClick'] = ({ key }) => { |
|
|
|
changeLanguage(key); |
|
|
|
@@ -40,14 +41,15 @@ const RightToolBar = () => { |
|
|
|
return ( |
|
|
|
<div className={styled.toolbarWrapper}> |
|
|
|
<Space wrap size={16}> |
|
|
|
<Dropdown menu={{ items, onClick: handleItemClick }} placement="bottom"> |
|
|
|
<Space className={styled.language}> |
|
|
|
<b>{t(camelCase(language))}</b> |
|
|
|
<DownOutlined /> |
|
|
|
</Space> |
|
|
|
</Dropdown> |
|
|
|
<Circle> |
|
|
|
<GithubOutlined onClick={handleGithubCLick} /> |
|
|
|
</Circle> |
|
|
|
<Dropdown menu={{ items, onClick: handleItemClick }} placement="bottom"> |
|
|
|
<Circle> |
|
|
|
<TranslationIcon /> |
|
|
|
</Circle> |
|
|
|
</Dropdown> |
|
|
|
{/* <Circle> |
|
|
|
<MonIcon /> |
|
|
|
</Circle> */} |