chore: lint (#539)

coinbase · Jun 13, 2024 · 7b88988 · 7b88988
1 parent 732a51c
commit 7b88988
Show file tree

Hide file tree

Showing 14 changed files with 24 additions and 23 deletions.
diff --git a/site/docs/components/SwapAmountInputContainer.tsx b/site/docs/components/SwapAmountInputContainer.tsx
@@ -1,4 +1,4 @@
-import { ReactElement, useState } from 'react';
+import { type ReactElement, useState } from 'react';
 import type { Token } from '@coinbase/onchainkit/token';
 
 type SwapAmountInputContainer = {

diff --git a/site/docs/components/TokenSelector.tsx b/site/docs/components/TokenSelector.tsx
@@ -77,15 +77,15 @@ function TokenSelector() {
       )}
       {filteredTokens.length > 0 ? (
         <div>
-          <div className="text-body text-black">Tokens</div>
+          <div className="text-black text-body">Tokens</div>
           <div>
             {filteredTokens.map((token) => (
               <TokenRow key={token.name} token={token} onClick={handleSelect} />
             ))}
           </div>
         </div>
       ) : (
-        <div className="text-body text-black">No tokens found</div>
+        <div className="text-black text-body">No tokens found</div>
       )}
     </div>
   );

diff --git a/site/docs/components/TokenSelectorContainer.tsx b/site/docs/components/TokenSelectorContainer.tsx
@@ -1,4 +1,4 @@
-import { ReactElement, useState } from 'react';
+import { type ReactElement, useState } from 'react';
 import type { Token } from '@coinbase/onchainkit/token';
 
 type TokenSelectorContainer = {

diff --git a/site/docs/pages/App.tsx b/site/docs/pages/App.tsx
@@ -1,5 +1,5 @@
 'use client';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { WagmiProvider, createConfig, http } from 'wagmi';
 import { baseSepolia } from 'wagmi/chains';

diff --git a/site/vocs.config.tsx b/site/vocs.config.tsx
@@ -7,7 +7,8 @@ export const GOOGLE_ANALYTICS_ID =
   process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS_ID ?? 'TEST_GA';
 
 const ONCHAINKIT_TITLE = 'OnchainKit';
-const ONCHAINKIT_DESCRIPTION = `React components and TypeScript utilities for top-tier onchain apps.`;
+const ONCHAINKIT_DESCRIPTION =
+  'React components and TypeScript utilities for top-tier onchain apps.';
 
 export default defineConfig({
   baseUrl: 'https://onchainkit.xyz',

diff --git a/src/identity/components/WithAvatarBadge.tsx b/src/identity/components/WithAvatarBadge.tsx
@@ -25,7 +25,7 @@ function WithAvatarBadgeInner({
     <div className="relative h-8 w-8" data-testid="ockAvatarBadgeContainer">
       {children}
       {attestations?.[0] && (
-        <div className="absolute -bottom-0.5 -right-0.5 flex h-[15px] w-[15px] items-center justify-center rounded-full bg-transparent">
+        <div className="-bottom-0.5 -right-0.5 absolute flex h-[15px] w-[15px] items-center justify-center rounded-full bg-transparent">
           <div className="flex h-[11px] w-[11px] items-center justify-center">
             <Badge />
           </div>

diff --git a/src/swap/components/Swap.tsx b/src/swap/components/Swap.tsx
@@ -103,7 +103,7 @@ export function Swap({ address, children, onError }: SwapReact) {
         <label
           className={cn(
             'box-border w-full border-b border-solid p-4 text-base',
-            'font-semibold leading-6 text-[#030712]',
+            'font-semibold text-[#030712] leading-6',
           )}
         >
           Swap

diff --git a/src/swap/components/SwapAmountInput.tsx b/src/swap/components/SwapAmountInput.tsx
@@ -61,7 +61,7 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
       data-testid="ockSwapAmountInput_Container"
     >
       <div className="flex w-full items-center justify-between">
-        <label className="text-sm font-semibold text-[#030712]">{label}</label>
+        <label className="font-semibold text-[#030712] text-sm">{label}</label>
       </div>
       <div className="flex w-full items-center justify-between">
         <TokenChip token={token} />

diff --git a/src/swap/components/SwapButton.tsx b/src/swap/components/SwapButton.tsx
@@ -33,7 +33,7 @@ export function SwapButton({ onError, onSubmit }: SwapButtonReact) {
       <button
         className={cn(
           'w-full rounded-[100px] bg-blue-700',
-          'px-4 py-3 text-base font-medium leading-6 text-white',
+          'px-4 py-3 font-medium text-base text-white leading-6',
         )}
         onClick={handleSubmit}
         disabled={!fromAmount || !fromToken || !toToken}

diff --git a/src/token/components/TextInput.tsx b/src/token/components/TextInput.tsx
@@ -18,21 +18,21 @@ export function TextInput({ placeholder, value, onChange }: TextInputReact) {
 
   return (
     <div className="relative flex items-center">
-      <div className="absolute left-4 top-1/2 -translate-y-1/2">
+      <div className="-translate-y-1/2 absolute top-1/2 left-4">
         <SearchIcon />
       </div>
       <input
         data-testid="ockTextInput_Search"
         type="text"
-        className="w-full rounded-full border-2 border-solid border-[#eef0f3] bg-[#eef0f3] py-2 pl-12 pr-5 text-[#0A0B0D] placeholder-[#5B616E] outline-none hover:bg-[#cacbce] hover:focus:bg-[#eef0f3]"
+        className="w-full rounded-full border-2 border-[#eef0f3] border-solid bg-[#eef0f3] py-2 pr-5 pl-12 text-[#0A0B0D] placeholder-[#5B616E] outline-none hover:bg-[#cacbce] hover:focus:bg-[#eef0f3]"
         placeholder={placeholder}
         value={value}
         onChange={handleChange}
       />
       {value && (
         <button
           data-testid="ockTextInput_Clear"
-          className="absolute right-4 top-1/2 -translate-y-1/2"
+          className="-translate-y-1/2 absolute top-1/2 right-4"
           onClick={handleClear}
         >
           <svg

diff --git a/src/token/components/TokenChip.tsx b/src/token/components/TokenChip.tsx
@@ -10,11 +10,11 @@ export function TokenChip({ token, onClick }: TokenChipReact) {
   return (
     <button
       data-testid="ockTokenChip_Button"
-      className="flex w-fit items-center rounded-2xl bg-[#eef0f3] py-1 pl-1 pr-3 hover:bg-[#cacbce] hover:active:bg-[#bfc1c3]"
+      className="flex w-fit items-center rounded-2xl bg-[#eef0f3] py-1 pr-3 pl-1 hover:active:bg-[#bfc1c3] hover:bg-[#cacbce]"
       onClick={() => onClick?.(token)}
     >
       <img className="mr-2 h-6 w-6" src={token.image || ''} />
-      <span className="text-base font-medium leading-4 text-black">
+      <span className="font-medium text-base text-black leading-4">
         {token.symbol}
       </span>
     </button>

diff --git a/src/token/components/TokenRow.tsx b/src/token/components/TokenRow.tsx
@@ -13,25 +13,25 @@ export const TokenRow = memo(function TokenRow({
   return (
     <button
       data-testid="ockTokenRow_Container"
-      className="flex h-16 w-full cursor-pointer items-center justify-between bg-white px-2 py-1 hover:bg-[#cacbce] active:bg-[#bfc1c3]"
+      className="flex h-16 w-full cursor-pointer items-center justify-between bg-white px-2 py-1 active:bg-[#bfc1c3] hover:bg-[#cacbce]"
       onClick={() => onClick?.(token)}
     >
       <span className="flex items-center gap-3">
         {!hideImage && <TokenImage token={token} size={48} />}
         <span className="flex flex-col items-start">
-          <span className="font-medium leading-normal text-[#0A0B0D]">
+          <span className="font-medium text-[#0A0B0D] leading-normal">
             {token.name}
           </span>
           {!hideSymbol && (
-            <span className="font-normal leading-normal text-[#5B616E]">
+            <span className="font-normal text-[#5B616E] leading-normal">
               {token.symbol}
             </span>
           )}
         </span>
       </span>
       <span
         data-testid="ockTokenRow_Amount"
-        className="font-normal leading-normal text-[#5B616E]"
+        className="font-normal text-[#5B616E] leading-normal"
       >
         {formatAmount(amount, {
           minimumFractionDigits: 2,

diff --git a/src/token/components/TokenSelectButton.tsx b/src/token/components/TokenSelectButton.tsx
@@ -45,7 +45,7 @@ export const TokenSelectButton = forwardRef(function TokenSelectButton(
   return (
     <button
       data-testid="ockTokenSelectButton_Button"
-      className="flex w-fit items-center gap-2 rounded-2xl bg-[#eef0f3] px-3 py-1 outline-none hover:bg-[#cacbce] active:bg-[#bfc1c3]"
+      className="flex w-fit items-center gap-2 rounded-2xl bg-[#eef0f3] px-3 py-1 outline-none active:bg-[#bfc1c3] hover:bg-[#cacbce]"
       onClick={onClick}
       ref={ref}
     >
@@ -54,13 +54,13 @@ export const TokenSelectButton = forwardRef(function TokenSelectButton(
           <TokenImage token={token} size={16} />
           <span
             data-testid="ockTokenSelectButton_Symbol"
-            className="text-base font-medium leading-normal text-[#0a0b0d]"
+            className="font-medium text-[#0a0b0d] text-base leading-normal"
           >
             {token.symbol}
           </span>
         </>
       ) : (
-        <span className="text-base font-medium leading-normal text-[#0a0b0d]">
+        <span className="font-medium text-[#0a0b0d] text-base leading-normal">
           Select
         </span>
       )}

diff --git a/src/wallet/components/ConnectAccount.tsx b/src/wallet/components/ConnectAccount.tsx
@@ -39,7 +39,7 @@ export function ConnectAccount({ children }: ConnectAccountReact) {
               type="button"
             >
               <div
-                className="text-sm font-medium leading-5 text-black"
+                className="font-medium text-black text-sm leading-5"
                 data-testid="ockConnectAccountButtonInner"
               >
                 Connect wallet