Prevent infinite re-renders in extensions (#457)

Regression introduced with 593acc7f89
This commit is contained in:
schroda
2023-11-18 19:55:35 +01:00
committed by GitHub
parent 8d4687428f
commit 482db4626a

View File

@@ -26,7 +26,7 @@ import {
useSubscription, useSubscription,
} from '@apollo/client'; } from '@apollo/client';
import { OperationVariables } from '@apollo/client/core'; import { OperationVariables } from '@apollo/client/core';
import { useEffect, useRef, useState } from 'react'; import { useEffect, useMemo, useRef, useState } from 'react';
import { IRestClient, RestClient } from '@/lib/requests/client/RestClient.ts'; import { IRestClient, RestClient } from '@/lib/requests/client/RestClient.ts';
import * as storage from '@/util/localStorage.tsx'; import * as storage from '@/util/localStorage.tsx';
import { GraphQLClient } from '@/lib/requests/client/GraphQLClient.ts'; import { GraphQLClient } from '@/lib/requests/client/GraphQLClient.ts';
@@ -876,33 +876,48 @@ export class RequestManager {
{}, {},
{ refetchQueries: [GET_EXTENSIONS], ...options }, { refetchQueries: [GET_EXTENSIONS], ...options },
); );
const [, setUpdatedCache] = useState({});
useEffect(() => {
if (result.loading) {
return;
}
if (!result.data?.fetchExtensions.extensions) {
return;
}
if (result.data?.fetchExtensions.extensions) {
this.cache.cacheResponse(EXTENSION_LIST_CACHE_KEY, undefined, result); this.cache.cacheResponse(EXTENSION_LIST_CACHE_KEY, undefined, result);
} setUpdatedCache({});
}, [result.loading]);
const cachedResult = this.cache.getResponseFor<typeof result>(EXTENSION_LIST_CACHE_KEY, undefined, 1000 * 60); const cachedResult = this.cache.getResponseFor<typeof result>(EXTENSION_LIST_CACHE_KEY, undefined, 1000 * 60);
const normalizedCachedResult = !cachedResult const normalizedCachedResult = useMemo(
? result () =>
: { !cachedResult
...cachedResult, ? result
data: !cachedResult?.data?.fetchExtensions.extensions : {
? cachedResult?.data ...cachedResult,
: { data: !cachedResult?.data?.fetchExtensions.extensions
...cachedResult.data, ? cachedResult?.data
fetchExtensions: { : {
...cachedResult.data.fetchExtensions, ...cachedResult.data,
extensions: cachedResult.data.fetchExtensions.extensions.map( fetchExtensions: {
(extension) => ...cachedResult.data.fetchExtensions,
this.graphQLClient.client.cache.readFragment< extensions: cachedResult.data.fetchExtensions.extensions.map(
GetExtensionsFetchMutation['fetchExtensions']['extensions'][0] (extension) =>
>({ this.graphQLClient.client.cache.readFragment<
id: this.graphQLClient.client.cache.identify(extension), GetExtensionsFetchMutation['fetchExtensions']['extensions'][0]
fragment: FULL_EXTENSION_FIELDS, >({
}) ?? extension, id: this.graphQLClient.client.cache.identify(extension),
), fragment: FULL_EXTENSION_FIELDS,
}, }) ?? extension,
}, ),
}; },
},
},
[this.cache.getFetchTimestampFor(EXTENSION_LIST_CACHE_KEY, undefined)],
);
const wrappedMutate = async (mutateOptions: Parameters<typeof mutate>[0]) => { const wrappedMutate = async (mutateOptions: Parameters<typeof mutate>[0]) => {
if (cachedResult) { if (cachedResult) {