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

Update download subscription to server changes

Browse Source 
The download subscription now sends messages for finished downloads, thus, it's not required anymore to refetch the chapters.
This commit is contained in:
schroda
2023-12-16 19:00:05 +01:00
parent 62568ce76b
commit f542c17fd6
3 changed files with 13 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/manga/ChapterList.tsx
View File

@@ -8,7 +8,7 @@
import { Button, CircularProgress, Stack, styled } from '@mui/material'; import { Button, CircularProgress, Stack, styled } from '@mui/material';
import Typography from '@mui/material/Typography'; import Typography from '@mui/material/Typography';
import React, { ComponentProps, useEffect, useMemo, useRef, useState } from 'react'; import React, { ComponentProps, useMemo, useState } from 'react';
import { Virtuoso } from 'react-virtuoso'; import { Virtuoso } from 'react-virtuoso';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { TChapter, TManga, TranslationKey } from '@/typings'; import { TChapter, TManga, TranslationKey } from '@/typings';
@@ -83,37 +83,15 @@ export const ChapterList: React.FC<IProps> = ({ manga, isRefreshing }) => {
const { t } = useTranslation(); const { t } = useTranslation();
const [selection, setSelection] = useState<number[] | null>(null); const [selection, setSelection] = useState<number[] | null>(null);
const prevQueueRef = useRef<DownloadType[]>();
const { data: downloaderData } = requestManager.useDownloadSubscription(); const { data: downloaderData } = requestManager.useDownloadSubscription();
const queue = (downloaderData?.downloadChanged.queue as DownloadType[]) ?? []; const queue = (downloaderData?.downloadChanged.queue as DownloadType[]) ?? [];
const [options, dispatch] = useChapterOptions(manga.id); const [options, dispatch] = useChapterOptions(manga.id);
const { data: chaptersData, loading: isLoading, refetch } = requestManager.useGetMangaChapters(manga.id); const { data: chaptersData, loading: isLoading } = requestManager.useGetMangaChapters(manga.id);
const chapters = useMemo(() => chaptersData?.chapters.nodes ?? [], [chaptersData?.chapters.nodes]); const chapters = useMemo(() => chaptersData?.chapters.nodes ?? [], [chaptersData?.chapters.nodes]);
const { settings: metadataServerSettings } = useMetadataServerSettings(); const { settings: metadataServerSettings } = useMetadataServerSettings();
useEffect(() => {
if (prevQueueRef.current && queue) {
const prevQueue = prevQueueRef.current;
const changedDownloads = queue.filter((cd) => {
const prevChapterDownload = prevQueue.find(
(pcd) =>
cd.chapter.sourceOrder === pcd.chapter.sourceOrder &&
cd.chapter.manga.id === pcd.chapter.manga.id,
);
if (!prevChapterDownload) return true;
return cd.state !== prevChapterDownload.state;
});
if (changedDownloads.length > 0 || prevQueue?.length !== queue.length) {
refetch();
}
}
prevQueueRef.current = queue;
}, [queue]);
const visibleChapters = useMemo(() => filterAndSortChapters(chapters, options), [chapters, options]); const visibleChapters = useMemo(() => filterAndSortChapters(chapters, options), [chapters, options]);
const nextChapterIndexToRead = (manga.lastReadChapter?.sourceOrder ?? 0) + 1; const nextChapterIndexToRead = (manga.lastReadChapter?.sourceOrder ?? 0) + 1;

2
src/lib/graphql/Fragments.ts
View File

@@ -322,9 +322,11 @@ export const FULL_DOWNLOAD_STATUS = gql`
id id
name name
sourceOrder sourceOrder
isDownloaded
manga { manga {
id id
title title
downloadCount
} }
} }
progress progress

18
src/lib/graphql/generated/graphql.ts
View File

@@ -2137,7 +2137,7 @@ export type UpdaterMangaFieldsFragment = { __typename?: 'MangaType', id: number,
export type FullExtensionFieldsFragment = { __typename?: 'ExtensionType', apkName: string, hasUpdate: boolean, iconUrl: string, isInstalled: boolean, isNsfw: boolean, isObsolete: boolean, lang: string, name: string, pkgName: string, versionCode: number, versionName: string }; export type FullExtensionFieldsFragment = { __typename?: 'ExtensionType', apkName: string, hasUpdate: boolean, iconUrl: string, isInstalled: boolean, isNsfw: boolean, isObsolete: boolean, lang: string, name: string, pkgName: string, versionCode: number, versionName: string };
export type FullDownloadStatusFragment = { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> }; export type FullDownloadStatusFragment = { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> };
export type PartialUpdaterStatusFragment = { __typename?: 'UpdateStatus', isRunning: boolean }; export type PartialUpdaterStatusFragment = { __typename?: 'UpdateStatus', isRunning: boolean };
@@ -2285,7 +2285,7 @@ export type ClearDownloaderMutationVariables = Exact<{
}>; }>;
export type ClearDownloaderMutation = { __typename?: 'Mutation', clearDownloader: { __typename?: 'ClearDownloaderPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type ClearDownloaderMutation = { __typename?: 'Mutation', clearDownloader: { __typename?: 'ClearDownloaderPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type DeleteDownloadedChapterMutationVariables = Exact<{ export type DeleteDownloadedChapterMutationVariables = Exact<{
input: DeleteDownloadedChapterInput; input: DeleteDownloadedChapterInput;
@@ -2306,35 +2306,35 @@ export type DequeueChapterDownloadMutationVariables = Exact<{
}>; }>;
export type DequeueChapterDownloadMutation = { __typename?: 'Mutation', dequeueChapterDownload: { __typename?: 'DequeueChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type DequeueChapterDownloadMutation = { __typename?: 'Mutation', dequeueChapterDownload: { __typename?: 'DequeueChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type DequeueChapterDownloadsMutationVariables = Exact<{ export type DequeueChapterDownloadsMutationVariables = Exact<{
input: DequeueChapterDownloadsInput; input: DequeueChapterDownloadsInput;
}>; }>;
export type DequeueChapterDownloadsMutation = { __typename?: 'Mutation', dequeueChapterDownloads: { __typename?: 'DequeueChapterDownloadsPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type DequeueChapterDownloadsMutation = { __typename?: 'Mutation', dequeueChapterDownloads: { __typename?: 'DequeueChapterDownloadsPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type EnqueueChapterDownloadMutationVariables = Exact<{ export type EnqueueChapterDownloadMutationVariables = Exact<{
input: EnqueueChapterDownloadInput; input: EnqueueChapterDownloadInput;
}>; }>;
export type EnqueueChapterDownloadMutation = { __typename?: 'Mutation', enqueueChapterDownload: { __typename?: 'EnqueueChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type EnqueueChapterDownloadMutation = { __typename?: 'Mutation', enqueueChapterDownload: { __typename?: 'EnqueueChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type EnqueueChapterDownloadsMutationVariables = Exact<{ export type EnqueueChapterDownloadsMutationVariables = Exact<{
input: EnqueueChapterDownloadsInput; input: EnqueueChapterDownloadsInput;
}>; }>;
export type EnqueueChapterDownloadsMutation = { __typename?: 'Mutation', enqueueChapterDownloads: { __typename?: 'EnqueueChapterDownloadsPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type EnqueueChapterDownloadsMutation = { __typename?: 'Mutation', enqueueChapterDownloads: { __typename?: 'EnqueueChapterDownloadsPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type ReorderChapterDownloadMutationVariables = Exact<{ export type ReorderChapterDownloadMutationVariables = Exact<{
input: ReorderChapterDownloadInput; input: ReorderChapterDownloadInput;
}>; }>;
export type ReorderChapterDownloadMutation = { __typename?: 'Mutation', reorderChapterDownload: { __typename?: 'ReorderChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } } }; export type ReorderChapterDownloadMutation = { __typename?: 'Mutation', reorderChapterDownload: { __typename?: 'ReorderChapterDownloadPayload', clientMutationId?: string | null, downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } } };
export type StartDownloaderMutationVariables = Exact<{ export type StartDownloaderMutationVariables = Exact<{
input?: InputMaybe<StartDownloaderInput>; input?: InputMaybe<StartDownloaderInput>;
@@ -2584,7 +2584,7 @@ export type GetChaptersQuery = { __typename?: 'Query', chapters: { __typename?:
export type GetDownloadStatusQueryVariables = Exact<{ [key: string]: never; }>; export type GetDownloadStatusQueryVariables = Exact<{ [key: string]: never; }>;
export type GetDownloadStatusQuery = { __typename?: 'Query', downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } }; export type GetDownloadStatusQuery = { __typename?: 'Query', downloadStatus: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } };
export type GetExtensionQueryVariables = Exact<{ export type GetExtensionQueryVariables = Exact<{
pkgName: Scalars['String']['input']; pkgName: Scalars['String']['input'];
@@ -2702,7 +2702,7 @@ export type GetLastUpdateTimestampQuery = { __typename?: 'Query', lastUpdateTime
export type DownloadStatusSubscriptionVariables = Exact<{ [key: string]: never; }>; export type DownloadStatusSubscriptionVariables = Exact<{ [key: string]: never; }>;
export type DownloadStatusSubscription = { __typename?: 'Subscription', downloadChanged: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, manga: { __typename?: 'MangaType', id: number, title: string } } }> } }; export type DownloadStatusSubscription = { __typename?: 'Subscription', downloadChanged: { __typename?: 'DownloadStatus', state: DownloaderState, queue: Array<{ __typename?: 'DownloadType', progress: number, state: DownloadState, tries: number, chapter: { __typename?: 'ChapterType', id: number, name: string, sourceOrder: number, isDownloaded: boolean, manga: { __typename?: 'MangaType', id: number, title: string, downloadCount: number } } }> } };
export type WebuiUpdateSubscriptionVariables = Exact<{ [key: string]: never; }>; export type WebuiUpdateSubscriptionVariables = Exact<{ [key: string]: never; }>;