feat: enabled linting in CI (#559)

.github/labeler.yml

@@ -14,10 +14,6 @@ documentation:
 - changed-files:
   - any-glob-to-any-file: src/core/**
 
-'pkg: definitions':
-- changed-files:
-  - any-glob-to-any-file: src/definitions/**
-
 'pkg: farcaster':
 - changed-files:
   - any-glob-to-any-file: src/farcaster/**

.github/workflows/lint.yml

@@ -0,0 +1,28 @@
+name: Kit Lint
+on:
+  push:
+    branches: ['main']
+  pull_request:
+    branches: ['main']
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [18.x]
+        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+          cache: 'npm'
+
+      - name: Kit Install dependencies
+        run: npm install
+
+      - name: Kit Lint Check
+        run: npm run ci:lint

biome.json

@@ -29,7 +29,8 @@
       "nursery": {
         "useSortedClasses": "error"
       }
-    }
+    },
+    "ignore": ["site/vocs.config.tsx", "src/token/components/useDebounce.ts"]
   },
   "json": {
     "formatter": {

framegear/components/RedirectModal/RedirectModal.tsx

@@ -16,12 +16,14 @@ export function RedirectModal({
         <p>If you connect your wallet and the site is malicious, you may lose funds.</p>
         <div className="mt-4 flex justify-end space-x-4">
           <button
+            type="button"
             className="rounded-full bg-white px-4 py-2 text-black transition hover:bg-gray-200"
             onClick={onClose}
           >
             Cancel
           </button>
           <button
+            type="button"
             className="rounded-full bg-black px-4 py-2 text-white transition hover:bg-gray-700"
             onClick={onConfirm}
           >

package.json

@@ -11,9 +11,7 @@
     "format": "biome format --write .",
     "lint": "biome lint --write .",
     "lint:unsafe": "biome lint --write --unsafe .",
-    "test": "jest --testPathIgnorePatterns=\\.integ\\.",
-    "test:integration": "jest --testPathIgnorePatterns=\\.test\\.",
-    "test:all": "jest .",
+    "test": "jest",
     "test:coverage": "jest . --coverage ",
     "release:check": "changeset status --verbose --since=origin/main",
     "release:publish": "yarn install && yarn build && changeset publish",

site/docs/pages/index.mdx

@@ -72,7 +72,7 @@ bun add @coinbase/onchainkit
 
       </div>
       <a href="/getting-started" className="justify-self-end">
-        <button className="h-[42px] px-8 py-2 rounded-3xl border border-white justify-center items-center gap-2.5 inline-flex">
+        <button type="button" className="h-[42px] px-8 py-2 rounded-3xl border border-white justify-center items-center gap-2.5 inline-flex">
           <div className="text-center text-xs font-medium leading-snug">View docs</div>
         </button>
       </a>

src/frame/getFrameMetadata.ts

@@ -69,6 +69,7 @@ export const getFrameMetadata = ({
   if (isOpenFrame) {
     metadata['of:version'] = 'vNext';
     if (accepts) {
+      /* biome-ignore lint: code needs to be refactored */
       Object.keys(accepts).forEach((protocolIdentifier) => {
         metadata[`of:accepts:${protocolIdentifier}`] =
           accepts[protocolIdentifier];

src/frame/getMockFrameRequest.ts

@@ -1,4 +1,3 @@
-import { Address } from 'viem';
 import type {
   FrameRequest,
   MockFrameRequest,
@@ -42,7 +41,7 @@ function getMockFrameRequest(
       valid: true,
       raw: {
         valid: true,
-        // TODO: unjank
+        /* biome-ignore lint: code needs to be refactored */
         action: {} as any,
       },
     },

src/frame/types.ts

@@ -67,6 +67,7 @@ export type FrameValidationResponse =
   | { isValid: true; message: FrameValidationData }
   | { isValid: false; message: undefined };
 
+/* biome-ignore lint: code needs to be refactored */
 export function convertToFrame(json: any) {
   return {
     fid: json.fid,
@@ -124,6 +125,7 @@ export type FrameImageMetadata = {
 export type FrameMetadataReact = FrameMetadataType & {
   ogDescription?: string;
   ogTitle?: string;
+  /* biome-ignore lint: code needs to be refactored */
   wrapper?: React.ComponentType<any>;
 };
 

src/identity/easSupportedChains.ts

@@ -1,8 +1,8 @@
 import type { Chain } from 'viem';
 import type { EASChainDefinition } from './types';
-import { easChainBase } from '../definitions/base';
-import { easChainOptimism } from '../definitions/optimism';
-import { easChainBaseSepolia } from '../definitions/baseSepolia';
+import { easChainBase } from '../network/definitions/base';
+import { easChainOptimism } from '../network/definitions/optimism';
+import { easChainBaseSepolia } from '../network/definitions/baseSepolia';
 
 export type EASSupportedChains = Record<number, EASChainDefinition>;
 
@@ -14,21 +14,14 @@ export const easSupportedChains: EASSupportedChains = {
 
 /**
  * Checks if a given blockchain chain is supported by EAS attestations.
- *
- * @param {Chain} chain - The chain to be checked for support.
- * @returns {boolean} True if the chain is supported, false otherwise.
  */
 export function isChainSupported(chain: Chain): boolean {
   return chain.id in easSupportedChains;
 }
 
 /**
  * Function to get the EAS GraphQL API endpoint for a given blockchain.
- *
- * @param {Chain} chain - The chain to be checked for support.
- * @returns {string} GraphQL endpoint
  */
-
 export function getChainEASGraphQLAPI(chain: Chain): string {
   return easSupportedChains[chain.id]?.easGraphqlAPI ?? '';
 }

src/network/attestations.ts

@@ -35,6 +35,7 @@ export type GetAttestationsByFilterOptions =
 export type AttestationsQueryVariables = {
   distinct: string[];
   take: number;
+  /* biome-ignore lint: code needs to be deprecated */
   where: Record<string, any>;
 };
 
@@ -89,6 +90,7 @@ export function getAttestationQueryVariables(
   filters: GetAttestationQueryVariablesFilters,
 ): AttestationsQueryVariables {
   const checksummedAddress = getAddress(address);
+  /* biome-ignore lint: code needs to be deprecated */
   const conditions: Record<string, any> = {
     recipient: { equals: checksummedAddress },
     revoked: { equals: filters.revoked },

src/definitions/base.ts → src/network/definitions/base.ts

@@ -1,5 +1,5 @@
 import { base } from 'viem/chains';
-import type { EASChainDefinition } from '../identity/types';
+import type { EASChainDefinition } from '../../identity/types';
 
 export const easChainBase: EASChainDefinition = {
   id: base.id,

src/definitions/baseSepolia.ts → src/network/definitions/baseSepolia.ts

@@ -1,5 +1,5 @@
 import { baseSepolia } from 'viem/chains';
-import type { EASChainDefinition } from '../identity/types';
+import type { EASChainDefinition } from '../../identity/types';
 
 export const easChainBaseSepolia: EASChainDefinition = {
   id: baseSepolia.id,

src/definitions/optimism.ts → src/network/definitions/optimism.ts

@@ -1,5 +1,5 @@
 import { optimism } from 'viem/chains';
-import type { EASChainDefinition } from '../identity/types';
+import type { EASChainDefinition } from '../../identity/types';
 
 // More details in https://docs.optimism.io/chain/identity/schemas
 export const easChainOptimism: EASChainDefinition = {

src/swap/components/Swap.tsx

@@ -39,7 +39,7 @@ export function Swap({ address, children, onError }: SwapReact) {
         onError?.(error as SwapError);
       }
     },
-    [fromToken, toToken, setFromAmount, setToAmount],
+    [fromToken, onError, toToken],
   );
 
   const handleToAmountChange = useCallback(
@@ -69,7 +69,7 @@ export function Swap({ address, children, onError }: SwapReact) {
         onError?.(error as SwapError);
       }
     },
-    [fromToken, toToken, setFromAmount, setToAmount],
+    [fromToken, onError, toToken],
   );
 
   const value = useMemo(() => {
@@ -90,17 +90,14 @@ export function Swap({ address, children, onError }: SwapReact) {
     fromToken,
     handleFromAmountChange,
     handleToAmountChange,
-    setFromToken,
-    setToAmount,
-    setToToken,
     toAmount,
     toToken,
   ]);
 
   return (
     <SwapContext.Provider value={value}>
-      <div className="flex w-[400px] flex-col rounded-xl bg-gray-100 pt-6 pb-4 px-6">
-        <label className="text-base font-semibold text-[#030712] leading-6 mb-4">
+      <div className="flex w-[400px] flex-col rounded-xl bg-gray-100 px-6 pt-6 pb-4">
+        <label className="mb-4 font-semibold text-[#030712] text-base leading-6">
           Swap
         </label>
         {children}

src/swap/components/SwapAmountInput.tsx

@@ -51,7 +51,7 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
     if (balanceResponse?.data?.formatted && token?.address) {
       return getRoundedAmount(balanceResponse?.data?.formatted, 8);
     }
-  }, [balanceResponse?.data]);
+  }, [balanceResponse?.data, token]);
 
   const handleAmountChange = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -78,7 +78,7 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
     <div
       className={cn(
         'box-border flex w-full flex-col items-start',
-        'border-b border-solid bg-[#E5E7EB] p-4 rounded-md my-0.5',
+        'my-0.5 rounded-md border-b border-solid bg-[#E5E7EB] p-4',
       )}
       data-testid="ockSwapAmountInput_Container"
     >
@@ -95,15 +95,16 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
         />
         <TokenChip token={token} />
       </div>
-      <div className="flex justify-between w-full mt-4">
+      <div className="mt-4 flex w-full justify-between">
         <TextLabel2>~$0.0</TextLabel2>
         <div>
           {roundedBalance && (
             <TextLabel2>{`Balance: ${roundedBalance}`}</TextLabel2>
           )}
           {type === 'from' && (
             <button
-              className="flex py-1 px-2 items-center justify-center cursor-pointer"
+              type="button"
+              className="flex cursor-pointer items-center justify-center px-2 py-1"
               data-testid="ockSwapAmountInput_MaxButton"
               disabled={roundedBalance === undefined}
               onClick={handleMaxButtonClick}

src/swap/components/SwapButton.tsx

@@ -27,13 +27,14 @@ export function SwapButton({ onError, onSubmit }: SwapButtonReact) {
         onError?.(error as SwapError);
       }
     }
-  }, [address, fromAmount, fromToken, toToken]);
+  }, [address, fromAmount, fromToken, onError, onSubmit, toToken]);
 
   return (
     <button
+      type="button"
       className={cn(
         'w-full rounded-xl bg-indigo-600',
-        'px-4 py-3 font-medium text-base text-white leading-6 mt-4',
+        'mt-4 px-4 py-3 font-medium text-base text-white leading-6',
       )}
       onClick={handleSubmit}
       disabled={!fromAmount || !fromToken || !toToken}

src/swap/core/buildSwapTransaction.test.ts

@@ -2,7 +2,7 @@ import { getAPIParamsForToken } from './getAPIParamsForToken';
 import { buildSwapTransaction } from './buildSwapTransaction';
 import { getSwapTransaction } from './getSwapTransaction';
 import { sendRequest } from '../../network/request';
-import { CDP_GET_SWAP_TRADE } from '../../definitions/swap';
+import { CDP_GET_SWAP_TRADE } from '../../network/definitions/swap';
 import type { Token } from '../../token/types';
 import type { BuildSwapTransaction } from '../types';
 

src/swap/core/buildSwapTransaction.ts

@@ -1,4 +1,4 @@
-import { CDP_GET_SWAP_TRADE } from '../../definitions/swap';
+import { CDP_GET_SWAP_TRADE } from '../../network/definitions/swap';
 import { sendRequest } from '../../network/request';
 import { getAPIParamsForToken } from './getAPIParamsForToken';
 import { getSwapTransaction } from './getSwapTransaction';

src/swap/core/getSwapQuote.test.ts

@@ -1,6 +1,6 @@
 import { getSwapQuote } from './getSwapQuote';
 import { sendRequest } from '../../network/request';
-import { CDP_GET_SWAP_QUOTE } from '../../definitions/swap';
+import { CDP_GET_SWAP_QUOTE } from '../../network/definitions/swap';
 import type { Token } from '../../token/types';
 import { getAPIParamsForToken } from './getAPIParamsForToken';
 

src/swap/core/getSwapQuote.ts

@@ -1,4 +1,4 @@
-import { CDP_GET_SWAP_QUOTE } from '../../definitions/swap';
+import { CDP_GET_SWAP_QUOTE } from '../../network/definitions/swap';
 import { sendRequest } from '../../network/request';
 import { getAPIParamsForToken } from './getAPIParamsForToken';
 import type {

src/token/components/useDebounce.ts

@@ -23,10 +23,9 @@ export const useDebounce = (
     }, delayMs);
   };
 
-  return useMemo(
-    () =>
-      (...args: any) =>
-        debounce(callbackRef.current, delay, ...args),
-    [delay],
-  );
+  return useMemo(() => {
+    return (...args: any) => {
+      return debounce(callbackRef.current, delay, ...args);
+    };
+  }, [delay]);
 };

src/token/core/getToken.test.ts

@@ -1,6 +1,6 @@
 import { getTokens } from './getTokens';
 import { sendRequest } from '../../network/request';
-import { CDP_LIST_SWAP_ASSETS } from '../../definitions/swap';
+import { CDP_LIST_SWAP_ASSETS } from '../../network/definitions/swap';
 
 jest.mock('../../network/request');
 

src/token/core/getTokens.ts

@@ -1,4 +1,4 @@
-import { CDP_LIST_SWAP_ASSETS } from '../../definitions/swap';
+import { CDP_LIST_SWAP_ASSETS } from '../../network/definitions/swap';
 import type {
   Token,
   GetTokensOptions,

src/utils/neynar/frame/convertToNeynarResponseModel.ts

@@ -2,6 +2,7 @@ import type { FrameValidationData } from '../../../frame/types';
 import type { NeynarFrameValidationInternalModel } from './types';
 
 export function convertToNeynarResponseModel(
+  /* biome-ignore lint: code needs to be deprecated */
   data: any,
 ): FrameValidationData | undefined {
   if (!data) {

src/utils/neynar/frame/types.ts

@@ -16,11 +16,13 @@ export interface NeynarFrameValidationInternalModel {
       profile: {
         bio: {
           text: string;
+          /* biome-ignore lint: code needs to be deprecated */
           mentioned_profiles?: any[];
         };
       };
       follower_count: number;
       following_count: number;
+      /* biome-ignore lint: code needs to be deprecated */
       verifications: any[];
       verified_addresses: {
         eth_addresses: string[] | null;
@@ -62,11 +64,13 @@ export interface NeynarFrameValidationInternalModel {
         profile: {
           bio: {
             text: string;
+            /* biome-ignore lint: code needs to be deprecated */
             mentioned_profiles?: any[];
           };
         };
         follower_count: number;
         following_count: number;
+        /* biome-ignore lint: code needs to be deprecated */
         verifications: any[];
         active_status: string;
         viewer_context: {
@@ -121,11 +125,13 @@ export interface NeynarFrameValidationInternalModel {
         profile: {
           bio: {
             text: string;
+            /* biome-ignore lint: code needs to be deprecated */
             mentioned_profiles?: any[];
           };
         };
         follower_count: number;
         following_count: number;
+        /* biome-ignore lint: code needs to be deprecated */
         verifications: any[];
         active_status: string;
       }[];