@zenstackhq/tanstack-query 2.21.0 → 3.0.0-beta.16

package/test/react-query.test.tsx

@@ -0,0 +1,1787 @@
+/**
+ * @vitest-environment happy-dom
+ */
+
+import { QueryClient, QueryClientProvider, useQuery } from '@tanstack/react-query';
+import { act, cleanup, renderHook, waitFor } from '@testing-library/react';
+import nock from 'nock';
+import React from 'react';
+import { afterEach, describe, expect, it } from 'vitest';
+import { QuerySettingsProvider, useClientQueries } from '../src/react';
+import { getQueryKey } from '../src/utils/common';
+import { schema } from './schemas/basic/schema-lite';
+
+const BASE_URL = 'http://localhost';
+
+describe('React Query Test', () => {
+    function createWrapper() {
+        const queryClient = new QueryClient({
+            defaultOptions: {
+                queries: {
+                    retry: false,
+                },
+            },
+        });
+        const Provider = QuerySettingsProvider;
+        const wrapper = ({ children }: { children: React.ReactNode }) => (
+            <QueryClientProvider client={queryClient}>
+                <Provider value={{ endpoint: `${BASE_URL}/api/model`, logging: true }}>{children}</Provider>
+            </QueryClientProvider>
+        );
+        return { queryClient, wrapper };
+    }
+
+    function makeUrl(model: string, operation: string, args?: unknown) {
+        let r = `${BASE_URL}/api/model/${model}/${operation}`;
+        if (args) {
+            r += `?q=${encodeURIComponent(JSON.stringify(args))}`;
+        }
+        return r;
+    }
+
+    afterEach(() => {
+        nock.cleanAll();
+        cleanup();
+    });
+
+    it('works with simple query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, {
+                data,
+            });
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindUnique(queryArgs), {
+            wrapper,
+        });
+
+        await waitFor(() => {
+            expect(result.current.isSuccess).toBe(true);
+            expect(result.current.data).toMatchObject(data);
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findUnique', queryArgs));
+            expect(cacheData).toMatchObject(data);
+        });
+
+        nock(makeUrl('User', 'findFirst', queryArgs))
+            .get(/.*/)
+            .reply(404, () => {
+                return { error: 'Not Found' };
+            });
+        const { result: errorResult } = renderHook(() => useClientQueries(schema).user.useFindFirst(queryArgs), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(errorResult.current.isError).toBe(true);
+        });
+    });
+
+    it('works with suspense query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, {
+                data,
+            });
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useSuspenseFindUnique(queryArgs), {
+            wrapper,
+        });
+
+        await waitFor(() => {
+            expect(result.current.isSuccess).toBe(true);
+            expect(result.current.data).toMatchObject(data);
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findUnique', queryArgs));
+            expect(cacheData).toMatchObject(data);
+        });
+    });
+
+    it('works with infinite query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = [{ id: '1', name: 'foo' }];
+
+        nock(makeUrl('User', 'findMany', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }));
+
+        const { result } = renderHook(
+            () =>
+                useClientQueries(schema).user.useInfiniteFindMany(queryArgs, {
+                    getNextPageParam: () => null,
+                }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.isSuccess).toBe(true);
+            const resultData = result.current.data!;
+            expect(resultData.pages).toHaveLength(1);
+            expect(resultData.pages[0]).toMatchObject(data);
+            expect(resultData?.pageParams).toHaveLength(1);
+            expect(resultData?.pageParams[0]).toMatchObject(queryArgs);
+            expect(result.current.hasNextPage).toBe(false);
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', queryArgs, { infinite: true, optimisticUpdate: false }),
+            );
+            expect(cacheData.pages[0]).toMatchObject(data);
+        });
+    });
+
+    it('works with suspense infinite query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = [{ id: '1', name: 'foo' }];
+
+        nock(makeUrl('User', 'findMany', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }));
+
+        const { result } = renderHook(
+            () =>
+                useClientQueries(schema).user.useSuspenseInfiniteFindMany(queryArgs, {
+                    getNextPageParam: () => null,
+                }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.isSuccess).toBe(true);
+            const resultData = result.current.data!;
+            expect(resultData.pages).toHaveLength(1);
+            expect(resultData.pages[0]).toMatchObject(data);
+            expect(resultData?.pageParams).toHaveLength(1);
+            expect(resultData?.pageParams[0]).toMatchObject(queryArgs);
+            expect(result.current.hasNextPage).toBe(false);
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', queryArgs, { infinite: true, optimisticUpdate: false }),
+            );
+            expect(cacheData.pages[0]).toMatchObject(data);
+        });
+    });
+
+    it('works with independent mutation and query', async () => {
+        const { wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        let queryCount = 0;
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => {
+                queryCount++;
+                return { data };
+            })
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindUnique(queryArgs), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('Post', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({
+                data: { id: '1', title: 'post1' },
+            }));
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).post.useCreate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ data: { title: 'post1' } }));
+
+        await waitFor(() => {
+            // no refetch caused by invalidation
+            expect(queryCount).toBe(1);
+        });
+    });
+
+    it('works with create and invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindMany(), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => {
+                data.push({ id: '1', email: 'foo' });
+                return { data: data[0] };
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useCreate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ data: { email: 'foo' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findMany', undefined));
+            expect(cacheData).toHaveLength(1);
+        });
+    });
+
+    it('works with create and no invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindMany(), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => {
+                data.push({ id: '1', email: 'foo' });
+                return { data: data[0] };
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useCreate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ data: { email: 'foo' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findMany', undefined));
+            expect(cacheData).toHaveLength(0);
+        });
+    });
+
+    it('works with optimistic create single', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({
+                data: null,
+            }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ data: { email: 'foo' } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0].$optimistic).toBe(true);
+            expect(cacheData[0].id).toBeTruthy();
+            expect(cacheData[0].email).toBe('foo');
+        });
+    });
+
+    it('works with optimistic create updating nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [{ id: '1', name: 'user1', posts: [] }];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () =>
+                useClientQueries(schema).user.useFindMany(
+                    {
+                        include: { posts: true },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(1);
+        });
+
+        nock(makeUrl('Post', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({
+                data: null,
+            }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ data: { title: 'post1', owner: { connect: { id: '1' } } } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'User',
+                    'findMany',
+                    { include: { posts: true } },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            const posts = cacheData[0].posts;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({ $optimistic: true, id: expect.any(String), title: 'post1', ownerId: '1' });
+        });
+    });
+
+    it('works with optimistic create updating deeply nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        // populate the cache with a user
+
+        const userData: any[] = [{ id: '1', email: 'user1', posts: [] }];
+
+        nock(BASE_URL)
+            .get('/api/model/user/findMany')
+            .query(true)
+            .reply(200, () => ({ data: userData }))
+            .persist();
+
+        const { result: userResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useFindMany(
+                    {
+                        include: {
+                            posts: {
+                                include: {
+                                    category: true,
+                                },
+                            },
+                        },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(userResult.current.data).toHaveLength(1);
+        });
+
+        // populate the cache with a category
+        const categoryData: any[] = [{ id: '1', name: 'category1', posts: [] }];
+
+        nock(BASE_URL)
+            .get('/api/model/category/findMany')
+            .query(true)
+            .reply(200, () => ({ data: categoryData }))
+            .persist();
+
+        const { result: categoryResult } = renderHook(
+            () =>
+                useClientQueries(schema).category.useFindMany(
+                    {
+                        include: {
+                            posts: true,
+                        },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(categoryResult.current.data).toHaveLength(1);
+        });
+
+        // create a post and connect it to the category
+        nock(BASE_URL)
+            .post('/api/model/post/create')
+            .reply(200, () => ({
+                data: null,
+            }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                data: { title: 'post1', owner: { connect: { id: '1' } }, category: { connect: { id: '1' } } },
+            }),
+        );
+
+        // assert that the post was created and connected to the category
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'Category',
+                    'findMany',
+                    {
+                        include: {
+                            posts: true,
+                        },
+                    },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            const posts = cacheData[0].posts;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({
+                $optimistic: true,
+                id: expect.any(String),
+                title: 'post1',
+                ownerId: '1',
+            });
+        });
+
+        // assert that the post was created and connected to the user, and included the category
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'User',
+                    'findMany',
+                    {
+                        include: {
+                            posts: {
+                                include: {
+                                    category: true,
+                                },
+                            },
+                        },
+                    },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            const posts = cacheData[0].posts;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({
+                $optimistic: true,
+                id: expect.any(String),
+                title: 'post1',
+                ownerId: '1',
+                categoryId: '1',
+                // TODO: should this include the category object and not just the foreign key?
+                // category: { $optimistic: true, id: '1', name: 'category1' },
+            });
+        });
+    });
+
+    it('works with optimistic update with optional one-to-many relationship', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        // populate the cache with a post, with an optional category relationship
+        const postData: any = {
+            id: '1',
+            title: 'post1',
+            ownerId: '1',
+            categoryId: null,
+            category: null,
+        };
+
+        const data: any[] = [postData];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .query(true)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result: postResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useFindMany(
+                    {
+                        include: {
+                            category: true,
+                        },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(postResult.current.data).toHaveLength(1);
+        });
+
+        // mock a put request to update the post title
+        nock(makeUrl('Post', 'update'))
+            .put(/.*/)
+            .reply(200, () => {
+                postData.title = 'postA';
+                return { data: postData };
+            });
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' }, data: { title: 'postA' } }));
+
+        // assert that the post was updated despite the optional (null) category relationship
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'Post',
+                    'findMany',
+                    {
+                        include: {
+                            category: true,
+                        },
+                    },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            const posts = cacheData;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({
+                $optimistic: true,
+                id: expect.any(String),
+                title: 'postA',
+                ownerId: '1',
+                categoryId: null,
+                category: null,
+            });
+        });
+    });
+
+    it('works with optimistic update with nested optional one-to-many relationship', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        // populate the cache with a user and a post, with an optional category
+        const postData: any = {
+            id: '1',
+            title: 'post1',
+            ownerId: '1',
+            categoryId: null,
+            category: null,
+        };
+
+        const userData: any[] = [{ id: '1', name: 'user1', posts: [postData] }];
+
+        nock(BASE_URL)
+            .get('/api/model/user/findMany')
+            .query(true)
+            .reply(200, () => {
+                return { data: userData };
+            })
+            .persist();
+
+        const { result: userResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useFindMany(
+                    {
+                        include: {
+                            posts: {
+                                include: {
+                                    category: true,
+                                },
+                            },
+                        },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(userResult.current.data).toHaveLength(1);
+        });
+
+        // mock a put request to update the post title
+        nock(BASE_URL)
+            .put('/api/model/post/update')
+            .reply(200, () => {
+                postData.title = 'postA';
+                return { data: postData };
+            });
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' }, data: { title: 'postA' } }));
+
+        // assert that the post was updated
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'User',
+                    'findMany',
+                    {
+                        include: {
+                            posts: {
+                                include: {
+                                    category: true,
+                                },
+                            },
+                        },
+                    },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            const posts = cacheData[0].posts;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({
+                $optimistic: true,
+                id: expect.any(String),
+                title: 'postA',
+                ownerId: '1',
+                categoryId: null,
+                category: null,
+            });
+        });
+    });
+
+    it('works with optimistic nested create updating query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).post.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({
+                data: null,
+            }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ data: { email: 'user1', posts: { create: { title: 'post1' } } } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('Post', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0].$optimistic).toBe(true);
+            expect(cacheData[0].id).toBeTruthy();
+            expect(cacheData[0].title).toBe('post1');
+        });
+    });
+
+    it('works with optimistic create many', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'createMany'))
+            .post(/.*/)
+            .reply(200, () => ({
+                data: null,
+            }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreateMany({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ data: [{ email: 'foo' }, { email: 'bar' }] }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(2);
+        });
+    });
+
+    it('works with update and invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindUnique(queryArgs), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => {
+                data.name = 'bar';
+                return data;
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useUpdate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ ...queryArgs, data: { name: 'bar' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findUnique', queryArgs));
+            expect(cacheData).toMatchObject({ name: 'bar' });
+        });
+    });
+
+    it('works with update and no invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindUnique(queryArgs), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => {
+                data.name = 'bar';
+                return data;
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useUpdate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ ...queryArgs, data: { name: 'bar' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findUnique', queryArgs));
+            expect(cacheData).toMatchObject({ name: 'foo' });
+        });
+    });
+
+    it('works with optimistic update simple', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindUnique(queryArgs, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => data);
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ ...queryArgs, data: { name: 'bar' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(
+                getQueryKey('User', 'findUnique', queryArgs, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toMatchObject({ name: 'bar', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic update updating nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' }, include: { posts: true } };
+        const data = { id: '1', name: 'foo', posts: [{ id: 'p1', title: 'post1' }] };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindUnique(queryArgs, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('Post', 'update'))
+            .put(/.*/)
+            .reply(200, () => data);
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: 'p1' },
+                data: { title: 'post2', owner: { connect: { id: '2' } } },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findUnique', queryArgs, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData.posts[0]).toMatchObject({ title: 'post2', $optimistic: true, ownerId: '2' });
+        });
+    });
+
+    it('works with optimistic nested update updating query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: 'p1' } };
+        const data = { id: 'p1', title: 'post1' };
+
+        nock(makeUrl('Post', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).post.useFindUnique(queryArgs, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ title: 'post1' });
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => data);
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: '1' },
+                data: { posts: { update: { where: { id: 'p1' }, data: { title: 'post2' } } } },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('Post', 'findUnique', queryArgs, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toMatchObject({ title: 'post2', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - create simple', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'upsert'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpsert({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: '1' },
+                create: { id: '1', email: 'foo' },
+                update: { email: 'bar' },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0]).toMatchObject({ id: '1', email: 'foo', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - create updating nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = { id: '1', name: 'user1', posts: [{ id: 'p1', title: 'post1' }] };
+
+        nock(makeUrl('User', 'findUnique'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindUnique({ where: { id: '1' } }, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ id: '1' });
+        });
+
+        nock(makeUrl('Post', 'upsert'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useUpsert({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: 'p2' },
+                create: { id: 'p2', title: 'post2', owner: { connect: { id: '1' } } },
+                update: { title: 'post3' },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findUnique', { where: { id: '1' } }, { infinite: false, optimisticUpdate: true }),
+            );
+            const posts = cacheData.posts;
+            expect(posts).toHaveLength(2);
+            expect(posts[0]).toMatchObject({ id: 'p2', title: 'post2', ownerId: '1', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - nested create updating query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = [{ id: 'p1', title: 'post1' }];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).post.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(1);
+        });
+
+        nock(makeUrl('User', 'update'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: '1' },
+                data: {
+                    posts: {
+                        upsert: {
+                            where: { id: 'p2' },
+                            create: { id: 'p2', title: 'post2' },
+                            update: { title: 'post3' },
+                        },
+                    },
+                },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('Post', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(2);
+            expect(cacheData[0]).toMatchObject({ id: 'p2', title: 'post2', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - update simple', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' } };
+        const data = { id: '1', name: 'foo' };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindUnique(queryArgs, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ name: 'foo' });
+        });
+
+        nock(makeUrl('User', 'upsert'))
+            .post(/.*/)
+            .reply(200, () => data);
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpsert({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ ...queryArgs, update: { email: 'bar' }, create: { email: 'zee' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(
+                getQueryKey('User', 'findUnique', queryArgs, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toMatchObject({ email: 'bar', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - update updating nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = { id: '1', name: 'user1', posts: [{ id: 'p1', title: 'post1' }] };
+
+        nock(makeUrl('User', 'findUnique'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindUnique({ where: { id: '1' } }, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ id: '1' });
+        });
+
+        nock(makeUrl('Post', 'upsert'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useUpsert({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: 'p1' },
+                create: { id: 'p1', title: 'post1' },
+                update: { title: 'post2' },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findUnique', { where: { id: '1' } }, { infinite: false, optimisticUpdate: true }),
+            );
+            const posts = cacheData.posts;
+            expect(posts).toHaveLength(1);
+            expect(posts[0]).toMatchObject({ id: 'p1', title: 'post2', $optimistic: true });
+        });
+    });
+
+    it('works with optimistic upsert - nested update updating query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = [{ id: 'p1', title: 'post1' }];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).post.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(1);
+        });
+
+        nock(makeUrl('User', 'update'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() =>
+            mutationResult.current.mutate({
+                where: { id: '1' },
+                data: {
+                    posts: {
+                        upsert: {
+                            where: { id: 'p1' },
+                            create: { id: 'p1', title: 'post1' },
+                            update: { title: 'post2' },
+                        },
+                    },
+                },
+            }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('Post', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0]).toMatchObject({ id: 'p1', title: 'post2', $optimistic: true });
+        });
+    });
+
+    it('works with delete and invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [{ id: '1', name: 'foo' }];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindMany(), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(1);
+        });
+
+        nock(makeUrl('User', 'delete'))
+            .delete(/.*/)
+            .reply(200, () => {
+                data.splice(0, 1);
+                return { data: [] };
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useDelete(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(getQueryKey('User', 'findMany', undefined));
+            expect(cacheData).toHaveLength(0);
+        });
+    });
+
+    it('works with optimistic delete simple', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [{ id: '1', name: 'foo' }];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(1);
+        });
+
+        nock(makeUrl('User', 'delete'))
+            .delete(/.*/)
+            .reply(200, () => ({ data }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useDelete({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' } }));
+
+        await waitFor(() => {
+            const cacheData = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(0);
+        });
+    });
+
+    it('works with optimistic delete nested query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = { id: '1', name: 'foo', posts: [{ id: 'p1', title: 'post1' }] };
+
+        nock(makeUrl('User', 'findFirst'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () =>
+                useClientQueries(schema).user.useFindFirst(
+                    {
+                        include: { posts: true },
+                    },
+                    { optimisticUpdate: true },
+                ),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject({ id: '1' });
+        });
+
+        nock(makeUrl('Post', 'delete'))
+            .delete(/.*/)
+            .reply(200, () => ({ data }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).post.useDelete({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ where: { id: 'p1' } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey(
+                    'User',
+                    'findFirst',
+                    { include: { posts: true } },
+                    { infinite: false, optimisticUpdate: true },
+                ),
+            );
+            expect(cacheData.posts).toHaveLength(0);
+        });
+    });
+
+    it('works with optimistic nested delete update query', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any = [
+            { id: 'p1', title: 'post1' },
+            { id: 'p2', title: 'post2' },
+        ];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).post.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(2);
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => ({ data }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useUpdate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' }, data: { posts: { delete: { id: 'p1' } } } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('Post', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+        });
+    });
+
+    it('top-level mutation and nested-read invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const queryArgs = { where: { id: '1' }, include: { posts: true } };
+        const data = { posts: [{ id: '1', title: 'post1' }] };
+
+        nock(makeUrl('User', 'findUnique', queryArgs))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).user.useFindUnique(queryArgs), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject(data);
+        });
+
+        nock(makeUrl('Post', 'update'))
+            .put(/.*/)
+            .reply(200, () => {
+                data.posts[0]!.title = 'post2';
+                return data;
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).post.useUpdate(), {
+            wrapper,
+        });
+
+        act(() => mutationResult.current.mutate({ where: { id: '1' }, data: { title: 'post2' } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(getQueryKey('User', 'findUnique', queryArgs));
+            expect(cacheData.posts[0].title).toBe('post2');
+        });
+    });
+
+    it('nested mutation and top-level-read invalidation', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data = [{ id: '1', title: 'post1', ownerId: '1' }];
+
+        nock(makeUrl('Post', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({
+                data,
+            }))
+            .persist();
+
+        const { result } = renderHook(() => useClientQueries(schema).post.useFindMany(), {
+            wrapper,
+        });
+        await waitFor(() => {
+            expect(result.current.data).toMatchObject(data);
+        });
+
+        nock(makeUrl('User', 'update'))
+            .put(/.*/)
+            .reply(200, () => {
+                data.push({ id: '2', title: 'post2', ownerId: '1' });
+                return data;
+            });
+
+        const { result: mutationResult } = renderHook(() => useClientQueries(schema).user.useUpdate(), {
+            wrapper,
+        });
+
+        act(() =>
+            mutationResult.current.mutate({ where: { id: '1' }, data: { posts: { create: { title: 'post2' } } } }),
+        );
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(getQueryKey('Post', 'findMany', undefined));
+            expect(cacheData).toHaveLength(2);
+        });
+    });
+
+    it('optimistic create with custom provider', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }))
+            .persist();
+
+        const { result: mutationResult1 } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                    optimisticDataProvider: ({ queryModel, queryOperation }) => {
+                        if (queryModel === 'User' && queryOperation === 'findMany') {
+                            return { kind: 'Skip' };
+                        } else {
+                            return { kind: 'ProceedDefault' };
+                        }
+                    },
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult1.current.mutate({ data: { email: 'foo' } }));
+
+        // cache should not update
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(0);
+        });
+
+        const { result: mutationResult2 } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                    optimisticDataProvider: ({ queryModel, queryOperation, currentData, mutationArgs }) => {
+                        if (queryModel === 'User' && queryOperation === 'findMany') {
+                            return {
+                                kind: 'Update',
+                                data: [
+                                    ...currentData,
+                                    { id: 100, email: mutationArgs.data.email + 'hooray', $optimistic: true },
+                                ],
+                            };
+                        } else {
+                            return { kind: 'ProceedDefault' };
+                        }
+                    },
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult2.current.mutate({ data: { email: 'foo' } }));
+
+        // cache should update
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0].$optimistic).toBe(true);
+            expect(cacheData[0].id).toBeTruthy();
+            expect(cacheData[0].email).toBe('foohooray');
+        });
+    });
+
+    it('optimistic update mixed with non-zenstack queries', async () => {
+        const { queryClient, wrapper } = createWrapper();
+
+        // non-zenstack query
+        const { result: myQueryResult } = renderHook(
+            () => useQuery({ queryKey: ['myQuery'], queryFn: () => ({ data: 'myData' }) }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(myQueryResult.current.data).toEqual({ data: 'myData' });
+        });
+
+        const data: any[] = [];
+
+        nock(makeUrl('User', 'findMany'))
+            .get(/.*/)
+            .reply(200, () => ({ data }))
+            .persist();
+
+        const { result } = renderHook(
+            () => useClientQueries(schema).user.useFindMany(undefined, { optimisticUpdate: true }),
+            {
+                wrapper,
+            },
+        );
+        await waitFor(() => {
+            expect(result.current.data).toHaveLength(0);
+        });
+
+        nock(makeUrl('User', 'create'))
+            .post(/.*/)
+            .reply(200, () => ({ data: null }));
+
+        const { result: mutationResult } = renderHook(
+            () =>
+                useClientQueries(schema).user.useCreate({
+                    optimisticUpdate: true,
+                    invalidateQueries: false,
+                }),
+            {
+                wrapper,
+            },
+        );
+
+        act(() => mutationResult.current.mutate({ data: { email: 'foo' } }));
+
+        await waitFor(() => {
+            const cacheData: any = queryClient.getQueryData(
+                getQueryKey('User', 'findMany', undefined, { infinite: false, optimisticUpdate: true }),
+            );
+            expect(cacheData).toHaveLength(1);
+            expect(cacheData[0].$optimistic).toBe(true);
+            expect(cacheData[0].id).toBeTruthy();
+            expect(cacheData[0].email).toBe('foo');
+        });
+    });
+});