mirror of
https://github.com/toeverything/AFFiNE.git
synced 2024-09-20 16:07:33 +03:00
feat: add translation
This commit is contained in:
parent
1bc2dcd661
commit
0b61f4a2a0
@ -1,9 +1,10 @@
|
||||
import { NotFoundTitle, PageContainer } from './styles';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const NotfoundPage = () => {
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<PageContainer>
|
||||
<NotFoundTitle>404 - Page Not Found</NotFoundTitle>
|
||||
<NotFoundTitle>{t('404 - Page Not Found')}</NotFoundTitle>
|
||||
</PageContainer>
|
||||
);
|
||||
};
|
||||
|
@ -23,7 +23,7 @@ import {
|
||||
StyledModalFooter,
|
||||
} from './style';
|
||||
import bg from '@/components/contact-modal/bg.png';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
const linkList = [
|
||||
{
|
||||
icon: <GithubIcon />,
|
||||
@ -51,20 +51,6 @@ const linkList = [
|
||||
link: 'https://discord.gg/Arn7TqJBvG',
|
||||
},
|
||||
];
|
||||
const rightLinkList = [
|
||||
{
|
||||
icon: <LogoIcon />,
|
||||
title: 'Official Website ',
|
||||
subTitle: 'AFFiNE.pro',
|
||||
link: 'https://affine.pro',
|
||||
},
|
||||
{
|
||||
icon: <DocIcon />,
|
||||
title: 'AFFiNE Community',
|
||||
subTitle: 'community.affine.pro',
|
||||
link: 'https://community.affine.pro',
|
||||
},
|
||||
];
|
||||
|
||||
type TransitionsModalProps = {
|
||||
open: boolean;
|
||||
@ -72,6 +58,21 @@ type TransitionsModalProps = {
|
||||
};
|
||||
|
||||
export const ContactModal = ({ open, onClose }: TransitionsModalProps) => {
|
||||
const { t } = useTranslation();
|
||||
const rightLinkList = [
|
||||
{
|
||||
icon: <LogoIcon />,
|
||||
title: t('Official Website'),
|
||||
subTitle: 'AFFiNE.pro',
|
||||
link: 'https://affine.pro',
|
||||
},
|
||||
{
|
||||
icon: <DocIcon />,
|
||||
title: t('AFFiNE Community'),
|
||||
subTitle: 'community.affine.pro',
|
||||
link: 'https://community.affine.pro',
|
||||
},
|
||||
];
|
||||
return (
|
||||
<Modal open={open} onClose={onClose} data-testid="contact-us-modal-content">
|
||||
<ModalWrapper
|
||||
@ -109,7 +110,7 @@ export const ContactModal = ({ open, onClose }: TransitionsModalProps) => {
|
||||
})}
|
||||
</StyledLeftContainer>
|
||||
<StyledRightContainer>
|
||||
<StyledSubTitle>Get in touch!</StyledSubTitle>
|
||||
<StyledSubTitle>{t('Get in touch!')}</StyledSubTitle>
|
||||
{linkList.map(({ icon, title, link }) => {
|
||||
return (
|
||||
<StyledSmallLink key={title} href={link} target="_blank">
|
||||
@ -128,7 +129,7 @@ export const ContactModal = ({ open, onClose }: TransitionsModalProps) => {
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
How is AFFiNE Alpha different?
|
||||
{t('How is AFFiNE Alpha different?')}
|
||||
</a>
|
||||
</p>
|
||||
<p>Copyright © 2022 Toeverything</p>
|
||||
|
@ -15,7 +15,7 @@ import { useTheme } from '@/providers/themeProvider';
|
||||
import { EdgelessIcon, PaperIcon } from './icons';
|
||||
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
|
||||
import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
const PaperItem = ({ active }: { active?: boolean }) => {
|
||||
const {
|
||||
theme: {
|
||||
@ -96,7 +96,7 @@ export const EditorModeSwitch = ({
|
||||
setRadioItemStatus(modifyRadioItemStatus());
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [isHover, mode]);
|
||||
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<StyledAnimateRadioContainer
|
||||
data-testid="editor-mode-switcher"
|
||||
@ -106,7 +106,7 @@ export const EditorModeSwitch = ({
|
||||
>
|
||||
<AnimateRadioItem
|
||||
isLeft={true}
|
||||
label="Paper"
|
||||
label={t('Paper')}
|
||||
icon={<PaperItem />}
|
||||
active={mode === 'page'}
|
||||
status={radioItemStatus.left}
|
||||
@ -126,7 +126,7 @@ export const EditorModeSwitch = ({
|
||||
<StyledMiddleLine hidden={!isHover} dark={themeMode === 'dark'} />
|
||||
<AnimateRadioItem
|
||||
isLeft={false}
|
||||
label="Edgeless"
|
||||
label={t('Edgeless')}
|
||||
data-testid="switch-edgeless-item"
|
||||
icon={<EdgelessItem />}
|
||||
active={mode === 'edgeless'}
|
||||
|
@ -16,12 +16,13 @@ import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
import { useConfirm } from '@/providers/confirm-provider';
|
||||
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
|
||||
import { toast } from '@/ui/toast';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
const PopoverContent = () => {
|
||||
const { editor } = useAppState();
|
||||
const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
|
||||
const { changePageMode } = usePageHelper();
|
||||
const { confirm } = useConfirm();
|
||||
const { t } = useTranslation();
|
||||
const {
|
||||
mode = 'page',
|
||||
id = '',
|
||||
@ -35,11 +36,13 @@ const PopoverContent = () => {
|
||||
data-testid="editor-option-menu-favorite"
|
||||
onClick={() => {
|
||||
toggleFavoritePage(id);
|
||||
toast(!favorite ? 'Removed to Favourites' : 'Added to Favourites');
|
||||
toast(
|
||||
!favorite ? t('Removed to Favourites') : t('Added to Favourites')
|
||||
);
|
||||
}}
|
||||
icon={favorite ? <FavouritedIcon /> : <FavouritesIcon />}
|
||||
>
|
||||
{favorite ? 'Remove' : 'Add'} to favourites
|
||||
{favorite ? t('Remove to favourites') : t('Add to favourites')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
icon={mode === 'page' ? <EdgelessIcon /> : <PaperIcon />}
|
||||
@ -48,7 +51,8 @@ const PopoverContent = () => {
|
||||
changePageMode(id, mode === 'page' ? 'edgeless' : 'page');
|
||||
}}
|
||||
>
|
||||
Convert to {mode === 'page' ? 'Edgeless' : 'Page'}
|
||||
{t('Convert to ')}
|
||||
{mode === 'page' ? t('Edgeless') : t('Page')}
|
||||
</MenuItem>
|
||||
<Menu
|
||||
placement="left-start"
|
||||
@ -60,7 +64,7 @@ const PopoverContent = () => {
|
||||
}}
|
||||
icon={<ExportToHtmlIcon />}
|
||||
>
|
||||
Export to HTML
|
||||
{t('Export to HTML')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
@ -68,31 +72,33 @@ const PopoverContent = () => {
|
||||
}}
|
||||
icon={<ExportToMarkdownIcon />}
|
||||
>
|
||||
Export to Markdown
|
||||
{t('Export to Markdown')}
|
||||
</MenuItem>
|
||||
</>
|
||||
}
|
||||
>
|
||||
<MenuItem icon={<ExportIcon />} isDir={true}>
|
||||
Export
|
||||
{t('Export')}
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
<MenuItem
|
||||
data-testid="editor-option-menu-delete"
|
||||
onClick={() => {
|
||||
confirm({
|
||||
title: 'Delete page?',
|
||||
content: `${title || 'Untitled'} will be moved to Trash`,
|
||||
confirmText: 'Delete',
|
||||
title: t('Delete page?'),
|
||||
content: t('will be moved to Trash', {
|
||||
title: title || 'Untitled',
|
||||
}),
|
||||
confirmText: t('Delete'),
|
||||
confirmType: 'danger',
|
||||
}).then(confirm => {
|
||||
confirm && toggleDeletePage(id);
|
||||
confirm && toast('Moved to Trash');
|
||||
confirm && toast(t('Moved to Trash'));
|
||||
});
|
||||
}}
|
||||
icon={<TrashIcon />}
|
||||
>
|
||||
Delete
|
||||
{t('Delete')}
|
||||
</MenuItem>
|
||||
</>
|
||||
);
|
||||
|
@ -3,15 +3,15 @@ import { IconButton, IconButtonProps } from '@/ui/button';
|
||||
import { Tooltip } from '@/ui/tooltip';
|
||||
import { ArrowDownIcon } from '@blocksuite/icons';
|
||||
import { useModal } from '@/providers/global-modal-provider';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const QuickSearchButton = ({
|
||||
onClick,
|
||||
...props
|
||||
}: Omit<IconButtonProps, 'children'>) => {
|
||||
const { triggerQuickSearchModal } = useModal();
|
||||
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<Tooltip content="Switch to" placement="bottom">
|
||||
<Tooltip content={t('Switch to')} placement="bottom">
|
||||
<IconButton
|
||||
data-testid="header-quickSearchButton"
|
||||
{...props}
|
||||
|
@ -8,6 +8,7 @@ import {
|
||||
import { CloseIcon, ContactIcon, HelpIcon, KeyboardIcon } from './icons';
|
||||
import Grow from '@mui/material/Grow';
|
||||
import { Tooltip } from '@/ui/tooltip';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useModal } from '@/providers/global-modal-provider';
|
||||
import { useTheme } from '@/providers/themeProvider';
|
||||
import useCurrentPageMeta from '@/hooks/use-current-page-meta';
|
||||
@ -22,7 +23,7 @@ export const HelpIsland = ({
|
||||
const { mode: editorMode } = useCurrentPageMeta() || {};
|
||||
const { triggerShortcutsModal, triggerContactModal } = useModal();
|
||||
const isEdgelessDark = mode === 'dark' && editorMode === 'edgeless';
|
||||
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<>
|
||||
<StyledIsland
|
||||
@ -37,7 +38,7 @@ export const HelpIsland = ({
|
||||
<Grow in={showContent}>
|
||||
<StyledIslandWrapper>
|
||||
{showList.includes('contact') && (
|
||||
<Tooltip content="Contact Us" placement="left-end">
|
||||
<Tooltip content={t('Contact Us')} placement="left-end">
|
||||
<StyledIconWrapper
|
||||
data-testid="right-bottom-contact-us-icon"
|
||||
isEdgelessDark={isEdgelessDark}
|
||||
@ -51,7 +52,7 @@ export const HelpIsland = ({
|
||||
</Tooltip>
|
||||
)}
|
||||
{showList.includes('shortcuts') && (
|
||||
<Tooltip content="Keyboard Shortcuts" placement="left-end">
|
||||
<Tooltip content={t('Keyboard Shortcuts')} placement="left-end">
|
||||
<StyledIconWrapper
|
||||
data-testid="shortcuts-icon"
|
||||
isEdgelessDark={isEdgelessDark}
|
||||
|
@ -6,6 +6,7 @@ import Loading from '@/components/loading';
|
||||
import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
import { useAppState } from '@/providers/app-state-provider/context';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
// import { Tooltip } from '@/ui/tooltip';
|
||||
type ImportModalProps = {
|
||||
open: boolean;
|
||||
@ -19,6 +20,7 @@ export const ImportModal = ({ open, onClose }: ImportModalProps) => {
|
||||
const [status, setStatus] = useState<'unImported' | 'importing'>('importing');
|
||||
const { openPage, createPage } = usePageHelper();
|
||||
const { currentWorkspace } = useAppState();
|
||||
const { t } = useTranslation();
|
||||
const _applyTemplate = function (pageId: string, template: Template) {
|
||||
const page = currentWorkspace?.getPage(pageId);
|
||||
|
||||
@ -84,7 +86,7 @@ export const ImportModal = ({ open, onClose }: ImportModalProps) => {
|
||||
<Modal open={open} onClose={onClose}>
|
||||
<ModalWrapper width={460} minHeight={240}>
|
||||
<ModalCloseButton onClick={onClose} />
|
||||
<StyledTitle>Import</StyledTitle>
|
||||
<StyledTitle>{t('Import')}</StyledTitle>
|
||||
|
||||
{status === 'unImported' && (
|
||||
<StyledButtonWrapper>
|
||||
|
@ -14,23 +14,25 @@ import {
|
||||
} from '@blocksuite/icons';
|
||||
import { toast } from '@/ui/toast';
|
||||
import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
const { id, favorite } = pageMeta;
|
||||
const { openPage } = usePageHelper();
|
||||
const { toggleFavoritePage, toggleDeletePage } = usePageHelper();
|
||||
const { confirm } = useConfirm();
|
||||
|
||||
const { t } = useTranslation();
|
||||
const OperationMenu = (
|
||||
<>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
toggleFavoritePage(id);
|
||||
toast(!favorite ? 'Removed to Favourites' : 'Added to Favourites');
|
||||
toast(
|
||||
!favorite ? t('Removed to Favourites') : t('Added to Favourites')
|
||||
);
|
||||
}}
|
||||
icon={favorite ? <FavouritedIcon /> : <FavouritesIcon />}
|
||||
>
|
||||
{favorite ? 'Remove' : 'Add'} to favourites
|
||||
{favorite ? t('Remove to favourites') : t('Add to favourites')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
@ -38,23 +40,25 @@ export const OperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
}}
|
||||
icon={<OpenInNewIcon />}
|
||||
>
|
||||
Open in new tab
|
||||
{t('Open in new tab')}
|
||||
</MenuItem>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
confirm({
|
||||
title: 'Delete page?',
|
||||
content: `${pageMeta.title || 'Untitled'} will be moved to Trash`,
|
||||
confirmText: 'Delete',
|
||||
title: t('Delete page?'),
|
||||
content: t('will be moved to Trash', {
|
||||
title: pageMeta.title || 'Untitled',
|
||||
}),
|
||||
confirmText: t('Delete'),
|
||||
confirmType: 'danger',
|
||||
}).then(confirm => {
|
||||
confirm && toggleDeletePage(id);
|
||||
toast('Moved to Trash');
|
||||
toast(t('Moved to Trash'));
|
||||
});
|
||||
}}
|
||||
icon={<TrashIcon />}
|
||||
>
|
||||
Delete
|
||||
{t('Delete')}
|
||||
</MenuItem>
|
||||
</>
|
||||
);
|
||||
@ -74,7 +78,7 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
const { openPage, getPageMeta } = usePageHelper();
|
||||
const { toggleDeletePage, permanentlyDeletePage } = usePageHelper();
|
||||
const { confirm } = useConfirm();
|
||||
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<Wrapper>
|
||||
<IconButton
|
||||
@ -82,7 +86,7 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
style={{ marginRight: '12px' }}
|
||||
onClick={() => {
|
||||
toggleDeletePage(id);
|
||||
toast(`${getPageMeta(id)?.title || 'Untitled'} restored`);
|
||||
toast(t('restored', { title: getPageMeta(id)?.title || 'Untitled' }));
|
||||
openPage(id);
|
||||
}}
|
||||
>
|
||||
@ -92,13 +96,13 @@ export const TrashOperationCell = ({ pageMeta }: { pageMeta: PageMeta }) => {
|
||||
darker={true}
|
||||
onClick={() => {
|
||||
confirm({
|
||||
title: 'Delete permanently?',
|
||||
content: "Once deleted, you can't undo this action.",
|
||||
confirmText: 'Delete',
|
||||
title: t('Delete permanently?'),
|
||||
content: t("Once deleted, you can't undo this action."),
|
||||
confirmText: t('Delete'),
|
||||
confirmType: 'danger',
|
||||
}).then(confirm => {
|
||||
confirm && permanentlyDeletePage(id);
|
||||
toast('Permanently deleted');
|
||||
toast(t('Permanently deleted'));
|
||||
});
|
||||
}}
|
||||
>
|
||||
|
@ -4,10 +4,11 @@ import { StyledModalFooterContent } from './style';
|
||||
import { useModal } from '@/providers/global-modal-provider';
|
||||
import { Command } from 'cmdk';
|
||||
import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const Footer = (props: { query: string }) => {
|
||||
const { triggerQuickSearchModal } = useModal();
|
||||
const { openPage, createPage } = usePageHelper();
|
||||
const { t } = useTranslation();
|
||||
const query = props.query;
|
||||
|
||||
return (
|
||||
@ -25,9 +26,9 @@ export const Footer = (props: { query: string }) => {
|
||||
<StyledModalFooterContent>
|
||||
<AddIcon />
|
||||
{query ? (
|
||||
<span>New "{query}" page</span>
|
||||
<span>{t('New Keyword Page', { query: query })}</span>
|
||||
) : (
|
||||
<span>New page</span>
|
||||
<span>{t('New Page')}</span>
|
||||
)}
|
||||
</StyledModalFooterContent>
|
||||
</Command.Item>
|
||||
|
@ -7,6 +7,7 @@ import { useAppState } from '@/providers/app-state-provider';
|
||||
import { useRouter } from 'next/router';
|
||||
import { config } from './config';
|
||||
import { NoResultSVG } from './noResultSVG';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import usePageHelper from '@/hooks/use-page-helper';
|
||||
import usePageMetaList from '@/hooks/use-page-meta-list';
|
||||
export const Results = (props: {
|
||||
@ -27,6 +28,7 @@ export const Results = (props: {
|
||||
const { search } = usePageHelper();
|
||||
const List = config(currentWorkspaceId);
|
||||
const [results, setResults] = useState(new Map<string, string | undefined>());
|
||||
const { t } = useTranslation();
|
||||
useEffect(() => {
|
||||
setResults(search(query));
|
||||
setLoading(false);
|
||||
@ -47,7 +49,9 @@ export const Results = (props: {
|
||||
<>
|
||||
{query ? (
|
||||
resultsPageMeta.length ? (
|
||||
<Command.Group heading={`Find ${resultsPageMeta.length} results`}>
|
||||
<Command.Group
|
||||
heading={t('Find results', { number: resultsPageMeta.length })}
|
||||
>
|
||||
{resultsPageMeta.map(result => {
|
||||
return (
|
||||
<Command.Item
|
||||
@ -72,12 +76,12 @@ export const Results = (props: {
|
||||
</Command.Group>
|
||||
) : (
|
||||
<StyledNotFound>
|
||||
<span>Find 0 result</span>
|
||||
<span>{t('Find 0 result')}</span>
|
||||
<NoResultSVG />
|
||||
</StyledNotFound>
|
||||
)
|
||||
) : (
|
||||
<Command.Group heading="Switch to">
|
||||
<Command.Group heading={t('Switch to')}>
|
||||
{List.map(link => {
|
||||
return (
|
||||
<Command.Item
|
||||
|
@ -16,6 +16,7 @@ import {
|
||||
import Slide from '@mui/material/Slide';
|
||||
import { ModalCloseButton } from '@/ui/modal';
|
||||
import { getUaHelper } from '@/utils';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
type ModalProps = {
|
||||
open: boolean;
|
||||
onClose: () => void;
|
||||
@ -27,11 +28,12 @@ const isMac = () => {
|
||||
|
||||
export const ShortcutsModal = ({ open, onClose }: ModalProps) => {
|
||||
const markdownShortcuts = isMac()
|
||||
? macMarkdownShortcuts
|
||||
: winMarkdownShortcuts;
|
||||
? macMarkdownShortcuts()
|
||||
: winMarkdownShortcuts();
|
||||
const keyboardShortcuts = isMac()
|
||||
? macKeyboardShortcuts
|
||||
: windowsKeyboardShortcuts;
|
||||
? macKeyboardShortcuts()
|
||||
: windowsKeyboardShortcuts();
|
||||
const { t } = useTranslation();
|
||||
return createPortal(
|
||||
<Slide direction="left" in={open} mountOnEnter unmountOnExit>
|
||||
<StyledShortcutsModal data-testid="shortcuts-modal">
|
||||
@ -39,7 +41,7 @@ export const ShortcutsModal = ({ open, onClose }: ModalProps) => {
|
||||
<StyledModalHeader>
|
||||
<StyledTitle>
|
||||
<KeyboardIcon />
|
||||
Shortcuts
|
||||
{t('Shortcuts')}
|
||||
</StyledTitle>
|
||||
|
||||
<ModalCloseButton
|
||||
@ -53,7 +55,7 @@ export const ShortcutsModal = ({ open, onClose }: ModalProps) => {
|
||||
/>
|
||||
</StyledModalHeader>
|
||||
<StyledSubTitle style={{ marginTop: 0 }}>
|
||||
Keyboard Shortcuts
|
||||
{t('Keyboard Shortcuts')}
|
||||
</StyledSubTitle>
|
||||
{Object.entries(keyboardShortcuts).map(([title, shortcuts]) => {
|
||||
return (
|
||||
@ -63,7 +65,7 @@ export const ShortcutsModal = ({ open, onClose }: ModalProps) => {
|
||||
</StyledListItem>
|
||||
);
|
||||
})}
|
||||
<StyledSubTitle>Markdown Syntax</StyledSubTitle>
|
||||
<StyledSubTitle>{t('Markdown Syntax')}</StyledSubTitle>
|
||||
{Object.entries(markdownShortcuts).map(([title, shortcuts]) => {
|
||||
return (
|
||||
<StyledListItem key={title}>
|
||||
|
@ -25,18 +25,18 @@ import Link from 'next/link';
|
||||
import { Tooltip } from '@/ui/tooltip';
|
||||
import { useModal } from '@/providers/global-modal-provider';
|
||||
import { useAppState } from '@/providers/app-state-provider/context';
|
||||
|
||||
import { IconButton } from '@/ui/button';
|
||||
// import { WorkspaceSelector } from './WorkspaceSelector';
|
||||
import useLocalStorage from '@/hooks/use-local-storage';
|
||||
import usePageMetaList from '@/hooks/use-page-meta-list';
|
||||
import { usePageHelper } from '@/hooks/use-page-helper';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
const FavoriteList = ({ showList }: { showList: boolean }) => {
|
||||
const { openPage } = usePageHelper();
|
||||
const pageList = usePageMetaList();
|
||||
const router = useRouter();
|
||||
|
||||
const { t } = useTranslation();
|
||||
const favoriteList = pageList.filter(p => p.favorite && !p.trash);
|
||||
return (
|
||||
<Collapse in={showList}>
|
||||
@ -59,7 +59,7 @@ const FavoriteList = ({ showList }: { showList: boolean }) => {
|
||||
);
|
||||
})}
|
||||
{favoriteList.length === 0 && (
|
||||
<StyledSubListItem disable={true}>No item</StyledSubListItem>
|
||||
<StyledSubListItem disable={true}>{t('No item')}</StyledSubListItem>
|
||||
)}
|
||||
</Collapse>
|
||||
);
|
||||
@ -70,7 +70,7 @@ export const WorkSpaceSliderBar = () => {
|
||||
const { currentWorkspaceId } = useAppState();
|
||||
const { openPage, createPage } = usePageHelper();
|
||||
const router = useRouter();
|
||||
|
||||
const { t } = useTranslation();
|
||||
const [showTip, setShowTip] = useState(false);
|
||||
const [show, setShow] = useLocalStorage('AFFiNE_SLIDE_BAR', false, true);
|
||||
|
||||
@ -86,7 +86,7 @@ export const WorkSpaceSliderBar = () => {
|
||||
<>
|
||||
<StyledSliderBar show={show}>
|
||||
<Tooltip
|
||||
content={show ? 'Collapse sidebar' : 'Expand sidebar'}
|
||||
content={show ? t('Collapse sidebar') : t('Expand sidebar')}
|
||||
placement="right"
|
||||
visible={showTip}
|
||||
>
|
||||
@ -120,17 +120,17 @@ export const WorkSpaceSliderBar = () => {
|
||||
}}
|
||||
>
|
||||
<SearchIcon />
|
||||
Quick search
|
||||
{t('Quick search')}
|
||||
</StyledListItem>
|
||||
<Link href={{ pathname: paths.all }}>
|
||||
<StyledListItem active={router.asPath === paths.all}>
|
||||
<AllPagesIcon /> <span>All pages</span>
|
||||
<AllPagesIcon /> <span>{t('All pages')}</span>
|
||||
</StyledListItem>
|
||||
</Link>
|
||||
<StyledListItem active={router.asPath === paths.favorite}>
|
||||
<StyledLink href={{ pathname: paths.favorite }}>
|
||||
<FavouritesIcon />
|
||||
Favourites
|
||||
{t('Favourites')}
|
||||
</StyledLink>
|
||||
<IconButton
|
||||
darker={true}
|
||||
@ -152,12 +152,12 @@ export const WorkSpaceSliderBar = () => {
|
||||
triggerImportModal();
|
||||
}}
|
||||
>
|
||||
<ImportIcon /> Import
|
||||
<ImportIcon /> {t('Import')}
|
||||
</StyledListItem>
|
||||
|
||||
<Link href={{ pathname: paths.trash }}>
|
||||
<StyledListItem active={router.asPath === paths.trash}>
|
||||
<TrashIcon /> Trash
|
||||
<TrashIcon /> {t('Trash')}
|
||||
</StyledListItem>
|
||||
</Link>
|
||||
<StyledNewPageButton
|
||||
@ -168,7 +168,7 @@ export const WorkSpaceSliderBar = () => {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<AddIcon /> New Page
|
||||
<AddIcon /> {t('New Page')}
|
||||
</StyledNewPageButton>
|
||||
</StyledSliderBarWrapper>
|
||||
</StyledSliderBar>
|
||||
|
@ -4,13 +4,13 @@ import usePageMetaList from '@/hooks/use-page-meta-list';
|
||||
import { PageListHeader } from '@/components/header';
|
||||
import { ReactElement } from 'react';
|
||||
import WorkspaceLayout from '@/components/workspace-layout';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
const All = () => {
|
||||
const pageMetaList = usePageMetaList();
|
||||
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<>
|
||||
<PageListHeader icon={<AllPagesIcon />}>All Page</PageListHeader>
|
||||
<PageListHeader icon={<AllPagesIcon />}>{t('All pages')}</PageListHeader>
|
||||
<PageList
|
||||
pageList={pageMetaList.filter(p => !p.trash)}
|
||||
showFavoriteTag={true}
|
||||
|
@ -4,12 +4,15 @@ import { FavouritesIcon } from '@blocksuite/icons';
|
||||
import usePageMetaList from '@/hooks/use-page-meta-list';
|
||||
import { ReactElement } from 'react';
|
||||
import WorkspaceLayout from '@/components/workspace-layout';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const Favorite = () => {
|
||||
const pageMetaList = usePageMetaList();
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<>
|
||||
<PageListHeader icon={<FavouritesIcon />}>Favourites</PageListHeader>
|
||||
<PageListHeader icon={<FavouritesIcon />}>
|
||||
{t('Favourites')}
|
||||
</PageListHeader>
|
||||
<PageList pageList={pageMetaList.filter(p => p.favorite && !p.trash)} />
|
||||
</>
|
||||
);
|
||||
|
@ -4,12 +4,13 @@ import { TrashIcon } from '@blocksuite/icons';
|
||||
import usePageMetaList from '@/hooks/use-page-meta-list';
|
||||
import { ReactElement } from 'react';
|
||||
import WorkspaceLayout from '@/components/workspace-layout';
|
||||
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export const Trash = () => {
|
||||
const pageMetaList = usePageMetaList();
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<>
|
||||
<PageListHeader icon={<TrashIcon />}>Trash</PageListHeader>
|
||||
<PageListHeader icon={<TrashIcon />}>{t('Trash')}</PageListHeader>
|
||||
<PageList pageList={pageMetaList.filter(p => p.trash)} isTrash={true} />
|
||||
</>
|
||||
);
|
||||
|
@ -7,6 +7,7 @@ import {
|
||||
StyledModalWrapper,
|
||||
} from '@/ui/confirm/styles';
|
||||
import { Button } from '@/ui/button';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
export type ConfirmProps = {
|
||||
title?: string;
|
||||
content?: string;
|
||||
@ -26,6 +27,7 @@ export const Confirm = ({
|
||||
onCancel,
|
||||
}: ConfirmProps) => {
|
||||
const [open, setOpen] = useState(true);
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
<Modal open={open}>
|
||||
<StyledModalWrapper>
|
||||
@ -48,7 +50,7 @@ export const Confirm = ({
|
||||
}}
|
||||
style={{ marginRight: '24px' }}
|
||||
>
|
||||
Cancel
|
||||
{t('Cancel')}
|
||||
</Button>
|
||||
<Button
|
||||
type={confirmType}
|
||||
|
Loading…
Reference in New Issue
Block a user