diff --git a/.changeset/gorgeous-pens-give.md b/.changeset/gorgeous-pens-give.md new file mode 100644 index 00000000..2f92b7b9 --- /dev/null +++ b/.changeset/gorgeous-pens-give.md @@ -0,0 +1,5 @@ +--- +'@powersync/tanstack-react-query': patch +--- + +Fixed issue with queries not reacting to local data changes or causing an infinite loop on certain sql parameters. diff --git a/packages/tanstack-react-query/src/hooks/useQuery.ts b/packages/tanstack-react-query/src/hooks/useQuery.ts index fc2c3dc9..e47d7388 100644 --- a/packages/tanstack-react-query/src/hooks/useQuery.ts +++ b/packages/tanstack-react-query/src/hooks/useQuery.ts @@ -89,6 +89,9 @@ function useQueryCore< } } + const stringifiedParams = JSON.stringify(queryParameters); + const stringifiedKey = JSON.stringify(options.queryKey); + const fetchTables = async () => { try { const tables = await powerSync.resolveTables(sqlStatement, queryParameters); @@ -104,7 +107,7 @@ function useQueryCore< (async () => { await fetchTables(); })(); - }, [powerSync, sqlStatement, queryParameters]); + }, [powerSync, sqlStatement, stringifiedParams]); const queryFn = React.useCallback(async () => { if (error) { @@ -116,7 +119,7 @@ function useQueryCore< } catch (e) { return Promise.reject(e); } - }, [powerSync, query, parameters, options.queryKey, error]); + }, [powerSync, query, parameters, stringifiedKey, error]); React.useEffect(() => { if (error || !query) return () => {}; @@ -139,7 +142,7 @@ function useQueryCore< } ); return () => abort.abort(); - }, [powerSync, options.queryKey, queryClient, tables, error]); + }, [powerSync, queryClient, stringifiedKey, tables, error]); return useQueryFn( {