From 482db4626a7c13af4f769daa82807673a8bc4301 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Sat, 18 Nov 2023 19:55:35 +0100
Subject: [PATCH] Prevent infinite re-renders in extensions (#457)

Regression introduced with 593acc7f89e5a2125a13b884d93358bcef141ee0
---
 src/lib/requests/RequestManager.ts | 65 ++++++++++++++++++------------
 1 file changed, 40 insertions(+), 25 deletions(-)

diff --git a/src/lib/requests/RequestManager.ts b/src/lib/requests/RequestManager.ts
index 77a48dab..58a8dd9b 100644
--- a/src/lib/requests/RequestManager.ts
+++ b/src/lib/requests/RequestManager.ts
@@ -26,7 +26,7 @@ import {
     useSubscription,
 } from '@apollo/client';
 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 * as storage from '@/util/localStorage.tsx';
 import { GraphQLClient } from '@/lib/requests/client/GraphQLClient.ts';
@@ -876,33 +876,48 @@ export class RequestManager {
             {},
             { 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);
-        }
+            setUpdatedCache({});
+        }, [result.loading]);
+
         const cachedResult = this.cache.getResponseFor<typeof result>(EXTENSION_LIST_CACHE_KEY, undefined, 1000 * 60);
-        const normalizedCachedResult = !cachedResult
-            ? result
-            : {
-                  ...cachedResult,
-                  data: !cachedResult?.data?.fetchExtensions.extensions
-                      ? cachedResult?.data
-                      : {
-                            ...cachedResult.data,
-                            fetchExtensions: {
-                                ...cachedResult.data.fetchExtensions,
-                                extensions: cachedResult.data.fetchExtensions.extensions.map(
-                                    (extension) =>
-                                        this.graphQLClient.client.cache.readFragment<
-                                            GetExtensionsFetchMutation['fetchExtensions']['extensions'][0]
-                                        >({
-                                            id: this.graphQLClient.client.cache.identify(extension),
-                                            fragment: FULL_EXTENSION_FIELDS,
-                                        }) ?? extension,
-                                ),
-                            },
-                        },
-              };
+        const normalizedCachedResult = useMemo(
+            () =>
+                !cachedResult
+                    ? result
+                    : {
+                          ...cachedResult,
+                          data: !cachedResult?.data?.fetchExtensions.extensions
+                              ? cachedResult?.data
+                              : {
+                                    ...cachedResult.data,
+                                    fetchExtensions: {
+                                        ...cachedResult.data.fetchExtensions,
+                                        extensions: cachedResult.data.fetchExtensions.extensions.map(
+                                            (extension) =>
+                                                this.graphQLClient.client.cache.readFragment<
+                                                    GetExtensionsFetchMutation['fetchExtensions']['extensions'][0]
+                                                >({
+                                                    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]) => {
             if (cachedResult) {