ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Internationalize missed "local source" occurences

Browse Source
This commit is contained in:
schroda
2024-09-29 15:19:06 +02:00
parent ff9f6b6207
commit da1a9d9e31
3 changed files with 92 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/components/MigrationCard.tsx
View File

@@ -14,6 +14,7 @@ import Chip from '@mui/material/Chip';
import Avatar from '@mui/material/Avatar';
import Typography from '@mui/material/Typography';
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { GetMigratableSourcesQuery } from '@/lib/graphql/generated/graphql.ts';
import { translateExtensionLanguage } from '@/screens/util/Extensions.ts';
@@ -24,51 +25,58 @@ export type TMigratableSource = NonNullable<GetMigratableSourcesQuery['mangas'][
};
// TODO - cleanup source/extension components
export const MigrationCard = ({ id, name, lang, iconUrl, mangaCount }: TMigratableSource) => (
<Card>
<CardActionArea component={Link} to={`/migrate/source/${id}/`}>
<CardContent
sx={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
p: 1.5,
}}
>
<Box sx={{ display: 'flex' }}>
<Avatar
variant="rounded"
sx={{
width: 56,
height: 56,
flex: '0 0 auto',
mr: 1,
background: 'transparent',
}}
>
<SpinnerImage
spinnerStyle={{ small: true }}
imgStyle={{ objectFit: 'cover', width: '100%', height: '100%' }}
alt={name}
src={requestManager.getValidImgUrlFor(iconUrl)}
/>
</Avatar>
<Box sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
<Typography variant="h6" component="h3">
{name}
</Typography>
<Typography
variant="caption"
export const MigrationCard = ({ id, name, lang, iconUrl, mangaCount }: TMigratableSource) => {
const { t } = useTranslation();
const isLocalSource = Number(id) === 0;
const sourceName = isLocalSource ? t('source.local_source.title') : name;
return (
<Card>
<CardActionArea component={Link} to={`/migrate/source/${id}/`}>
<CardContent
sx={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
p: 1.5,
}}
>
<Box sx={{ display: 'flex' }}>
<Avatar
variant="rounded"
sx={{
display: 'block',
width: 56,
height: 56,
flex: '0 0 auto',
mr: 1,
background: 'transparent',
}}
>
{translateExtensionLanguage(lang)}
</Typography>
<SpinnerImage
spinnerStyle={{ small: true }}
imgStyle={{ objectFit: 'cover', width: '100%', height: '100%' }}
alt={sourceName}
src={requestManager.getValidImgUrlFor(iconUrl)}
/>
</Avatar>
<Box sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
<Typography variant="h6" component="h3">
{sourceName}
</Typography>
<Typography
variant="caption"
sx={{
display: 'block',
}}
>
{translateExtensionLanguage(lang)}
</Typography>
</Box>
</Box>
</Box>
<Chip sx={{ borderRadius: 1 }} size="small" label={mangaCount} />
</CardContent>
</CardActionArea>
</Card>
);
<Chip sx={{ borderRadius: 1 }} size="small" label={mangaCount} />
</CardContent>
</CardActionArea>
</Card>
);
};

69
src/components/SourceCard.tsx
View File

@@ -47,6 +47,9 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
showSourceRepo,
} = props;
const isLocalSource = Number(id) === 0;
const sourceName = isLocalSource ? t('source.local_source.title') : name;
return (
<Card
sx={{
@@ -70,7 +73,7 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
<Box sx={{ display: 'flex', alignItems: 'center' }}>
<Avatar
variant="rounded"
alt={name}
alt={sourceName}
sx={{
width: 56,
height: 56,
@@ -82,7 +85,7 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
<SpinnerImage
spinnerStyle={{ small: true }}
imgStyle={{ objectFit: 'cover', width: '100%', height: '100%' }}
alt={name}
alt={sourceName}
src={requestManager.getValidImgUrlFor(iconUrl)}
/>
</Avatar>
@@ -94,39 +97,37 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
}}
>
<Typography variant="h6" component="h3">
{name}
{sourceName}
</Typography>
<Typography
variant="caption"
sx={{
display: 'block',
}}
>
{translateExtensionLanguage(lang)}
{isNsfw && (
<Typography
variant="caption"
color="error"
sx={{
display: 'inline',
}}
>
{' 18+'}
</Typography>
)}
{showSourceRepo && (
<Typography
variant="caption"
sx={{
display: 'block',
}}
>
{repo}
</Typography>
)}
</Typography>
{id !== '0' && (
<Typography
variant="caption"
sx={{
display: 'block',
}}
>
{translateExtensionLanguage(lang)}
{isNsfw && (
<Typography
variant="caption"
color="error"
sx={{
display: 'inline',
}}
>
{' 18+'}
</Typography>
)}
{showSourceRepo && (
<Typography
variant="caption"
sx={{
display: 'block',
}}
>
{repo}
</Typography>
)}
</Typography>
)}
</Box>
</Box>
<Stack sx={{ flexDirection: 'row', gap: 1 }}>

5
src/components/manga/MangaDetails.tsx
View File

@@ -119,6 +119,11 @@ function getSourceName(source?: Pick<SourceType, 'id' | 'displayName'> | null):
return translate('global.label.unknown');
}
const isLocalSource = Number(source.id) === 0;
if (isLocalSource) {
return translate('source.local_source.title');
}
return source.displayName ?? source.id;
}