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

Reduce requested chapter data in queries

Browse Source
This commit is contained in:
schroda
2024-07-02 16:20:28 +02:00
parent 9b8ace003d
commit 2fa1de578c
19 changed files with 400 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/lib/data/Chapters.ts
View File

@@ -9,11 +9,12 @@
import { t as translate } from 'i18next';
import gql from 'graphql-tag';
import { DocumentNode } from '@apollo/client';
import { ChapterOffset, TChapter, TManga, TranslationKey } from '@/typings.ts';
import { ChapterOffset, TManga, TranslationKey } from '@/typings.ts';
import { makeToast } from '@/components/util/Toast.tsx';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { getMetadataServerSettings } from '@/lib/metadata/metadataServerSettings.ts';
import { FULL_CHAPTER_FIELDS } from '@/lib/graphql/Fragments.ts';
import { ChapterListFieldsFragment, ChapterType } from '@/lib/graphql/generated/graphql.ts';
import { CHAPTER_LIST_FIELDS } from '@/lib/graphql/fragments/ChapterFragments.ts';
export type ChapterAction = 'download' | 'delete' | 'bookmark' | 'unbookmark' | 'mark_as_read' | 'mark_as_unread';
@@ -77,24 +78,24 @@ export const actionToTranslationKey: {
},
};
export type ChapterIdInfo = Pick<TChapter, 'id'>;
export type ChapterMangaInfo = Pick<TChapter, 'mangaId'>;
export type ChapterDownloadInfo = ChapterIdInfo & Pick<TChapter, 'isDownloaded'>;
export type ChapterBookmarkInfo = ChapterIdInfo & Pick<TChapter, 'isBookmarked'>;
export type ChapterReadInfo = ChapterIdInfo & Pick<TChapter, 'isRead'>;
export type ChapterNumberInfo = ChapterIdInfo & Pick<TChapter, 'chapterNumber'>;
export type ChapterScanlatorInfo = ChapterIdInfo & Pick<TChapter, 'scanlator'>;
export type ChapterRealUrlInfo = Pick<TChapter, 'realUrl'>;
export type ChapterIdInfo = Pick<ChapterType, 'id'>;
export type ChapterMangaInfo = Pick<ChapterType, 'mangaId'>;
export type ChapterDownloadInfo = ChapterIdInfo & Pick<ChapterType, 'isDownloaded'>;
export type ChapterBookmarkInfo = ChapterIdInfo & Pick<ChapterType, 'isBookmarked'>;
export type ChapterReadInfo = ChapterIdInfo & Pick<ChapterType, 'isRead'>;
export type ChapterNumberInfo = ChapterIdInfo & Pick<ChapterType, 'chapterNumber'>;
export type ChapterScanlatorInfo = ChapterIdInfo & Pick<ChapterType, 'scanlator'>;
export type ChapterRealUrlInfo = Pick<ChapterType, 'realUrl'>;
export class Chapters {
static getIds(chapters: { id: number }[]): number[] {
return chapters.map((chapter) => chapter.id);
}
static getFromCache<T>(
static getFromCache<T = ChapterListFieldsFragment>(
id: number,
fragment: DocumentNode = FULL_CHAPTER_FIELDS,
fragmentName: string = 'FULL_CHAPTER_FIELDS',
fragment: DocumentNode = CHAPTER_LIST_FIELDS,
fragmentName: string = 'CHAPTER_LIST_FIELDS',
): T | null {
return requestManager.graphQLClient.client.cache.readFragment<T>({
id: requestManager.graphQLClient.client.cache.identify({
@@ -107,7 +108,7 @@ export class Chapters {
}
static isDownloading(id: number): boolean {
return !!requestManager.graphQLClient.client.cache.readFragment<TChapter>({
return !!requestManager.graphQLClient.client.cache.readFragment<ChapterType>({
id: requestManager.graphQLClient.client.cache.identify({
__typename: 'DownloadType',
chapter: {

9
src/lib/data/ChaptersWithMeta.ts
View File

@@ -6,17 +6,18 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import { TChapter } from '@/typings.ts';
import { DownloadType } from '@/lib/graphql/generated/graphql.ts';
import { Chapters } from '@/lib/data/Chapters.ts';
import { ChapterBookmarkInfo, ChapterDownloadInfo, ChapterReadInfo, Chapters } from '@/lib/data/Chapters.ts';
export type ChapterWithMetaType = {
chapter: TChapter;
chapter: ChapterDownloadInfo & ChapterReadInfo & ChapterBookmarkInfo;
downloadChapter: DownloadType | undefined;
};
export class ChaptersWithMeta {
static getChapters(chapters: ChapterWithMetaType[]): TChapter[] {
static getChapters<ChaptersWithMeta extends ChapterWithMetaType>(
chapters: ChaptersWithMeta[],
): ChaptersWithMeta['chapter'][] {
return chapters.map(({ chapter }) => chapter);
}

84
src/lib/graphql/fragments/ChapterFragments.ts Normal file
View File

@@ -0,0 +1,84 @@
/*
* Copyright (C) Contributors to the Suwayomi project
*
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import gql from 'graphql-tag';
const MANGA_BASE_FIELDS = gql`
fragment MANGA_BASE_FIELDS on MangaType {
id
title
thumbnailUrl
thumbnailUrlLastFetched
inLibrary
initialized
}
`;
export const CHAPTER_BASE_FIELDS = gql`
fragment CHAPTER_BASE_FIELDS on ChapterType {
id
name
mangaId
scanlator
realUrl
sourceOrder
chapterNumber
}
`;
export const CHAPTER_STATE_FIELDS = gql`
fragment CHAPTER_STATE_FIELDS on ChapterType {
id
isRead
isDownloaded
isBookmarked
}
`;
export const CHAPTER_READER_FIELDS = gql`
${CHAPTER_BASE_FIELDS}
${CHAPTER_STATE_FIELDS}
fragment CHAPTER_READER_FIELDS on ChapterType {
...CHAPTER_BASE_FIELDS
...CHAPTER_STATE_FIELDS
lastPageRead
pageCount
}
`;
export const CHAPTER_LIST_FIELDS = gql`
${CHAPTER_BASE_FIELDS}
${CHAPTER_STATE_FIELDS}
fragment CHAPTER_LIST_FIELDS on ChapterType {
...CHAPTER_BASE_FIELDS
...CHAPTER_STATE_FIELDS
fetchedAt
uploadDate
}
`;
export const CHAPTER_UPDATE_LIST_FIELDS = gql`
${CHAPTER_LIST_FIELDS}
${MANGA_BASE_FIELDS}
fragment CHAPTER_UPDATE_LIST_FIELDS on ChapterType {
...CHAPTER_LIST_FIELDS
manga {
...MANGA_BASE_FIELDS
}
}
`;

7
src/lib/graphql/generated/apollo-helpers.ts
View File

@@ -1,7 +1,6 @@
import {FieldPolicy, FieldReadFunction, Reference, TypePolicies, TypePolicy} from '@apollo/client/cache';
import {
GetChapterQueryVariables,
GetChaptersQuery, GetDownloadStatusQueryVariables, GetExtensionQueryVariables, GetGlobalMetadataQueryVariables,
GetChaptersMangaQuery, GetDownloadStatusQueryVariables, GetExtensionQueryVariables, GetGlobalMetadataQueryVariables,
GetMangaQueryVariables, GetSourceQueryVariables, GetUpdateStatusQueryVariables, GetWebuiUpdateStatusQueryVariables,
} from "@/lib/graphql/generated/graphql.ts";
import {FieldFunctionOptions} from "@apollo/client/cache/inmemory/policies";
@@ -575,8 +574,8 @@ export type QueryFieldPolicy = {
aboutWebUI?: FieldPolicy<any> | FieldReadFunction<any>,
categories?: FieldPolicy<any> | FieldReadFunction<any>,
category?: FieldPolicy<any> | FieldReadFunction<any>,
chapter?: FieldPolicy<Reference, Reference, Reference, FieldFunctionOptions<GetChapterQueryVariables>> | FieldReadFunction<Reference, Reference, FieldFunctionOptions<GetChapterQueryVariables>>,
chapters?: FieldPolicy<GetChaptersQuery['chapters']> | FieldReadFunction<GetChaptersQuery['chapters']>,
chapter?: FieldPolicy<any> | FieldReadFunction<any>,
chapters?: FieldPolicy<GetChaptersMangaQuery['chapters']> | FieldReadFunction<GetChaptersMangaQuery['chapters']>,
checkForServerUpdates?: FieldPolicy<any> | FieldReadFunction<any>,
checkForWebUIUpdate?: FieldPolicy<any> | FieldReadFunction<any>,
downloadStatus?: FieldPolicy<Reference, Reference, Reference, FieldFunctionOptions<GetDownloadStatusQueryVariables>> | FieldReadFunction<Reference, Reference, FieldFunctionOptions<GetDownloadStatusQueryVariables>>,

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

File diff suppressed because one or more lines are too long

8
src/lib/graphql/mutations/ChapterMutation.ts
View File

@@ -7,7 +7,8 @@
*/
import gql from 'graphql-tag';
import { BASE_TRACK_RECORD_FIELDS, FULL_CHAPTER_FIELDS } from '@/lib/graphql/Fragments';
import { BASE_TRACK_RECORD_FIELDS } from '@/lib/graphql/Fragments';
import { CHAPTER_LIST_FIELDS } from '@/lib/graphql/fragments/ChapterFragments.ts';
export const DELETE_CHAPTER_METADATA = gql`
mutation DELETE_CHAPTER_METADATA($input: DeleteChapterMetaInput!) {
@@ -51,12 +52,13 @@ export const GET_CHAPTER_PAGES_FETCH = gql`
// makes the server fetch and return the chapters of the manga
export const GET_MANGA_CHAPTERS_FETCH = gql`
${FULL_CHAPTER_FIELDS}
${CHAPTER_LIST_FIELDS}
mutation GET_MANGA_CHAPTERS_FETCH($input: FetchChaptersInput!) {
fetchChapters(input: $input) {
clientMutationId
chapters {
...FULL_CHAPTER_FIELDS
...CHAPTER_LIST_FIELDS
manga {
id
chapters {

110
src/lib/graphql/queries/ChapterQuery.ts
View File

@@ -7,23 +7,20 @@
*/
import gql from 'graphql-tag';
import { FULL_CHAPTER_FIELDS, PAGE_INFO } from '@/lib/graphql/Fragments';
// returns the current chapter from the database
export const GET_CHAPTER = gql`
${FULL_CHAPTER_FIELDS}
query GET_CHAPTER($id: Int!) {
chapter(id: $id) {
...FULL_CHAPTER_FIELDS
}
}
`;
import { PAGE_INFO } from '@/lib/graphql/Fragments';
import {
CHAPTER_LIST_FIELDS,
CHAPTER_READER_FIELDS,
CHAPTER_STATE_FIELDS,
CHAPTER_UPDATE_LIST_FIELDS,
} from '@/lib/graphql/fragments/ChapterFragments.ts';
// returns the current chapters from the database
export const GET_CHAPTERS = gql`
${FULL_CHAPTER_FIELDS}
export const GET_CHAPTERS_READER = gql`
${CHAPTER_READER_FIELDS}
${PAGE_INFO}
query GET_CHAPTERS(
query GET_CHAPTERS_READER(
$after: Cursor
$before: Cursor
$condition: ChapterConditionInput
@@ -46,7 +43,83 @@ export const GET_CHAPTERS = gql`
orderByType: $orderByType
) {
nodes {
...FULL_CHAPTER_FIELDS
...CHAPTER_READER_FIELDS
}
pageInfo {
...PAGE_INFO
}
totalCount
}
}
`;
// returns the current chapters from the database
export const GET_CHAPTERS_MANGA = gql`
${CHAPTER_LIST_FIELDS}
${PAGE_INFO}
query GET_CHAPTERS_MANGA(
$after: Cursor
$before: Cursor
$condition: ChapterConditionInput
$filter: ChapterFilterInput
$first: Int
$last: Int
$offset: Int
$orderBy: ChapterOrderBy
$orderByType: SortOrder
) {
chapters(
after: $after
before: $before
condition: $condition
filter: $filter
first: $first
last: $last
offset: $offset
orderBy: $orderBy
orderByType: $orderByType
) {
nodes {
...CHAPTER_LIST_FIELDS
}
pageInfo {
...PAGE_INFO
}
totalCount
}
}
`;
// returns the current chapters from the database
export const GET_CHAPTERS_UPDATES = gql`
${CHAPTER_UPDATE_LIST_FIELDS}
${PAGE_INFO}
query GET_CHAPTERS_UPDATES(
$after: Cursor
$before: Cursor
$condition: ChapterConditionInput
$filter: ChapterFilterInput
$first: Int
$last: Int
$offset: Int
$orderBy: ChapterOrderBy
$orderByType: SortOrder
) {
chapters(
after: $after
before: $before
condition: $condition
filter: $filter
first: $first
last: $last
offset: $offset
orderBy: $orderBy
orderByType: $orderByType
) {
nodes {
...CHAPTER_UPDATE_LIST_FIELDS
}
pageInfo {
...PAGE_INFO
@@ -57,6 +130,8 @@ export const GET_CHAPTERS = gql`
`;
export const GET_MANGAS_CHAPTER_IDS_WITH_STATE = gql`
${CHAPTER_STATE_FIELDS}
query GET_MANGAS_CHAPTER_IDS_WITH_STATE(
$mangaIds: [Int!]!
$isDownloaded: Boolean = null
@@ -69,10 +144,7 @@ export const GET_MANGAS_CHAPTER_IDS_WITH_STATE = gql`
orderBy: SOURCE_ORDER
) {
nodes {
id
isDownloaded
isRead
isBookmarked
...CHAPTER_STATE_FIELDS
mangaId
scanlator
chapterNumber

6
src/lib/metadata/metadata.ts
View File

@@ -14,7 +14,6 @@ import {
Metadata,
MetadataHolder,
MetadataKeyValuePair,
TChapter,
TManga,
TPartialSource,
} from '@/typings.ts';
@@ -22,6 +21,7 @@ import { requestManager } from '@/lib/requests/RequestManager.ts';
import { MetaType } from '@/lib/graphql/generated/graphql.ts';
import { DEFAULT_DEVICE, getActiveDevice } from '@/util/device.ts';
import { CategoryIdInfo } from '@/lib/data/Categories.ts';
import { ChapterIdInfo } from '@/lib/data/Chapters.ts';
const APP_METADATA_KEY_PREFIX = 'webUI_';
@@ -373,7 +373,7 @@ export const requestUpdateMetadataValue = async (
await requestManager.setCategoryMeta((metadataHolder as CategoryIdInfo).id, metadataKey, value).response;
break;
case 'chapter':
await requestManager.setChapterMeta((metadataHolder as TChapter).id, metadataKey, value).response;
await requestManager.setChapterMeta((metadataHolder as ChapterIdInfo).id, metadataKey, value).response;
break;
case 'global':
await requestManager.setGlobalMetadata(metadataKey, value).response;
@@ -405,7 +405,7 @@ export const requestUpdateMangaMetadata = async (
): Promise<void[]> => requestUpdateMetadata(manga, 'manga', keysToValues);
export const requestUpdateChapterMetadata = async (
chapter: TChapter,
chapter: ChapterIdInfo & GqlMetaHolder,
keysToValues: MetadataKeyValuePair[],
): Promise<void[]> => requestUpdateMetadata(chapter, 'chapter', keysToValues);

103
src/lib/requests/RequestManager.ts
View File

@@ -69,8 +69,6 @@ import {
GetCategoryMangasQueryVariables,
GetChapterPagesFetchMutation,
GetChapterPagesFetchMutationVariables,
GetChaptersQuery,
GetChaptersQueryVariables,
GetExtensionsFetchMutation,
GetExtensionsFetchMutationVariables,
GetExtensionsQuery,
@@ -199,6 +197,10 @@ import {
SetSourceMetadataMutationVariables,
GetCategoriesSettingsQuery,
GetCategoriesSettingsQueryVariables,
GetChaptersMangaQuery,
GetChaptersMangaQueryVariables,
GetChaptersUpdatesQuery,
GetChaptersUpdatesQueryVariables,
} from '@/lib/graphql/generated/graphql.ts';
import { GET_GLOBAL_METADATAS } from '@/lib/graphql/queries/GlobalMetadataQuery.ts';
import { SET_GLOBAL_METADATA } from '@/lib/graphql/mutations/GlobalMetadataMutation.ts';
@@ -253,7 +255,11 @@ import {
START_DOWNLOADER,
STOP_DOWNLOADER,
} from '@/lib/graphql/mutations/DownloaderMutation.ts';
import { GET_CHAPTERS, GET_MANGAS_CHAPTER_IDS_WITH_STATE } from '@/lib/graphql/queries/ChapterQuery.ts';
import {
GET_CHAPTERS_MANGA,
GET_CHAPTERS_UPDATES,
GET_MANGAS_CHAPTER_IDS_WITH_STATE,
} from '@/lib/graphql/queries/ChapterQuery.ts';
import {
GET_CHAPTER_PAGES_FETCH,
GET_MANGA_CHAPTERS_FETCH,
@@ -1835,30 +1841,34 @@ export class RequestManager {
);
}
public useGetChapters(
variables: GetChaptersQueryVariables,
options?: QueryHookOptions<GetChaptersQuery, GetChaptersQueryVariables>,
): AbortableApolloUseQueryResponse<GetChaptersQuery, GetChaptersQueryVariables> {
return this.doRequest(GQLMethod.USE_QUERY, GET_CHAPTERS, variables, options);
public useGetChapters<Data, Variables extends OperationVariables>(
document: DocumentNode | TypedDocumentNode<Data, Variables>,
variables: Variables,
options?: QueryHookOptions<Data, Variables>,
): AbortableApolloUseQueryResponse<Data, Variables> {
return this.doRequest(GQLMethod.USE_QUERY, document, variables, options);
}
public getChapters(
variables: GetChaptersQueryVariables,
options?: QueryOptions<GetChaptersQueryVariables, GetChaptersQuery>,
): AbortabaleApolloQueryResponse<GetChaptersQuery> {
return this.doRequest(GQLMethod.QUERY, GET_CHAPTERS, variables, options);
public getChapters<Data, Variables extends OperationVariables>(
document: DocumentNode | TypedDocumentNode<Data, Variables>,
variables: Variables,
options?: QueryOptions<Variables, Data>,
): AbortabaleApolloQueryResponse<Data> {
return this.doRequest(GQLMethod.QUERY, document, variables, options);
}
public useGetMangaChapters(
public useGetMangaChapters<Data, Variables extends OperationVariables>(
document: DocumentNode | TypedDocumentNode<Data, Variables>,
mangaId: number | string,
options?: QueryHookOptions<GetChaptersQuery, GetChaptersQueryVariables>,
): AbortableApolloUseQueryResponse<GetChaptersQuery, GetChaptersQueryVariables> {
options?: QueryHookOptions<Data, Variables>,
): AbortableApolloUseQueryResponse<Data, Variables> {
return this.useGetChapters(
document,
{
condition: { mangaId: Number(mangaId) },
orderBy: ChapterOrderBy.SourceOrder,
orderByType: SortOrder.Desc,
},
} as unknown as Variables,
options,
);
}
@@ -1887,24 +1897,25 @@ export class RequestManager {
GQLMethod.MUTATION,
GET_MANGA_CHAPTERS_FETCH,
{ input: { mangaId: Number(mangaId) } },
{ refetchQueries: [GET_CHAPTERS], ...options },
{ refetchQueries: [GET_CHAPTERS_MANGA], ...options },
);
}
public useGetMangaChapter(
mangaId: number | string,
chapterIndex: number | string,
options?: QueryHookOptions<GetChaptersQuery, GetChaptersQueryVariables>,
options?: QueryHookOptions<GetChaptersMangaQuery, GetChaptersMangaQueryVariables>,
): AbortableApolloUseQueryResponse<
Omit<GetChaptersQuery, 'chapters'> & { chapter: GetChaptersQuery['chapters']['nodes'][number] },
GetChaptersQueryVariables
Omit<GetChaptersMangaQuery, 'chapters'> & { chapter: GetChaptersMangaQuery['chapters']['nodes'][number] },
GetChaptersMangaQueryVariables
> {
type Response = AbortableApolloUseQueryResponse<
Omit<GetChaptersQuery, 'chapters'> & { chapter: GetChaptersQuery['chapters']['nodes'][number] },
GetChaptersQueryVariables
Omit<GetChaptersMangaQuery, 'chapters'> & { chapter: GetChaptersMangaQuery['chapters']['nodes'][number] },
GetChaptersMangaQueryVariables
>;
const chapterResponse = this.useGetChapters(
const chapterResponse = this.useGetChapters<GetChaptersMangaQuery, GetChaptersMangaQueryVariables>(
GET_CHAPTERS_MANGA,
{ condition: { mangaId: Number(mangaId), sourceOrder: Number(chapterIndex) } },
options,
);
@@ -1921,43 +1932,6 @@ export class RequestManager {
} as unknown as Response;
}
public getChapter(
mangaId: number | string,
chapterIndex: number | string,
options?: QueryOptions<GetChaptersQueryVariables, GetChaptersQuery>,
): AbortabaleApolloQueryResponse<
Omit<GetChaptersQuery, 'chapters'> & { chapter: GetChaptersQuery['chapters']['nodes'][number] }
> {
type ResponseData = Omit<GetChaptersQuery, 'chapters'> & {
chapter: GetChaptersQuery['chapters']['nodes'][number];
};
const chapterRequest = this.doRequest<GetChaptersQuery, GetChaptersQueryVariables>(
GQLMethod.QUERY,
GET_CHAPTERS,
{
condition: { mangaId: Number(mangaId), sourceOrder: Number(chapterIndex) },
},
options,
);
return {
...chapterRequest,
response: chapterRequest.response.then((chapterResponse) => {
if (!chapterResponse.data) {
return chapterResponse;
}
return {
...chapterResponse,
data: {
chapter: chapterResponse.data.chapters.nodes[0],
},
};
}) as Promise<ApolloQueryResult<ResponseData>>,
};
}
public useGetChapterPagesFetch(
chapterId: string | number,
options?: MutationHookOptions<GetChapterPagesFetchMutation, GetChapterPagesFetchMutationVariables>,
@@ -2425,15 +2399,16 @@ export class RequestManager {
public useGetRecentlyUpdatedChapters(
initialPages: number = 1,
options?: QueryHookOptions<GetChaptersQuery, GetChaptersQueryVariables>,
): AbortableApolloUseQueryResponse<GetChaptersQuery, GetChaptersQueryVariables> {
options?: QueryHookOptions<GetChaptersUpdatesQuery, GetChaptersUpdatesQueryVariables>,
): AbortableApolloUseQueryResponse<GetChaptersUpdatesQuery, GetChaptersUpdatesQueryVariables> {
const PAGE_SIZE = 50;
const CACHE_KEY = 'useGetRecentlyUpdatedChapters';
const offset = this.cache.getResponseFor<number>(CACHE_KEY, undefined) ?? 0;
const [lastOffset] = useState(offset);
const result = this.useGetChapters(
const result = this.useGetChapters<GetChaptersUpdatesQuery, GetChaptersUpdatesQueryVariables>(
GET_CHAPTERS_UPDATES,
{
filter: { inLibrary: { equalTo: true } },
orderBy: ChapterOrderBy.FetchedAt,