Internationalize missed "local source" occurences

src/components/MigrationCard.tsx

@@ -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,7 +25,13 @@ export type TMigratableSource = NonNullable<GetMigratableSourcesQuery['mangas'][
 };
 
 // TODO - cleanup source/extension components
-export const MigrationCard = ({ id, name, lang, iconUrl, mangaCount }: TMigratableSource) => (
+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
@@ -49,13 +56,13 @@ export const MigrationCard = ({ id, name, lang, iconUrl, mangaCount }: TMigratab
                             <SpinnerImage
                                 spinnerStyle={{ small: true }}
                                 imgStyle={{ objectFit: 'cover', width: '100%', height: '100%' }}
-                            alt={name}
+                                alt={sourceName}
                                 src={requestManager.getValidImgUrlFor(iconUrl)}
                             />
                         </Avatar>
                         <Box sx={{ display: 'flex', flexDirection: 'column', justifyContent: 'center' }}>
                             <Typography variant="h6" component="h3">
-                            {name}
+                                {sourceName}
                             </Typography>
                             <Typography
                                 variant="caption"
@@ -71,4 +78,5 @@ export const MigrationCard = ({ id, name, lang, iconUrl, mangaCount }: TMigratab
                 </CardContent>
             </CardActionArea>
         </Card>
-);
+    );
+};

src/components/SourceCard.tsx

@@ -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,9 +97,8 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
                             }}
                         >
                             <Typography variant="h6" component="h3">
-                                {name}
+                                {sourceName}
                             </Typography>
-                            {id !== '0' && (
                             <Typography
                                 variant="caption"
                                 sx={{
@@ -126,7 +128,6 @@ export const SourceCard: React.FC<IProps> = (props: IProps) => {
                                     </Typography>
                                 )}
                             </Typography>
-                            )}
                         </Box>
                     </Box>
                     <Stack sx={{ flexDirection: 'row', gap: 1 }}>

src/components/manga/MangaDetails.tsx

@@ -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;
 }