glax/tranga-website
1
0
Fork 0
mirror of https://github.com/C9Glax/tranga-website.git synced 2025-06-08 13:13:00 +02:00
Code Issues Packages Projects Releases Wiki Activity

useState for MangaConnector in Manga with loading from id

Browse Source
This commit is contained in:
glax 2025-05-18 22:26:06 +02:00
parent 0193077377
commit 181d591344
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
tranga-website/src/Components/Manga.tsx
View File

@ -13,16 +13,15 @@ import {ReleaseStatusToPalette} from "../api/types/EnumMangaReleaseStatus.ts";
import {SxProps} from "@mui/joy/styles/types"; import {SxProps} from "@mui/joy/styles/types";
import MangaPopup from "./MangaPopup.tsx"; import MangaPopup from "./MangaPopup.tsx";
import {MangaConnectorContext} from "../api/Contexts/MangaConnectorContext.tsx"; import {MangaConnectorContext} from "../api/Contexts/MangaConnectorContext.tsx";
import IMangaConnector from "../api/types/IMangaConnector.ts";
export function MangaFromId({mangaId, children} : { mangaId: string, children?: ReactElement<any, any> | ReactElement<any, any>[] | undefined }){ export function MangaFromId({mangaId, children} : { mangaId: string, children?: ReactElement<any, any> | ReactElement<any, any>[] | undefined }){
const [manga, setManga] = useState<IManga>(); const [manga, setManga] = useState<IManga>();
const [loading, setLoading] = useState(true);
const apiUri = useContext(ApiUriContext); const apiUri = useContext(ApiUriContext);
const loadManga = useCallback(() => { const loadManga = useCallback(() => {
setLoading(true); GetMangaById(apiUri, mangaId).then(setManga);
GetMangaById(apiUri, mangaId).then(setManga).finally(() => setLoading(false));
},[apiUri, mangaId]); },[apiUri, mangaId]);
useEffect(() => { useEffect(() => {
@ -31,7 +30,7 @@ export function MangaFromId({mangaId, children} : { mangaId: string, children?:
return ( return (
<> <>
{loading || manga === undefined ? <></> : <Manga manga={manga} children={children} /> } {manga === undefined ? <></> : <Manga manga={manga} children={children} /> }
</> </>
); );
} }
@ -46,10 +45,11 @@ export function Manga({manga: manga, children} : { manga: IManga, children?: Rea
const mangaConnectors = useContext(MangaConnectorContext); const mangaConnectors = useContext(MangaConnectorContext);
const [expanded, setExpanded] = useState(false); const [expanded, setExpanded] = useState(false);
const mangaConnector = mangaConnectors.find(all => all.name == manga.mangaConnectorName); const [mangaConnector, setMangaConnector] = useState<IMangaConnector>();
useEffect(() => { useEffect(() => {
LoadMangaCover(); LoadMangaCover();
setMangaConnector(mangaConnectors.find(all => all.name == manga.mangaConnectorName));
}, [manga]); }, [manga]);
const LoadMangaCover = useCallback(() => { const LoadMangaCover = useCallback(() => {