diff --git a/tranga-website/src/Components/MangaConnectorLink.tsx b/tranga-website/src/Components/MangaConnectorLink.tsx index 63e8b28..4f38533 100644 --- a/tranga-website/src/Components/MangaConnectorLink.tsx +++ b/tranga-website/src/Components/MangaConnectorLink.tsx @@ -4,7 +4,7 @@ import {Link, Tooltip, Typography} from "@mui/joy"; import {MangaConnectorContext} from "../App.tsx"; import {ApiContext} from "../apiClient/ApiContext.tsx"; -export default function MangaConnectorLink({MangaConnectorId, imageStyle} : {MangaConnectorId : MangaMangaConnectorId | ChapterMangaConnectorId, imageStyle? : CSSProperties}) : ReactNode{ +export default function MangaConnectorLink({MangaConnectorId, imageStyle, printName} : {MangaConnectorId : MangaMangaConnectorId | ChapterMangaConnectorId, imageStyle? : CSSProperties, printName?: boolean}) : ReactNode{ const mangaConnectorContext = useContext(MangaConnectorContext); const [mangaConnector, setMangaConnector] = useState(mangaConnectorContext?.find(c => c.name == MangaConnectorId.mangaConnectorName)); const imageRef = useRef(null); @@ -13,19 +13,20 @@ export default function MangaConnectorLink({MangaConnectorId, imageStyle} : {Man const connector = mangaConnectorContext?.find(c => c.name == MangaConnectorId.mangaConnectorName); setMangaConnector(connector); if (imageRef?.current != null) - imageRef.current.setHTMLUnsafe(""); + imageRef.current.setHTMLUnsafe(``); }, []); return ( {MangaConnectorId.mangaConnectorName}: {MangaConnectorId.websiteUrl}}> + {printName ? {mangaConnector?.name} : null} ); } -export function MangaConnectorLinkFromId({MangaConnectorIdId} : {MangaConnectorIdId: string}) : ReactNode { +export function MangaConnectorLinkFromId({MangaConnectorIdId, imageStyle, printName} : {MangaConnectorIdId: string, imageStyle? : CSSProperties, printName?: boolean}) : ReactNode { const Api = useContext(ApiContext); const [node, setNode] = useState(null); @@ -33,7 +34,7 @@ export function MangaConnectorLinkFromId({MangaConnectorIdId} : {MangaConnectorI useEffect(() => { Api.queryMangaMangaConnectorIdDetail(MangaConnectorIdId).then(response => { if (response.ok) - setNode(); + setNode(); }); }, []); diff --git a/tranga-website/src/Components/Mangas/MangaCard.tsx b/tranga-website/src/Components/Mangas/MangaCard.tsx index c4a971b..72074e2 100644 --- a/tranga-website/src/Components/Mangas/MangaCard.tsx +++ b/tranga-website/src/Components/Mangas/MangaCard.tsx @@ -63,12 +63,12 @@ export function MangaModal({manga, open, setOpen, children}: {manga: Manga | und {manga?.name} - + - - - {manga?.mangaConnectorIdsIds?.map((idid) => )} + + + {manga?.mangaConnectorIdsIds?.map((idid) => )} {manga?.mangaTags?.map((tag) => {tag.tag})} {manga?.links?.map((link) => {link.linkProvider})} diff --git a/tranga-website/src/Components/Mangas/MangaConnectorBadge.tsx b/tranga-website/src/Components/Mangas/MangaConnectorBadge.tsx index 978e252..f56fe7b 100644 --- a/tranga-website/src/Components/Mangas/MangaConnectorBadge.tsx +++ b/tranga-website/src/Components/Mangas/MangaConnectorBadge.tsx @@ -7,7 +7,7 @@ import {MangaConnectorLinkFromId} from "../MangaConnectorLink.tsx"; export default function MangaConnectorBadge ({manga, children} : {manga: Manga, children? : ReactElement | ReactElement[] | undefined}) { return ( - )}> + )}> {children} ); diff --git a/tranga-website/src/Components/Mangas/MangaDownloadDialog.tsx b/tranga-website/src/Components/Mangas/MangaDownloadDialog.tsx index 7157be5..ab0e5d6 100644 --- a/tranga-website/src/Components/Mangas/MangaDownloadDialog.tsx +++ b/tranga-website/src/Components/Mangas/MangaDownloadDialog.tsx @@ -1,11 +1,12 @@ import {Manga} from "../../apiClient/data-contracts.ts"; -import {Dispatch, ReactNode, useContext, useState} from "react"; +import {ChangeEvent, Dispatch, ReactNode, useContext, useState} from "react"; import {Button, Checkbox, Option, Select, Stack, Typography} from "@mui/joy"; import Drawer from "@mui/joy/Drawer"; import ModalClose from "@mui/joy/ModalClose"; import {MangaConnectorLinkFromId} from "../MangaConnectorLink.tsx"; import Sheet from "@mui/joy/Sheet"; import {FileLibraryContext} from "../../App.tsx"; +import {ApiContext} from "../../apiClient/ApiContext.tsx"; export default function ({manga} : {manga: Manga}) : ReactNode{ const [open, setOpen] = useState(false); @@ -20,13 +21,20 @@ export default function ({manga} : {manga: Manga}) : ReactNode{ function DownloadDrawer({manga, open, setOpen}: {manga: Manga, open: boolean, setOpen: Dispatch}): ReactNode { const fileLibraries = useContext(FileLibraryContext); + const Api = useContext(ApiContext); + + const onLibraryChange = (_ :any, value: ({} | null)) => { + if (value === undefined) + return; + Api.mangaChangeLibraryCreate(manga.key as string, value as string); + } return ( setOpen(false)}> Download to Library: - {fileLibraries?.map(library => ( ))} @@ -41,7 +49,17 @@ function DownloadDrawer({manga, open, setOpen}: {manga: Manga, open: boolean, se } function DownloadCheckBox({mangaConnectorIdId} : {mangaConnectorIdId : string}) : ReactNode { + const Api = useContext(ApiContext); + + const onSelected = (event: ChangeEvent) => { + Api.queryMangaMangaConnectorIdDetail(mangaConnectorIdId).then(response => { + if (!response.ok) + return; + Api.mangaSetAsDownloadFromCreate(response.data.objId, response.data.mangaConnectorName, event.currentTarget.checked); + }); + } + return ( - } /> + } /> ); } \ No newline at end of file