diff --git a/apps/vaults-v3/components/details/RewardsTab.tsx b/apps/vaults-v3/components/details/RewardsTab.tsx index 946fff4b6..8d4f4c021 100644 --- a/apps/vaults-v3/components/details/RewardsTab.tsx +++ b/apps/vaults-v3/components/details/RewardsTab.tsx @@ -307,7 +307,7 @@ export function RewardsTab(props: {currentVault: TYDaemonVault; hasStakingReward if (props.currentVault.staking.rewards?.length === 0) { return ( -
+
-
- +
+ -
-
-
{'Stake'}
-
-
- -

{`${formatAmount(vaultData.vaultBalanceOf.normalized, 6)} ${props.currentVault.symbol} available to stake`}

-

{`${formatCounterValue(vaultData.vaultBalanceOf.normalized, vaultTokenPrice.normalized)}`}

-
- } - value={ - toBigInt(vaultData.vaultBalanceOf.raw) === 0n ? undefined : ( - - ) - } - /> +
+
+
{'Stake'}
+
+
+ +

{`${formatAmount(vaultData.vaultBalanceOf.normalized, 6)} ${props.currentVault.symbol} available to stake`}

+

{`${formatCounterValue(vaultData.vaultBalanceOf.normalized, vaultTokenPrice.normalized)}`}

+
+ } + value={ + toBigInt(vaultData.vaultBalanceOf.raw) === 0n ? undefined : ( + + ) + } + /> - -
+
-
-
-
{'Claim Rewards'}
-
-
- -

{`${formatAmount(vaultData.stakedEarned.normalized, 6)} ${rewardTokenBalance.symbol || (props.currentVault.staking.rewards || [])[0].symbol || ''} available to claim`}

-

{`${formatCounterValue(vaultData.stakedEarned.normalized, rewardTokenPrice.normalized)}`}

-
- } - value={ - toBigInt(vaultData.stakedEarned.raw) === 0n ? undefined : ( - - ) - } - /> - - -
+
+
+
+
{'Claim Rewards'}
+
+
+ +

{`${formatAmount(vaultData.stakedEarned.normalized, 6)} ${rewardTokenBalance.symbol || (props.currentVault.staking.rewards || [])[0].symbol || ''} available to claim`}

+

{`${formatCounterValue(vaultData.stakedEarned.normalized, rewardTokenPrice.normalized)}`}

+
+ } + value={ + toBigInt(vaultData.stakedEarned.raw) === 0n ? undefined : ( + + ) + } + /> + +
- +
); } diff --git a/apps/vaults-v3/components/details/VaultActionsTabsWrapper.tsx b/apps/vaults-v3/components/details/VaultActionsTabsWrapper.tsx index 288de13fe..e30e52494 100755 --- a/apps/vaults-v3/components/details/VaultActionsTabsWrapper.tsx +++ b/apps/vaults-v3/components/details/VaultActionsTabsWrapper.tsx @@ -32,13 +32,33 @@ import type {ReactElement} from 'react'; import type {TYDaemonVault} from '@yearn-finance/web-lib/utils/schemas/yDaemonVaultsSchemas'; import type {TNormalizedBN} from '@builtbymom/web3/types'; -export type TTabsOptions = { +/************************************************************************************************** + ** Base type for tab options containing value, label and optional slug + *************************************************************************************************/ +type TTabsOptionsBase = { value: number; label: string; - flowAction: Flow; slug?: string; }; +/************************************************************************************************** + ** Extended tab options type that includes flow action + *************************************************************************************************/ +export type TTabsOptions = TTabsOptionsBase & { + flowAction: Flow; +}; + +/************************************************************************************************** + ** Type for tab state management including selected index and setter function + *************************************************************************************************/ +export type TTabs = { + selectedAboutTabIndex: number; + set_selectedAboutTabIndex: (arg0: number) => void; +}; + +/************************************************************************************************** + ** Available tabs for vault actions with their respective values, labels and flow actions + *************************************************************************************************/ export const tabs: TTabsOptions[] = [ {value: 0, label: 'Deposit', flowAction: Flow.Deposit, slug: 'deposit'}, {value: 1, label: 'Withdraw', flowAction: Flow.Withdraw, slug: 'withdraw'}, @@ -46,6 +66,11 @@ export const tabs: TTabsOptions[] = [ {value: 3, label: 'Boost', flowAction: Flow.None, slug: 'boost'} ]; +/************************************************************************************************** + ** Determines the current tab based on deposit status, migration availability and retirement status + ** Returns the withdraw tab if vault is migrated or retired, otherwise returns deposit/withdraw tab + ** based on isDepositing flag + *************************************************************************************************/ export function getCurrentTab(props: {isDepositing: boolean; hasMigration: boolean; isRetired: boolean}): TTabsOptions { if (props.hasMigration || props.isRetired) { return tabs[1]; @@ -241,9 +266,9 @@ export function VaultDetailsTab(props: { {props.tab.label === 'Boost' && toBigInt(props.unstakedBalance?.raw) > 0n ? ( - + ) : null}

@@ -251,6 +276,81 @@ export function VaultDetailsTab(props: { ); } +export function VaultRewardsTabs(props: {currentVault: TYDaemonVault; tab: TTabsOptions}): ReactElement { + const stakingRewardSource = props.currentVault.staking.source; + const tabLabel = useMemo(() => { + if (props.tab.label === 'Boost' && stakingRewardSource === 'VeYFI') { + return 'veYFI BOOST'; + } + if (props.tab.label === 'Boost' && stakingRewardSource === 'OP Boost') { + return '$OP BOOST'; + } + if (props.tab.label === 'Boost' && stakingRewardSource === 'Juiced') { + return 'Juiced BOOST'; + } + if (props.tab.label === 'Boost' && stakingRewardSource === 'V3 Staking') { + return 'Staking BOOST'; + } + return props.tab.label; + }, [props.tab.label, stakingRewardSource]); + + return ( + <> + +
+ + {({open}): ReactElement => ( + <> + +
{props.tab.label || 'Menu'}
+
+ +
+
+ + + {tabs.map( + (tab): ReactElement => ( + + {tab.label} + + ) + )} + + + + )} +
+
+ + ); +} + /************************************************************************************************** ** The VaultActionsTabsWrapper wraps the different components that are part of the Vault Actions ** section. It will display the different tabs available for the current vault and the @@ -393,7 +493,7 @@ export function VaultActionsTabsWrapper({currentVault}: {currentVault: TYDaemonV
-
+
{'Looks like this is an old vault.'}

{ @@ -411,7 +511,7 @@ export function VaultActionsTabsWrapper({currentVault}: {currentVault: TYDaemonV

-
+
{'This Vault is no longer supported (oh no).'}

{ @@ -426,7 +526,7 @@ export function VaultActionsTabsWrapper({currentVault}: {currentVault: TYDaemonV

-
+
{'Oh look, an important message for you to read!'}

)} -

+
-
+

 

@@ -550,12 +652,23 @@ export function VaultActionsTabsWrapper({currentVault}: {currentVault: TYDaemonV
)} - - + {currentTab.value !== 3 && ( + +
+ +
+
+
+ +
+ + )}
); diff --git a/apps/vaults-v3/components/details/VaultDetailsTabsWrapper.tsx b/apps/vaults-v3/components/details/VaultDetailsTabsWrapper.tsx index 8c770eefe..b26acf5df 100755 --- a/apps/vaults-v3/components/details/VaultDetailsTabsWrapper.tsx +++ b/apps/vaults-v3/components/details/VaultDetailsTabsWrapper.tsx @@ -210,7 +210,7 @@ export function VaultDetailsTabsWrapper({currentVault}: {currentVault: TYDaemonV const hasStrategies = Number(currentVault.strategies?.length || 0) > 0; return ( -
+
-
+
)} - - + {currentTab.value !== 3 && ( + +
+ +
+
+
+ +
+ + )}
); diff --git a/apps/vaults/components/details/tabs/VaultDetailsAbout.tsx b/apps/vaults/components/details/tabs/VaultDetailsAbout.tsx index 2fbdd5710..308bd60c3 100755 --- a/apps/vaults/components/details/tabs/VaultDetailsAbout.tsx +++ b/apps/vaults/components/details/tabs/VaultDetailsAbout.tsx @@ -128,7 +128,7 @@ export function VaultDetailsAbout({ } return ( -
+
{'Description'} diff --git a/apps/vaults/components/details/tabs/VaultDetailsHistorical.tsx b/apps/vaults/components/details/tabs/VaultDetailsHistorical.tsx index b22b1faec..089f4ba19 100755 --- a/apps/vaults/components/details/tabs/VaultDetailsHistorical.tsx +++ b/apps/vaults/components/details/tabs/VaultDetailsHistorical.tsx @@ -139,7 +139,7 @@ export function VaultDetailsHistorical({ } return ( -
+
{(harvests || [])?.map((harvest: TYDaemonVaultHarvest, index: number): ReactElement => { diff --git a/apps/vaults/components/details/tabs/VaultDetailsStrategies.tsx b/apps/vaults/components/details/tabs/VaultDetailsStrategies.tsx index 12b616554..20fcd33b6 100755 --- a/apps/vaults/components/details/tabs/VaultDetailsStrategies.tsx +++ b/apps/vaults/components/details/tabs/VaultDetailsStrategies.tsx @@ -176,7 +176,7 @@ export function VaultDetailsStrategies({currentVault}: {currentVault: TYDaemonVa }, [searchValue, shouldDisplayInactiveStrategies, sortedStrategies]); return ( -
+
+

{'Vault Contract Address'}

@@ -273,9 +273,7 @@ export function VaultDetailsTabsWrapper({currentVault}: {currentVault: TYDaemonV }, [currentVault.decimals, yDaemonHarvestsData]); return ( -
+
{ - txStatusSetter({...defaultTxStatus}); - }, 3000); + setTimeout((): void => txStatusSetter(defaultTxStatus), 3000); } }, [execute, provider] diff --git a/apps/vaults/hooks/solvers/useSolverPortals.ts b/apps/vaults/hooks/solvers/useSolverPortals.ts index 0a978f306..52abdc681 100644 --- a/apps/vaults/hooks/solvers/useSolverPortals.ts +++ b/apps/vaults/hooks/solvers/useSolverPortals.ts @@ -384,12 +384,18 @@ export function useSolverPortals(): TSolverContext { assert(provider, 'Provider is not set'); txStatusSetter({...defaultTxStatus, pending: true}); - const status = await execute(); - if (status.isSuccessful) { - txStatusSetter({...defaultTxStatus, success: true}); - await onSuccess(); - } else { + try { + const status = await execute(); + if (status.isSuccessful) { + txStatusSetter({...defaultTxStatus, success: true}); + await onSuccess(); + } else { + txStatusSetter({...defaultTxStatus, error: true}); + } + } catch (error) { txStatusSetter({...defaultTxStatus, error: true}); + } finally { + setTimeout((): void => txStatusSetter(defaultTxStatus), 3000); } }, [execute, provider] diff --git a/bun.lockb b/bun.lockb index 758755329..f01f89613 100755 Binary files a/bun.lockb and b/bun.lockb differ