enso-org/enso
1
1
Fork 0
mirror of https://github.com/enso-org/enso.git synced 2024-12-23 08:21:49 +03:00
Code Issues Projects Releases Wiki Activity

Add tanstack query devtools (#9991)

Browse Source 
This PR adds tanstack devtools to debug react query queries


https://github.com/enso-org/enso/assets/61194245/6898de33-cf9a-4077-9fdd-7b710484a94b


Also, this PR provides a way to download dev tools in Production
This commit is contained in:
Sergei Garin 2024-05-18 09:50:28 +03:00 committed by GitHub
parent 3b29de313d
commit c5a91a63fe
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 94 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/ide-desktop/lib/dashboard/package.json
View File

@ -71,6 +71,7 @@
"@typescript-eslint/eslint-plugin": "^6.7.2",
"@typescript-eslint/parser": "^6.7.2",
"@vitejs/plugin-react": "^4.2.1",
"@tanstack/react-query-devtools": "^5.36.2",
"chalk": "^5.3.0",
"cross-env": "^7.0.3",
"enso-chat": "git://github.com/enso-org/enso-bot",

4
app/ide-desktop/lib/dashboard/src/App.tsx
View File

@ -89,6 +89,8 @@ import * as object from '#/utilities/object'
import * as authServiceModule from '#/authentication/service'
import * as reactQueryDevtools from './ReactQueryDevtools'
// ============================
// === Global configuration ===
// ============================
@ -204,6 +206,8 @@ export default function App(props: AppProps) {
</ModalProvider>
</LocalStorageProvider>
</Router>
<reactQueryDevtools.ReactQueryDevtools />
</reactQuery.QueryClientProvider>
)
}

40
app/ide-desktop/lib/dashboard/src/ReactQueryDevtools.tsx Normal file
View File

@ -0,0 +1,40 @@
/**
* @file
*
* ReactQueryDevtools component. Shows the React Query Devtools.
*/
import * as React from 'react'
import * as reactQueryDevtools from '@tanstack/react-query-devtools'
const ReactQueryDevtoolsProduction = React.lazy(() =>
import('@tanstack/react-query-devtools/build/modern/production.js').then(d => ({
default: d.ReactQueryDevtools,
}))
)
/**
* ReactQueryDevtools component.
* Shows the React Query Devtools and provide ability to show them in production.
*/
export function ReactQueryDevtools() {
const [showDevtools, setShowDevtools] = React.useState(false)
React.useEffect(() => {
window.toggleDevtools = () => {
setShowDevtools(old => !old)
}
}, [])
return (
<>
<reactQueryDevtools.ReactQueryDevtools />
{showDevtools && (
<React.Suspense fallback={null}>
<ReactQueryDevtoolsProduction />
</React.Suspense>
)}
</>
)
}

2
app/ide-desktop/lib/types/globals.d.ts vendored
View File

@ -103,6 +103,7 @@ interface VersionInfo {
declare global {
// Documentation is already inherited.
/** */
// eslint-disable-next-line no-restricted-syntax
interface Window {
readonly enso?: AppRunner & Enso
readonly backendApi?: BackendApi
@ -110,6 +111,7 @@ declare global {
readonly navigationApi: NavigationApi
readonly menuApi: MenuApi
readonly versionInfo?: VersionInfo
toggleDevtools: () => void
}
namespace NodeJS {

66
package-lock.json generated
View File

@ -357,6 +357,7 @@
"@playwright/experimental-ct-react": "^1.40.0",
"@playwright/test": "^1.40.0",
"@react-types/shared": "^3.22.1",
"@tanstack/react-query-devtools": "^5.36.2",
"@types/node": "^20.11.21",
"@types/react": "^18.0.27",
"@types/react-dom": "^18.0.10",
@ -435,6 +436,47 @@
"node": ">=14.17"
}
},
"app/ide-desktop/node_modules/@tanstack/query-core": {
"version": "5.36.1",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.36.1.tgz",
"integrity": "sha512-BteWYEPUcucEu3NBcDAgKuI4U25R9aPrHSP6YSf2NvaD2pSlIQTdqOfLRsxH9WdRYg7k0Uom35Uacb6nvbIMJg==",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"app/ide-desktop/node_modules/@tanstack/react-query": {
"version": "5.36.2",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.36.2.tgz",
"integrity": "sha512-bHNa+5dead+j6SA8WVlEOPxcGfteVFgdyFTCFcxBgjnPf0fFpHUc7aNZBCnvmPXqy/BeQa9zTuU9ectb7i8ZXA==",
"dependencies": {
"@tanstack/query-core": "5.36.1"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"react": "^18.0.0"
}
},
"app/ide-desktop/node_modules/@tanstack/react-query-devtools": {
"version": "5.36.2",
"resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.36.2.tgz",
"integrity": "sha512-bkPQrKmKJOa2dNs6rBB9aef8jCG8XAg8QKIhwN8NI+QaXky86IofnO8YjiF6P1mYquLXbQvK0VZ9DnGV0wH/eA==",
"dev": true,
"dependencies": {
"@tanstack/query-devtools": "5.32.1"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"@tanstack/react-query": "^5.36.2",
"react": "^18.0.0"
}
},
"app/ide-desktop/node_modules/ajv": {
"version": "8.13.0",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.13.0.tgz",
@ -5378,30 +5420,16 @@
"node": ">=10"
}
},
"node_modules/@tanstack/query-core": {
"version": "5.27.5",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.27.5.tgz",
"integrity": "sha512-HuYOo46NhzNX1SwXCmLf/Skr8B7T56cDHUN+iOhnu7+GOkUMThda64GwZpAqQzBT8TOTBQo6RQaNe0gi3Gi2fw==",
"node_modules/@tanstack/query-devtools": {
"version": "5.32.1",
"resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.32.1.tgz",
"integrity": "sha512-7Xq57Ctopiy/4atpb0uNY5VRuCqRS/1fi/WBCKKX6jHMa6cCgDuV/AQuiwRXcKARbq2OkVAOrW2v4xK9nTbcCA==",
"dev": true,
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"node_modules/@tanstack/react-query": {
"version": "5.27.5",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.27.5.tgz",
"integrity": "sha512-VcuQo4CYRGsPsD8/rj9e4WnXN6eU4GKmAs0Yd9a1hLSx6DxAzRaBdrwu6P9lfjpz8bxaYkZRyb5NI+YtLipoYA==",
"dependencies": {
"@tanstack/query-core": "5.27.5"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"react": "^18.0.0"
}
},
"node_modules/@testim/chrome-version": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/@testim/chrome-version/-/chrome-version-1.1.4.tgz",