@tanstack/svelte-query-persist-client 5.48.0 → 5.49.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/svelte-query-persist-client",
-  "version": "5.48.0",
+  "version": "5.49.1",
   "description": "Svelte bindings to work with persisters in TanStack/svelte-query",
   "author": "Lachlan Collins",
   "license": "MIT",
@@ -27,7 +27,7 @@
     "src"
   ],
   "dependencies": {
-    "@tanstack/query-persist-client-core": "5.48.0"
+    "@tanstack/query-persist-client-core": "5.49.1"
   },
   "devDependencies": {
     "@sveltejs/package": "^2.3.1",
@@ -36,12 +36,11 @@
     "eslint-plugin-svelte": "^2.40.0",
     "svelte": "^4.2.17",
     "svelte-check": "^3.7.1",
-    "svelte-eslint-parser": "^0.39.1",
-    "@tanstack/svelte-query": "5.48.0"
+    "@tanstack/svelte-query": "5.49.1"
   },
   "peerDependencies": {
     "svelte": "^3.54.0 || ^4.0.0 || ^5.0.0-next.0",
-    "@tanstack/svelte-query": "^5.48.0"
+    "@tanstack/svelte-query": "^5.49.1"
   },
   "scripts": {}
 }

package/dist/__tests__/AwaitOnSuccess/AwaitOnSuccess.svelte

@@ -1,26 +0,0 @@
-<script>import { createQuery } from "@tanstack/svelte-query";
-import { get } from "svelte/store";
-import { sleep } from "../utils";
-export let key;
-export let states;
-const state = createQuery({
-  queryKey: key,
-  queryFn: async () => {
-    states.update((s) => [...s, "fetching"]);
-    await sleep(10);
-    states.update((s) => [...s, "fetched"]);
-    return "fetched";
-  }
-});
-let data = get(state).data;
-let fetchStatus = get(state).fetchStatus;
-state.subscribe((s) => {
-  data = s.data;
-  fetchStatus = s.fetchStatus;
-});
-</script>
-
-<div>
-  <h1>{data}</h1>
-  <h2>fetchStatus: {fetchStatus}</h2>
-</div>

package/dist/__tests__/AwaitOnSuccess/AwaitOnSuccess.svelte.d.ts

@@ -1,18 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Writable } from 'svelte/store';
-declare const __propDef: {
-    props: {
-        key: Array<string>;
-        states: Writable<Array<string>>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type AwaitOnSuccessProps = typeof __propDef.props;
-export type AwaitOnSuccessEvents = typeof __propDef.events;
-export type AwaitOnSuccessSlots = typeof __propDef.slots;
-export default class AwaitOnSuccess extends SvelteComponentTyped<AwaitOnSuccessProps, AwaitOnSuccessEvents, AwaitOnSuccessSlots> {
-}
-export {};

package/dist/__tests__/AwaitOnSuccess/Provider.svelte

@@ -1,12 +0,0 @@
-<script>import PersistQueryClientProvider from "../../PersistQueryClientProvider.svelte";
-import AwaitOnSuccess from "./AwaitOnSuccess.svelte";
-export let queryClient;
-export let persistOptions;
-export let key;
-export let onSuccess;
-export let states;
-</script>
-
-<PersistQueryClientProvider client={queryClient} {persistOptions} {onSuccess}>
-  <AwaitOnSuccess {key} {states} />
-</PersistQueryClientProvider>

package/dist/__tests__/AwaitOnSuccess/Provider.svelte.d.ts

@@ -1,23 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query';
-import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core';
-import type { Writable } from 'svelte/store';
-declare const __propDef: {
-    props: {
-        queryClient: QueryClient;
-        persistOptions: OmitKeyof<PersistQueryClientOptions, 'queryClient'>;
-        key: Array<string>;
-        onSuccess: () => Promise<void>;
-        states: Writable<Array<string>>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ProviderProps = typeof __propDef.props;
-export type ProviderEvents = typeof __propDef.events;
-export type ProviderSlots = typeof __propDef.slots;
-export default class Provider extends SvelteComponentTyped<ProviderProps, ProviderEvents, ProviderSlots> {
-}
-export {};

package/dist/__tests__/FreshData/FreshData.svelte

@@ -1,31 +0,0 @@
-<script>import { createQuery } from "@tanstack/svelte-query";
-import { get } from "svelte/store";
-import { sleep } from "../utils";
-export let key;
-export let states;
-export let fetched;
-const state = createQuery({
-  queryKey: key,
-  queryFn: async () => {
-    fetched.set(true);
-    await sleep(10);
-    return "fetched";
-  },
-  staleTime: Infinity
-});
-let data = get(state).data;
-let fetchStatus = get(state).fetchStatus;
-state.subscribe((s) => {
-  states.update((prev) => [
-    ...prev,
-    { status: s.status, data: s.data, fetchStatus: s.fetchStatus }
-  ]);
-  data = s.data;
-  fetchStatus = s.fetchStatus;
-});
-</script>
-
-<div>
-  <h1>data: {data ?? 'null'}</h1>
-  <h2>fetchStatus: {fetchStatus}</h2>
-</div>

package/dist/__tests__/FreshData/FreshData.svelte.d.ts

@@ -1,20 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Writable } from 'svelte/store';
-import type { StatusResult } from '../utils';
-declare const __propDef: {
-    props: {
-        key: Array<string>;
-        states: Writable<Array<StatusResult<string>>>;
-        fetched: Writable<boolean>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type FreshDataProps = typeof __propDef.props;
-export type FreshDataEvents = typeof __propDef.events;
-export type FreshDataSlots = typeof __propDef.slots;
-export default class FreshData extends SvelteComponentTyped<FreshDataProps, FreshDataEvents, FreshDataSlots> {
-}
-export {};

package/dist/__tests__/FreshData/Provider.svelte

@@ -1,12 +0,0 @@
-<script>import PersistQueryClientProvider from "../../PersistQueryClientProvider.svelte";
-import FreshData from "./FreshData.svelte";
-export let queryClient;
-export let persistOptions;
-export let key;
-export let states;
-export let fetched;
-</script>
-
-<PersistQueryClientProvider client={queryClient} {persistOptions}>
-  <FreshData {key} {states} {fetched} />
-</PersistQueryClientProvider>

package/dist/__tests__/FreshData/Provider.svelte.d.ts

@@ -1,24 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query';
-import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core';
-import type { Writable } from 'svelte/store';
-import type { StatusResult } from '../utils';
-declare const __propDef: {
-    props: {
-        queryClient: QueryClient;
-        persistOptions: OmitKeyof<PersistQueryClientOptions, 'queryClient'>;
-        key: Array<string>;
-        states: Writable<Array<StatusResult<string>>>;
-        fetched: Writable<boolean>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ProviderProps = typeof __propDef.props;
-export type ProviderEvents = typeof __propDef.events;
-export type ProviderSlots = typeof __propDef.slots;
-export default class Provider extends SvelteComponentTyped<ProviderProps, ProviderEvents, ProviderSlots> {
-}
-export {};

package/dist/__tests__/InitialData/InitialData.svelte

@@ -1,32 +0,0 @@
-<script>import { createQuery } from "@tanstack/svelte-query";
-import { get } from "svelte/store";
-import { sleep } from "../utils";
-export let key;
-export let states;
-const state = createQuery({
-  queryKey: key,
-  queryFn: async () => {
-    await sleep(10);
-    return "fetched";
-  },
-  initialData: "initial",
-  // make sure that initial data is older than the hydration data
-  // otherwise initialData would be newer and takes precedence
-  initialDataUpdatedAt: 1
-});
-let data = get(state).data;
-let fetchStatus = get(state).fetchStatus;
-state.subscribe((s) => {
-  states.update((prev) => [
-    ...prev,
-    { status: s.status, data: s.data, fetchStatus: s.fetchStatus }
-  ]);
-  data = s.data;
-  fetchStatus = s.fetchStatus;
-});
-</script>
-
-<div>
-  <h1>{data}</h1>
-  <h2>fetchStatus: {fetchStatus}</h2>
-</div>

package/dist/__tests__/InitialData/InitialData.svelte.d.ts

@@ -1,19 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Writable } from 'svelte/store';
-import type { StatusResult } from '../utils';
-declare const __propDef: {
-    props: {
-        key: Array<string>;
-        states: Writable<Array<StatusResult<string>>>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type InitialDataProps = typeof __propDef.props;
-export type InitialDataEvents = typeof __propDef.events;
-export type InitialDataSlots = typeof __propDef.slots;
-export default class InitialData extends SvelteComponentTyped<InitialDataProps, InitialDataEvents, InitialDataSlots> {
-}
-export {};

package/dist/__tests__/InitialData/Provider.svelte

@@ -1,11 +0,0 @@
-<script>import PersistQueryClientProvider from "../../PersistQueryClientProvider.svelte";
-import InitialData from "./InitialData.svelte";
-export let queryClient;
-export let persistOptions;
-export let key;
-export let states;
-</script>
-
-<PersistQueryClientProvider client={queryClient} {persistOptions}>
-  <InitialData {key} {states} />
-</PersistQueryClientProvider>

package/dist/__tests__/InitialData/Provider.svelte.d.ts

@@ -1,23 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query';
-import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core';
-import type { Writable } from 'svelte/store';
-import type { StatusResult } from '../utils';
-declare const __propDef: {
-    props: {
-        queryClient: QueryClient;
-        persistOptions: OmitKeyof<PersistQueryClientOptions, 'queryClient'>;
-        key: Array<string>;
-        states: Writable<Array<StatusResult<string>>>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ProviderProps = typeof __propDef.props;
-export type ProviderEvents = typeof __propDef.events;
-export type ProviderSlots = typeof __propDef.slots;
-export default class Provider extends SvelteComponentTyped<ProviderProps, ProviderEvents, ProviderSlots> {
-}
-export {};

package/dist/__tests__/OnSuccess/OnSuccess.svelte

@@ -1,23 +0,0 @@
-<script>import { createQuery } from "@tanstack/svelte-query";
-import { get } from "svelte/store";
-import { sleep } from "../utils";
-export let key;
-const state = createQuery({
-  queryKey: key,
-  queryFn: async () => {
-    await sleep(10);
-    return "fetched";
-  }
-});
-let data = get(state).data;
-let fetchStatus = get(state).fetchStatus;
-state.subscribe((s) => {
-  data = s.data;
-  fetchStatus = s.fetchStatus;
-});
-</script>
-
-<div>
-  <h1>{data}</h1>
-  <h2>fetchStatus: {fetchStatus}</h2>
-</div>

package/dist/__tests__/OnSuccess/OnSuccess.svelte.d.ts

@@ -1,16 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-declare const __propDef: {
-    props: {
-        key: Array<string>;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type OnSuccessProps = typeof __propDef.props;
-export type OnSuccessEvents = typeof __propDef.events;
-export type OnSuccessSlots = typeof __propDef.slots;
-export default class OnSuccess extends SvelteComponentTyped<OnSuccessProps, OnSuccessEvents, OnSuccessSlots> {
-}
-export {};

package/dist/__tests__/OnSuccess/Provider.svelte

@@ -1,11 +0,0 @@
-<script>import PersistQueryClientProvider from "../../PersistQueryClientProvider.svelte";
-import OnSuccess from "./OnSuccess.svelte";
-export let queryClient;
-export let persistOptions;
-export let key;
-export let onSuccess;
-</script>
-
-<PersistQueryClientProvider client={queryClient} {persistOptions} {onSuccess}>
-  <OnSuccess {key} />
-</PersistQueryClientProvider>

package/dist/__tests__/OnSuccess/Provider.svelte.d.ts

@@ -1,21 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { OmitKeyof, QueryClient } from '@tanstack/svelte-query';
-import type { PersistQueryClientOptions } from '@tanstack/query-persist-client-core';
-declare const __propDef: {
-    props: {
-        queryClient: QueryClient;
-        persistOptions: OmitKeyof<PersistQueryClientOptions, 'queryClient'>;
-        key: Array<string>;
-        onSuccess: () => void;
-    };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type ProviderProps = typeof __propDef.props;
-export type ProviderEvents = typeof __propDef.events;
-export type ProviderSlots = typeof __propDef.slots;
-export default class Provider extends SvelteComponentTyped<ProviderProps, ProviderEvents, ProviderSlots> {
-}
-export {};

package/dist/__tests__/PersistQueryClientProvider.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/__tests__/PersistQueryClientProvider.test.js

@@ -1,294 +0,0 @@
-import { render, waitFor } from '@testing-library/svelte';
-import { describe, expect, test, vi } from 'vitest';
-import { persistQueryClientSave } from '@tanstack/query-persist-client-core';
-import { get, writable } from 'svelte/store';
-import AwaitOnSuccess from './AwaitOnSuccess/Provider.svelte';
-import FreshData from './FreshData/Provider.svelte';
-import OnSuccess from './OnSuccess/Provider.svelte';
-import InitialData from './InitialData/Provider.svelte';
-import RemoveCache from './RemoveCache/Provider.svelte';
-import RestoreCache from './RestoreCache/Provider.svelte';
-import UseQueries from './UseQueries/Provider.svelte';
-import { createQueryClient, queryKey, sleep } from './utils';
-const createMockPersister = () => {
-    let storedState;
-    return {
-        async persistClient(persistClient) {
-            storedState = persistClient;
-        },
-        async restoreClient() {
-            await sleep(10);
-            return storedState;
-        },
-        removeClient() {
-            storedState = undefined;
-        },
-    };
-};
-const createMockErrorPersister = (removeClient) => {
-    const error = new Error('restore failed');
-    return [
-        error,
-        {
-            async persistClient() {
-                // noop
-            },
-            async restoreClient() {
-                await sleep(10);
-                throw error;
-            },
-            removeClient,
-        },
-    ];
-};
-describe('PersistQueryClientProvider', () => {
-    test('restores cache from persister', async () => {
-        const key = queryKey();
-        const states = writable([]);
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const rendered = render(RestoreCache, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                states,
-            },
-        });
-        await waitFor(() => rendered.getByText('fetchStatus: idle'));
-        await waitFor(() => rendered.getByText('hydrated'));
-        await waitFor(() => rendered.getByText('fetched'));
-        const states_ = get(states);
-        expect(states_).toHaveLength(4);
-        expect(states_[0]).toMatchObject({
-            status: 'pending',
-            fetchStatus: 'idle',
-            data: undefined,
-        });
-        expect(states_[1]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[2]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[3]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'idle',
-            data: 'fetched',
-        });
-    });
-    test('should also put useQueries into idle state', async () => {
-        const key = queryKey();
-        const states = writable([]);
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const rendered = render(UseQueries, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                states,
-            },
-        });
-        await waitFor(() => rendered.getByText('fetchStatus: idle'));
-        await waitFor(() => rendered.getByText('hydrated'));
-        await waitFor(() => rendered.getByText('fetched'));
-        const states_ = get(states);
-        expect(states_).toHaveLength(4);
-        expect(states_[0]).toMatchObject({
-            status: 'pending',
-            fetchStatus: 'idle',
-            data: undefined,
-        });
-        expect(states_[1]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[2]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[3]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'idle',
-            data: 'fetched',
-        });
-    });
-    test('should show initialData while restoring', async () => {
-        const key = queryKey();
-        const states = writable([]);
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const rendered = render(InitialData, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                states,
-            },
-        });
-        await waitFor(() => rendered.getByText('initial'));
-        await waitFor(() => rendered.getByText('hydrated'));
-        await waitFor(() => rendered.getByText('fetched'));
-        const states_ = get(states);
-        expect(states_).toHaveLength(4);
-        expect(states_[0]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'idle',
-            data: 'initial',
-        });
-        expect(states_[1]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[2]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'fetching',
-            data: 'hydrated',
-        });
-        expect(states_[3]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'idle',
-            data: 'fetched',
-        });
-    });
-    test('should not refetch after restoring when data is fresh', async () => {
-        const key = queryKey();
-        const states = writable([]);
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const fetched = writable(false);
-        const rendered = render(FreshData, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                states,
-                fetched,
-            },
-        });
-        await waitFor(() => rendered.getByText('data: null'));
-        await waitFor(() => rendered.getByText('data: hydrated'));
-        const states_ = get(states);
-        expect(states_).toHaveLength(2);
-        expect(get(fetched)).toBe(false);
-        expect(states_[0]).toMatchObject({
-            status: 'pending',
-            fetchStatus: 'idle',
-            data: undefined,
-        });
-        expect(states_[1]).toMatchObject({
-            status: 'success',
-            fetchStatus: 'idle',
-            data: 'hydrated',
-        });
-    });
-    test('should call onSuccess after successful restoring', async () => {
-        const key = queryKey();
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const onSuccess = vi.fn();
-        const rendered = render(OnSuccess, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                onSuccess,
-            },
-        });
-        expect(onSuccess).toHaveBeenCalledTimes(0);
-        await waitFor(() => rendered.getByText('hydrated'));
-        expect(onSuccess).toHaveBeenCalledTimes(1);
-        await waitFor(() => rendered.getByText('fetched'));
-    });
-    test('should await onSuccess after successful restoring', async () => {
-        const key = queryKey();
-        const queryClient = createQueryClient();
-        await queryClient.prefetchQuery({
-            queryKey: key,
-            queryFn: () => Promise.resolve('hydrated'),
-        });
-        const persister = createMockPersister();
-        await persistQueryClientSave({ queryClient, persister });
-        queryClient.clear();
-        const states = writable([]);
-        const rendered = render(AwaitOnSuccess, {
-            props: {
-                queryClient,
-                persistOptions: { persister },
-                key,
-                states,
-                onSuccess: async () => {
-                    states.update((s) => [...s, 'onSuccess']);
-                    await sleep(20);
-                    states.update((s) => [...s, 'onSuccess done']);
-                },
-            },
-        });
-        await waitFor(() => rendered.getByText('hydrated'));
-        await waitFor(() => rendered.getByText('fetched'));
-        expect(get(states)).toEqual([
-            'onSuccess',
-            'onSuccess done',
-            'fetching',
-            'fetched',
-        ]);
-    });
-    test('should remove cache after non-successful restoring', async () => {
-        const key = queryKey();
-        const consoleMock = vi.spyOn(console, 'error');
-        const consoleWarn = vi
-            .spyOn(console, 'warn')
-            .mockImplementation(() => undefined);
-        consoleMock.mockImplementation(() => undefined);
-        const queryClient = createQueryClient();
-        const removeClient = vi.fn();
-        const [error, persister] = createMockErrorPersister(removeClient);
-        const rendered = render(RemoveCache, {
-            props: { queryClient, persistOptions: { persister }, key },
-        });
-        await waitFor(() => rendered.getByText('fetched'));
-        expect(removeClient).toHaveBeenCalledTimes(1);
-        expect(consoleMock).toHaveBeenCalledTimes(1);
-        expect(consoleMock).toHaveBeenNthCalledWith(1, error);
-        consoleMock.mockRestore();
-        consoleWarn.mockRestore();
-    });
-});