Fix/manga white screen missing extension (#285)

* Prevent white screen when source is missing

A undefined source caused a TypeError

* Show error message when source is missing

src/components/manga/MangaDetails.tsx

@@ -12,12 +12,14 @@ import { Typography } from '@mui/material';
 import IconButton from '@mui/material/IconButton';
 import { Theme } from '@mui/material/styles';
 import makeStyles from '@mui/styles/makeStyles';
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { mutate } from 'swr';
 import client from 'util/client';
 import useLocalStorage from 'util/useLocalStorage';
 import { IManga, ISource } from 'typings';
+import { t as translate } from 'i18next';
+import makeToast from 'components/util/Toast';
 
 const useStyles = (inLibrary: boolean) =>
     makeStyles((theme: Theme) => ({
@@ -119,10 +121,11 @@ interface IProps {
 }
 
 function getSourceName(source: ISource) {
-    if (source.displayName !== null) {
-        return source.displayName;
+    if (!source) {
+        return translate('global.label.unknown');
     }
-    return source.id;
+
+    return source.displayName ?? source.id;
 }
 
 function getValueOrUnknown(val: string) {
@@ -137,6 +140,8 @@ const MangaDetails: React.FC<IProps> = ({ manga }) => {
 
     const classes = useStyles(manga.inLibrary)();
 
+    useEffect(() => makeToast(translate('source.error.label.source_not_found'), 'error'), [manga.id]);
+
     const addToLibrary = () => {
         mutate(`/api/v1/manga/${manga.id}/?onlineFetch=false`, { ...manga, inLibrary: true }, { revalidate: false });
         client

src/i18n/locale/en.json

@@ -238,7 +238,8 @@
       "filter": "Filter",
       "loading": "Loading...",
       "none": "None",
-      "sort": "Sort"
+      "sort": "Sort",
+      "unknown": "Unknown"
     },
     "language": {
       "label": {
@@ -435,7 +436,8 @@
     },
     "error": {
       "label": {
-        "no_sources_found": "No sources found. Install Some Extensions first."
+        "no_sources_found": "No sources found. Install Some Extensions first.",
+        "source_not_found": "Could not find source. Check your installed extensions."
       }
     },
     "local_source": {