More eslint fixes

.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,

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": "*",

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",

src-web/components/GraphQLEditor.tsx

@@ -22,7 +22,7 @@ interface GraphQLBody {
 
 export function GraphQLEditor({ defaultValue, onChange, baseRequest, ...extraEditorProps }: Props) {
   const { query, variables } = useMemo<GraphQLBody>(() => {
-    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 (
     <div className="pb-2 h-full grid grid-rows-[minmax(0,100%)_auto_auto_minmax(0,auto)]">

src-web/components/core/Stacks.tsx

@@ -25,7 +25,7 @@ export const HStack = forwardRef(function HStack(
   return (
     <BaseStack
       ref={ref}
-      className={classnames(className, 'flex-row', space && gapClasses[space])}
+      className={classnames(className, 'flex-row', space != null && gapClasses[space])}
       {...props}
     >
       {children}
@@ -45,7 +45,7 @@ export const VStack = forwardRef(function VStack(
   return (
     <BaseStack
       ref={ref}
-      className={classnames(className, 'flex-col', space && gapClasses[space])}
+      className={classnames(className, 'flex-col', space != null && gapClasses[space])}
       {...props}
     >
       {children}

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 }), []);
     },
   });

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(
   <StrictMode>
     <App />
   </StrictMode>,

tsconfig.json

@@ -18,7 +18,8 @@
     "jsx": "react-jsx"
   },
   "include": [
-    "src-web"
+    "src-web",
+    "vite.config.ts"
   ],
   "references": [{ "path": "./tsconfig.node.json" }]
 }