Merge pull request #269 from gadget-inc/fix-extensions-lint

airhorns · web-flow · commit fe596df180ab · 2023-09-25T19:20:48.000-04:00
Add import-extensions lint rules and fix latent lint warnings
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -4,8 +4,13 @@ module.exports = {
     tsconfigRootDir: __dirname,
     project: ["./packages/*/tsconfig.json", "./scripts/tsconfig.json", "./packages/blog-example/tsconfig.node.json"],
   },
+  settings: {
+    "import/extensions": [".js", ".jsx"],
+  },
   rules: {
     "lodash/import-scope": "off",
     "react/react-in-jsx-scope": "off",
+    "@typescript-eslint/require-await": "off",
+    "import/extensions": ["error", "ignorePackages"],
   },
 };
diff --git a/packages/api-client-core/spec/GadgetConnection-suite.ts b/packages/api-client-core/spec/GadgetConnection-suite.ts
@@ -1,7 +1,7 @@
 import { Response } from "cross-fetch";
 import gql from "gql-tag";
 import nock from "nock";
-import { AuthenticationMode, BrowserSessionStorageType, GadgetConnection } from "../src";
+import { AuthenticationMode, BrowserSessionStorageType, GadgetConnection } from "../src/index.js";
 import { base64 } from "./helpers.js";
 
 nock.disableNetConnect();
@@ -404,7 +404,7 @@ export const GadgetConnectionSharedSuite = (queryExtra = "") => {
               (init.headers as any).authorization = `FancyMode whatever`;
             },
             // eslint-disable-next-line @typescript-eslint/no-empty-function
-            processTransactionConnectionParams: async (params) => {},
+            processTransactionConnectionParams: async (_params) => {},
           },
         },
       });
@@ -474,7 +474,7 @@ export const GadgetConnectionSharedSuite = (queryExtra = "") => {
               (init.headers as any)["x-whatever"] = `FancyMode whatever`;
             },
             // eslint-disable-next-line @typescript-eslint/no-empty-function
-            processTransactionConnectionParams: async (params) => {},
+            processTransactionConnectionParams: async (_params) => {},
           },
         },
       });
@@ -555,7 +555,7 @@ export const GadgetConnectionSharedSuite = (queryExtra = "") => {
             (init.headers as any).authorization = `FancyMode whatever`;
           },
           // eslint-disable-next-line @typescript-eslint/no-empty-function
-          processTransactionConnectionParams: async (params) => {},
+          processTransactionConnectionParams: async (_params) => {},
         },
       });
 
diff --git a/packages/api-client-core/spec/operationRunners.spec.ts b/packages/api-client-core/spec/operationRunners.spec.ts
@@ -1,7 +1,7 @@
 import nock from "nock";
 import type { GadgetErrorGroup } from "../src/index.js";
 import { GadgetConnection, actionRunner } from "../src/index.js";
-import { mockUrqlClient } from "./mockUrqlClient";
+import { mockUrqlClient } from "./mockUrqlClient.js";
 
 nock.disableNetConnect();
 
diff --git a/packages/api-client-core/src/GadgetConnection.ts b/packages/api-client-core/src/GadgetConnection.ts
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-non-null-assertion */
 import type { ClientOptions, RequestPolicy } from "@urql/core";
 import { Client, cacheExchange, fetchExchange, subscriptionExchange } from "@urql/core";
 
diff --git a/packages/blog-example/src/App.tsx b/packages/blog-example/src/App.tsx
@@ -1,6 +1,6 @@
 import { useFetch, useFindMany } from "@gadgetinc/react";
 import { Suspense, useEffect, useState } from "react";
-import { api } from "./api";
+import { api } from "./api.js";
 import "./styles/App.css";
 
 function ExampleFetch() {
@@ -9,6 +9,7 @@ function ExampleFetch() {
 
   useEffect(() => {
     setHistory([...history, result]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [result]);
 
   return (
@@ -27,8 +28,9 @@ function ExampleFindMany() {
   const [result, send] = useFindMany(api.post);
 
   useEffect(() => {
-    const { operation, ...keep } = result;
+    const { operation: _operation, ...keep } = result;
     setHistory([...history, keep]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [result]);
 
   return (
@@ -64,8 +66,9 @@ function ExampleSuspenseInner() {
   const [result, send] = useFindMany(api.post, { suspense: true, sort: { id: "Descending" } });
 
   useEffect(() => {
-    const { operation, ...keep } = result;
+    const { operation: _operation, ...keep } = result;
     setHistory([...history, keep]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [result]);
 
   return (
diff --git a/packages/blog-example/src/main.tsx b/packages/blog-example/src/main.tsx
@@ -1,8 +1,8 @@
 import { Provider } from "@gadgetinc/react";
 import React from "react";
 import ReactDOM from "react-dom/client";
-import App from "./App";
-import { api } from "./api";
+import App from "./App.js";
+import { api } from "./api.js";
 import "./styles/index.css";
 
 ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
diff --git a/packages/react-shopify-app-bridge/spec/useGadget.spec.ts b/packages/react-shopify-app-bridge/spec/useGadget.spec.ts
@@ -5,7 +5,7 @@ import type { AppType } from "../src/index.js";
 import { useGadget } from "../src/index.js";
 
 // these functions are typechecked but never run to avoid actually making API calls
-const TestUseGadgetReturnsAppropriateTypes = () => {
+const _TestUseGadgetReturnsAppropriateTypes = () => {
   const { loading, appType, isEmbedded, appBridge, canAuth, isAuthenticated, isRootFrameRequest } = useGadget();
 
   assert<IsExact<typeof loading, boolean>>(true);
diff --git a/packages/react/spec/components/auth/SignedOut.spec.tsx b/packages/react/spec/components/auth/SignedOut.spec.tsx
@@ -1,7 +1,7 @@
 import "@testing-library/jest-dom";
 import { render } from "@testing-library/react";
 import React from "react";
-import { SignedOut } from "../../../src/components/auth/SignedOut";
+import { SignedOut } from "../../../src/components/auth/SignedOut.js";
 import { superAuthApi } from "../../apis.js";
 import { MockClientWrapper } from "../../testWrappers.js";
 import { expectMockDeletedUser, expectMockSignedInUser, expectMockSignedOutUser } from "../../utils.js";
diff --git a/packages/react/spec/jsdom-environment.ts b/packages/react/spec/jsdom-environment.ts
@@ -2,6 +2,7 @@ import JSDOMEnvironment from "jest-environment-jsdom";
 import { ReadableStream, TextDecoderStream } from "stream/web";
 import { TextDecoder, TextEncoder } from "util";
 
+// eslint-disable-next-line jsdoc/require-jsdoc
 export default class extends JSDOMEnvironment {
   constructor(...args: ConstructorParameters<typeof JSDOMEnvironment>) {
     super(...args);
diff --git a/packages/react/spec/useAction.spec.tsx b/packages/react/spec/useAction.spec.tsx
@@ -13,7 +13,7 @@ import { MockClientWrapper, createMockUrqlClient, mockUrqlClient } from "./testW
 
 describe("useAction", () => {
   // these functions are typechecked but never run to avoid actually making API calls
-  const TestUseActionCanRunUpdateActionsWithVariables = () => {
+  const _TestUseActionCanRunUpdateActionsWithVariables = () => {
     const [_, mutate] = useAction(relatedProductsApi.user.update);
 
     // can call with variables
@@ -32,7 +32,7 @@ describe("useAction", () => {
     void mutate({ foo: "123" });
   };
 
-  const TestUseActionCanRunCreateActionsWithVariables = () => {
+  const _TestUseActionCanRunCreateActionsWithVariables = () => {
     const [_, mutate] = useAction(relatedProductsApi.user.create);
 
     // can call with variables
@@ -48,7 +48,7 @@ describe("useAction", () => {
     void mutate({ foo: "123" });
   };
 
-  const TestUseActionCanRunWithoutModelApiIdentifier = () => {
+  const _TestUseActionCanRunWithoutModelApiIdentifier = () => {
     const [_, mutate] = useAction(relatedProductsApi.unambiguous.update);
 
     // can call using flat style
@@ -64,7 +64,7 @@ describe("useAction", () => {
     void mutate({});
   };
 
-  const TestUseActionCannotRunWithoutModelApiIdentifier = () => {
+  const _TestUseActionCannotRunWithoutModelApiIdentifier = () => {
     const [_, mutate] = useAction(relatedProductsApi.ambiguous.update);
 
     // @ts-expect-error models with ambigous identifiers can't be called with flat style signature
@@ -80,8 +80,8 @@ describe("useAction", () => {
     void mutate({});
   };
 
-  const TestUseActionReturnsTypedDataWithExplicitSelection = () => {
-    const [{ data, fetching, error }, mutate] = useAction(relatedProductsApi.user.update, {
+  const _TestUseActionReturnsTypedDataWithExplicitSelection = () => {
+    const [{ data, fetching, error }, _mutate] = useAction(relatedProductsApi.user.update, {
       select: { id: true, email: true },
     });
 
@@ -96,7 +96,7 @@ describe("useAction", () => {
     }
   };
 
-  const TestUseActionReturnsTypedDataWithNoSelection = () => {
+  const _TestUseActionReturnsTypedDataWithNoSelection = () => {
     const [{ data }] = useAction(relatedProductsApi.user.update);
 
     if (data) {
diff --git a/packages/react/spec/useBulkAction.spec.ts b/packages/react/spec/useBulkAction.spec.ts
@@ -429,7 +429,7 @@ describe("useBulkAction", () => {
     });
 
     await act(async () => {
-      const promiseResult = await mutationPromise;
+      await mutationPromise;
     });
 
     const beforeObject = result.current[0];
diff --git a/packages/react/spec/useFetch.spec.ts b/packages/react/spec/useFetch.spec.ts
@@ -570,9 +570,8 @@ describe("useFetch", () => {
     expect(result.current[0].fetching).toBe(false);
     expect(result.current[0].error).toBeFalsy();
 
-    let reexecutePromise: Promise<string>;
     act(() => {
-      reexecutePromise = result.current[1]();
+      void result.current[1]();
     });
 
     expect(result.current[0].data).toBeFalsy();
@@ -603,9 +602,8 @@ describe("useFetch", () => {
 
     expect(mockUrqlClient.mockFetch).toBeCalledTimes(0);
 
-    let reexecutePromise: Promise<string>;
     act(() => {
-      reexecutePromise = result.current[1]({ headers: { "X-Test": "hello" }, body: JSON.stringify({ test: true }) });
+      void result.current[1]({ headers: { "X-Test": "hello" }, body: JSON.stringify({ test: true }) });
     });
 
     expect(mockUrqlClient.mockFetch.requests[0].args).toEqual([
@@ -621,7 +619,7 @@ describe("useFetch", () => {
     expect(mockUrqlClient.mockFetch).toBeCalledTimes(1);
 
     act(() => {
-      reexecutePromise = result.current[1]({ headers: { "X-Test": "other" }, body: "other body" });
+      void result.current[1]({ headers: { "X-Test": "other" }, body: "other body" });
     });
 
     expect(mockUrqlClient.mockFetch.requests[0].args).toEqual([
diff --git a/packages/react/spec/useGlobalAction.spec.ts b/packages/react/spec/useGlobalAction.spec.ts
@@ -9,7 +9,7 @@ import { MockClientWrapper, mockUrqlClient } from "./testWrappers.js";
 
 describe("useGlobalAction", () => {
   // these functions are typechecked but never run to avoid actually making API calls
-  const TestUseGlobalActionCanRunGlobalActionsWithVariables = () => {
+  const _TestUseGlobalActionCanRunGlobalActionsWithVariables = () => {
     const [{ data, fetching, error }, mutate] = useGlobalAction(bulkExampleApi.flipAll);
 
     assert<IsExact<typeof fetching, boolean>>(true);
diff --git a/packages/react/src/auth/useAuth.ts b/packages/react/src/auth/useAuth.ts
@@ -1,5 +1,5 @@
 import type { DefaultSelection, GadgetRecord, Select } from "@gadgetinc/api-client-core";
-import type { OptionsType, ReadOperationOptions } from "src/utils.js";
+import type { OptionsType, ReadOperationOptions } from "src/utils";
 import type { ClientWithSessionAndUserManagers, GadgetSession, GadgetUser } from "./useSession.js";
 import { useSession } from "./useSession.js";
 import { useUser } from "./useUser.js";
diff --git a/packages/react/src/useAction.ts b/packages/react/src/useAction.ts
@@ -5,14 +5,8 @@ import type { AnyVariables, OperationContext, UseMutationState } from "urql";
 import { GadgetUrqlClientContext } from "./GadgetProvider.js";
 import { useGadgetMutation } from "./useGadgetMutation.js";
 import { useStructuralMemo } from "./useStructuralMemo.js";
-import {
-  ActionHookResult,
-  ActionHookState,
-  ErrorWrapper,
-  OptionsType,
-  disambiguateActionVariables,
-  noProviderErrorMessage,
-} from "./utils.js";
+import type { ActionHookResult, ActionHookState, OptionsType } from "./utils.js";
+import { ErrorWrapper, disambiguateActionVariables, noProviderErrorMessage } from "./utils.js";
 
 /**
  * React hook to run a Gadget model action. `useAction` must be passed an action function from an instance of your generated API client library, like `api.user.create` or `api.blogPost.publish`. `useAction` doesn't actually run the action when invoked, but instead returns an action function as the second result for running the action in response to an event.
diff --git a/packages/react/src/useBulkAction.ts b/packages/react/src/useBulkAction.ts
@@ -4,7 +4,8 @@ import { useCallback, useMemo } from "react";
 import type { OperationContext, UseMutationState } from "urql";
 import { useGadgetMutation } from "./useGadgetMutation.js";
 import { useStructuralMemo } from "./useStructuralMemo.js";
-import { ActionHookResult, ErrorWrapper, OptionsType, disambiguateActionVariables } from "./utils.js";
+import type { ActionHookResult, OptionsType } from "./utils.js";
+import { ErrorWrapper, disambiguateActionVariables } from "./utils.js";
 
 /**
  * React hook to run a Gadget model bulk action.
diff --git a/packages/react/src/useFetch.ts b/packages/react/src/useFetch.ts
@@ -171,6 +171,7 @@ export function useFetch<T = string>(path: string, options?: FetchHookOptions):
           data = await response.json();
         } else if (typeof mergedOptions.stream === "string") {
           dispatchData = false;
+          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
           const decodedStream = response.body!.pipeThrough(
             new TextDecoderStream(mergedOptions.stream === "string" ? "utf8" : mergedOptions.stream)
           );
@@ -233,7 +234,8 @@ export function useFetch<T = string>(path: string, options?: FetchHookOptions):
       }
       return data;
     },
-    [memoizedOptions, path]
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [connection, memoizedOptions, path]
   );
 
   useEffect(() => {
diff --git a/packages/tiny-graphql-query-compiler/spec/calls.spec.ts b/packages/tiny-graphql-query-compiler/spec/calls.spec.ts
@@ -1,5 +1,5 @@
-import { Call, Var, compile, compileWithVariableValues } from "../src";
-import { expectValidGraphQLQuery } from "./helpers";
+import { Call, Var, compile, compileWithVariableValues } from "../src/index.js";
+import { expectValidGraphQLQuery } from "./helpers.js";
 
 describe("compiling queries with field calls", () => {
   test("it should compile a query that calls a field with a hardcoded value", () => {
diff --git a/packages/tiny-graphql-query-compiler/spec/mutation.spec.ts b/packages/tiny-graphql-query-compiler/spec/mutation.spec.ts
@@ -1,5 +1,5 @@
-import { Call, Var, compile } from "../src";
-import { expectValidGraphQLQuery } from "./helpers";
+import { Call, Var, compile } from "../src/index.js";
+import { expectValidGraphQLQuery } from "./helpers.js";
 
 describe("compiling mutation", () => {
   test("it should compile a mutation for some fields", () => {
diff --git a/packages/tiny-graphql-query-compiler/spec/query.spec.ts b/packages/tiny-graphql-query-compiler/spec/query.spec.ts
@@ -1,5 +1,5 @@
-import { Call, Var, compile } from "../src";
-import { expectValidGraphQLQuery } from "./helpers";
+import { Call, Var, compile } from "../src/index.js";
+import { expectValidGraphQLQuery } from "./helpers.js";
 
 describe("compiling queries", () => {
   test("it should compile a query for some fields", () => {

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,4 @@`
	`1`	`+/* eslint-disable @typescript-eslint/no-non-null-assertion */`
`1`	`2`	`import type { ClientOptions, RequestPolicy } from "@urql/core";`
`2`	`3`	`import { Client, cacheExchange, fetchExchange, subscriptionExchange } from "@urql/core";`
`3`	`4`