From c66781970b50db61f7e771af2d91cc0f120c624b Mon Sep 17 00:00:00 2001
From: Peng Xiao <pengxiao@outlook.com>
Date: Thu, 14 Dec 2023 08:04:50 +0000
Subject: [PATCH] feat(core): add useQueryImmutable (#5299)

---
 .../hooks/affine/use-is-workspace-owner.ts    |  4 +-
 .../src/hooks/affine/use-server-flavor.ts     |  7 +--
 packages/frontend/workspace/src/affine/gql.ts | 43 +++++++++++--------
 3 files changed, 28 insertions(+), 26 deletions(-)

diff --git a/packages/frontend/core/src/hooks/affine/use-is-workspace-owner.ts b/packages/frontend/core/src/hooks/affine/use-is-workspace-owner.ts
index c85f990561..3470a61dbb 100644
--- a/packages/frontend/core/src/hooks/affine/use-is-workspace-owner.ts
+++ b/packages/frontend/core/src/hooks/affine/use-is-workspace-owner.ts
@@ -1,8 +1,8 @@
 import { getIsOwnerQuery } from '@affine/graphql';
-import { useQuery } from '@affine/workspace/affine/gql';
+import { useQueryImmutable } from '@affine/workspace/affine/gql';
 
 export function useIsWorkspaceOwner(workspaceId: string) {
-  const { data } = useQuery({
+  const { data } = useQueryImmutable({
     query: getIsOwnerQuery,
     variables: {
       workspaceId,
diff --git a/packages/frontend/core/src/hooks/affine/use-server-flavor.ts b/packages/frontend/core/src/hooks/affine/use-server-flavor.ts
index b7335d2318..25a4be6535 100644
--- a/packages/frontend/core/src/hooks/affine/use-server-flavor.ts
+++ b/packages/frontend/core/src/hooks/affine/use-server-flavor.ts
@@ -1,5 +1,5 @@
 import { serverConfigQuery } from '@affine/graphql';
-import { useQuery } from '@affine/workspace/affine/gql';
+import { useQueryImmutable } from '@affine/workspace/affine/gql';
 import type { BareFetcher, Middleware } from 'swr';
 
 const wrappedFetcher = (fetcher: BareFetcher<any> | null, ...args: any[]) =>
@@ -10,13 +10,10 @@ const errorHandler: Middleware = useSWRNext => (key, fetcher, config) => {
 };
 
 export const useServerFlavor = () => {
-  const { data: config, error } = useQuery(
+  const { data: config, error } = useQueryImmutable(
     { query: serverConfigQuery },
     {
       use: [errorHandler],
-      revalidateOnFocus: false,
-      revalidateOnMount: false,
-      revalidateIfStale: false,
     }
   );
 
diff --git a/packages/frontend/workspace/src/affine/gql.ts b/packages/frontend/workspace/src/affine/gql.ts
index 36f02c4eca..2b6778d3ff 100644
--- a/packages/frontend/workspace/src/affine/gql.ts
+++ b/packages/frontend/workspace/src/affine/gql.ts
@@ -13,6 +13,7 @@ import type { GraphQLError } from 'graphql';
 import { useMemo } from 'react';
 import type { Key, SWRConfiguration, SWRResponse } from 'swr';
 import useSWR, { useSWRConfig } from 'swr';
+import useSWRImutable from 'swr/immutable';
 import useSWRInfinite from 'swr/infinite';
 import type {
   SWRMutationConfiguration,
@@ -44,7 +45,7 @@ export const fetcher = gqlFetcherFactory(
  * })
  * ```
  */
-export function useQuery<Query extends GraphQLQuery>(
+type useQueryFn = <Query extends GraphQLQuery>(
   options: QueryOptions<Query>,
   config?: Omit<
     SWRConfiguration<
@@ -54,31 +55,35 @@ export function useQuery<Query extends GraphQLQuery>(
     >,
     'fetcher'
   >
-): SWRResponse<
+) => SWRResponse<
   QueryResponse<Query>,
   GraphQLError | GraphQLError[],
   {
     suspense: true;
   }
 >;
-export function useQuery<Query extends GraphQLQuery>(
-  options: QueryOptions<Query>,
-  config?: any
-) {
-  const configWithSuspense: SWRConfiguration = useMemo(
-    () => ({
-      suspense: true,
-      ...config,
-    }),
-    [config]
-  );
 
-  return useSWR(
-    () => ['cloud', options.query.id, options.variables],
-    () => fetcher(options),
-    configWithSuspense
-  );
-}
+const createUseQuery =
+  (immutable: boolean): useQueryFn =>
+  (options, config) => {
+    const configWithSuspense: SWRConfiguration = useMemo(
+      () => ({
+        suspense: true,
+        ...config,
+      }),
+      [config]
+    );
+
+    const useSWRFn = immutable ? useSWRImutable : useSWR;
+    return useSWRFn(
+      options ? () => ['cloud', options.query.id, options.variables] : null,
+      options ? () => fetcher(options) : null,
+      configWithSuspense
+    );
+  };
+
+export const useQuery = createUseQuery(false);
+export const useQueryImmutable = createUseQuery(true);
 
 export function useQueryInfinite<Query extends GraphQLQuery>(
   options: Omit<QueryOptions<Query>, 'variables'> & {