fix: update eslint config to test .ts and .js separately (#2805)

* fix: update eslint config

* fix: update ts ignore

* fix: update eslint config

* Update TeamAvailabilityScreen.tsx

* Type fixes

* Update useIntercom.ts

Co-authored-by: Omar López <zomars@me.com>

apps/web/contexts/contractsContext.tsx

@@ -1,10 +1,17 @@
+import noop from "lodash/noop";
 import { createContext, ReactNode, useContext } from "react";
 
 import { localStorage } from "@calcom/lib/webstorage";
 
-type contractsContextType = Record<string, string>;
+type contractsContextType = {
+  contracts: Record<string, string>;
+  addContract: (payload: addContractsPayload) => void;
+};
 
-const contractsContextDefaultValue: contractsContextType = {};
+const contractsContextDefaultValue: contractsContextType = {
+  contracts: {},
+  addContract: noop,
+};
 
 const ContractsContext = createContext<contractsContextType>(contractsContextDefaultValue);
 
@@ -37,9 +44,5 @@ export function ContractsProvider({ children }: Props) {
     addContract,
   };
 
-  return (
-    <>
-      <ContractsContext.Provider value={value as any}>{children}</ContractsContext.Provider>
-    </>
-  );
+  return <ContractsContext.Provider value={value}>{children}</ContractsContext.Provider>;
 }

apps/web/ee/components/team/availability/TeamAvailabilityScreen.tsx

@@ -1,12 +1,12 @@
 import dayjs from "dayjs";
-import React, { useState, useEffect, CSSProperties } from "react";
+import { CSSProperties, useEffect, useState } from "react";
 import TimezoneSelect, { ITimezone } from "react-timezone-select";
 import AutoSizer from "react-virtualized-auto-sizer";
 import { FixedSizeList as List } from "react-window";
 
 import { WEBSITE_URL } from "@calcom/lib/constants";
 
-import { trpc, inferQueryOutput } from "@lib/trpc";
+import { inferQueryOutput, trpc } from "@lib/trpc";
 
 import Avatar from "@components/ui/Avatar";
 import { DatePicker } from "@components/ui/form/DatePicker";
@@ -100,10 +100,8 @@ export default function TeamAvailabilityScreen(props: Props) {
         </div>
       </div>
       <div className="flex h-full flex-1">
-        {/* @ts-ignore */}
         <AutoSizer>
           {({ height, width }) => (
-            // @ts-ignore
             <List
               itemSize={240}
               itemCount={props.team?.members?.length ?? 0}

apps/web/ee/components/web3/CryptoSection.tsx

@@ -2,19 +2,19 @@ import Router from "next/router";
 import { useCallback, useMemo, useState } from "react";
 import React from "react";
 import Web3 from "web3";
+import { AbstractProvider } from "web3-core";
 import { AbiItem } from "web3-utils";
 
+import { useLocale } from "@calcom/lib/hooks/useLocale";
 import showToast from "@calcom/lib/notification";
 import { Button } from "@calcom/ui/Button";
 
-import { useLocale } from "@lib/hooks/useLocale";
-
 import { useContracts } from "../../../contexts/contractsContext";
 import genericAbi from "../../../web3/abis/abiWithGetBalance.json";
 import verifyAccount, { AUTH_MESSAGE } from "../../../web3/utils/verifyAccount";
 
 interface Window {
-  ethereum: any;
+  ethereum: AbstractProvider & { selectedAddress: string };
   web3: Web3;
 }
 interface EvtsToVerify {
@@ -40,7 +40,7 @@ const CryptoSection = (props: CryptoSectionProps) => {
   const { t } = useLocale();
 
   const connectMetamask = useCallback(async () => {
-    if (window.ethereum) {
+    if (window.ethereum && typeof window.ethereum.request === "function") {
       await window.ethereum.request({ method: "eth_requestAccounts" });
       window.web3 = new Web3(window.ethereum);
       toggleEthEnabled(true);
@@ -64,10 +64,7 @@ const CryptoSection = (props: CryptoSectionProps) => {
         throw new Error("Specified wallet does not own any tokens belonging to this smart contract");
       } else {
         const account = (await window.web3.eth.getAccounts())[0];
-
-        // @ts-ignore
-        const signature = await window.web3.eth.personal.sign(AUTH_MESSAGE, account);
-        // @ts-ignore
+        const signature = await window.web3.eth.personal.sign(AUTH_MESSAGE, account, "");
         addContract({ address: props.smartContractAddress, signature });
 
         await verifyAccount(signature, account);

apps/web/ee/lib/impersonation/ImpersonationProvider.ts

@@ -11,6 +11,7 @@ const ImpersonationProvider = CredentialsProvider({
     username: { label: "Username", type: "text " },
   },
   async authorize(creds, req) {
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore need to figure out how to correctly type this
     const session = await getSession({ req });
     if (session?.user.role !== "ADMIN") {

apps/web/ee/lib/intercom/useIntercom.ts

@@ -1,11 +1,12 @@
+import noop from "lodash/noop";
 import { useIntercom as _useIntercom } from "react-use-intercom";
 
 export const useIntercom =
   typeof window !== "undefined" && !!process.env.NEXT_PUBLIC_INTERCOM_APP_ID
     ? _useIntercom
     : () => ({
-        boot: () => {},
-        show: () => {},
+        boot: noop,
+        show: noop,
       });
 
 export default useIntercom;

apps/web/ee/pages/api/integrations/stripepayment/webhook.ts

@@ -126,7 +126,7 @@ async function handlePaymentSuccess(event: Stripe.Event) {
 
   if (booking.location) evt.location = booking.location;
 
-  let bookingData: Prisma.BookingUpdateInput = {
+  const bookingData: Prisma.BookingUpdateInput = {
     paid: true,
     confirmed: true,
   };

apps/web/playwright/fixtures/bookings.ts

@@ -15,7 +15,7 @@ type BookingFixture = ReturnType<typeof createBookingFixture>;
 
 // creates a user fixture instance and stores the collection
 export const createBookingsFixture = (page: Page) => {
-  let store = { bookings: [], page } as { bookings: BookingFixture[]; page: typeof page };
+  const store = { bookings: [], page } as { bookings: BookingFixture[]; page: typeof page };
   return {
     create: async (
       userId: number,

apps/web/playwright/fixtures/payments.ts

@@ -8,7 +8,7 @@ type PaymentFixture = ReturnType<typeof createPaymentFixture>;
 
 // creates a user fixture instance and stores the collection
 export const createPaymentsFixture = (page: Page) => {
-  let store = { payments: [], page } as { payments: PaymentFixture[]; page: typeof page };
+  const store = { payments: [], page } as { payments: PaymentFixture[]; page: typeof page };
   return {
     create: async (
       bookingId: number,

apps/web/playwright/fixtures/users.ts

@@ -22,7 +22,7 @@ type UserWithIncludes = PrismaType.UserGetPayload<typeof userWithEventTypes>;
 
 // creates a user fixture instance and stores the collection
 export const createUsersFixture = (page: Page, workerInfo: WorkerInfo) => {
-  let store = { users: [], page } as { users: UserFixture[]; page: typeof page };
+  const store = { users: [], page } as { users: UserFixture[]; page: typeof page };
   return {
     create: async (opts?: CustomUserOpts) => {
       const _user = await prisma.user.create({

apps/web/playwright/lib/testUtils.ts

@@ -2,7 +2,7 @@ import { expect, Page, test } from "@playwright/test";
 import { createServer, IncomingMessage, ServerResponse } from "http";
 
 export function todo(title: string) {
-  // eslint-disable-next-line playwright/no-skipped-test
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
   test.skip(title, () => {});
 }
 

apps/web/server/routers/viewer/webhook.tsx

@@ -18,7 +18,7 @@ export const webhookRouter = createProtectedRouter()
       })
       .optional(),
     async resolve({ ctx, input }) {
-      let where: Prisma.WebhookWhereInput = {
+      const where: Prisma.WebhookWhereInput = {
         AND: [{ appId: null /* Don't mixup zapier webhooks with normal ones */ }],
       };
       if (Array.isArray(where.AND)) {

packages/config/eslint-preset.js

@@ -1,19 +1,12 @@
 /** @type {import("eslint").Linter.Config} */
 module.exports = {
   root: true,
-  extends: [
-    "plugin:playwright/playwright-test",
-    "next",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:prettier/recommended",
-  ],
-  parser: "@typescript-eslint/parser",
+  extends: ["plugin:playwright/playwright-test", "next", "plugin:prettier/recommended"],
   parserOptions: {
     tsconfigRootDir: __dirname,
     project: ["./tsconfig.json"],
     project: ["./apps/*/tsconfig.json", "./packages/*/tsconfig.json"],
   },
-  plugins: ["@typescript-eslint"],
   settings: {
     next: {
       rootDir: ["apps/*/", "packages/*/"],
@@ -26,7 +19,21 @@ module.exports = {
   },
   overrides: [
     {
-      files: ["playwright/**/*.{js,jsx,tsx,ts}"],
+      files: ["*.ts", "*.tsx"],
+      extends: ["plugin:@typescript-eslint/recommended"],
+      plugins: ["@typescript-eslint"],
+      parser: "@typescript-eslint/parser",
+      overrides: [
+        {
+          files: ["playwright/**/*.{tsx,ts}"],
+          rules: {
+            "no-undef": "off",
+          },
+        },
+      ],
+    },
+    {
+      files: ["playwright/**/*.{js,jsx}"],
       rules: {
         "no-undef": "off",
       },