refactor(react-query-devtools): use `superjson` to display values

[aboqasem]

Fixes #1552

[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 c42bf384217031d128fb9aaea2a3d82ee1915826:

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

[codecov-commenter]

Codecov Report

Merging #4085 (8d98084) into main (eab6e2c) will increase coverage by 0.45%. The diff coverage is n/a.

@@            Coverage Diff             @@
##             main    #4085      +/-   ##
==========================================
+ Coverage   96.36%   96.81%   +0.45%     
==========================================
  Files          45       57      +12     
  Lines        2281     2672     +391     
  Branches      640      784     +144     
==========================================
+ Hits         2198     2587     +389     
- Misses         80       83       +3     
+ Partials        3        2       -1     

Impacted Files	Coverage Δ
src/core/queryCache.ts
src/devtools/theme.tsx
src/react/logger.native.ts
src/core/retryer.ts
src/devtools/utils.ts
src/react/useIsMutating.ts
src/core/mutation.ts
src/devtools/useMediaQuery.ts
src/react/reactBatchedUpdates.ts
src/devtools/tests/utils.tsx
... and 92 more

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

[TkDodo]

not sure that there should be so many changes in package-lock.json, also, builds are failing. I would suggest reverting the changes to packge-lock (restoring what we have in main), then running npm install again.

[aboqasem]

I tried and it produces similar result. Which version of npm should I use? Currently I have to npm i --legacy-peer-deps on 8.18.0.

[TkDodo]

our .nvmrc uses node v16.14.2, so please use that

[TkDodo]

sorry, I wanted to wait until we merged our beta branch with bundling changes. If you fix the merge conflicts, I'll merge this PR

[omeraplak]

Hey @TkDodo , We've got an error on the build with 4.10.0. Is this a known issue? Thank you

Error:

Error: R] Could not resolve "superjson"

    ../../node_modules/@tanstack/react-query-devtools/build/lib/utils.mjs:2:22:
      2 │ import SuperJSON from 'superjson';
        ╵                       ~~~~~~~~~~~

  You can mark the path "superjson" as external to exclude it from the bundle, which will remove this error.

CJS ⚡️ Build success in 678ms
CJS dist/index.js     5.17 KB
CJS dist/index.js.map 18.79 KB
ESM ⚡️ Build success in 724ms
ESM dist/esm/index.js     4.34 KB
ESM dist/esm/index.js.map 19.45 KB
IIFE Build failed
Error: Build failed with 1 error:
../../node_modules/@tanstack/react-query-devtools/build/lib/utils.mjs:2:22: ERROR: Could not resolve "superjson"
    at failureErrorWithLog (/home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:1624:15)
    at /home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:1266:28
    at runOnEndCallbacks (/home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:1046:63)
    at buildResponseToResult (/home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:1264:7)
    at /home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:1377:14
    at /home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:678:9
    at handleIncomingPacket (/home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:775:9)
    at Socket.readFromStdout (/home/runner/work/refine/refine/node_modules/esbuild/lib/main.js:644:7)
    at Socket.emit (node:events:513:28)
    at addChunk (node:internal/streams/readable:315:12)

link: https://github.com/pankod/refine/actions/runs/3182317318/jobs/5188210282#step:7:1296

edit: it's fixed with 4.10.1. Thank you @TkDodo

[TkDodo]

yeah, we fixed it immediately. sorry 🙈