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

Fix Loading issues

Browse Source
This commit is contained in:
glax
2025-07-22 17:30:20 +02:00
parent 39f6cbdbfd
commit c3eb42449f
1 changed files with 30 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
tranga-website/src/App.tsx
View File

@@ -2,12 +2,13 @@ import Sheet from '@mui/joy/Sheet';
import './App.css' import './App.css'
import Settings from "./Components/Settings/Settings.tsx"; import Settings from "./Components/Settings/Settings.tsx";
import Header from "./Header.tsx"; import Header from "./Header.tsx";
import {createContext, useEffect, useState} from "react"; import {createContext, ReactNode, useEffect, useState} from "react";
import {V2} from "./apiClient/V2.ts"; import {V2} from "./apiClient/V2.ts";
import { ApiContext } from './apiClient/ApiContext.tsx'; import { ApiContext } from './apiClient/ApiContext.tsx';
import MangaList from "./Components/Mangas/MangaList.tsx"; import MangaList from "./Components/Mangas/MangaList.tsx";
import {FileLibrary, Manga, MangaConnector} from "./apiClient/data-contracts.ts"; import {FileLibrary, Manga, MangaConnector} from "./apiClient/data-contracts.ts";
import Search from "./Components/Search.tsx"; import Search from "./Components/Search.tsx";
import {Typography} from "@mui/joy";
export const MangaConnectorContext = createContext<MangaConnector[]>([]); export const MangaConnectorContext = createContext<MangaConnector[]>([]);
export const MangaContext = createContext<Manga[]>([]); export const MangaContext = createContext<Manga[]>([]);
@@ -16,7 +17,9 @@ export const FileLibraryContext = createContext<FileLibrary[]>([]);
export default function App () { export default function App () {
const apiUriStr = localStorage.getItem("apiUri") ?? window.location.href.substring(0, window.location.href.lastIndexOf("/")) + "/api"; const apiUriStr = localStorage.getItem("apiUri") ?? window.location.href.substring(0, window.location.href.lastIndexOf("/")) + "/api";
const [apiUri, setApiUri] = useState<string>(apiUriStr); const [apiUri, setApiUri] = useState<string>(apiUriStr);
const [Api, setApi] = useState<V2>(new V2()); const [Api, setApi] = useState<V2>(new V2({
baseUrl: apiUri
}));
const [mangaConnectors, setMangaConnectors] = useState<MangaConnector[]>([]); const [mangaConnectors, setMangaConnectors] = useState<MangaConnector[]>([]);
const [manga, setManga] = useState<Manga[]>([]); const [manga, setManga] = useState<Manga[]>([]);
@@ -44,14 +47,15 @@ export default function App () {
setManga(response.data); setManga(response.data);
}) })
}) })
}, [Api]); }, []);
useEffect(() => { useEffect(() => {
localStorage.setItem("apiUri", apiUri); localStorage.setItem("apiUri", apiUri);
setApi(new V2({ if (Api.baseUrl != apiUri)
baseUrl: apiUri setApi(new V2({
})); baseUrl: apiUri
}));
}, [apiUri]); }, [apiUri]);
return ( return (
@@ -59,19 +63,29 @@ export default function App () {
<FileLibraryContext value={fileLibraries}> <FileLibraryContext value={fileLibraries}>
<MangaConnectorContext.Provider value={mangaConnectors}> <MangaConnectorContext.Provider value={mangaConnectors}>
<MangaContext.Provider value={manga}> <MangaContext.Provider value={manga}>
<Sheet className={"app"}> {
<Header> Api ?
<Settings setApiUri={setApiUri} /> <Sheet className={"app"}>
</Header> <Header>
<Sheet className={"app-content"}> <Settings setApiUri={setApiUri} />
<MangaList mangas={manga}> </Header>
<Search /> <Sheet className={"app-content"}>
</MangaList> <MangaList mangas={manga}>
</Sheet> <Search />
</Sheet> </MangaList>
</Sheet>
</Sheet>
: <Loading />
}
</MangaContext.Provider> </MangaContext.Provider>
</MangaConnectorContext.Provider> </MangaConnectorContext.Provider>
</FileLibraryContext> </FileLibraryContext>
</ApiContext.Provider> </ApiContext.Provider>
); );
} }
function Loading () : ReactNode{
return (
<Typography>Loading</Typography>
);
}