From 3d5f239e4e84d5c8a9e15d389b35ac6ce2ad4eac Mon Sep 17 00:00:00 2001 From: JimmFly Date: Fri, 6 Jan 2023 15:00:42 +0800 Subject: [PATCH] feat: add language switch --- .../src/components/workspace-modal/index.tsx | 2 + .../workspace-modal/languageMenu.tsx | 95 +++++++++++++++++++ .../src/components/workspace-modal/styles.ts | 20 ++++ packages/app/src/libs/i18n/resources/bn.json | 23 +---- packages/app/src/libs/i18n/resources/fr.json | 30 +----- packages/app/src/libs/i18n/resources/sr.json | 28 +----- .../app/src/libs/i18n/resources/zh-Hans.json | 88 ++++++++++++----- .../app/src/libs/i18n/resources/zh-Hant.json | 30 +----- packages/app/src/ui/confirm/Confirm.tsx | 2 +- 9 files changed, 184 insertions(+), 134 deletions(-) create mode 100644 packages/app/src/components/workspace-modal/languageMenu.tsx diff --git a/packages/app/src/components/workspace-modal/index.tsx b/packages/app/src/components/workspace-modal/index.tsx index 81293efdbc..b86cb67ad6 100644 --- a/packages/app/src/components/workspace-modal/index.tsx +++ b/packages/app/src/components/workspace-modal/index.tsx @@ -2,6 +2,7 @@ import { styled } from '@/styles'; import { Modal, ModalWrapper, ModalCloseButton } from '@/ui/modal'; import { Button } from '@/ui/button'; import { useEffect, useState } from 'react'; +import { LanguageMenu } from './languageMenu'; import { getWorkspaces, Workspace, @@ -56,6 +57,7 @@ export const WorkspaceModal = ({ open, onClose }: LoginModalProps) => { >
My Workspaces + { + const { i18n } = useTranslation(); + const changeLanguage = (event: string) => { + i18n.changeLanguage(event); + }; + const [show, setShow] = useState(false); + const currentLanguage = LOCALES.find(item => item.tag === i18n.language); + const [languageName, setLanguageName] = useState( + currentLanguage?.originalName + ); + return ( + + {LOCALES.map(option => { + return ( + { + changeLanguage(option.tag); + setShow(false); + setLanguageName(option.originalName); + }} + > + {option.originalName} + + ); + })} + + } + open={show} + > + { + setShow(!show); + }} + > + + {languageName} + + + + + ); +}; + +const StyledContainer = styled('div')(() => ({ + display: 'flex', + flexDirection: 'row', + justifyContent: 'center', + alignItems: 'center', +})); + +const StyledText = styled('span')(({ theme }) => ({ + marginRight: '4px', + marginLeft: '16px', + fontSize: theme.font.sm, + fontWeight: '500', + textTransform: 'capitalize', +})); +const StyledTooltip = styled(({ className, ...props }: TooltipProps) => ( + +))(({ theme }) => ({ + zIndex: theme.zIndex.modal, + '& .MuiTooltip-tooltip': { + backgroundColor: theme.colors.popoverBackground, + boxShadow: theme.shadow.modal, + color: theme.colors.popoverColor, + }, +})); + +const ListItem = styled(Button)(({ theme }) => ({ + display: 'block', + width: '100%', + color: theme.colors.popoverColor, + fontSize: theme.font.sm, + textTransform: 'capitalize', +})); + +const StyledTitleButton = styled(Button)(({ theme }) => ({ + position: 'absolute', + right: '50px', + color: theme.colors.popoverColor, + fontSize: theme.font.sm, +})); diff --git a/packages/app/src/components/workspace-modal/styles.ts b/packages/app/src/components/workspace-modal/styles.ts index 40a8bcc375..a54b191fce 100644 --- a/packages/app/src/components/workspace-modal/styles.ts +++ b/packages/app/src/components/workspace-modal/styles.ts @@ -1,4 +1,7 @@ import { displayFlex, styled } from '@/styles'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import Select from '@mui/material/Select'; export const StyledTitle = styled.div(() => { return { @@ -36,3 +39,20 @@ export const StyledButton = styled.div(({ theme }) => { ...displayFlex('center', 'center'), }; }); +export const StyledFormControl = styled(FormControl)(({ theme }) => { + return { + position: 'absolute', + minWidth: '100px', + right: '50px', + backgroundColor: theme.colors.popoverBackground, + }; +}); +export const StyledSelect = styled(Select)(({ theme }) => { + return { + backgroundColor: theme.colors.popoverBackground, + color: theme.colors.popoverColor, + }; +}); +export const StyledMenuItem = styled(MenuItem)(() => { + return {}; +}); diff --git a/packages/app/src/libs/i18n/resources/bn.json b/packages/app/src/libs/i18n/resources/bn.json index 5eb50f8cdf..0967ef424b 100644 --- a/packages/app/src/libs/i18n/resources/bn.json +++ b/packages/app/src/libs/i18n/resources/bn.json @@ -1,22 +1 @@ -{ - "// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.": "", - "Add A Below Block": "নীচে একটি ব্লক যোগ করুন", - "WarningTips": { - "IsNotfsApiSupported": "অ্যাফাইন ডেমোতে স্বাগতম। পরিবর্তনগুলি সংরক্ষণ করা শুরু করতে আপনি Chrome/Edge এর মতো ক্রোমিয়াম ভিত্তিক ব্রাউজারের সর্বশেষ সংস্করণের মাধ্যমে ডিস্কে ডেটা সিঙ্ক করতে পারেন", - "DoNotStore": "অ্যাফাইন সক্রিয় ডেভেলপমেন্ট এর অধীনে এবং বর্তমান সংস্করণটি অস্থিতিশীল। দয়া করে কোন তথ্য বা ডেটা সঞ্চয় করবেন না" - }, - "Language": "ভাষা", - "Settings": "সেটিংস", - "Share": "শেয়ার করুন", - "Comment": "মন্তব্য", - "Delete": "মুছে ফেলুন", - "Copy Page Link": "পেজ লিংক কপি করুন", - "Duplicate Page": "সদৃশ পৃষ্ঠা তৈরি করুন", - "Logout": "লগআউট", - "Divide Here As A New Group": "একটি নতুন গ্রুপ হিসেবে বিভক্ত করুন", - "ComingSoon": "লেআউট সেটিংস শীঘ্রই আসছে...", - "Clear Workspace": "ওয়ার্কস্পেস পরিষ্কার করুন", - "Layout": "লেআউট", - "Turn into": "রূপান্তর করুন", - "Sync to Disk": "ডিস্ক এ সিঙ্ক করুন" -} +{} diff --git a/packages/app/src/libs/i18n/resources/fr.json b/packages/app/src/libs/i18n/resources/fr.json index d30fdcb133..0967ef424b 100644 --- a/packages/app/src/libs/i18n/resources/fr.json +++ b/packages/app/src/libs/i18n/resources/fr.json @@ -1,29 +1 @@ -{ - "// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.": "", - "ComingSoon": "Bientôt disponible", - "Duplicate Page": "Dupliquer la page", - "Copy Page Link": "Copier le lien de la page", - "Delete": "Supprimer", - "Comment": "Commentaire", - "Export As HTML": "Exporter en HTML", - "Export As Markdown": "Exporter en Markdown", - "Export As PDF (Unsupported)": "exporter en PDF (non supporté)", - "Logout": "Déconnexion", - "Export Workspace": "Exporter l'espace de travail", - "Import Workspace": "Importer l'espace de travail", - "Language": "Langue", - "Last edited by": "Dernière édition par {{name}}", - "Layout": "Mise en forme", - "Settings": "Réglages", - "Share": "Partager", - "Sync to Disk": "Synchroniser sur le disque", - "Turn into": "Transformer en", - "WarningTips": { - "DoNotStore": "Affine est en développement actif ; la version actuelle est INSTABLE. Veuillez NE PAS stocker d'informations ou de données", - "IsNotLocalWorkspace": "Bienvenue sur la démo d'AFFiNE. Pour commencer à sauvegarder vos modifications, vous pouvez SYNCHRONISER SUR LE DISQUE", - "IsNotfsApiSupported": "Bienvenue sur la démo d'AFFiNE. Pour commencer à sauvegarder vos modifications, vous pouvez SYNCHRONISER SUR LE DISQUE\navec la dernière version d'un navigateur basé sur Chromium tel que Chrome ou Edge." - }, - "Add A Below Block": "Ajouter un bloc en-dessous", - "Divide Here As A New Group": "Séparer ici en un nouveau groupe", - "Clear Workspace": "Vider l'espace de travail" -} +{} diff --git a/packages/app/src/libs/i18n/resources/sr.json b/packages/app/src/libs/i18n/resources/sr.json index edc6c32f2c..0967ef424b 100644 --- a/packages/app/src/libs/i18n/resources/sr.json +++ b/packages/app/src/libs/i18n/resources/sr.json @@ -1,27 +1 @@ -{ - "// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.": "", - "Clear Workspace": "Očisti radni prostor", - "ComingSoon": "Podešavanja za izgled dolaze", - "Comment": "Komentar", - "Copy Page Link": "Kopiraj link stranice", - "Delete": "Obriši", - "Duplicate Page": "Dupliraj stranicu", - "Export As HTML": "Izvezi kao HTML", - "Export As Markdown": "Izvezi kao Markdown", - "Export As PDF (Unsupported)": "Izvezi kao PDF (nepodržano)", - "Export Workspace": "Izvezi radnu površinu", - "Import Workspace": "Poboljšaj radnu površinu", - "Language": "Jezik", - "Last edited by": "Zadnju promenu uradio {{ime}}", - "Layout": "Izgled", - "Logout": "Odjava", - "Settings": "Podešavanja", - "Share": "Podeli", - "Sync to Disk": "Sinhroniziraj sa diskom", - "Turn into": "Promeni u", - "WarningTips": { - "DoNotStore": "AFFiNE je u stanju aktivnog razvoja i trenutna verzija je NESTABILNA. Molimo vas, NEMOJTE čuvati informacije ili podatke.", - "IsNotLocalWorkspace": "Dobrodošli u AFFiNE demo. Da bi započeli proces čuvanja promena možete kliknuti SINHRONIZUJ SA DISKOM.", - "IsNotfsApiSupported": "Dobrodošli u AFFiNE demo. Da bi započeli proces čuvanja promena možete SINHRONIZOVATI NA DISK sa poslednjom verzijom pretraživača tipa Chromium, kao što su Chrome/Edge." - } -} +{} diff --git a/packages/app/src/libs/i18n/resources/zh-Hans.json b/packages/app/src/libs/i18n/resources/zh-Hans.json index 14786dcb7e..47095233d9 100644 --- a/packages/app/src/libs/i18n/resources/zh-Hans.json +++ b/packages/app/src/libs/i18n/resources/zh-Hans.json @@ -1,29 +1,65 @@ { - "// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.": "", - "Sync to Disk": "同步到磁盘", - "Share": "分享", - "WarningTips": { - "IsNotfsApiSupported": "欢迎来到AFFiNE 的演示界面。您可以使用最新版本的基于Chrome的浏览器（如Chrome/Edge）将数据同步到磁盘来进行保存", - "IsNotLocalWorkspace": "欢迎来到AFFiNE 的演示界面，您可以同步到磁盘来进行保存操作。", - "DoNotStore": "AFFiNE 正在积极开发中，当前版本不稳定。请不要存储信息或数据。" - }, - "ComingSoon": "布局设置即将到来", - "Layout": "布局", - "Comment": "评论", - "Settings": "设置", - "Duplicate Page": "复制页面", - "Copy Page Link": "复制页面链接", - "Language": "当前语言", - "Clear Workspace": "清空工作区域", - "Export As Markdown": "导出 markdown", - "Export As HTML": "导出 HTML", - "Export As PDF (Unsupported)": "导出 PDF (暂不支持)", - "Import Workspace": "导入 Workspace", - "Export Workspace": "导出 Workspace", - "Last edited by": "最后编辑者为 {{name}}", - "Logout": "退出登录", + "Quick search": "快速搜索", + "All pages": "全部页面", + "Favourites": "收藏夹", + "No item": "没有项目", + "Import": "导入", + "Trash": "回收站", + "New Page": "新建文章", + "New Keyword Page": "新建 '{{query}}' 为标题的文章", + "Find 0 result": "找到 0 个结果", + "Find results": "找到 {{number}} 个结果", + "Collapse sidebar": "关闭侧边栏", + "Expand sidebar": "展开侧边栏", + "Removed from Favourites": "已从收藏中移除", + "Remove from favourites": "从收藏中移除", + "Added to Favourites": "已添加到收藏", + "Add to favourites": "添加到收藏", + "Paper": "文章", + "Edgeless": "无边模式", + "Switch to": "跳转到", + "Convert to ": "转换成 ", + "Page": "文章", + "Export": "导出", + "Export to HTML": "导出到 HTML", + "Export to Markdown": "导出到 Markdown", "Delete": "删除", - "Turn into": "转换为", - "Add A Below Block": "在下方添加一个新块", - "Divide Here As A New Group": "从这里划分一个新组" + "Title": "标题", + "Untitled": "无标题", + "Created": "创建时间", + "Updated": "更新时间", + "Open in new tab": "在新页面打开", + "Favourite": "收藏", + "Favourited": "已收藏", + "Delete page?": "删除文章?", + "Delete permanently?": "永久删除?", + "will be moved to Trash": "{{title}} 将被移动到回收站", + "Once deleted, you can't undo this action.": "一次性删除，无法恢复。", + "Moved to Trash": "已移动到回收站", + "Permanently deleted": "已永久删除", + "restored": "{{title}} 已恢复", + "Cancel": "取消", + "Keyboard Shortcuts": "快捷键", + "Contact Us": "联系我们", + "Official Website": "官网", + "Get in touch!": "Get in touch!", + "AFFiNE Community": "AFFiNE Community", + "How is AFFiNE Alpha different?": "How is AFFiNE Alpha different?", + "Shortcuts": "Shortcuts", + "Undo": "Undo", + "Redo": "Redo", + "Bold": "Bold", + "Italic": "Italic", + "Underline": "Underline", + "Strikethrough": "Strikethrough", + "Inline code": "Inline code", + "Code block": "Code block", + "Link": "Link", + "Body text": "Body text", + "Heading": "Heading {{number}}", + "Increase indent": "Increase indent", + "Reduce indent": "Reduce indent", + "Markdown Syntax": "Markdown Syntax", + "Divider": "Divider", + "404 - Page Not Found": "404 - Page Not Found" } diff --git a/packages/app/src/libs/i18n/resources/zh-Hant.json b/packages/app/src/libs/i18n/resources/zh-Hant.json index 4d0f28c9cd..0967ef424b 100644 --- a/packages/app/src/libs/i18n/resources/zh-Hant.json +++ b/packages/app/src/libs/i18n/resources/zh-Hant.json @@ -1,29 +1 @@ -{ - "// THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.": "", - "Add A Below Block": "在下方新添塊", - "Clear Workspace": "清空工作區", - "ComingSoon": "自定義佈局功能即將與您見面", - "Comment": "評論", - "Copy Page Link": "拷貝頁面鏈接", - "Delete": "刪除", - "Divide Here As A New Group": "從此地劃分成新組", - "Duplicate Page": "複製界面", - "Export As HTML": "導出 HTML", - "Export As Markdown": "以 Markdown 導出", - "Export As PDF (Unsupported)": "導出為 PDF（即將可用）", - "Export Workspace": "導出 Workspace", - "Import Workspace": "導入 Workspace", - "Language": "語言", - "Last edited by": "最後編輯者為 {{name}}", - "Layout": "佈局", - "Logout": "退出登錄", - "Settings": "設置", - "Share": "分享", - "Sync to Disk": "同步到磁盤", - "Turn into": "轉換為", - "WarningTips": { - "DoNotStore": "我們正在積極開發 AFFiNE，目前版本尚不穩定，請避免存儲信息或數據。", - "IsNotLocalWorkspace": "歡迎來到 AFFiNE 演示界面。您可以通過「同步到磁盤」來保存更改。", - "IsNotfsApiSupported": "歡迎進入AFFiNE演示！使用最新版本的基於 Chromium 內核的瀏覽器如Chrome/Edge，您可以通過「同步到磁盤」來保存更改" - } -} +{} diff --git a/packages/app/src/ui/confirm/Confirm.tsx b/packages/app/src/ui/confirm/Confirm.tsx index 872a43624e..dee4953812 100644 --- a/packages/app/src/ui/confirm/Confirm.tsx +++ b/packages/app/src/ui/confirm/Confirm.tsx @@ -52,7 +52,7 @@ export const Confirm = ({ }} style={{ marginRight: '24px' }} > - {cancelText} + {cancelText === 'Cancel' ? t('Cancel') : cancelText}