Fix linting errors in @casimir/web app

.eslintrc

@@ -25,7 +25,7 @@
         "semi": ["error", "never"],
         "quotes": ["error", "double"],
         "vue/multi-word-component-names": "off",
-        "max-len": ["error", { "code": 120, "ignoreStrings": true, "comments":300, "ignoreTemplateLiterals": true }],
+        "max-len": ["error", { "code": 150, "ignoreStrings": true, "comments":300, "ignoreTemplateLiterals": true }],
         "space-before-blocks": ["error", "always"],
         "object-curly-spacing": ["error", "always"],
         "space-in-parens": ["error", "never"],

apps/web/src/composables/analytics.ts

@@ -68,7 +68,8 @@ export default function useAnalytics() {
           const dataLength = userAnalytics.value.oneYear.data.push({ walletAddress, walletBalance: Array(12).fill(0) })
           oneYearDataIndex = dataLength - 1
         }
-        const monthsAgo = (new Date().getFullYear() - new Date(receivedAt).getFullYear()) * 12 + (new Date().getMonth() - new Date(receivedAt).getMonth())
+        const monthsAgo = 
+          (new Date().getFullYear() - new Date(receivedAt).getFullYear()) * 12 + (new Date().getMonth() - new Date(receivedAt).getMonth())
         const intervalIndex = 11 - monthsAgo
         userAnalytics.value.oneYear.data[oneYearDataIndex].walletBalance[intervalIndex] = walletBalance
       }
@@ -80,7 +81,8 @@ export default function useAnalytics() {
           const dataLength = userAnalytics.value.sixMonth.data.push({ walletAddress, walletBalance: Array(6).fill(0) })
           sixMonthDataIndex = dataLength - 1
         }
-        const monthsAgo = (new Date().getFullYear() - new Date(receivedAt).getFullYear()) * 12 + (new Date().getMonth() - new Date(receivedAt).getMonth())
+        const monthsAgo = 
+          (new Date().getFullYear() - new Date(receivedAt).getFullYear()) * 12 + (new Date().getMonth() - new Date(receivedAt).getMonth())
         const intervalIndex = 5 - monthsAgo
         userAnalytics.value.sixMonth.data[sixMonthDataIndex].walletBalance[intervalIndex] = walletBalance
       }

apps/web/src/composables/breakdownMetrics.ts

@@ -72,7 +72,12 @@ export default function useBreakdownMetrics() {
           WithdrawalRequested: acc.WithdrawalRequested + (WithdrawalRequested || 0),
           WithdrawalFulfilled: acc.WithdrawalFulfilled + (WithdrawalFulfilled || 0)
         }
-      }, { StakeDeposited: 0, WithdrawalInitiated: 0, WithdrawalRequested: 0, WithdrawalFulfilled: 0 } as { StakeDeposited: number; WithdrawalInitiated: number, WithdrawalRequested: number, WithdrawalFulfilled: number })
+      }, { 
+        StakeDeposited: 0, 
+        WithdrawalInitiated: 0, 
+        WithdrawalRequested: 0, 
+        WithdrawalFulfilled: 0 
+      } as { StakeDeposited: number; WithdrawalInitiated: number, WithdrawalRequested: number, WithdrawalFulfilled: number })
 
 
       const stakedDepositedETH = userEventTotalsSum.StakeDeposited
@@ -82,7 +87,8 @@ export default function useBreakdownMetrics() {
 
 
       /* Get User's All Time Rewards */
-      const currentUserStakeMinusEvents = currentUserStakeETH - stakedDepositedETH + ((withdrawalInitiatedETH) + (withdrawalRequestedETH) + (withdrawalFulfilledETH))
+      const currentUserStakeMinusEvents = 
+        currentUserStakeETH - stakedDepositedETH + ((withdrawalInitiatedETH) + (withdrawalRequestedETH) + (withdrawalFulfilledETH))
 
       return {
         eth: `${formatNumber(currentUserStakeMinusEvents)} ETH`,

apps/web/src/composables/contracts.ts

@@ -18,9 +18,15 @@ export default function useContracts() {
     const baseRegistry = new ethers.Contract(baseManagerConfig.registryAddress, ICasimirRegistryAbi, provider) as CasimirRegistry
     const baseViews = new ethers.Contract(baseManagerConfig.viewsAddress, ICasimirViewsAbi, provider) as CasimirViews
 
-    const eigenManager = new ethers.Contract(eigenManagerConfig?.managerAddress || ethers.constants.AddressZero, ICasimirManagerAbi, provider) as CasimirManager
-    const eigenRegistry = new ethers.Contract(eigenManagerConfig?.registryAddress || ethers.constants.AddressZero, ICasimirRegistryAbi, provider) as CasimirRegistry
-    const eigenViews = new ethers.Contract(eigenManagerConfig?.viewsAddress || ethers.constants.AddressZero, ICasimirViewsAbi, provider) as CasimirViews
+    const eigenManager = new ethers.Contract(
+      eigenManagerConfig?.managerAddress || ethers.constants.AddressZero, ICasimirManagerAbi, provider
+    ) as CasimirManager
+    const eigenRegistry = new ethers.Contract(
+      eigenManagerConfig?.registryAddress || ethers.constants.AddressZero, ICasimirRegistryAbi, provider
+    ) as CasimirRegistry
+    const eigenViews = new ethers.Contract(
+      eigenManagerConfig?.viewsAddress || ethers.constants.AddressZero, ICasimirViewsAbi, provider
+    ) as CasimirViews
 
     return {
       baseManager,

apps/web/src/composables/ethers.ts

@@ -76,7 +76,9 @@ export default function useEthers() {
    * Estimate gas fee using EIP 1559 methodology
    * @returns string in ETH
    */
-  async function estimateEIP1559GasFee(rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable<ethers.providers.TransactionRequest>) : Promise<GasEstimate> {
+  async function estimateEIP1559GasFee(
+    rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable<ethers.providers.TransactionRequest>
+  ) : Promise<GasEstimate> {
     try {
       const provider = new ethers.providers.JsonRpcProvider(rpcUrl)
       const gasPrice = await provider.getFeeData() as ethers.providers.FeeData
@@ -120,7 +122,9 @@ export default function useEthers() {
    * @deprecated
    * @see estimateEIP1559GasFee
   */
-  async function estimateLegacyGasFee(rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable<ethers.providers.TransactionRequest>) : Promise<GasEstimate> {
+  async function estimateLegacyGasFee(
+    rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable<ethers.providers.TransactionRequest>
+  ) : Promise<GasEstimate> {
     try {
       const provider = new ethers.providers.JsonRpcProvider(rpcUrl)
       const gasPrice = await provider.getGasPrice()

apps/web/src/composables/ledger.ts

@@ -104,7 +104,8 @@ export default function useLedger() {
       } as ethers.UnsignedTransaction
 
       // Todo check before click (user can +/- gas limit accordingly)
-      const { gasPrice, gasLimit } = await getGasPriceAndLimit(ethereumUrl, unsignedTransaction as ethers.utils.Deferrable<ethers.providers.TransactionRequest>)
+      const { gasPrice, gasLimit } = 
+        await getGasPriceAndLimit(ethereumUrl, unsignedTransaction as ethers.utils.Deferrable<ethers.providers.TransactionRequest>)
       const balance = await provider.getBalance(from)
       const required = gasPrice.mul(gasLimit).add(ethers.utils.parseEther(value))
       console.log("Balance", ethers.utils.formatEther(balance))

apps/web/src/composables/operators.ts

@@ -203,7 +203,9 @@ export default function useOperators() {
       } else {
         throw new Error(`Invalid wallet provider: ${walletProvider}`)
       }
-      const result = await (baseRegistry as CasimirRegistry).connect(signer as ethers.Signer).registerOperator(operatorId, { from: address, value: ethers.utils.parseEther(collateral) })
+      const result = await (baseRegistry as CasimirRegistry)
+        .connect(signer as ethers.Signer)
+        .registerOperator(operatorId, { from: address, value: ethers.utils.parseEther(collateral) })
       // TODO: @shanejearley - How many confirmations do we want to wait?
       await result?.wait(1)
       await addOperator({ address, nodeUrl })

apps/web/src/composables/trezor.ts

@@ -101,7 +101,8 @@ export default function useTrezor() {
       value: ethers.utils.parseUnits(value),
       type: 0
     } as ethers.UnsignedTransaction
-    const { gasPrice, gasLimit } = await getGasPriceAndLimit(ethereumUrl, unsignedTransaction as ethers.utils.Deferrable<ethers.providers.TransactionRequest>)
+    const { gasPrice, gasLimit } = 
+      await getGasPriceAndLimit(ethereumUrl, unsignedTransaction as ethers.utils.Deferrable<ethers.providers.TransactionRequest>)
     unsignedTransaction.gasPrice = gasPrice
     unsignedTransaction.gasLimit = gasLimit
 

apps/web/src/pages/operators/Operator.vue

@@ -151,9 +151,13 @@ watch(selectedWallet, async () => {
     availableOperatorIDs.value = []
   } else if (operatorType.value === "base") {
     if (nonregisteredBaseOperators.value && nonregisteredBaseOperators.value.length > 0) {
-      availableOperatorIDs.value = [...nonregisteredBaseOperators.value].filter((operator: any) => operator.ownerAddress === selectedWallet.value.address).map((operator: any) => operator.id)
+      availableOperatorIDs.value = [...nonregisteredBaseOperators.value]
+        .filter((operator: any) => operator.ownerAddress === selectedWallet.value.address)
+        .map((operator: any) => operator.id)
     } else if (nonregisteredEigenOperators.value && nonregisteredEigenOperators.value.length > 0) {
-      availableOperatorIDs.value = [...nonregisteredEigenOperators.value].filter((operator: any) => operator.ownerAddress === selectedWallet.value.address).map((operator: any) => operator.id)
+      availableOperatorIDs.value = [...nonregisteredEigenOperators.value]
+        .filter((operator: any) => operator.ownerAddress === selectedWallet.value.address)
+        .map((operator: any) => operator.id)
     } else {
       availableOperatorIDs.value = []
     }
@@ -406,7 +410,10 @@ watch([loadingSessionLogin || loadingInitializeOperators], () => {
                     v-show="header.value != 'blank_column'"
                     class="ml-[4px] flex flex-col items-center justify-between"
                     :class="selectedHeader === header.value ? 'opacity-100' : 'opacity-25'"
-                    @click="selectedHeader = header.value, selectedOrientation === 'ascending' ? selectedOrientation = 'descending' : selectedOrientation = 'ascending'"
+                    @click="
+                      selectedHeader = header.value, 
+                      selectedOrientation === 'ascending' ? selectedOrientation = 'descending' : selectedOrientation = 'ascending'
+                    "
                   >
                     <vue-feather
                       type="arrow-up"

apps/web/src/pages/overview/components/BreakdownChart.vue

@@ -8,15 +8,23 @@ import { AnalyticsData, ProviderString, UserAnalyticsData, UserWithAccountsAndOp
 import useBreakdownMetrics from "@/composables/breakdownMetrics"
 
 const {  user } = useUser()
-const { currentStaked, stakingRewards, totalWalletBalance, initializeBreakdownMetricsComposable, uninitializeBreakdownMetricsComposable } = useBreakdownMetrics()
+const { 
+  currentStaked,
+  stakingRewards,
+  totalWalletBalance,
+  initializeBreakdownMetricsComposable,
+  uninitializeBreakdownMetricsComposable
+} = useBreakdownMetrics()
 const { screenWidth } = useScreenDimensions()
 
 const chardId = ref("cross_provider_chart")
 const selectedTimeframe = ref("historical")
 const chartData = ref({} as any)
 
 const getAccountColor = (address: string) => {
-  const walletProvider = user.value?.accounts.find(item =>  item.address.toLocaleLowerCase() === address.toLocaleLowerCase())?.walletProvider as ProviderString
+  const walletProvider = user.value?.accounts.find(
+    item =>  item.address.toLocaleLowerCase() === address.toLocaleLowerCase()
+  )?.walletProvider as ProviderString
 
   switch (walletProvider) {
   case "MetaMask":

apps/web/src/pages/overview/components/BreakdownTable.vue

@@ -128,9 +128,51 @@ const tableHeaderOptions = ref(
 const { user } = useUser()
 
 const tableData = ref({
-  Wallets: [] as { tx_hash: string, wallet_provider: string, status: string, staking_fees: string, type: string, amount: string, bal: string, act: string, date: string, blank_column: any, stk_amt: string, tx_type: string, stk_rwd: string }[],
-  Transactions: [] as { tx_hash: string, wallet_provider: string, status: string, staking_fees: string, type: string, amount: string, bal: string, act: string, date: string, blank_column: any, stk_amt: string, tx_type: string, stk_rwd: string }[],
-  Staking: [] as { tx_hash: string, wallet_provider: string, status: string, staking_fees: string, type: string, amount: string, bal: string, act: string, date: string, blank_column: any, stk_amt: string, tx_type: string, stk_rwd: string }[],
+  Wallets: [] as { 
+    tx_hash: string, 
+    wallet_provider: string, 
+    status: string,
+     staking_fees: string,
+     type: string,
+     amount: string,
+     bal: string,
+     act: string,
+     date: string,
+     blank_column: any,
+     stk_amt: string,
+     tx_type: string,
+     stk_rwd: string 
+    }[],
+  Transactions: [] as { 
+    tx_hash: string,
+     wallet_provider: string,
+     status: string,
+     staking_fees: string,
+     type: string,
+     amount: string,
+     bal: string,
+     act: string,
+     date: string,
+     blank_column: any,
+     stk_amt: string,
+     tx_type: string,
+     stk_rwd: string 
+    }[],
+  Staking: [] as { 
+    tx_hash: string,
+     wallet_provider: string,
+     status: string,
+     staking_fees: string,
+     type: string,
+     amount: string,
+     bal: string,
+     act: string,
+     date: string,
+     blank_column: any,
+     stk_amt: string,
+     tx_type: string,
+     stk_rwd: string 
+    }[],
 })
 
 const filteredData = ref(tableData.value[tableView.value as keyof typeof tableData.value])
@@ -478,7 +520,10 @@ onMounted(() => {
                   v-show="header.value != 'blank_column'"
                   class="ml-[4px] h-min"
                   :class="selectedHeader === header.value ? 'opacity-100 text-primary' : 'opacity-90 text-grey_4'"
-                  @click="selectedHeader = header.value, selectedOrientation === 'ascending' ? selectedOrientation = 'descending' : selectedOrientation = 'ascending'"
+                  @click="
+                    selectedHeader = header.value,
+                    selectedOrientation === 'ascending' ? selectedOrientation = 'descending' : selectedOrientation = 'ascending'
+                  "
                 >
                   <vue-feather
                     type="arrow-up"

apps/web/src/pages/overview/components/Staking.vue

@@ -649,7 +649,12 @@ function setStakeOrWithdraw(option: "stake" | "withdraw") {
     <button
       class="submit-button  h-[37px] w-full"
       :class="success ? 'bg-approve' : failure ? 'bg-decline' : 'bg-primary'"
-      :disabled="!(selectedWalletAddress && formattedAmountToStakeOrWithdraw && !errorMessage) || (stakeButtonText !== 'Stake' && stakeButtonText !== 'Withdraw') || parseFloat(formattedAmountToStakeOrWithdraw) <= 0 || (stakeOrWithdraw === 'stake' && !termsOfServiceCheckbox)"
+      :disabled="
+        !(selectedWalletAddress && formattedAmountToStakeOrWithdraw && !errorMessage) 
+          || (stakeButtonText !== 'Stake' && stakeButtonText !== 'Withdraw') 
+          || parseFloat(formattedAmountToStakeOrWithdraw) <= 0 
+          || (stakeOrWithdraw === 'stake' && !termsOfServiceCheckbox)
+      "
       @click="stakeOrWithdraw === 'stake' ? handleDeposit() : handleWithdraw()"
     >
       <div

common/uniswap/src/providers/factory.ts

@@ -15,7 +15,9 @@ export class Factory {
     } else {
       this.provider = new ethers.providers.JsonRpcProvider(options.ethereumUrl)
     }
-    this.uniswapV3Factory = new ethers.Contract(options.uniswapV3FactoryAddress, IUniswapV3FactoryAbi, this.provider) as IUniswapV3Factory & ethers.Contract
+    this.uniswapV3Factory = new ethers.Contract(
+      options.uniswapV3FactoryAddress, IUniswapV3FactoryAbi, this.provider
+    ) as IUniswapV3Factory & ethers.Contract
   }
 
   /** 

contracts/ethereum/helpers/oracle.ts

@@ -52,7 +52,9 @@ export async function initiatePoolHandler({ manager, signer }: { manager: Casimi
   await initiatePool.wait()
 }
 
-export async function activatePoolsHandler({ manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }) {
+export async function activatePoolsHandler(
+  { manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }
+) {
   const count = args.count as number
   if (!count) throw new Error("No count provided")
 
@@ -107,7 +109,9 @@ export async function activatePoolsHandler({ manager, views, signer, args }: { m
   }
 }
 
-export async function resharePoolHandler({ manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }) {
+export async function resharePoolHandler(
+  { manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }
+) {
   const operatorId = args.operatorId as number
   if (!operatorId) throw new Error("No operator id provided")
 
@@ -158,7 +162,8 @@ export async function resharePoolHandler({ manager, views, signer, args }: { man
           uniswapFeeTier: 3000
         })
 
-        const feeAmount = ethers.utils.parseEther((Number(ethers.utils.formatEther(requiredFee.sub(oldCluster.balance))) * Number(price)).toPrecision(9))
+        const unformattedFeeAmount = (Number(ethers.utils.formatEther(requiredFee.sub(oldCluster.balance))) * Number(price)).toPrecision(9)
+        const feeAmount = ethers.utils.parseEther(unformattedFeeAmount)
         const minTokenAmount = ethers.utils.parseEther((Number(ethers.utils.formatEther(requiredFee.sub(oldCluster.balance))) * 0.99).toPrecision(9))
 
         const reportReshare = await manager.connect(signer).resharePool(
@@ -242,7 +247,9 @@ export async function depositUpkeepBalanceHandler({ manager, signer }: { manager
   await depositUpkeepBalance.wait()
 }
 
-export async function reportCompletedExitsHandler({ manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }) {
+export async function reportCompletedExitsHandler(
+  { manager, views, signer, args }: { manager: CasimirManager, views: CasimirViews, signer: SignerWithAddress, args: Record<string, any> }
+) {
   const { count } = args
 
   /**

contracts/ethereum/scripts/dev.ts

@@ -195,7 +195,11 @@ async function dev() {
           const sweptExitedBalance = exitingPoolCount.toNumber() * 32
           const rewardBalance = rewardPerValidator * stakedPoolIds.length
           const latestBeaconBalance = await manager.latestBeaconBalance()
-          const nextBeaconBalance = round(parseFloat(ethers.utils.formatEther(latestBeaconBalance)) + activatedBalance + rewardBalance - sweptRewardBalance - sweptExitedBalance, 10)
+          const formattedBeaconBalance = ethers.utils.formatEther(latestBeaconBalance)
+          const nextBeaconBalance = round(
+            parseFloat(formattedBeaconBalance) + activatedBalance + rewardBalance - sweptRewardBalance - sweptExitedBalance,
+            10
+          )
           const nextActivatedDeposits = (await manager.getPendingPoolIds()).length
           for (const poolId of lastStakedPoolIds) {
             const poolAddress = await manager.getPoolAddress(poolId)