Merge pull request psteinroe#399 from psteinroe/fix/revalidate-function-call

Author: psteinroe

.changeset/short-beds-knock.md

@@ -0,0 +1,5 @@
+---
+"@supabase-cache-helpers/postgrest-swr": patch
+---
+
+fix: properly pass parameters to mutate for revalidation

packages/postgrest-swr/__tests__/query/use-pagination-query.integration.spec.tsx

@@ -5,6 +5,7 @@ import React, { useState } from 'react';
 import {
   useInfiniteOffsetPaginationQuery,
   fetchOffsetPaginationHasMoreFallbackData,
+  useInsertMutation,
 } from '../../src';
 import type { Database } from '../database.types';
 import { renderWithConfig } from '../utils';
@@ -221,4 +222,57 @@ describe('useInfiniteOffsetPaginationQuery', () => {
     renderWithConfig(<Page />, { provider: () => provider });
     await screen.findByText(contacts[0].username!, {}, { timeout: 10000 });
   });
+
+  it('revalidation should work', async () => {
+    function Page() {
+      const [success, setSuccess] = useState(false);
+      const { currentPage, isLoading, setPage } =
+        useInfiniteOffsetPaginationQuery(
+          client
+            .from('contact')
+            .select('id,username')
+            .ilike('username', `${testRunPrefix}%`)
+            .order('username', { ascending: true }),
+          { pageSize: 1, revalidateOnReconnect: true },
+        );
+
+      const { trigger: insert } = useInsertMutation(
+        client.from('contact_note'),
+        ['id'],
+        null,
+        {
+          revalidateTables: [{ schema: 'public', table: 'contact' }],
+          onSuccess: () => setSuccess(true),
+          onError: (error) => console.error(error),
+        },
+      );
+
+      const contact = currentPage?.[0];
+
+      return (
+        <div>
+          <div
+            data-testid="revalidate"
+            onClick={() => insert([{ contact_id: contact!.id, text: 'Test' }])}
+          />
+          <div data-testid="pages">
+            {(currentPage ?? [])[0]?.username ?? 'undefined'}
+          </div>
+          <div>{`isLoading: ${isLoading}`}</div>
+          <div>{`success: ${success}`}</div>
+        </div>
+      );
+    }
+
+    renderWithConfig(<Page />, { provider: () => provider });
+    await screen.findByText('isLoading: false', {}, { timeout: 10000 });
+    await screen.findByText(contacts[0].username!, {}, { timeout: 10000 });
+    fireEvent.click(screen.getByTestId('revalidate'));
+    await screen.findByText('success: true', {}, { timeout: 10000 });
+    await screen.findByText(
+      `${testRunPrefix}-username-1`,
+      {},
+      { timeout: 10000 },
+    );
+  });
 });

packages/postgrest-swr/src/cache/use-delete-item.ts

@@ -31,7 +31,7 @@ export function useDeleteItem<Type extends Record<string, unknown>>(
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
         revalidate: (key) => {
-          mutate(key, { ...opts, revalidate: true });
+          mutate(key, null, { ...opts, revalidate: true });
         },
         mutate: (key, data) => {
           mutate(key, data, { ...opts, revalidate: opts?.revalidate ?? false });

packages/postgrest-swr/src/cache/use-mutate-item.ts

@@ -33,7 +33,7 @@ export function useMutateItem<Type extends Record<string, unknown>>(
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
         revalidate: (key) => {
-          mutate(key, { ...opts, revalidate: true });
+          mutate(key, null, { ...opts, revalidate: true });
         },
         mutate: (key, data) => {
           mutate(key, data, {

packages/postgrest-swr/src/cache/use-upsert-item.ts

@@ -31,7 +31,7 @@ export function useUpsertItem<Type extends Record<string, unknown>>(
         cacheKeys: getMutableKeys(Array.from(cache.keys())),
         getPostgrestFilter,
         revalidate: (key) => {
-          mutate(key, { ...opts, revalidate: true });
+          mutate(key, null, { ...opts, revalidate: true });
         },
         mutate: (key, data) => {
           mutate(key, data, {