ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use gql for "mangas" I - get manga

Browse Source
This commit is contained in:
schroda
2023-09-08 00:44:01 +02:00
parent a5b4b95bce
commit 89dc053f00
14 changed files with 170 additions and 126 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/screens/Manga.tsx
View File

@@ -11,6 +11,7 @@ import { CircularProgress, IconButton, Stack, Tooltip, Box } from '@mui/material
import React, { useContext, useEffect, useRef } from 'react';
import { useTranslation } from 'react-i18next';
import { useParams } from 'react-router-dom';
import { isNetworkRequestInFlight } from '@apollo/client/core/networkStatus';
import requestManager from '@/lib/requests/RequestManager.ts';
import NavbarContext, { useSetDefaultBackTo } from '@/components/context/NavbarContext';
import ChapterList from '@/components/manga/ChapterList';
@@ -19,8 +20,9 @@ import MangaDetails from '@/components/manga/MangaDetails';
import MangaToolbarMenu from '@/components/manga/MangaToolbarMenu';
import EmptyView from '@/components/util/EmptyView';
import LoadingPlaceholder from '@/components/util/LoadingPlaceholder';
import { MangaType } from '@/lib/graphql/generated/graphql.ts';
const AUTOFETCH_AGE = 60 * 60 * 24; // 24 hours
const AUTOFETCH_AGE = 1000 * 60 * 60 * 24; // 24 hours
const Manga: React.FC = () => {
const { t } = useTranslation();
@@ -29,21 +31,26 @@ const Manga: React.FC = () => {
const { id } = useParams<{ id: string }>();
const autofetchedRef = useRef(false);
const { data: manga, error, isLoading, isValidating, mutate } = requestManager.useGetManga(id);
const { data, error, loading: isLoading, networkStatus, refetch } = requestManager.useGetManga(id);
const isValidating = isNetworkRequestInFlight(networkStatus);
const manga = data?.manga as MangaType | undefined;
const [refresh, { loading: refreshing }] = useRefreshManga(id);
useSetDefaultBackTo('library');
useEffect(() => {
// Automatically fetch manga from source if data is older then 24 hours
// Automatically fetch manga from source if data is older then 24 hours OR manga is not initialized yet
// Automatic fetch is done only once, to prevent issues when server does
// not update age for some reason (ie. error on source side)
if (manga == null) return;
if (
manga.inLibrary &&
(manga.age > AUTOFETCH_AGE || manga.chaptersAge > AUTOFETCH_AGE) &&
autofetchedRef.current === false
) {
const isOutdated =
Date.now() - Number(manga.lastFetchedAt) * 1000 > AUTOFETCH_AGE ||
Date.now() - Number(manga.chaptersLastFetchedAt) * 1000 > AUTOFETCH_AGE;
const refetchBecauseOutdated = manga.inLibrary && isOutdated;
const doFetch = !autofetchedRef.current && (refetchBecauseOutdated || !manga.initialized);
if (doFetch) {
autofetchedRef.current = true;
refresh();
}
@@ -67,7 +74,7 @@ const Manga: React.FC = () => {
</>
}
>
<IconButton onClick={() => mutate()}>
<IconButton onClick={() => refetch()}>
<Warning color="error" />
</IconButton>
</Tooltip>
@@ -80,7 +87,7 @@ const Manga: React.FC = () => {
{manga && <MangaToolbarMenu manga={manga} onRefresh={refresh} refreshing={refreshing} />}
</Stack>,
);
}, [t, error, isValidating, refreshing, mutate, manga, refresh]);
}, [t, error, isValidating, refreshing, manga, refresh]);
if (error && !manga) {
return <EmptyView message={t('manga.error.label.request_failure')} messageExtra={error.message ?? error} />;