From 0c6dff0df3dbb54e2a56e41b71cf937f1c7279e8 Mon Sep 17 00:00:00 2001
From: Philipp Melab <philipp.melab@gmail.com>
Date: Wed, 29 Nov 2023 06:18:19 +0000
Subject: [PATCH] WIP

---
 packages/schema/src/operators.ts              |  2 +-
 packages/ui/.storybook/preview.tsx            | 42 ++++++++++++++++++-
 .../Organisms/ContentHub.stories.ts           |  3 --
 .../src/components/Organisms/ContentHub.tsx   |  1 +
 packages/ui/src/utils/operation.ts            |  2 +-
 5 files changed, 44 insertions(+), 6 deletions(-)

diff --git a/packages/schema/src/operators.ts b/packages/schema/src/operators.ts
index 7cd935eaf..91139bf5e 100644
--- a/packages/schema/src/operators.ts
+++ b/packages/schema/src/operators.ts
@@ -118,7 +118,7 @@ class OperatorRegistryError<OperationId extends AnyOperationId> extends Error {
 export function createOperator<OperationId extends AnyOperationId>(
   id: OperationId,
   variables?: OperationVariables<OperationId>,
-): () => OperationResult<OperationId> | Promise<OperationResult<OperationId>> {
+) {
   const op = getCandidates(id)
     .filter((entry) => matchVariables(entry.variables, variables))
     .pop();
diff --git a/packages/ui/.storybook/preview.tsx b/packages/ui/.storybook/preview.tsx
index 862356614..01a91549f 100644
--- a/packages/ui/.storybook/preview.tsx
+++ b/packages/ui/.storybook/preview.tsx
@@ -30,8 +30,48 @@ const LocationDecorator: Decorator = (Story, ctx) => {
   );
 };
 
+declare global {
+  interface Window {
+    __STORYBOOK_PREVIEW__: {
+      currentRender: {
+        id: string;
+      };
+    };
+  }
+}
+
+const SWRCacheDecorator: Decorator = (Story) => {
+  const { cache } = useSWRConfig();
+  for (const key of cache.keys()) {
+    cache.delete(key);
+  }
+  return (
+    <SWRConfig
+      value={{
+        use: [
+          (useSWR) => (key, fetcher, config) => {
+            return useSWR(
+              // Make sure SWR caches are unique per story.
+              [key, window.__STORYBOOK_PREVIEW__.currentRender.id],
+              fetcher,
+              config,
+            );
+          },
+        ],
+      }}
+    >
+      <Story />
+    </SWRConfig>
+  );
+};
+
 export const parameters = {
   chromatic: { viewports: [320, 840, 1440] },
 };
 
-export const decorators = [LocationDecorator, IntlDecorator, OperatorDecorator];
+export const decorators = [
+  LocationDecorator,
+  IntlDecorator,
+  OperatorDecorator,
+  SWRCacheDecorator,
+];
diff --git a/packages/ui/src/components/Organisms/ContentHub.stories.ts b/packages/ui/src/components/Organisms/ContentHub.stories.ts
index 8b1956234..19f0ade52 100644
--- a/packages/ui/src/components/Organisms/ContentHub.stories.ts
+++ b/packages/ui/src/components/Organisms/ContentHub.stories.ts
@@ -22,14 +22,12 @@ export const Empty = {
         contentHub: { total: 0, items: [] },
       })),
     ],
-    location: new URL('local:/content-hub?page=111'),
   },
 } satisfies StoryObj<typeof ContentHub>;
 
 export const Loading = {
   parameters: {
     operators: [buildOperator(ContentHubQuery, () => new Promise(() => {}))],
-    location: new URL('local:/content-hub?page=222'),
   },
 } satisfies StoryObj<typeof ContentHub>;
 
@@ -40,7 +38,6 @@ export const Error = {
         throw 'Error loading content hub.';
       }),
     ],
-    location: new URL('local:/content-hub?page=333'),
   },
 } satisfies StoryObj<typeof ContentHub>;
 
diff --git a/packages/ui/src/components/Organisms/ContentHub.tsx b/packages/ui/src/components/Organisms/ContentHub.tsx
index 43ff7cfab..c240ee41a 100644
--- a/packages/ui/src/components/Organisms/ContentHub.tsx
+++ b/packages/ui/src/components/Organisms/ContentHub.tsx
@@ -19,6 +19,7 @@ export function ContentHub({ pageSize = 10 }: { pageSize: number }) {
       offset: currentPage * pageSize - pageSize,
     },
   });
+  console.log(error);
   return (
     <div className="mx-auto max-w-6xl">
       <SearchForm />
diff --git a/packages/ui/src/utils/operation.ts b/packages/ui/src/utils/operation.ts
index ee9956a80..bff873c5d 100644
--- a/packages/ui/src/utils/operation.ts
+++ b/packages/ui/src/utils/operation.ts
@@ -12,7 +12,7 @@ export function useOperation<TOperation extends AnyOperationId>(
 ) {
   return useSwr<OperationResult<TOperation>>(
     [operation, variables],
-    variables ? createOperator(operation, variables) : null,
+    createOperator(operation, variables),
     {
       suspense: false,
     },