akai/readest
2
1
Fork 1
Code Issues Pull Requests Actions 9 Packages Projects Releases Wiki Activity

Add i18n support (#46)

Browse Source
This commit is contained in:
Huang Xin
2024-12-26 23:29:54 +01:00
committed by GitHub
parent dc500c5bb4
commit 4612730474
48 changed files with 2016 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/app/reader/components/sidebar/BookCard.tsx
+4 -2
View File
@@ -1,6 +1,7 @@
import React from 'react';
import Image from 'next/image';
import { MdInfoOutline } from 'react-icons/md';
import { useTranslation } from '@/hooks/useTranslation';
interface BookCardProps {
cover: string;
@@ -9,11 +10,12 @@ interface BookCardProps {
}
const BookCard: React.FC<BookCardProps> = ({ cover, title, author }) => {
const _ = useTranslation();
return (
<div className='flex h-20 w-full items-center'>
<Image
src={cover}
alt='Book cover'
alt={_('Book Cover')}
width={56}
height={80}
className='mr-4 aspect-auto max-h-20 w-[15%] max-w-14 rounded-sm object-cover shadow-md'
@@ -27,7 +29,7 @@ const BookCard: React.FC<BookCardProps> = ({ cover, title, author }) => {
</div>
<button
className='btn btn-ghost hover:bg-base-300 h-6 min-h-6 w-6 rounded-full p-0 transition-colors'
aria-label='More info'
aria-label={_('More Info')}
>
<MdInfoOutline size={18} className='fill-base-content' />
</button>
apps/readest-app/src/app/reader/components/sidebar/BookMenu.tsx
+5 -3
View File
@@ -4,6 +4,7 @@ import Image from 'next/image';
import MenuItem from '@/components/MenuItem';
import { setAboutDialogVisible } from '@/components/AboutWindow';
import { useLibraryStore } from '@/store/libraryStore';
import { useTranslation } from '@/hooks/useTranslation';
import { isWebAppPlatform } from '@/services/environment';
import { DOWNLOAD_READEST_URL } from '@/services/constants';
import useBooksManager from '../../hooks/useBooksManager';
@@ -13,6 +14,7 @@ interface BookMenuProps {
}
const BookMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
const _ = useTranslation();
const { library } = useLibraryStore();
const { openParallelView } = useBooksManager();
const handleParallelView = (id: string) => {
@@ -39,7 +41,7 @@ const BookMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
tabIndex={0}
className='book-menu dropdown-content dropdown-center border-base-100 z-20 mt-3 w-60 shadow-2xl'
>
<MenuItem label='Parallel Read' noIcon>
<MenuItem label={_('Parallel Read')} noIcon>
<ul className='max-h-60 overflow-y-auto'>
{library.slice(0, 20).map((book) => (
<MenuItem
@@ -62,10 +64,10 @@ const BookMenu: React.FC<BookMenuProps> = ({ setIsDropdownOpen }) => {
))}
</ul>
</MenuItem>
<MenuItem label='Reload Page' noIcon shortcut='Shift+R' onClick={handleReloadPage} />
<MenuItem label={_('Reload Page')} noIcon shortcut='Shift+R' onClick={handleReloadPage} />
<hr className='border-base-200 my-1' />
{isWebApp && <MenuItem label='Download Readest' noIcon onClick={downloadReadest} />}
<MenuItem label='About Readest' noIcon onClick={showAboutReadest} />
<MenuItem label={_('About Readest')} noIcon onClick={showAboutReadest} />
</div>
);
};
apps/readest-app/src/app/reader/components/sidebar/BooknoteItem.tsx
+5 -3
View File
@@ -6,8 +6,9 @@ import { BookNote } from '@/types/book';
import { useSettingsStore } from '@/store/settingsStore';
import { useReaderStore } from '@/store/readerStore';
import { useNotebookStore } from '@/store/notebookStore';
import useScrollToItem from '../../hooks/useScrollToItem';
import { useBookDataStore } from '@/store/bookDataStore';
import { useTranslation } from '@/hooks/useTranslation';
import useScrollToItem from '../../hooks/useScrollToItem';
interface BooknoteItemProps {
bookKey: string;
@@ -16,6 +17,7 @@ interface BooknoteItemProps {
}
const BooknoteItem: React.FC<BooknoteItemProps> = ({ bookKey, item, editable = false }) => {
const _ = useTranslation();
const { envConfig } = useEnv();
const { settings } = useSettingsStore();
const { getConfig, saveConfig, updateBooknotes } = useBookDataStore();
@@ -115,7 +117,7 @@ const BooknoteItem: React.FC<BooknoteItemProps> = ({ bookKey, item, editable = f
)}
onClick={editNote.bind(null, item)}
>
<div className='align-bottom text-blue-400'>Edit</div>
<div className='align-bottom text-blue-400'>{_('Edit')}</div>
</button>
)}
<button
@@ -125,7 +127,7 @@ const BooknoteItem: React.FC<BooknoteItemProps> = ({ bookKey, item, editable = f
)}
onClick={deleteNote.bind(null, item)}
>
<div className='align-bottom text-red-400'>Delete</div>
<div className='align-bottom text-red-400'>{_('Delete')}</div>
</button>
</div>
</div>
apps/readest-app/src/app/reader/components/sidebar/SearchBar.tsx
+3 -1
View File
@@ -5,6 +5,7 @@ import { useEnv } from '@/context/EnvContext';
import { useSettingsStore } from '@/store/settingsStore';
import { useBookDataStore } from '@/store/bookDataStore';
import { useReaderStore } from '@/store/readerStore';
import { useTranslation } from '@/hooks/useTranslation';
import { BookSearchConfig, BookSearchResult } from '@/types/book';
import Dropdown from '@/components/Dropdown';
import SearchOptions from './SearchOptions';
@@ -24,6 +25,7 @@ const SearchBar: React.FC<SearchBarProps> = ({
searchTerm: term,
onSearchResultChange,
}) => {
const _ = useTranslation();
const { envConfig } = useEnv();
const { settings } = useSettingsStore();
const { getConfig, saveConfig } = useBookDataStore();
@@ -149,7 +151,7 @@ const SearchBar: React.FC<SearchBarProps> = ({
value={searchTerm}
spellCheck={false}
onChange={handleInputChange}
placeholder='Search...'
placeholder={_('Search...')}
className='w-full bg-transparent p-2 font-sans text-sm font-light focus:outline-none'
/>
apps/readest-app/src/app/reader/components/sidebar/SearchOptions.tsx
+7 -5
View File
@@ -1,6 +1,7 @@
import React from 'react';
import { MdCheck } from 'react-icons/md';
import { BookSearchConfig } from '@/types/book';
import { useTranslation } from '@/hooks/useTranslation';
interface SearchOptionsProps {
searchConfig: BookSearchConfig;
@@ -13,6 +14,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
onSearchConfigChanged,
setIsDropdownOpen,
}) => {
const _ = useTranslation();
const handleSetScope = () => {
onSearchConfigChanged({
...searchConfig,
@@ -46,7 +48,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
<span style={{ minWidth: '20px' }}>
{searchConfig.scope === 'book' && <MdCheck size={20} className='text-base-content' />}
</span>
<span className='ml-2'>Book</span>
<span className='ml-2'>{_('Book')}</span>
</div>
</button>
@@ -60,7 +62,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
<MdCheck size={20} className='text-base-content' />
)}
</span>
<span className='ml-2'>Chapter</span>
<span className='ml-2'>{_('Chapter')}</span>
</div>
</button>
@@ -74,7 +76,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
<span style={{ minWidth: '20px' }}>
{searchConfig.matchCase && <MdCheck size={20} className='text-base-content' />}
</span>
<span className='ml-2'>Match Case</span>
<span className='ml-2'>{_('Match Case')}</span>
</div>
</button>
@@ -86,7 +88,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
<span style={{ minWidth: '20px' }}>
{searchConfig.matchWholeWords && <MdCheck size={20} className='text-base-content' />}
</span>
<span className='ml-2'>Match Whole Words</span>
<span className='ml-2'>{_('Match Whole Words')}</span>
</div>
</button>
@@ -98,7 +100,7 @@ const SearchOptions: React.FC<SearchOptionsProps> = ({
<span style={{ minWidth: '20px' }}>
{searchConfig.matchDiacritics && <MdCheck size={20} className='text-base-content' />}
</span>
<span className='ml-2'>Match Diacritics</span>
<span className='ml-2'>{_('Match Diacritics')}</span>
</div>
</button>
</div>