- {{ parseFloat(parseFloat(act.balance).toFixed(2)) }} ETH
+ {{ formatEthersCasimir(act.balance) }} ETH
@@ -420,9 +420,11 @@ onUnmounted(() => {
Confirm Signage
-+
The current wallet you are trying to connect exists under another primary wallet or is a primary account.
++
Would you like to create a new account with this address as the primary wallet address?
@@ -440,7 +442,7 @@ onUnmounted(() => {
class="action_button w-full"
@click="handleConfirmCreateAccountWithExistingSecondary"
>
- Confirm
+ Create Account
diff --git a/apps/web/src/composables/auth.ts b/apps/web/src/composables/auth.ts
index 59ec08f2d..343c21595 100644
--- a/apps/web/src/composables/auth.ts
+++ b/apps/web/src/composables/auth.ts
@@ -15,16 +15,11 @@ import {
} from "@casimir/types"
const { usersUrl } = useEnvironment()
-const { browserProvidersList, detectActiveEthersWalletAddress, loginWithEthers } =
- useEthers()
+const { browserProvidersList, detectActiveEthersWalletAddress, loginWithEthers } = useEthers()
const { loginWithLedger } = useLedger()
const { loginWithTrezor } = useTrezor()
const { setUser, user } = useUser()
-const {
- loginWithWalletConnectV2,
- initializeWalletConnect,
- uninitializeWalletConnect,
-} = useWalletConnect()
+const { loginWithWalletConnectV2, initializeWalletConnect, uninitializeWalletConnect } = useWalletConnect()
const initializedAuthComposable = ref(false)
const loadingSessionLogin = ref(false)
@@ -101,7 +96,7 @@ export default function useAuth() {
const response = await fetch(`${usersUrl}/user`, requestOptions)
const { user: retrievedUser, error } = await response.json()
if (error) throw new Error(error)
- await setUser(retrievedUser)
+ setUser(retrievedUser)
} catch (error: any) {
throw new Error("Error getting user from API route")
}
@@ -173,12 +168,9 @@ export default function useAuth() {
}
// Then check if address is being used as a secondary account by another user
- const { data: accountsIfSecondaryAddress } =
- await checkIfSecondaryAddress(address)
+ const { data: accountsIfSecondaryAddress } = await checkIfSecondaryAddress(address)
console.log("accountsIfSecondaryAddress :>> ", accountsIfSecondaryAddress)
- if (accountsIfSecondaryAddress.length) {
- return "Address already exists as a secondary address on another account"
- }
+ if (accountsIfSecondaryAddress.length) return "Address already exists as a secondary address on another account"
// Handle user interaction (do they want to sign in with another account?)
// If yes, log out (and/or log them in with the other account)
@@ -288,11 +280,10 @@ export default function useAuth() {
}
async function logout() {
- // Loader
try {
loadingSessionLogout.value = true
await Session.signOut()
- await setUser(undefined)
+ setUser(undefined)
loadingSessionLogout.value = false
} catch (error) {
loadingSessionLogoutError.value = true
diff --git a/apps/web/src/composables/breakdownMetrics.ts b/apps/web/src/composables/breakdownMetrics.ts
index e689016d7..93b91ccdb 100644
--- a/apps/web/src/composables/breakdownMetrics.ts
+++ b/apps/web/src/composables/breakdownMetrics.ts
@@ -1,56 +1,102 @@
-import { readonly, ref, onMounted, watch } from "vue"
+import { readonly, ref, watch } from "vue"
import { ethers } from "ethers"
import { Account, BreakdownAmount, BreakdownString, ContractEventsByAddress, UserWithAccountsAndOperators } from "@casimir/types"
import useContracts from "@/composables/contracts"
import useEnvironment from "@/composables/environment"
import useFormat from "@/composables/format"
import usePrice from "@/composables/price"
+import useStaking from "@/composables/staking"
import useUser from "@/composables/user"
import { CasimirManager } from "@casimir/ethereum/build/@types"
-const { getContracts } = useContracts()
-const { provider } = useEnvironment()
-const { formatNumber } = useFormat()
+const { getBaseManager, getEigenManager, contractsAreInitialized } = useContracts()
+const { batchProvider, provider, wsProvider } = useEnvironment()
+const { formatEthersCasimir } = useFormat()
const { getCurrentPrice } = usePrice()
+const { awaitingStakeOrWithdrawConfirmation } = useStaking()
const { user } = useUser()
-const isInitialized = ref(false)
+const breakdownMetricsComposableInitialized = ref(false)
const loadingInitializeBreakdownMetrics = ref(false)
const loadingInitializeBreakdownMetricsError = ref(false)
+const listeningForContractEvents = ref(false)
let baseManager: CasimirManager
let eigenManager: CasimirManager
+const currentStaked = ref({ eth: "0 ETH", usd: "$0.00" })
+const stakingRewards = ref({ eth: "0 ETH", usd: "$0.00" })
+const totalWalletBalance = ref({ eth: "0 ETH", usd: "$0.00" })
+
export default function useBreakdownMetrics() {
- onMounted(() => {
- if (user.value) initializeBreakdownMetricsComposable()
- else uninitializeBreakdownMetricsComposable()
- })
-
- watch(user, async () => {
- if (user.value) {
- initializeBreakdownMetricsComposable()
+ async function blockListener(blockNumber: number) {
+ if (!user.value) return
+ if (import.meta.env.MODE === "development") console.log("blockNumber :>> ", blockNumber)
+
+ const addresses = (user.value as UserWithAccountsAndOperators).accounts.map((account: Account) => account.address) as string[]
+ const availableProvider = wsProvider || provider
+ const block = await availableProvider.getBlockWithTransactions(blockNumber)
+
+ const txs = block.transactions.map(async (tx: any) => {
+ if (addresses.includes(tx.from.toLowerCase())) {
+ try {
+ // const response = (manager as CasimirManager).interface.parseTransaction({ data: tx.data })
+ // console.log('response :>> ', response)
+ await refreshBreakdown()
+ } catch (error) {
+ console.error("Error parsing transaction:", error)
+ }
+ }
+ })
+
+ await Promise.all(txs)
+ }
+
+ async function initializeBreakdownMetricsComposable() {
+ watch([user, contractsAreInitialized], async () => {
+ if (user.value && contractsAreInitialized.value && !breakdownMetricsComposableInitialized.value) {
+ await initializeBreakdownMetricsComposable()
+ } else {
+ uninitializeBreakdownMetricsComposable()
+ }
+ })
+
+ watch(awaitingStakeOrWithdrawConfirmation, () => {
+ if (awaitingStakeOrWithdrawConfirmation.value && !listeningForContractEvents.value) {
+ listenForStakeWithdrawEvents()
+ } else {
+ stopListeningForContractEvents()
+ }
+ })
+
+ if (breakdownMetricsComposableInitialized.value) return
+ breakdownMetricsComposableInitialized.value = true
+
+ baseManager = getBaseManager()
+ eigenManager = getEigenManager()
+
+ try {
+ loadingInitializeBreakdownMetrics.value = true
+ const availableProvider = wsProvider || provider
+ availableProvider.removeAllListeners("block")
+ availableProvider.on("block", blockListener as ethers.providers.Listener)
+ listenForRebalancedEvents()
await refreshBreakdown()
- } else {
- uninitializeBreakdownMetricsComposable()
+ loadingInitializeBreakdownMetrics.value = false
+ breakdownMetricsComposableInitialized.value = true
+ } catch (error) {
+ loadingInitializeBreakdownMetricsError.value = true
+ console.log("Error initializing breakdown metrics :>> ", error)
+ loadingInitializeBreakdownMetrics.value = false
}
+ }
- })
-
- const currentStaked = ref({
- eth: "0 ETH",
- usd: "$0.00"
- })
-
- const stakingRewards = ref({
- eth: "0 ETH",
- usd: "$0.00"
- })
-
- const totalWalletBalance = ref({
- eth: "0 ETH",
- usd: "$0.00"
- })
+ async function uninitializeBreakdownMetricsComposable() {
+ const availableProvider = wsProvider || provider
+ availableProvider.removeAllListeners("block")
+ stopListeningForContractEvents()
+ breakdownMetricsComposableInitialized.value = false
+ }
async function getAllTimeStakingRewards() : Promise {
try {
@@ -93,11 +139,10 @@ export default function useBreakdownMetrics() {
/* Get User's All Time Rewards */
const currentUserStakeMinusEvents =
- currentUserStakeETH - stakedDepositedETH + ((withdrawalInitiatedETH) + (withdrawalRequestedETH) + (withdrawalFulfilledETH))
-
+ currentUserStakeETH - stakedDepositedETH + ((withdrawalInitiatedETH) + (withdrawalRequestedETH) + (withdrawalFulfilledETH))
return {
- eth: `${formatNumber(currentUserStakeMinusEvents)} ETH`,
- usd: `$${formatNumber(currentUserStakeMinusEvents * (await getCurrentPrice({ coin: "ETH", currency: "USD" })))}`
+ eth: `${formatEthersCasimir(currentUserStakeMinusEvents)} ETH`,
+ usd: `$${formatEthersCasimir(currentUserStakeMinusEvents * (await getCurrentPrice({ coin: "ETH", currency: "USD" })))}`
}
} catch (err) {
console.error(`There was an error in getAllTimeStakingRewards: ${err}`)
@@ -155,19 +200,21 @@ export default function useBreakdownMetrics() {
async function getCurrentStaked(): Promise {
const addresses = (user.value as UserWithAccountsAndOperators).accounts.map((account: Account) => account.address) as string[]
try {
- const baseManagerPromises = addresses.map((address) => (baseManager as CasimirManager).getUserStake(address))
+ const baseManagerPromises = addresses.map((address) => {
+ // console.log("running getUserStake in getCurrentStaked")
+ return (baseManager as CasimirManager).getUserStake(address)
+ })
const eigenManagerPromises = addresses.map((address) => (eigenManager as CasimirManager).getUserStake(address))
const promises = [...baseManagerPromises, ...eigenManagerPromises]
const settledPromises = await Promise.allSettled(promises) as Array>
const currentStaked = settledPromises
.filter((result) => result.status === "fulfilled")
.map((result) => result.value)
-
const totalStaked = currentStaked.reduce((accumulator, currentValue) => accumulator.add(currentValue), ethers.BigNumber.from(0))
const totalStakedUSD = parseFloat(ethers.utils.formatEther(totalStaked)) * (await getCurrentPrice({ coin: "ETH", currency: "USD" }))
const totalStakedETH = parseFloat(ethers.utils.formatEther(totalStaked))
- const formattedTotalStakedUSD = formatNumber(totalStakedUSD)
- const formattedTotalStakedETH = formatNumber(totalStakedETH)
+ const formattedTotalStakedUSD = formatEthersCasimir(totalStakedUSD)
+ const formattedTotalStakedETH = formatEthersCasimir(totalStakedETH)
return {
eth: formattedTotalStakedETH + " ETH",
usd: "$ " + formattedTotalStakedUSD
@@ -181,25 +228,29 @@ export default function useBreakdownMetrics() {
}
}
- async function getEthersBalance(address: string) : Promise {
- const balance = await provider.getBalance(address)
- return parseFloat(ethers.utils.formatEther(balance))
- }
-
- async function getTotalWalletBalance() : Promise {
- const promises = [] as Array>
- const addresses = (user.value as UserWithAccountsAndOperators).accounts.map((account: Account) => account.address) as string[]
- addresses.forEach((address) => { promises.push(getEthersBalance(address)) })
- const totalWalletBalance = (await Promise.all(promises)).reduce((acc, curr) => acc + curr, 0)
- const totalWalletBalanceUSD = totalWalletBalance * (await getCurrentPrice({ coin: "ETH", currency: "USD" }))
- const formattedTotalWalletBalance = formatNumber(totalWalletBalance)
- const formattedTotalWalletBalanceUSD = formatNumber(totalWalletBalanceUSD)
- return {
- eth: formattedTotalWalletBalance + " ETH",
- usd: "$ " + formattedTotalWalletBalanceUSD
+ async function getTotalWalletBalance(): Promise {
+ try {
+ const addresses = (user.value as UserWithAccountsAndOperators).accounts.map(account => account.address)
+ const balancePromises = addresses.map((address: string) => batchProvider.getBalance(address))
+ const balances = await Promise.all(balancePromises)
+ const totalWalletBalance = balances.reduce((acc, curr) => acc.add(curr), ethers.BigNumber.from(0))
+ const totalWalletBalanceUSD = (await getCurrentPrice({ coin: "ETH", currency: "USD" })) * parseFloat(ethers.utils.formatEther(totalWalletBalance))
+ const formattedTotalWalletBalance = ethers.utils.formatEther(totalWalletBalance)
+ const roundedFormattedTotalWalletBalance = formatEthersCasimir(parseFloat(formattedTotalWalletBalance))
+ const formattedTotalWalletBalanceUSD = formatEthersCasimir(totalWalletBalanceUSD, 2)
+ return {
+ eth: roundedFormattedTotalWalletBalance + " ETH",
+ usd: "$ " + formattedTotalWalletBalanceUSD
+ }
+ } catch (error) {
+ console.log("Error occurred in getTotalWalletBalance:", error)
+ return {
+ eth: "0ETH",
+ usd: "$0.00"
+ }
}
}
-
+
async function refreshBreakdown() {
try {
setBreakdownValue({ name: "currentStaked", ...await getCurrentStaked() })
@@ -213,41 +264,45 @@ export default function useBreakdownMetrics() {
function setBreakdownValue({ name, eth, usd }: { name: BreakdownString, eth: string, usd: string}) {
switch (name) {
case "currentStaked":
- currentStaked.value = {
- eth,
- usd
- }
+ currentStaked.value = { eth, usd }
break
case "totalWalletBalance":
- totalWalletBalance.value = {
- eth,
- usd
- }
+ totalWalletBalance.value = { eth, usd }
break
case "stakingRewardsEarned":
- stakingRewards.value = {
- eth,
- usd
- }
+ stakingRewards.value = { eth, usd }
break
}
}
- function listenForContractEvents() {
+ function listenForStakeWithdrawEvents() {
+ if (!breakdownMetricsComposableInitialized.value) return
stopListeningForContractEvents() // Clear old listeners
+ listeningForContractEvents.value = true
try {
(baseManager as CasimirManager).on("StakeDeposited", stakeDepositedListener);
- (baseManager as CasimirManager).on("StakeRebalanced", stakeRebalancedListener);
(baseManager as CasimirManager).on("WithdrawalInitiated", withdrawalInitiatedListener);
(eigenManager as CasimirManager).on("StakeDeposited", stakeDepositedListener);
- (eigenManager as CasimirManager).on("StakeRebalanced", stakeRebalancedListener);
(eigenManager as CasimirManager).on("WithdrawalInitiated", withdrawalInitiatedListener)
} catch (err) {
- console.log(`There was an error in listenForContractEvents: ${err}`)
+ console.log(`There was an error in listenForStakeWithdrawEvents: ${err}`)
+ }
+ }
+
+ function listenForRebalancedEvents() {
+ if (!breakdownMetricsComposableInitialized.value) return
+ stopListeningForContractEvents() // Clear old listeners
+ try {
+ (baseManager as CasimirManager).on("StakeRebalanced", stakeRebalancedListener)
+ // (eigenManager as CasimirManager).on("StakeRebalanced", stakeRebalancedListener)
+ } catch (err) {
+ console.log(`There was an error in listenForRebalancedEvents: ${err}`)
}
}
function stopListeningForContractEvents() {
+ listeningForContractEvents.value = false
+ if (!breakdownMetricsComposableInitialized.value) return
(baseManager as CasimirManager).removeListener("StakeDeposited", stakeDepositedListener);
(baseManager as CasimirManager).removeListener("StakeRebalanced", stakeRebalancedListener);
(baseManager as CasimirManager).removeListener("WithdrawalInitiated", withdrawalInitiatedListener);
@@ -259,57 +314,6 @@ export default function useBreakdownMetrics() {
const stakeDepositedListener = async () => await refreshBreakdown()
const stakeRebalancedListener = async () => await refreshBreakdown()
const withdrawalInitiatedListener = async () => await refreshBreakdown()
-
- async function blockListener(blockNumber: number) {
- if (!user.value) return
- if (import.meta.env.MODE === "development") console.log("blockNumber :>> ", blockNumber)
- const addresses = (user.value as UserWithAccountsAndOperators).accounts.map((account: Account) => account.address) as string[]
- const block = await provider.getBlockWithTransactions(blockNumber)
-
- const txs = block.transactions.map(async (tx: any) => {
- if (addresses.includes(tx.from.toLowerCase())) {
- try {
- // const response = (manager as CasimirManager).interface.parseTransaction({ data: tx.data })
- // console.log('response :>> ', response)
- await refreshBreakdown()
- } catch (error) {
- console.error("Error parsing transaction:", error)
- }
- }
- })
-
- await Promise.all(txs)
- }
-
- async function initializeBreakdownMetricsComposable() {
- if (isInitialized.value) return
- const { baseManager: baseManagerFromContracts, eigenManager: eigenManagerFromContracts } = await getContracts()
- baseManager = baseManagerFromContracts
- eigenManager = eigenManagerFromContracts
-
- try {
- loadingInitializeBreakdownMetrics.value = true
- provider.removeAllListeners("block")
- provider.on("block", blockListener as ethers.providers.Listener)
- listenForContractEvents()
- await refreshBreakdown()
- loadingInitializeBreakdownMetrics.value = false
- isInitialized.value = true
- } catch (error) {
- loadingInitializeBreakdownMetricsError.value = true
- console.log("Error initializing breakdown metrics :>> ", error)
- loadingInitializeBreakdownMetrics.value = false
- }
- }
-
- async function uninitializeBreakdownMetricsComposable() {
- const { baseManager: baseManagerFromContracts, eigenManager: eigenManagerFromContracts } = await getContracts()
- baseManager = baseManagerFromContracts
- eigenManager = eigenManagerFromContracts
- provider.removeAllListeners("block")
- stopListeningForContractEvents()
- isInitialized.value = false
- }
return {
currentStaked: readonly(currentStaked),
diff --git a/apps/web/src/composables/contracts.ts b/apps/web/src/composables/contracts.ts
index a0f27d1ce..2d94bc854 100644
--- a/apps/web/src/composables/contracts.ts
+++ b/apps/web/src/composables/contracts.ts
@@ -1,44 +1,72 @@
+import { ref } from "vue"
import { ethers } from "ethers"
import useEnvironment from "@/composables/environment"
-import { ManagerConfig } from "@casimir/types"
import { CasimirManager, CasimirRegistry, CasimirViews } from "@casimir/ethereum/build/@types"
import ICasimirManagerAbi from "@casimir/ethereum/build/abi/ICasimirManager.json"
import ICasimirRegistryAbi from "@casimir/ethereum/build/abi/ICasimirRegistry.json"
import ICasimirViewsAbi from "@casimir/ethereum/build/abi/ICasimirViews.json"
-const { provider, factory } = useEnvironment()
+const { wsProvider, provider, factory } = useEnvironment()
+const contractsAreInitialized = ref(false)
+
+let baseManager: CasimirManager
+let baseRegistry: CasimirRegistry
+let baseViews: CasimirViews
+let eigenManager: CasimirManager
+let eigenRegistry: CasimirRegistry
+let eigenViews: CasimirViews
export default function useContracts() {
+
+ async function initializeContractsComposable() {
+ if (contractsAreInitialized.value) return
+ await getContracts()
+ }
+
async function getContracts() {
const [baseManagerConfig, eigenManagerConfig] = await Promise.all((await factory.getManagerIds()).map(async (id: number) => {
return await factory.getManagerConfig(id)
}))
- const baseManager = new ethers.Contract(baseManagerConfig.managerAddress, ICasimirManagerAbi, provider) as CasimirManager
- const baseRegistry = new ethers.Contract(baseManagerConfig.registryAddress, ICasimirRegistryAbi, provider) as CasimirRegistry
- const baseViews = new ethers.Contract(baseManagerConfig.viewsAddress, ICasimirViewsAbi, provider) as CasimirViews
+ const availableProvider = wsProvider || provider
+
+ baseManager = new ethers.Contract(baseManagerConfig.managerAddress, ICasimirManagerAbi, availableProvider) as CasimirManager
+ baseRegistry = new ethers.Contract(baseManagerConfig.registryAddress, ICasimirRegistryAbi, availableProvider) as CasimirRegistry
+ baseViews = new ethers.Contract(baseManagerConfig.viewsAddress, ICasimirViewsAbi, availableProvider) as CasimirViews
- const eigenManager = new ethers.Contract(
- eigenManagerConfig?.managerAddress || ethers.constants.AddressZero, ICasimirManagerAbi, provider
+ eigenManager = new ethers.Contract(
+ eigenManagerConfig?.managerAddress || ethers.constants.AddressZero, ICasimirManagerAbi, availableProvider
) as CasimirManager
- const eigenRegistry = new ethers.Contract(
- eigenManagerConfig?.registryAddress || ethers.constants.AddressZero, ICasimirRegistryAbi, provider
+ eigenRegistry = new ethers.Contract(
+ eigenManagerConfig?.registryAddress || ethers.constants.AddressZero, ICasimirRegistryAbi, availableProvider
) as CasimirRegistry
- const eigenViews = new ethers.Contract(
- eigenManagerConfig?.viewsAddress || ethers.constants.AddressZero, ICasimirViewsAbi, provider
+ eigenViews = new ethers.Contract(
+ eigenManagerConfig?.viewsAddress || ethers.constants.AddressZero, ICasimirViewsAbi, availableProvider
) as CasimirViews
- return {
- baseManager,
- baseRegistry,
- baseViews,
- eigenManager,
- eigenRegistry,
- eigenViews
- }
+ contractsAreInitialized.value = true
}
+ function getBaseManager() { return baseManager }
+
+ function getEigenManager() { return eigenManager }
+
+ function getBaseRegistry() { return baseRegistry }
+
+ function getEigenRegistry() { return eigenRegistry }
+
+ function getBaseViews() { return baseViews }
+
+ function getEigenViews() { return eigenViews }
+
return {
- getContracts
+ contractsAreInitialized,
+ initializeContractsComposable,
+ getBaseManager,
+ getEigenManager,
+ getBaseRegistry,
+ getEigenRegistry,
+ getBaseViews,
+ getEigenViews,
}
}
\ No newline at end of file
diff --git a/apps/web/src/composables/environment.ts b/apps/web/src/composables/environment.ts
index d9f32a8ec..ba59d83c7 100644
--- a/apps/web/src/composables/environment.ts
+++ b/apps/web/src/composables/environment.ts
@@ -8,7 +8,10 @@ const origin = window.location.origin
/* Ethereum environment */
const ethereumUrl = import.meta.env.PUBLIC_ETHEREUM_RPC_URL || "http://127.0.0.1:8545"
+const ethereumWsUrl = import.meta.env.PUBLIC_ETHEREUM_WS_URL
const provider = new ethers.providers.JsonRpcProvider(ethereumUrl)
+const batchProvider: ethers.providers.JsonRpcBatchProvider = new ethers.providers.JsonRpcBatchProvider(ethereumUrl)
+const wsProvider: ethers.providers.WebSocketProvider | null = ethereumWsUrl !== "undefined" ? new ethers.providers.WebSocketProvider(ethereumWsUrl) : null
/* Casimir environment */
const docsUrl = import.meta.env.PUBLIC_DOCS_URL || "https://docs.dev.casimir.co"
@@ -34,6 +37,7 @@ const speculosUrl = import.meta.env.PUBLIC_SPECULOS_URL ? "http://localhost:5001
export default function useEnvironment() {
return {
+ batchProvider,
domain,
cryptoCompareApiKey,
ethereumUrl,
@@ -47,6 +51,7 @@ export default function useEnvironment() {
ssvViewsAddress,
docsUrl,
usersUrl,
- walletConnectProjectId
+ walletConnectProjectId,
+ wsProvider,
}
}
\ No newline at end of file
diff --git a/apps/web/src/composables/ethers.ts b/apps/web/src/composables/ethers.ts
index 6067ad11d..a18440695 100644
--- a/apps/web/src/composables/ethers.ts
+++ b/apps/web/src/composables/ethers.ts
@@ -1,7 +1,6 @@
import { ethers } from "ethers"
import { CryptoAddress, EthersProvider } from "@casimir/types"
-import { TransactionRequest } from "@casimir/types"
-import { GasEstimate, LoginCredentials, MessageRequest, ProviderString } from "@casimir/types"
+import { LoginCredentials, ProviderString } from "@casimir/types"
import useEnvironment from "@/composables/environment"
import useSiwe from "@/composables/siwe"
import useWallets from "@/composables/wallets"
@@ -11,7 +10,7 @@ interface ethereumWindow extends Window {
}
declare const window: ethereumWindow
-const { ethereumUrl, provider } = useEnvironment()
+const { provider, batchProvider } = useEnvironment()
const { createSiweMessage, signInWithEthereum } = useSiwe()
const { installedWallets } = useWallets()
@@ -72,110 +71,28 @@ export default function useEthers() {
}
}
- /**
- * Estimate gas fee using EIP 1559 methodology
- * @returns string in ETH
- */
- async function estimateEIP1559GasFee(
- rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable
- ) : Promise {
- try {
- const provider = new ethers.providers.JsonRpcProvider(rpcUrl)
- const gasPrice = await provider.getFeeData() as ethers.providers.FeeData
- const { maxFeePerGas, maxPriorityFeePerGas } = gasPrice
- const maxFeePerGasInWei = maxFeePerGas ? ethers.utils.parseEther(maxFeePerGas.toString()) : "0"
- const maxPriorityFeePerGasInWei = maxPriorityFeePerGas ? ethers.utils.parseEther(maxPriorityFeePerGas.toString()) : "0"
- if (maxFeePerGasInWei === "0") throw new Error("maxFeePerGasInWei is zero")
- if (maxPriorityFeePerGasInWei === "0") throw new Error("maxPriorityFeePerGasInWei is zero")
-
- const { to, from, value } = unsignedTransaction
- const tx = {
- from,
- to,
- value,
- type: 2, // TODO: 2 is for EIP 1559, 0 is for legacy; make this dynamic
- maxFeePerGas: maxFeePerGasInWei,
- maxPriorityFeePerGas: maxPriorityFeePerGasInWei
- }
- const gasEstimate = await provider.estimateGas(tx)
- // TODO: What is the way to get gas estimate in human readable format?
- // const gasEstimateInEth = ethers.utils.formatEther(gasEstimate)
- const fee = maxPriorityFeePerGasInWei?.mul(gasEstimate).add(maxFeePerGasInWei)
- const feeInWei = ethers.utils.formatEther(fee)
- const feeInEth = (parseFloat(feeInWei) / 10**18).toFixed(8).toString()
- return {
- gasLimit: gasEstimate.toString(),
- fee: feeInEth
- }
- } catch (err) {
- console.error("There was an error in estimateGasFee :>> ", err)
- return {
- gasLimit: "0",
- fee: "0"
- }
- }
- }
-
- /**
- * Estimate gas fee using legacy methodology
- * @returns string in ETH
- * @deprecated
- * @see estimateEIP1559GasFee
- */
- async function estimateLegacyGasFee(
- rpcUrl: string, unsignedTransaction: ethers.utils.Deferrable
- ) : Promise {
- try {
- const provider = new ethers.providers.JsonRpcProvider(rpcUrl)
- const gasPrice = await provider.getGasPrice()
- const gasEstimate = await provider.estimateGas(unsignedTransaction as ethers.utils.Deferrable)
- const fee = gasPrice.mul(gasEstimate)
- const feeInWei = ethers.utils.formatEther(fee)
- const feeInEth = (parseFloat(feeInWei) / 10**18).toFixed(8).toString()
- return {
- gasLimit: gasEstimate.toString(),
- fee: feeInEth
- }
- } catch (err) {
- console.error("There was an error in estimateGasFee :>> ", err)
- return {
- gasLimit: "0",
- fee: "0"
- }
- }
- }
-
- async function getEthersAddressesWithBalances (providerString: ProviderString): Promise {
+ async function getEthersAddressesWithBalances(providerString: ProviderString): Promise {
const provider = getBrowserProvider(providerString)
if (provider) {
const addresses = await provider.request({ method: "eth_requestAccounts" })
- const addressesWithBalance: CryptoAddress[] = []
- for (const address of addresses) {
- const balance = (await getEthersBalance(address)).toString()
- const addressWithBalance = { address, balance }
- addressesWithBalance.push(addressWithBalance)
- }
+ const balancePromises = addresses.map((address: string) => batchProvider.getBalance(address))
+ const balances = await Promise.all(balancePromises)
+ const addressesWithBalance = addresses.map((address: string, index: number) => ({
+ address: address,
+ balance: ethers.utils.formatEther(balances[index])
+ }))
+
return addressesWithBalance
} else {
throw new Error("Provider not yet connected to this dapp. Please connect and try again.")
}
}
-
+
async function getEthersBalance(address: string) : Promise {
const balance = await provider.getBalance(address)
return parseFloat(ethers.utils.formatEther(balance))
}
- async function getEthersBrowserProviderSelectedCurrency(providerString: ProviderString) {
- // IOTEX Smart Contract Address: 0x6fb3e0a217407efff7ca062d46c26e5d60a14d69
- const browserProvider = getBrowserProvider(providerString)
- const web3Provider: ethers.providers.Web3Provider = new ethers.providers.Web3Provider(browserProvider as EthersProvider)
- const network = await web3Provider.getNetwork()
- // console.log('network.chainId :>> ', network.chainId)
- const { currency } = currenciesByChainId[network.chainId.toString() as keyof typeof currenciesByChainId]
- return currency
- }
-
function getEthersBrowserSigner(providerString: ProviderString): ethers.Signer | undefined {
const provider = getBrowserProvider(providerString)
if (provider) {
@@ -193,13 +110,6 @@ export default function useEthers() {
return { gasPrice, gasLimit }
}
- async function getMaxETHAfterFees(rpcUrl: string, unsignedTx: ethers.utils.Deferrable, totalAmount: string) {
- const { fee } = await estimateEIP1559GasFee(rpcUrl, unsignedTx)
- const total = parseFloat(totalAmount) - parseFloat(fee)
- const maxAfterFees = ethers.utils.formatEther(total).toString()
- return maxAfterFees
- }
-
async function loginWithEthers(loginCredentials: LoginCredentials): Promise {
const { provider, address, currency } = loginCredentials
const browserProvider = getBrowserProvider(provider)
@@ -220,36 +130,6 @@ export default function useEthers() {
}
}
- async function sendEthersTransaction(
- { from, to, value, providerString }: TransactionRequest
- ) {
- const signer = getEthersBrowserSigner(providerString) as ethers.Signer
- const weiAmount = ethers.utils.parseEther(value)
- const tx = {
- from,
- to,
- value: weiAmount
- }
- const ethFees = await estimateEIP1559GasFee(ethereumUrl, tx)
- const { fee, gasLimit } = ethFees
- const requiredBalance = parseFloat(value) + parseFloat(fee)
- const balance = await getEthersBalance(from)
- if (balance < requiredBalance) {
- throw new Error("Insufficient balance")
- }
- console.log(`Sending ${value} ETH to ${to} with estimated ${fee} ETH in fees using ~${gasLimit.toString()} in gas.`)
- return await signer.sendTransaction(tx)
- }
-
- async function signEthersMessage(messageRequest: MessageRequest): Promise {
- const { providerString, message } = messageRequest
- const browserProvider = getBrowserProvider(providerString)
- const web3Provider: ethers.providers.Web3Provider = new ethers.providers.Web3Provider(browserProvider as EthersProvider)
- const signer = web3Provider.getSigner()
- const signature = await signer.signMessage(message)
- return signature
- }
-
return {
browserProvidersList,
detectActiveEthersWalletAddress,
@@ -288,79 +168,4 @@ function getTrustWallet() {
} else {
window.open("https://trustwallet.com/download", "_blank")
}
-}
-
-const currenciesByChainId = {
- "1": {
- name: "Mainnet ETH",
- currency: "ETH",
- },
- "3": {
- name: "Ropsten ETH",
- currency: "ETH",
- },
- "4": {
- name: "Rinkeby ETH",
- currency: "ETH",
- },
- "5": {
- name: "Goerli ETH",
- currency: "ETH",
- },
- "42": {
- name: "Kovan ETH",
- currency: "ETH",
- },
- "56": {
- name: "Binance Smart Chain",
- currency: "BNB",
- },
- "97": {
- name: "Binance Smart Chain Testnet",
- currency: "BNB",
- },
- "137": {
- name: "Polygon",
- currency: "MATIC",
- },
- "31337": {
- name: "Localhost Network",
- currency: "ETH",
- },
- "80001": {
- name: "Polygon Testnet",
- currency: "MATIC",
- },
- "4690": {
- name: "IoTeX",
- currency: "IOTX",
- },
- "4691": {
- name: "IoTeX Testnet",
- currency: "IOTX",
- },
-}
-
-const iotexNetwork = {
- chainId: ethers.utils.hexlify(4690),
- chainName: "IoTeX",
- nativeCurrency: {
- name: "IoTeX",
- symbol: "IOTX",
- decimals: 18
- },
- rpcUrls: ["https://api.testnet.iotex.one:80", "http://api.testnet.iotex.one:80"],
- blockExplorerUrls: ["https://iotexscan.io"]
-}
-
-const goerliNetwork = {
- chainId: "0x5",
- chainName: "Goerli Testnet",
- nativeCurrency: {
- name: "Goerli",
- symbol: "GÖETH",
- decimals: 18
- },
- rpcUrls: ["https://goerli.infura.io/v3/6b9f3a5d3d5e4c8e9b5d1f0c3e5f1e4a"],
- blockExplorerUrls: ["https://goerli.etherscan.io"]
}
\ No newline at end of file
diff --git a/apps/web/src/composables/format.ts b/apps/web/src/composables/format.ts
index b0d8aa824..ad04d68f1 100644
--- a/apps/web/src/composables/format.ts
+++ b/apps/web/src/composables/format.ts
@@ -15,35 +15,76 @@ export default function useFormat() {
return parseFloat(decimalString).toFixed(2)
}
- function formatNumber(number: number) {
- const SI_SYMBOL = ["",
- "K",
- "M",
- "B",
- "T",
- "P",
- "E"]
- const tier = Math.floor(Math.log10(Math.abs(number)) / 3)
- let scale, scaled, suffix
-
- if (number === 0) {
- return "0.00"
- } else if (Math.abs(number) < 1) {
- // Find the position of the first non-zero digit after the decimal point
- const decimalPlaces = Math.ceil(-Math.log10(Math.abs(number)))
- // Limit to 6 decimal places
- const fixedDecimals = Math.min(decimalPlaces, 6)
- return number.toFixed(fixedDecimals)
- } else if (tier === 0) {
- return number.toFixed(2)
+ function formatEthersCasimir(inputFloat: number, customDecimals?: number): string {
+ const siSymbols: { [key: string]: number } = {
+ "K": 1e3,
+ "M": 1e6,
+ "B": 1e9
+ }
+
+ const [siSymbol, magnitude] = Object.entries(siSymbols)
+ .reduce(([selectedSymbol, selectedMagnitude], [symbol, mag]) =>
+ Math.abs(inputFloat) >= mag ? [symbol, mag] : [selectedSymbol, selectedMagnitude], ["", 1])
+
+ let numDecimals: number
+
+ if (customDecimals !== undefined) {
+ numDecimals = customDecimals
+ } else if (Math.abs(inputFloat) < 1) {
+ numDecimals = 9
+ } else if (Math.abs(inputFloat) < 5) {
+ numDecimals = 6
} else {
- suffix = SI_SYMBOL[tier]
- scale = Math.pow(10, tier * 3)
- scaled = number / scale
- return scaled.toFixed(2) + suffix
+ numDecimals = 2
}
+
+ let formattedFloat = (inputFloat / magnitude).toFixed(numDecimals)
+
+ if (numDecimals > 0) {
+ formattedFloat = formattedFloat.replace(/\.?0+$/, "")
+ }
+ return siSymbol.length > 0 ? formattedFloat + siSymbol : formattedFloat
+ }
+
+ function formatEthersCasimirStaking(inputFloat: number) {
+ // Ensure the number has 18 decimal places
+ const formattedNumber = inputFloat.toFixed(18)
+
+ // Split the number into integer and decimal parts
+ const parts = formattedNumber.split(".")
+
+ // Add commas to the integer part
+ parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",")
+
+ // Rejoin the integer and decimal parts
+ return parts.join(".")
}
+
+ function parseEthersCasimir(inputString: string): number {
+ const siSymbols: { [key: string]: number } = {
+ "K": 1e3,
+ "M": 1e6,
+ "B": 1e9
+ }
+
+ // Extract the numeric part and the SI symbol
+ const matches = inputString.match(/([0-9.,]+)([KMB])?/)
+ if (!matches) {
+ throw new Error("Invalid input format")
+ }
+ const [ , numericPart, siSymbol] = matches
+
+ // Replace commas and convert to a float
+ let value = parseFloat(numericPart.replace(/,/g, ""))
+
+ // Apply the multiplication factor if an SI symbol is present
+ if (siSymbol && siSymbols[siSymbol]) {
+ value *= siSymbols[siSymbol]
+ }
+
+ return value
+ }
function trimAndLowercaseAddress(address: string) {
return address.trim().toLowerCase()
@@ -52,7 +93,9 @@ export default function useFormat() {
return {
convertString,
formatDecimalString,
- formatNumber,
+ formatEthersCasimir,
+ formatEthersCasimirStaking,
+ parseEthersCasimir,
trimAndLowercaseAddress,
}
}
\ No newline at end of file
diff --git a/apps/web/src/composables/operators.ts b/apps/web/src/composables/operators.ts
index d9bf423a0..3d8aba168 100644
--- a/apps/web/src/composables/operators.ts
+++ b/apps/web/src/composables/operators.ts
@@ -1,4 +1,4 @@
-import { readonly, ref } from "vue"
+import { readonly, ref, watch } from "vue"
import { Operator, Scanner } from "@casimir/ssv"
import { Account, PoolConfig, RegisteredOperator, RegisterOperatorWithCasimirParams } from "@casimir/types"
import { ethers } from "ethers"
@@ -20,8 +20,16 @@ let eigenManager: CasimirManager
let eigenRegistry: CasimirRegistry
let eigenViews: CasimirViews
-const { getContracts } = useContracts()
-const { ethereumUrl, ssvNetworkAddress, ssvViewsAddress, usersUrl } = useEnvironment()
+const {
+ contractsAreInitialized,
+ getBaseManager,
+ getBaseRegistry,
+ getBaseViews,
+ getEigenManager,
+ getEigenRegistry,
+ getEigenViews
+} = useContracts()
+const { ethereumUrl, ssvNetworkAddress, ssvViewsAddress, usersUrl, batchProvider, provider, wsProvider } = useEnvironment()
const { browserProvidersList, getEthersBrowserSigner } = useEthers()
const { getEthersLedgerSigner } = useLedger()
const { getEthersTrezorSigner } = useTrezor()
@@ -31,16 +39,23 @@ const { getWalletConnectSignerV2 } = useWalletConnectV2()
const loadingInitializeOperators = ref(false)
const loadingInitializeOperatorsError = ref(false)
+const loadingAddOperator = ref(false)
+const loadingAddOperatorError = ref(false)
+const loadingRegisteredOperators = ref(false)
+const loadingRegisteredOperatorsError = ref(false)
+
+const nonregisteredBaseOperators = ref([])
+const nonregisteredEigenOperators = ref([])
+const registeredBaseOperators = ref([])
+const registeredEigenOperators = ref([])
+
export default function useOperators() {
- const loadingAddOperator = ref(false)
- const loadingAddOperatorError = ref(false)
- const loadingRegisteredOperators = ref(false)
- const loadingRegisteredOperatorsError = ref(false)
- const nonregisteredBaseOperators = ref([])
- const nonregisteredEigenOperators = ref([])
- const registeredBaseOperators = ref([])
- const registeredEigenOperators = ref([])
+ watch(contractsAreInitialized, async () => {
+ if (contractsAreInitialized.value) {
+ await initializeOperatorComposable()
+ }
+ })
async function addOperator({ address, nodeUrl }: { address: string, nodeUrl: string }) {
try {
@@ -65,10 +80,13 @@ export default function useOperators() {
async function getUserOperators(): Promise {
const userAddresses = user.value?.accounts.map((account: Account) => account.address) as string[]
+ const availableProvider = wsProvider || batchProvider || provider
+
const scanner = new Scanner({
ethereumUrl,
ssvNetworkAddress,
- ssvViewsAddress
+ ssvViewsAddress,
+ provider: availableProvider
})
const ssvOperators: Operator[] = []
@@ -149,15 +167,12 @@ export default function useOperators() {
async function initializeOperatorComposable() {
try {
- /* Get Manager, Views, and Registry */
- const { baseManager: managerContract, baseRegistry: registryContract, baseViews: viewsContract } = await getContracts()
- const { eigenManager: eigenManagerContract, eigenRegistry: eigenRegistryContract, eigenViews: eigenViewsContract } = await getContracts()
- baseManager = managerContract
- baseRegistry = registryContract
- baseViews = viewsContract
- eigenManager = eigenManagerContract
- eigenRegistry = eigenRegistryContract
- eigenViews = eigenViewsContract
+ baseManager = getBaseManager()
+ baseRegistry = getBaseRegistry()
+ baseViews = getBaseViews()
+ eigenManager = getEigenManager()
+ eigenRegistry = getEigenRegistry()
+ eigenViews = getEigenViews()
loadingInitializeOperators.value = true
listenForContractEvents()
@@ -226,7 +241,7 @@ export default function useOperators() {
loadingAddOperatorError: readonly(loadingAddOperatorError),
loadingInitializeOperators: readonly(loadingInitializeOperators),
loadingInitializeOperatorsError: readonly(loadingInitializeOperatorsError),
- initializeOperatorComposable,
+ // initializeOperatorComposable,
registerOperatorWithCasimir,
}
}
diff --git a/apps/web/src/composables/staking.ts b/apps/web/src/composables/staking.ts
index 41f317021..8fe7aa757 100644
--- a/apps/web/src/composables/staking.ts
+++ b/apps/web/src/composables/staking.ts
@@ -1,43 +1,51 @@
-import { ref } from "vue"
+import { readonly, ref, watch } from "vue"
import { ethers } from "ethers"
import { ProviderString } from "@casimir/types"
import useContracts from "@/composables/contracts"
-import useEnvironment from "@/composables/environment"
import useEthers from "@/composables/ethers"
import useLedger from "@/composables/ledger"
import useTrezor from "@/composables/trezor"
+import useUser from "@/composables/user"
import useWallets from "@/composables/wallets"
import useWalletConnectV2 from "./walletConnectV2"
import { CasimirManager } from "@casimir/ethereum/build/@types"
+import { StakeDetails } from "@casimir/types"
-const { getContracts } = useContracts()
-const { provider } = useEnvironment()
+const { getBaseManager, getEigenManager, contractsAreInitialized } = useContracts()
const { browserProvidersList, getEthersBrowserSigner } = useEthers()
const { getEthersLedgerSigner } = useLedger()
const { getEthersTrezorSigner } = useTrezor()
+const { user } = useUser()
const { detectActiveNetwork, switchEthersNetwork } = useWallets()
const { getWalletConnectSignerV2 } = useWalletConnectV2()
const stakingComposableInitialized = ref(false)
+const awaitingStakeOrWithdrawConfirmation = ref(false)
+const userStakeDetails = ref>([])
let baseManager: CasimirManager
let eigenManager: CasimirManager
export default function useStaking() {
+ watch(contractsAreInitialized, async () => {
+ if (contractsAreInitialized.value) {
+ await initializeStakingComposable()
+ }
+ })
+
async function initializeStakingComposable() {
if (stakingComposableInitialized.value) return
try {
- /* Get Managers */
- const { baseManager: baseManagerFromContracts, eigenManager: eigenManagerFromContracts } = await getContracts()
- baseManager = baseManagerFromContracts
- eigenManager = eigenManagerFromContracts
stakingComposableInitialized.value = true
+ baseManager = getBaseManager()
+ eigenManager = getEigenManager()
+ await getUserStakeDetails()
} catch (error) {
console.log("Error initializing staking component :>> ", error)
}
}
-
+
async function deposit({ amount, walletProvider, type }: { amount: string, walletProvider: ProviderString, type: "default" | "eigen" }) {
try {
const activeNetwork = await detectActiveNetwork(walletProvider)
@@ -63,9 +71,14 @@ export default function useStaking() {
const fees = await getDepositFees()
const depositAmount = parseFloat(amount) * ((100 + fees) / 100)
const value = ethers.utils.parseEther(depositAmount.toString())
- return await managerSigner.depositStake({ value, type: 2 })
+ awaitingStakeOrWithdrawConfirmation.value = true
+ const result = await managerSigner.depositStake({ value, type: 2 })
+ const confirmation = await result.wait(1)
+ if (confirmation) awaitingStakeOrWithdrawConfirmation.value = false
+ return confirmation
} catch (err) {
console.error(`There was an error in deposit function: ${JSON.stringify(err)}`)
+ awaitingStakeOrWithdrawConfirmation.value = false
return false
}
}
@@ -81,7 +94,7 @@ export default function useStaking() {
console.error(`There was an error in getDepositFees function: ${JSON.stringify(err)}`)
throw new Error(err)
}
- }
+ }
async function getUserStake(address: string): Promise {
if (!stakingComposableInitialized.value) return 0
@@ -98,7 +111,49 @@ export default function useStaking() {
}
}
- async function getWithdrawableBalance({ walletProvider, type }: {walletProvider: ProviderString, type: "default" | "eigen"}) {
+ async function getUserStakeDetails() {
+ const result: Array = []
+ const addresses = user.value?.accounts.map((account) => account.address) as Array
+
+ async function getUserStakeAndWithdrawable(manager: CasimirManager, address: string) {
+ const userStake = await (manager as CasimirManager).getUserStake(address)
+ const userStakeNumber = parseFloat(ethers.utils.formatEther(userStake))
+ const availableToWithdraw = await (manager as CasimirManager).getWithdrawableBalance()
+ const availableToWithdrawNumber = parseFloat(ethers.utils.formatEther(availableToWithdraw))
+
+ return { userStakeNumber, availableToWithdrawNumber }
+ }
+
+ const promises = addresses.map(async (address) => {
+ const [baseManagerData, /* eigenManagerData */] = await Promise.all([
+ getUserStakeAndWithdrawable(baseManager, address),
+ // getUserStakeAndWithdrawable(eigenManager, address),
+ ])
+
+ if (baseManagerData.userStakeNumber > 0) {
+ result.push({
+ operatorType: "Default",
+ address,
+ amountStaked: baseManagerData.userStakeNumber,
+ availableToWithdraw: baseManagerData.availableToWithdrawNumber,
+ })
+ }
+
+ // if (eigenManagerData.userStakeNumber > 0) {
+ // result.push({
+ // operatorType: "Eigen",
+ // address,
+ // amountStaked: eigenManagerData.userStakeNumber,
+ // availableToWithdraw: eigenManagerData.availableToWithdrawNumber,
+ // })
+ // }
+ })
+
+ await Promise.all(promises)
+ userStakeDetails.value = result
+ }
+
+ async function getWithdrawableBalance({ walletProvider, type }: { walletProvider: ProviderString, type: "default" | "eigen" }) {
let signer
if (browserProvidersList.includes(walletProvider)) {
signer = getEthersBrowserSigner(walletProvider)
@@ -119,37 +174,49 @@ export default function useStaking() {
}
async function withdraw({ amount, walletProvider, type }: { amount: string, walletProvider: ProviderString, type: "default" | "eigen" }) {
- const activeNetwork = await detectActiveNetwork(walletProvider)
- if (activeNetwork !== 5) {
- await switchEthersNetwork(walletProvider, "0x5")
- return window.location.reload()
- }
-
- let signer
- if (browserProvidersList.includes(walletProvider)) {
- signer = getEthersBrowserSigner(walletProvider)
- } else if (walletProvider === "WalletConnect") {
- await getWalletConnectSignerV2()
- } else if (walletProvider === "Ledger") {
- getEthersLedgerSigner()
- } else if (walletProvider === "Trezor") {
- getEthersTrezorSigner()
- } else {
- throw new Error(`Invalid wallet provider: ${walletProvider}`)
+ try {
+ const activeNetwork = await detectActiveNetwork(walletProvider)
+ if (activeNetwork !== 5) {
+ await switchEthersNetwork(walletProvider, "0x5")
+ return window.location.reload()
+ }
+
+ let signer
+ if (browserProvidersList.includes(walletProvider)) {
+ signer = getEthersBrowserSigner(walletProvider)
+ } else if (walletProvider === "WalletConnect") {
+ await getWalletConnectSignerV2()
+ } else if (walletProvider === "Ledger") {
+ getEthersLedgerSigner()
+ } else if (walletProvider === "Trezor") {
+ getEthersTrezorSigner()
+ } else {
+ throw new Error(`Invalid wallet provider: ${walletProvider}`)
+ }
+ const manager = type === "default" ? baseManager : eigenManager
+ const managerSigner = (manager as CasimirManager).connect(signer as ethers.Signer)
+ const value = ethers.utils.parseEther(amount)
+ awaitingStakeOrWithdrawConfirmation.value = true
+ const result = await managerSigner.requestWithdrawal(value)
+ const confirmation = await result.wait(1)
+ if (confirmation) awaitingStakeOrWithdrawConfirmation.value = false
+ return confirmation
+ } catch (err) {
+ console.error(`There was an error in withdraw function: ${JSON.stringify(err)}`)
+ awaitingStakeOrWithdrawConfirmation.value = false
+ return false
}
- const manager = type === "default" ? baseManager : eigenManager
- const managerSigner = (manager as CasimirManager).connect(signer as ethers.Signer)
- const value = ethers.utils.parseEther(amount)
- return await managerSigner.requestWithdrawal(value)
}
- return {
+ return {
+ awaitingStakeOrWithdrawConfirmation: readonly(awaitingStakeOrWithdrawConfirmation),
stakingComposableInitialized,
+ userStakeDetails,
initializeStakingComposable,
- deposit,
+ deposit,
getDepositFees,
getUserStake,
getWithdrawableBalance,
- withdraw
+ withdraw
}
}
\ No newline at end of file
diff --git a/apps/web/src/composables/user.ts b/apps/web/src/composables/user.ts
index 248474011..41bb039db 100644
--- a/apps/web/src/composables/user.ts
+++ b/apps/web/src/composables/user.ts
@@ -1,34 +1,22 @@
-import { onMounted, onUnmounted, readonly, ref, watch } from "vue"
-import { Account, UserWithAccountsAndOperators } from "@casimir/types"
+import { readonly, ref, watch } from "vue"
+import { UserWithAccountsAndOperators } from "@casimir/types"
import useEnvironment from "@/composables/environment"
import { ethers } from "ethers"
-// Test address: 0xd557a5745d4560B24D36A68b52351ffF9c86A212
-const { provider, usersUrl } = useEnvironment()
-
-const initializeComposable = ref(false)
+const { usersUrl, batchProvider } = useEnvironment()
const user = ref(undefined)
+const userComposableInitialized = ref(false)
export default function useUser() {
- // TODO: Move back to ethers composable
- async function getEthersBalance(address: string): Promise {
- const balance = await provider.getBalance(address)
- return parseFloat(ethers.utils.formatEther(balance))
+ async function initializeUserComposable() {
+ if (userComposableInitialized.value) return
+ userComposableInitialized.value = true
+ watch(user, async () => {
+ await setUserAccountBalances()
+ })
}
- // onMounted(async () => {
- // if (!initializeComposable.value) {
- // initializeComposable.value = true
- // }
- // })
-
- // onUnmounted(() => {
- // initializeComposable.value = false
- // })
-
- async function setUser(
- newUserValue: UserWithAccountsAndOperators | undefined
- ) {
+ function setUser(newUserValue: UserWithAccountsAndOperators | undefined) {
user.value = newUserValue
}
@@ -36,23 +24,22 @@ export default function useUser() {
try {
if (user?.value?.accounts) {
const { accounts } = user.value
- const accountsWithBalances = await Promise.all(
- accounts.map(async (account: Account) => {
- const { address } = account
- const balance = await getEthersBalance(address)
- return {
- ...account,
- balance,
- }
- })
- )
+ const balancePromises = accounts.map(account => {
+ return batchProvider.getBalance(account.address)
+ })
+ const balances = await Promise.all(balancePromises)
+ const accountsWithBalances = accounts.map((account, index) => ({
+ ...account,
+ balance: parseFloat(ethers.utils.formatEther(balances[index])),
+ }))
+
user.value.accounts = accountsWithBalances
}
} catch (error) {
throw new Error("Error setting user account balances")
}
}
-
+
async function updateUserAgreement(agreed: boolean) {
const requestOptions = {
method: "PUT",
@@ -66,15 +53,11 @@ export default function useUser() {
requestOptions
)
}
-
- watch(user, async () => {
- if (!user.value) return
- await setUserAccountBalances()
- })
-
+
return {
user: readonly(user),
+ initializeUserComposable,
setUser,
updateUserAgreement,
}
-}
+}
\ No newline at end of file
diff --git a/apps/web/src/composables/walletConnectV2.ts b/apps/web/src/composables/walletConnectV2.ts
index 190c9fd83..724700a91 100644
--- a/apps/web/src/composables/walletConnectV2.ts
+++ b/apps/web/src/composables/walletConnectV2.ts
@@ -106,7 +106,7 @@ export default function useWalletConnectV2() {
async function initializeWalletConnect() {
if (componentIsMounted.value) return
- if (import.meta.env.MODE === "development") console.log("initializing wallet connect")
+ // if (import.meta.env.MODE === "development") console.log("initializing wallet connect")
componentIsMounted.value = true
// Check for persisted sessions & Subscribe to provider events
diff --git a/apps/web/src/main.ts b/apps/web/src/main.ts
index 6cc0d1205..de2ff292b 100644
--- a/apps/web/src/main.ts
+++ b/apps/web/src/main.ts
@@ -8,6 +8,17 @@ import { SuperTokensWebJSConfig } from "./sessions.config"
SuperTokens.init(SuperTokensWebJSConfig)
+// const originalFetch = window.fetch
+// let fetchCallCount = 0
+// window.fetch = async (...args) => {
+// const url = args[0]
+// if (url === "https://goerli.infura.io/v3/46a379ac6895489f812f33beb726b03b" || url === "http://127.0.0.1:8545") {
+// fetchCallCount++
+// console.log(`Fetch call count: ${fetchCallCount}`)
+// }
+// return originalFetch(...args)
+// }
+
const app = createApp(App)
app.use(router)
-app.mount("#app")
+app.mount("#app")
\ No newline at end of file
diff --git a/apps/web/src/pages/operators/Operator.vue b/apps/web/src/pages/operators/Operator.vue
index 208f6c52d..eef0d7428 100644
--- a/apps/web/src/pages/operators/Operator.vue
+++ b/apps/web/src/pages/operators/Operator.vue
@@ -3,9 +3,9 @@ import { onMounted, ref, watch } from "vue"
import VueFeather from "vue-feather"
import { ProviderString } from "@casimir/types"
import useAuth from "@/composables/auth"
+import useContracts from "@/composables/contracts"
import useEnvironment from "@/composables/environment"
// import useEthers from '@/composables/ethers'
-import useFiles from "@/composables/files"
import useFormat from "@/composables/format"
import useOperators from "@/composables/operators"
import useUser from "@/composables/user"
@@ -13,10 +13,9 @@ import useUser from "@/composables/user"
const { loadingSessionLogin } = useAuth()
const { docsUrl } = useEnvironment()
// const { detectActiveWalletAddress } = useEthers()
-const { exportFile } = useFiles()
+const { contractsAreInitialized } = useContracts()
const { convertString } = useFormat()
const {
- initializeOperatorComposable,
registerOperatorWithCasimir,
nonregisteredBaseOperators,
nonregisteredEigenOperators,
@@ -117,7 +116,6 @@ const submitButtonTxt = ref("Submit")
onMounted(async () => {
if (user.value) {
loading.value = true
- await initializeOperatorComposable()
// Autofill disable
const disableAutofill = () => {
@@ -129,15 +127,23 @@ onMounted(async () => {
document.addEventListener("DOMContentLoaded", disableAutofill)
- filterData()
}
+
+ tableData.value = [...registeredBaseOperators.value, ...registeredEigenOperators.value].map((operator: any) => {
+ return {
+ id: operator.id,
+ walletAddress: operator.ownerAddress,
+ collateral: operator.collateral + " ETH",
+ poolCount: operator.poolCount,
+ nodeURL: operator.url
+ }
+ })
+ filterData()
})
watch(user, async () => {
if (user.value) {
loading.value = true
- await initializeOperatorComposable()
-
filterData()
}
})
@@ -192,6 +198,12 @@ watch([searchInput,
filterData()
})
+watch(contractsAreInitialized, () => {
+ if (!contractsAreInitialized.value) {
+ loading.value = true
+ }
+})
+
const openWalletsModal = () => {
const el = document.getElementById("connect_wallet_button")
if (el) {
@@ -215,20 +227,20 @@ const handleInputChangeCollateral = (event: any) => {
const filterData = () => {
loading.value = true
- let filteredDataArray
-
- if (searchInput.value === "") {
- filteredDataArray = tableData.value
- } else {
- const searchTerm = searchInput.value
- filteredDataArray = tableData.value.filter((item: any) => {
- return (
- // Might need to modify to match types each variable
- // item.walletProvider?.toLowerCase().includes(searchTerm)
- true
- )
- })
- }
+ let filteredDataArray = [...tableData.value]
+
+ // if (searchInput.value === "") {
+ // filteredDataArray = tableData.value
+ // } else {
+ // const searchTerm = searchInput.value
+ // filteredDataArray = tableData.value.filter((item: any) => {
+ // return (
+ // // Might need to modify to match types each variable
+ // // item.walletProvider?.toLowerCase().includes(searchTerm)
+ // true
+ // )
+ // })
+ // }
if (selectedHeader.value !== "" && selectedOrientation.value !== "") {
filteredDataArray = filteredDataArray.sort((a: any, b: any) => {
@@ -246,6 +258,7 @@ const filterData = () => {
const start = (currentPage.value - 1) * itemsPerPage.value
const end = start + itemsPerPage.value
+
filteredData.value = filteredDataArray.slice(start, end) as any
loading.value = false
}
diff --git a/apps/web/src/pages/overview/components/BreakdownChart.vue b/apps/web/src/pages/overview/components/BreakdownChart.vue
index ada2fc782..c03c54926 100644
--- a/apps/web/src/pages/overview/components/BreakdownChart.vue
+++ b/apps/web/src/pages/overview/components/BreakdownChart.vue
@@ -1,20 +1,14 @@
@@ -364,15 +371,15 @@ function setStakeOrWithdraw(option: "stake" | "withdraw") {
@@ -385,75 +392,127 @@ function setStakeOrWithdraw(option: "stake" | "withdraw") {
-
- Wallet -
-
-
-
-
-
-
+
+
+
+
+
+ + Wallet +
+
+
+
+
+
{{ selectedWalletAddress ? convertString(selectedWalletAddress) : 'Select wallet' }}
+
+ {{ addressBalance ? addressBalance : '' }}
+
+
-
-
- ![]()
- {{ item.provider }}
+
+ No wallets connected
+
+
+ ![]()
+ {{ item.provider }}
+
-
+
+ -
+
+
-
+ ++
{{ convertString(stakeDetail.address) }}
{{ formatEthersCasimirStaking(stakeDetail.amountStaked) }} ETH+
+
+
+
+ -
+ ++
+ {{ convertString(stakeDetail.address) }}
{{ formatEthersCasimirStaking(stakeDetail.amountStaked) }} ETH+
+
+
Default Stakes
+Eigen Stakes
+
+
+
+
+
+
Amount
@@ -463,7 +522,9 @@ function setStakeOrWithdraw(option: "stake" | "withdraw") {
@@ -520,79 +612,6 @@ function setStakeOrWithdraw(option: "stake" | "withdraw") {
-
-
- Operator Group -
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ Withdrawals are currently limited to available balance that is not actively staked on Beacon Chain.
+
+ We will adding capability to make full withdrawals soon. + +
+ + We will adding capability to make full withdrawals soon. + +
+ Your current withdrawable amount is: {{ formatEthersCasimirStaking(availableToWithdraw) }} ETH
+
+