Merge pull request #379 from psteinroe/fix/revalidate-relations

fix: make revalidate relations and table work again
psteinroe · Feb 14, 2024 · a11c145 · a11c145
2 parents ec72756 + a4d14bd
commit a11c145
Show file tree

Hide file tree

Showing 5 changed files with 92 additions and 3 deletions.
diff --git a/.changeset/rude-glasses-battle.md b/.changeset/rude-glasses-battle.md
@@ -0,0 +1,5 @@
+---
+"@supabase-cache-helpers/postgrest-swr": patch
+---
+
+fix: pass key to mutate when revalidating in swr
diff --git a/packages/postgrest-swr/__tests__/mutate/use-update-mutation.integration.spec.tsx b/packages/postgrest-swr/__tests__/mutate/use-update-mutation.integration.spec.tsx
@@ -160,4 +160,82 @@ describe('useUpdateMutation', () => {
     expect(screen.getByTestId('count').textContent).toEqual('count: 1');
     await screen.findByText('success: true', {}, { timeout: 10000 });
   });
+
+  it('revalidate relations should work', async () => {
+    const USERNAME = `${testRunPrefix}-rev-relations`;
+    const USERNAME_UPDATED = `${testRunPrefix}-rev-relations-updated`;
+    const NOTE_1 = `${testRunPrefix}-note-1`;
+    const NOTE_2 = `${testRunPrefix}-note-2`;
+
+    const { data: contact } = await client
+      .from('contact')
+      .insert([{ username: USERNAME }])
+      .select('id')
+      .single()
+      .throwOnError();
+
+    await client
+      .from('contact_note')
+      .insert([{ contact_id: contact!.id, text: NOTE_1 }])
+      .throwOnError();
+
+    function Page() {
+      const [success, setSuccess] = useState<boolean>(false);
+      const { data } = useQuery(
+        client
+          .from('contact_note')
+          .select('id,text')
+          .ilike('text', `${testRunPrefix}%`),
+        {
+          revalidateOnFocus: false,
+          revalidateOnReconnect: false,
+        },
+      );
+      const { trigger: update } = useUpdateMutation(
+        client.from('contact'),
+        ['id'],
+        'id',
+        {
+          revalidateTables: [{ schema: 'public', table: 'contact_note' }],
+          onSuccess: () => setSuccess(true),
+          onError: (error) => console.error(error),
+        },
+      );
+      return (
+        <div>
+          <div
+            data-testid="update"
+            onClick={async () =>
+              await update({
+                id: contact!.id,
+                username: USERNAME_UPDATED,
+              })
+            }
+          />
+          <span>
+            {(data ?? [])
+              .map((d) => d.text)
+              .sort()
+              .join(',')}
+          </span>
+          <span data-testid="success">{`success: ${success}`}</span>
+        </div>
+      );
+    }
+
+    renderWithConfig(<Page />, { provider: () => provider });
+    await screen.findByText([NOTE_1].join(','), {}, { timeout: 10000 });
+
+    await client
+      .from('contact_note')
+      .insert([{ contact_id: contact!.id, text: NOTE_2 }])
+      .throwOnError();
+
+    await screen.findByText([NOTE_1].join(','), {}, { timeout: 10000 });
+
+    fireEvent.click(screen.getByTestId('update'));
+
+    await screen.findByText([NOTE_1, NOTE_2].join(','), {}, { timeout: 10000 });
+    await screen.findByText('success: true', {}, { timeout: 10000 });
+  });
 });
diff --git a/packages/postgrest-swr/src/cache/use-delete-item.ts b/packages/postgrest-swr/src/cache/use-delete-item.ts
@@ -30,7 +30,9 @@ export function useDeleteItem<Type extends Record<string, unknown>>(
       {
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
-        revalidate: (key) => mutate({ ...opts, revalidate: true }),
+        revalidate: (key) => {
+          mutate(key, { ...opts, revalidate: true });
+        },
         mutate: (key, data) => {
           mutate(key, data, { ...opts, revalidate: opts?.revalidate ?? false });
         },

diff --git a/packages/postgrest-swr/src/cache/use-mutate-item.ts b/packages/postgrest-swr/src/cache/use-mutate-item.ts
@@ -32,7 +32,9 @@ export function useMutateItem<Type extends Record<string, unknown>>(
       {
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
-        revalidate: (key) => mutate({ ...opts, revalidate: true }),
+        revalidate: (key) => {
+          mutate(key, { ...opts, revalidate: true });
+        },
         mutate: (key, data) => {
           mutate(key, data, {
             ...opts,

diff --git a/packages/postgrest-swr/src/cache/use-upsert-item.ts b/packages/postgrest-swr/src/cache/use-upsert-item.ts
@@ -30,7 +30,9 @@ export function useUpsertItem<Type extends Record<string, unknown>>(
       {
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
-        revalidate: (key) => mutate({ ...opts, revalidate: true }),
+        revalidate: (key) => {
+          mutate(key, { ...opts, revalidate: true });
+        },
         mutate: (key, data) => {
           mutate(key, data, {
             ...opts,