lint and prettier

tranga-website/src/App.tsx

@@ -26,7 +26,7 @@ const Api = new V2({ baseUrl: apiUri });
 const manga: Manga[] = [];
 const promises: Map<string, Promise<Manga | undefined>> = new Map();
 const getManga = async (key: string): Promise<Manga | undefined> => {
-  let result = manga.find((m) => m.key === key);
+  const result = manga.find((m) => m.key === key);
   if (result) return result;
   if (promises.has(key)) return promises.get(key);
   const newPromise = retrieveManga(key);

tranga-website/src/Components/MangaConnectorLink.tsx

@@ -43,7 +43,7 @@ export default function MangaConnectorLink({
       imageRef.current.setHTMLUnsafe(
         `<img ref=${imageRef} src=${mangaConnector?.iconUrl} style=${imageStyle}/>`,
       );
-  }, []);
+  }, [MangaConnectorId, imageStyle, mangaConnector, mangaConnectorContext]);
 
   return (
     <Tooltip
@@ -96,7 +96,7 @@ export function MangaConnectorLinkFromId({
           );
       },
     );
-  }, []);
+  }, [Api, MangaConnectorIdId, imageStyle, printName]);
 
   return node;
 }

tranga-website/src/Components/Mangas/MangaCard.tsx

@@ -36,10 +36,10 @@ export function MangaCard({
   manga: MinimalManga | undefined;
   children?: ReactNode;
 }) {
-  if (manga === undefined) return PlaceHolderCard();
-
   const [open, setOpen] = useState(false);
 
+  if (manga === undefined) return PlaceHolderCard();
+
   return (
     <MangaConnectorBadge manga={manga}>
       <Card className={"manga-card"} onClick={() => setOpen(true)}>
@@ -73,7 +73,7 @@ export function MangaModal({
   const [manga, setManga] = useState<Manga>();
   useEffect(() => {
     getManga(minimalManga.key).then(setManga);
-  }, []);
+  }, [getManga, minimalManga]);
 
   return (
     <Modal open={open} onClose={() => setOpen(false)} className={"manga-modal"}>

tranga-website/src/Components/Mangas/MangaConnectorBadge.tsx

@@ -1,6 +1,6 @@
 import { Badge } from "@mui/joy";
 import { MinimalManga } from "../../apiClient/data-contracts.ts";
-import { ReactElement } from "react";
+import { ReactNode } from "react";
 import "./MangaCard.css";
 import MangaConnectorLink from "../MangaConnectorLink.tsx";
 
@@ -9,7 +9,7 @@ export default function MangaConnectorBadge({
   children,
 }: {
   manga: MinimalManga;
-  children?: ReactElement<any, any> | ReactElement<any, any>[] | undefined;
+  children?: ReactNode;
 }) {
   return (
     <Badge

tranga-website/src/Components/Mangas/MangaDownloadDialog.tsx

@@ -15,6 +15,7 @@ import Sheet from "@mui/joy/Sheet";
 import { FileLibraryContext, MangaContext } from "../../App.tsx";
 import { ApiContext } from "../../apiClient/ApiContext.tsx";
 import { LoadingState, StateIndicator } from "../Loading.tsx";
+import * as React from "react";
 
 export default function ({ mangaId }: { mangaId: string }): ReactNode {
   const [open, setOpen] = useState(false);
@@ -22,7 +23,7 @@ export default function ({ mangaId }: { mangaId: string }): ReactNode {
   const [manga, setManga] = useState<Manga>();
   useEffect(() => {
     getManga(mangaId).then(setManga);
-  }, []);
+  }, [getManga, mangaId]);
 
   return (
     <>
@@ -44,10 +45,13 @@ function DownloadDrawer({
   const fileLibraries = useContext(FileLibraryContext);
   const Api = useContext(ApiContext);
 
-  const onLibraryChange = (_: any, value: {} | null) => {
+  const onLibraryChange = (
+    _: React.MouseEvent | React.KeyboardEvent | React.FocusEvent | null,
+    value: string | null,
+  ) => {
     if (!value) return;
     if (!manga) return;
-    Api.mangaChangeLibraryCreate(manga.key as string, value as string);
+    Api.mangaChangeLibraryCreate(manga.key, value);
   };
 
   return (
@@ -97,7 +101,7 @@ function DownloadCheckBox({
         } else setLoading(LoadingState.failure);
       })
       .catch((_) => setLoading(LoadingState.failure));
-  }, []);
+  }, [Api, mangaConnectorIdId]);
 
   const onSelected = (event: ChangeEvent<HTMLInputElement>) => {
     setLoading(LoadingState.loading);

tranga-website/src/Components/Mangas/MangaMerge.tsx

@@ -34,7 +34,7 @@ export default function ({
           if (response.ok) setSimilar(response.data);
         });
     });
-  }, [open]);
+  }, [Api, manga, open]);
 
   const exit = (manga: Manga) => {
     setOpen(false);

tranga-website/src/Components/Search.tsx

@@ -103,7 +103,7 @@ function SearchDialog({
     try {
       new URL(url);
       return true;
-    } catch (Error) {
+    } catch {
       return false;
     }
   };

tranga-website/src/Components/Settings/LibraryConnectors/ListLibraryConnectors.tsx

@@ -10,14 +10,10 @@ export default function () {
   >([]);
 
   useEffect(() => {
-    getConnectors();
-  }, []);
-
-  const getConnectors = () => {
     Api.libraryConnectorList().then((r) => {
       if (r.ok) setLibraryConnectors(r.data);
     });
-  };
+  }, [Api]);
 
   return (
     <Stack direction={"column"} spacing={1}>

tranga-website/src/Components/Settings/NotificationConnectors/AddNotificationConnector.tsx

@@ -18,6 +18,7 @@ import {
   PushoverRecord,
 } from "../../../apiClient/data-contracts.ts";
 import { LoadingState, StateColor, StateIndicator } from "../../Loading.tsx";
+import * as React from "react";
 
 export default function ({
   open,
@@ -53,7 +54,7 @@ function NotificationConnectorTab({
 }: {
   value: string;
   children: ReactNode;
-  add: (data: any) => void;
+  add: React.MouseEventHandler<HTMLAnchorElement> | undefined;
   state: LoadingState;
 }) {
   const IsLoading = (state: LoadingState): boolean =>

tranga-website/src/Components/Settings/NotificationConnectors/ListNotificationConnector.tsx

@@ -18,14 +18,10 @@ export default function () {
   >([]);
 
   useEffect(() => {
-    getConnectors();
-  }, []);
-
-  const getConnectors = () => {
     Api.notificationConnectorList().then((r) => {
       if (r.ok) setNotificationConnectors(r.data);
     });
-  };
+  }, [Api]);
 
   return (
     <Stack direction={"column"} spacing={1}>

tranga-website/src/Components/Settings/Settings.tsx

@@ -51,7 +51,7 @@ export default function Settings({
     Api.settingsList().then((response) => {
       setSettings(response.data);
     });
-  }, []);
+  }, [Api]);
 
   const apiUriChanged = (e: React.ChangeEvent<HTMLInputElement>) => {
     clearTimeout(timerRef.current);

tranga-website/src/Components/WorkerModal/Workers.tsx

@@ -17,7 +17,7 @@ export default function (): ReactNode {
         setWorkers(response.data);
       }
     });
-  }, []);
+  }, [Api]);
 
   return (
     <>

tranga-website/src/Header.tsx

@@ -1,6 +1,6 @@
 import Sheet from "@mui/joy/Sheet";
 import { Link, Stack, Typography } from "@mui/joy";
-import { ReactElement, useContext } from "react";
+import { ReactElement, ReactNode, useContext } from "react";
 import "./Header.css";
 import { Article, GitHub } from "@mui/icons-material";
 import { ApiContext } from "./apiClient/ApiContext.tsx";
@@ -8,7 +8,7 @@ import { ApiContext } from "./apiClient/ApiContext.tsx";
 export default function Header({
   children,
 }: {
-  children?: ReactElement<any, any> | ReactElement<any, any>[] | undefined;
+  children?: ReactNode;
 }): ReactElement {
   const Api = useContext(ApiContext);
 

tranga-website/src/apiClient/SettingsContext.tsx

@@ -6,12 +6,11 @@ const [settingsPromise, setSettingsPromise] =
   useState<Promise<TrangaSettings | undefined>>();
 const [settings, setSettings] = useState<TrangaSettings>();
 
-const API = useContext(ApiContext);
-
 export const SettingsContext = createContext<{
   GetSettings: () => Promise<TrangaSettings | undefined>;
 }>({
   GetSettings: (): Promise<TrangaSettings | undefined> => {
+    const API = useContext(ApiContext);
     const promise = settingsPromise;
     if (promise) return promise;
     const p = new Promise<TrangaSettings | undefined>((resolve, reject) => {

tranga-website/src/main.tsx

@@ -1,7 +1,7 @@
 import { createRoot } from "react-dom/client";
 import "./index.css";
 import App from "./App.tsx";
-// @ts-ignore
+// @ts-expect-error font
 import "@fontsource/inter";
 import { CssVarsProvider } from "@mui/joy/styles";
 import CssBaseline from "@mui/joy/CssBaseline";