solid-query-persist-client: init at 4.13.0

[milahu]

add persistent caching for solid-query

based on

• packages/react-query-persist-client
• packages/solid-query
  • #3730
  • #4211
• examples/react/offline

todo

fix tests?

example: remove workspace:* deps

done

make it build: packages/solid-query-persist-client/build/ is not generated → add buildConfigs block to rollup.config.ts

fix example: transitive dependencies are not installed by pnpm vite: ✘ [ERROR] Could not resolve "@mswjs/cookies" dependency graph: @tanstack/query-example-solid-offline → msw → @mswjs/cookies solved by removing { resolve: { preserveSymlinks: true } } from vite.config.ts

fixme: solid build is not produced packages/solid-query-persist-client/build/solid/ but is declared in tsconfig.json fixme: solid jsx is compiled to React.createElement packages/solid-query-persist-client/src/PersistQueryClientProvider.tsx solved by adding { "path": "packages/solid-query-persist-client" }, to the root tsconfig.json

fixme: service worker in typescript is not compiled to javascript? A bad HTTP response code (404) was received when fetching the script. fixed by running npx msw init . to generate mockServiceWorker.js (docs)

fixme: double fetching

rest-deps.js:82 [MSW] 21:58:24 GET /movies (200 OK)
rest-deps.js:82 [MSW] 21:58:24 GET /movies (200 OK)

fixed by query options { refetchOnMount: false }

i use unwrap to remove solidjs Proxy objects from queryKey before storing the query cache in indexeddb. is this a lossy transformation? or is it okay to restore the query cache without solidjs Proxy objects → okay because we use handleResult(observer.getCurrentResult()) which calls setState(unwrap(unwrappedResult)) which restores the solidjs Proxy objects

fix examples/solid/offline

createQueries: add persistence

~~createMutation: add persistence~~ no. useIsRestoring is used only in packages/react-query/src/useBaseQuery.ts packages/react-query/src/useQueries.ts

ping

@lukesmurray

[codesandbox-ci[bot]]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 2ce3b6c745b40061a8d62ba6b6092a5ed59733ed:

Sandbox	Source
@tanstack/query-example-react-basic-typescript	Configuration
@tanstack/query-example-solid-basic-typescript	Configuration
@tanstack/query-example-vue-basic	Configuration

[milahu]

currently blocked by

fixme: solid build is not produced packages/solid-query-persist-client/build/solid/ but is declared in tsconfig.json

fixme: solid jsx is compiled to React.createElement packages/solid-query-persist-client/src/PersistQueryClientProvider.tsx

no idea whats wrong ... should be compiled for solid, but is compiled for react

[ardeora]

Hello @milahu! Thanks for working on the persister! This is looking very promising. One thing I noticed that is preventing the solid folder to be generated is because you need to add another reference in the root tsconfig.

{ "path": "packages/solid-query-persist-client" },

Once you add that running pnpm run build should create the correct source build for the persist client

[milahu]

currently blocked by solidjs store functions, which cannot be stored in indexeddb

DOMException: Failed to execute 'put' on 'IDBObjectStore': function () { [native code] } could not be cloned.

caused by client.clientState.queries[0].state.data.movie.comment in examples/solid/offline/src/persister.ts and packages/solid-query/src/createBaseQuery.ts: setState(unwrap(unwrappedResult))

what would others do? solid-dexie createFetch().withCacheStorage()

[ardeora]

Closing this in favor of #5858