diff --git a/.eslintrc.cjs b/.eslintrc.cjs index cb02f7de..884b51b3 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -8,6 +8,10 @@ module.exports = { "plugin:@typescript-eslint/recommended", "eslint-config-prettier" ], + parser: '@typescript-eslint/parser', + parserOptions: { + project: ['./tsconfig.json'], + }, ignorePatterns: ["src-tauri/**/*"], settings: { react: { @@ -16,13 +20,14 @@ module.exports = { "import/resolver": { node: { paths: ["src-web"], - extensions: [".js", ".jsx", ".ts", ".tsx"] + extensions: [".ts", ".tsx"] } } }, rules: { "jsx-a11y/no-autofocus": "warn", "react/react-in-jsx-scope": "off", + "import/no-unresolved": "off", "@typescript-eslint/consistent-type-imports": ["error", { prefer: "type-imports", disallowTypeAnnotations: true, diff --git a/package-lock.json b/package-lock.json index d26efdea..d8eea4a7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -49,7 +49,8 @@ "@types/node": "^18.7.10", "@types/parse-color": "^1.0.1", "@types/parse-json": "^4.0.0", - "@types/react-dom": "^18.0.6", + "@types/react": "^18.0.31", + "@types/react-dom": "^18.0.11", "@types/uuid": "^9.0.1", "@typescript-eslint/eslint-plugin": "^5.57.0", "@typescript-eslint/parser": "^5.57.0", @@ -2135,9 +2136,9 @@ "devOptional": true }, "node_modules/@types/react": { - "version": "18.0.28", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz", - "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==", + "version": "18.0.31", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.31.tgz", + "integrity": "sha512-EEG67of7DsvRDU6BLLI0p+k1GojDLz9+lZsnCpCRTa/lOokvyPBvp8S5x+A24hME3yyQuIipcP70KJ6H7Qupww==", "devOptional": true, "dependencies": { "@types/prop-types": "*", @@ -8842,9 +8843,9 @@ "devOptional": true }, "@types/react": { - "version": "18.0.28", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz", - "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==", + "version": "18.0.31", + "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.31.tgz", + "integrity": "sha512-EEG67of7DsvRDU6BLLI0p+k1GojDLz9+lZsnCpCRTa/lOokvyPBvp8S5x+A24hME3yyQuIipcP70KJ6H7Qupww==", "devOptional": true, "requires": { "@types/prop-types": "*", diff --git a/package.json b/package.json index f1a7619f..9d9eab9f 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,8 @@ "@types/node": "^18.7.10", "@types/parse-color": "^1.0.1", "@types/parse-json": "^4.0.0", - "@types/react-dom": "^18.0.6", + "@types/react": "^18.0.31", + "@types/react-dom": "^18.0.11", "@types/uuid": "^9.0.1", "@typescript-eslint/eslint-plugin": "^5.57.0", "@typescript-eslint/parser": "^5.57.0", diff --git a/src-web/components/GraphQLEditor.tsx b/src-web/components/GraphQLEditor.tsx index f1bd5dfc..3f97da20 100644 --- a/src-web/components/GraphQLEditor.tsx +++ b/src-web/components/GraphQLEditor.tsx @@ -22,7 +22,7 @@ interface GraphQLBody { export function GraphQLEditor({ defaultValue, onChange, baseRequest, ...extraEditorProps }: Props) { const { query, variables } = useMemo(() => { - if (!defaultValue) { + if (defaultValue === undefined) { return { query: '', variables: {} }; } try { @@ -61,6 +61,11 @@ export function GraphQLEditor({ defaultValue, onChange, baseRequest, ...extraEdi // Refetch the schema when the URL changes useEffect(() => { + // First, clear the schema + if (editorViewRef.current) { + updateSchema(editorViewRef.current, undefined); + } + let unmounted = false; const body = JSON.stringify({ query: getIntrospectionQuery(), @@ -76,14 +81,15 @@ export function GraphQLEditor({ defaultValue, onChange, baseRequest, ...extraEdi updateSchema(editorViewRef.current, schema); } catch (err) { console.log('Failed to parse introspection query', err); - updateSchema(editorViewRef.current, undefined); - return; } }); + return () => { unmounted = true; }; - }, [baseRequest, baseRequest.url]); + + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [baseRequest.url]); return (
diff --git a/src-web/components/core/Stacks.tsx b/src-web/components/core/Stacks.tsx index bd6d72bb..e2861d86 100644 --- a/src-web/components/core/Stacks.tsx +++ b/src-web/components/core/Stacks.tsx @@ -25,7 +25,7 @@ export const HStack = forwardRef(function HStack( return ( {children} @@ -45,7 +45,7 @@ export const VStack = forwardRef(function VStack( return ( {children} diff --git a/src-web/hooks/useDeleteResponses.ts b/src-web/hooks/useDeleteResponses.ts index 1a7f9e3f..39602907 100644 --- a/src-web/hooks/useDeleteResponses.ts +++ b/src-web/hooks/useDeleteResponses.ts @@ -6,11 +6,11 @@ export function useDeleteResponses(requestId?: string) { const queryClient = useQueryClient(); return useMutation({ mutationFn: async () => { - if (!requestId) return; + if (requestId === undefined) return; await invoke('delete_all_responses', { requestId }); }, onSuccess: async () => { - if (!requestId) return; + if (requestId === undefined) return; queryClient.setQueryData(responsesQueryKey({ requestId }), []); }, }); diff --git a/src-web/main.tsx b/src-web/main.tsx index 57b170ed..91413013 100644 --- a/src-web/main.tsx +++ b/src-web/main.tsx @@ -1,5 +1,5 @@ import { StrictMode } from 'react'; -import ReactDOM from 'react-dom/client'; +import { createRoot } from 'react-dom/client'; import { App } from './components/App'; import { getKeyValue } from './lib/keyValueStore'; import { syncLastLocation } from './lib/lastLocation'; @@ -10,7 +10,7 @@ setAppearance(await getKeyValue({ key: 'appearance', fallback: getPreferredAppea await syncLastLocation(); // root holds our app's root DOM Element: -ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( +createRoot(document.getElementById('root') as HTMLElement).render( , diff --git a/tsconfig.json b/tsconfig.json index 3816a209..12d4cae7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -18,7 +18,8 @@ "jsx": "react-jsx" }, "include": [ - "src-web" + "src-web", + "vite.config.ts" ], "references": [{ "path": "./tsconfig.node.json" }] }