From e9daa1a63afa4af78075594c0ce8232c5b02f5f2 Mon Sep 17 00:00:00 2001 From: Matthew Pereira Date: Wed, 11 Dec 2024 11:10:13 -0800 Subject: [PATCH] split swap fee and pause management choices --- .../nextjs/app/v3/_components/ChooseInfo.tsx | 69 ++++++----- .../app/v3/_components/ChooseParameters.tsx | 111 +++++++++++------- .../nextjs/app/v3/_components/ChooseToken.tsx | 33 ++++-- .../app/v3/_components/PoolConfiguration.tsx | 2 +- .../v3/_components/PoolCreationManager.tsx | 24 ++-- .../nextjs/app/v3/_components/PoolDetails.tsx | 10 +- .../nextjs/components/common/RadioInput.tsx | 4 +- .../nextjs/hooks/v3/useBoostableWhitelist.ts | 15 ++- .../nextjs/hooks/v3/usePoolCreationStore.ts | 6 +- packages/nextjs/hooks/v3/useUserDataStore.ts | 6 +- .../hooks/v3/useValidatePoolCreationInput.ts | 6 +- 11 files changed, 177 insertions(+), 109 deletions(-) diff --git a/packages/nextjs/app/v3/_components/ChooseInfo.tsx b/packages/nextjs/app/v3/_components/ChooseInfo.tsx index 01cd0b9c..d751994b 100644 --- a/packages/nextjs/app/v3/_components/ChooseInfo.tsx +++ b/packages/nextjs/app/v3/_components/ChooseInfo.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from "react"; import { PoolType } from "@balancer/sdk"; -import { ArrowTopRightOnSquareIcon, ExclamationTriangleIcon } from "@heroicons/react/24/outline"; +import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/outline"; import { Alert, TextField } from "~~/components/common"; import { useBoostableWhitelist, useCheckIfV3PoolExists, usePoolCreationStore, useUserDataStore } from "~~/hooks/v3"; import { MAX_POOL_NAME_LENGTH } from "~~/utils/constants"; @@ -11,7 +11,7 @@ import { MAX_POOL_NAME_LENGTH } from "~~/utils/constants"; */ export const ChooseInfo = () => { const { name, symbol, tokenConfigs, poolType, updatePool } = usePoolCreationStore(); - const { updateUserData, hasEditedPoolInformation } = useUserDataStore(); + const { updateUserData, hasEditedPoolName, hasEditedPoolSymbol } = useUserDataStore(); const { data: boostableWhitelist } = useBoostableWhitelist(); const { existingPools } = useCheckIfV3PoolExists( @@ -33,21 +33,16 @@ export const ChooseInfo = () => { }) .join("-"); - if (!hasEditedPoolInformation) { - updatePool({ name: symbol.split("-").join(" ") }); - } - - updatePool({ - symbol, - }); + if (!hasEditedPoolName) updatePool({ name: symbol.split("-").join(" ") }); + if (!hasEditedPoolSymbol) updatePool({ symbol }); } - }, [tokenConfigs, poolType, updatePool, boostableWhitelist, hasEditedPoolInformation]); + }, [tokenConfigs, poolType, updatePool, boostableWhitelist, hasEditedPoolName, hasEditedPoolSymbol]); return (
Choose pool information:
-
+
{ maxLength={MAX_POOL_NAME_LENGTH} onChange={e => { updatePool({ name: e.target.value }); - updateUserData({ hasEditedPoolInformation: true }); + updateUserData({ hasEditedPoolName: true }); }} />
-
+
{ updatePool({ symbol: e.target.value.trim() }); - updateUserData({ hasEditedPoolInformation: true }); + updateUserData({ hasEditedPoolSymbol: true }); }} />
{existingPools && existingPools.length > 0 && ( - -
- Warning: The following pools have already been created with - a similar configuration +
+ Warning: Pools with a similar configuration have already been created +
+ + + {existingPools.map(pool => ( + + + + + + ))} + +
{pool.name}{pool.symbol} + + See Details + + +
-
    - {/* TODO: Replace with production link instead of test.balancer.fi */} - {existingPools.map(pool => ( -
  1. - - {pool.symbol} - - -
    2. - ))} -
- +
)}
); diff --git a/packages/nextjs/app/v3/_components/ChooseParameters.tsx b/packages/nextjs/app/v3/_components/ChooseParameters.tsx index f2279c6e..409774c2 100644 --- a/packages/nextjs/app/v3/_components/ChooseParameters.tsx +++ b/packages/nextjs/app/v3/_components/ChooseParameters.tsx @@ -22,7 +22,8 @@ export const ChooseParameters = () => { poolHooksContract, enableDonation, disableUnbalancedLiquidity, - isDelegatingManagement, + isDelegatingPauseManagement, + isDelegatingSwapFeeManagement, updatePool, } = usePoolCreationStore(); @@ -142,62 +143,92 @@ export const ChooseParameters = () => { target="_blank" rel="noreferrer" > - Pool management + Swap fee manager { - updatePool({ isDelegatingManagement: true, swapFeeManager: "", pauseManager: "" }); + updatePool({ isDelegatingSwapFeeManagement: true, swapFeeManager: "" }); }} /> updatePool({ - isDelegatingManagement: false, + isDelegatingSwapFeeManagement: false, swapFeeManager: connectedWalletAddress, - pauseManager: connectedWalletAddress, }) } /> updatePool({ isDelegatingSwapFeeManagement: false, swapFeeManager: "" })} + /> + {!isDelegatingSwapFeeManagement && swapFeeManager !== connectedWalletAddress && ( + updatePool({ swapFeeManager: e.target.value.trim() })} + /> + )} +
+ +
+ + { + updatePool({ isDelegatingPauseManagement: true, pauseManager: "" }); + }} + /> + + updatePool({ + isDelegatingPauseManagement: false, + pauseManager: connectedWalletAddress, + }) } - onChange={() => updatePool({ isDelegatingManagement: false, swapFeeManager: "", pauseManager: "" })} /> - {!isDelegatingManagement && - (swapFeeManager !== connectedWalletAddress || pauseManager !== connectedWalletAddress) && ( -
- updatePool({ swapFeeManager: e.target.value.trim() })} - /> - updatePool({ pauseManager: e.target.value.trim() })} - /> -
- )} + updatePool({ isDelegatingPauseManagement: false, pauseManager: "" })} + /> + {!isDelegatingPauseManagement && pauseManager !== connectedWalletAddress && ( +
+ updatePool({ pauseManager: e.target.value.trim() })} + /> +
+ )}
diff --git a/packages/nextjs/app/v3/_components/ChooseToken.tsx b/packages/nextjs/app/v3/_components/ChooseToken.tsx index 5f3532ca..ea463862 100644 --- a/packages/nextjs/app/v3/_components/ChooseToken.tsx +++ b/packages/nextjs/app/v3/_components/ChooseToken.tsx @@ -74,7 +74,11 @@ export function ChooseToken({ index }: { index: number }) { useBoostedVariant: false, }); - if (boostableWhitelist?.[tokenInfo.address]) { + // If user switches token, this will force trigger auto-generation of pool name and symbol, at which point user can decide to modify + updateUserData({ hasEditedPoolName: false, hasEditedPoolSymbol: false }); + + const hasBoostedVariant = boostableWhitelist?.[tokenInfo.address]; + if (hasBoostedVariant) { setShowBoostOpportunityModal(true); } }; @@ -333,12 +337,15 @@ const BoostOpportunityModal = ({ return (
-
+

{boostedVariant.name}

Boosted tokens provide your liquidity pool with a layer of sustainable yield. If you select{" "} {boostedVariant.symbol}, all {standardVariant.symbol} in this pool will be supplied to Aave's lending market to earn additional yield. +
+ Note that if you choose the boosted variant, the necessary rate provider address will be auto-filled for you +
)}
diff --git a/packages/nextjs/app/v3/_components/PoolDetails.tsx b/packages/nextjs/app/v3/_components/PoolDetails.tsx index a4202a2b..24ce82f5 100644 --- a/packages/nextjs/app/v3/_components/PoolDetails.tsx +++ b/packages/nextjs/app/v3/_components/PoolDetails.tsx @@ -31,6 +31,8 @@ export function PoolDetails({ isPreview }: { isPreview?: boolean }) { symbol, amplificationParameter, poolAddress, + isDelegatingPauseManagement, + isDelegatingSwapFeeManagement, } = usePoolCreationStore(); const { isParametersValid, isTypeValid, isInfoValid, isTokensValid } = useValidatePoolCreationInput(); @@ -89,8 +91,10 @@ export function PoolDetails({ isPreview }: { isPreview?: boolean }) { {abbreviateAddress(swapFeeManager)} - ) : ( + ) : isDelegatingSwapFeeManagement ? ( "Balancer" + ) : ( + "-" )}
@@ -107,8 +111,10 @@ export function PoolDetails({ isPreview }: { isPreview?: boolean }) { {abbreviateAddress(pauseManager)} - ) : ( + ) : isDelegatingPauseManagement ? ( "Balancer" + ) : ( + "-" )}
diff --git a/packages/nextjs/components/common/RadioInput.tsx b/packages/nextjs/components/common/RadioInput.tsx index 2f5f11c6..ea1e19c8 100644 --- a/packages/nextjs/components/common/RadioInput.tsx +++ b/packages/nextjs/components/common/RadioInput.tsx @@ -10,11 +10,11 @@ interface RadioInputProps { export function RadioInput({ name, checked, onChange, label }: RadioInputProps) { return (
-