fix: notify title, button style

KyberNetwork · Jan 20, 2025 · 6e34c37 · 6e34c37
1 parent bd45d87
commit 6e34c37
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 6 deletions.
diff --git a/src/pages/Earns/PositionDetail/ClaimFeeModal/index.tsx b/src/pages/Earns/PositionDetail/ClaimFeeModal/index.tsx
@@ -59,6 +59,9 @@ export default function ClaimFeeModal({
 
   const contract = useSigningContract(nftManagerContract, NonfungiblePositionManagerABI)
 
+  const isToken0Native = isNativeToken(position.token0Address, position.chainId as keyof typeof WETH)
+  const isToken1Native = isNativeToken(position.token1Address, position.chainId as keyof typeof WETH)
+
   const handleCollectFees = useCallback(async () => {
     if (!library || !contract) return
     const accounts = await library.listAccounts()
@@ -75,8 +78,6 @@ export default function ClaimFeeModal({
     const calldatas = []
 
     try {
-      const isToken0Native = isNativeToken(position.token0Address, position.chainId as keyof typeof WETH)
-      const isToken1Native = isNativeToken(position.token1Address, position.chainId as keyof typeof WETH)
       const involvesETH = isToken0Native || isToken1Native
       const collectParams = {
         tokenId,
@@ -118,8 +119,8 @@ export default function ClaimFeeModal({
           tokenAmountOut: formatDisplayNumber(feeInfo.amount1, { significantDigits: 4 }),
           tokenAddressIn: position.token0Address,
           tokenAddressOut: position.token1Address,
-          tokenSymbolIn: position.token0Symbol,
-          tokenSymbolOut: position.token1Symbol,
+          tokenSymbolIn: isToken0Native ? 'ETH' : position.token0Symbol,
+          tokenSymbolOut: isToken1Native ? 'ETH' : position.token1Symbol,
           arbitrary: {
             token_1: position.token0Symbol,
             token_2: position.token1Symbol,
@@ -144,6 +145,8 @@ export default function ClaimFeeModal({
     feeInfo.amount1,
     feeInfo.balance0,
     feeInfo.balance1,
+    isToken0Native,
+    isToken1Native,
     library,
     nftManagerContract,
     onClose,

diff --git a/src/pages/Earns/PositionDetail/LeftSection.tsx b/src/pages/Earns/PositionDetail/LeftSection.tsx
@@ -246,6 +246,7 @@ const LeftSection = ({ position }: { position: ParsedPosition }) => {
           <PositionAction
             small
             outline
+            mobileAutoWidth
             loading={claiming}
             disabled={(!feeInfo || feeInfo.totalValue === 0) && !claiming}
             onClick={() => feeInfo && feeInfo.totalValue !== 0 && !claiming && setOpenClaimFeeModal(true)}

diff --git a/src/pages/Earns/PositionDetail/styles.tsx b/src/pages/Earns/PositionDetail/styles.tsx
@@ -126,6 +126,7 @@ export const PositionAction = styled.button<{
   small?: boolean
   disabled?: boolean
   loading?: boolean
+  mobileAutoWidth?: boolean
 }>`
   border-radius: 24px;
   padding: 10px 18px;
@@ -140,7 +141,9 @@ export const PositionAction = styled.button<{
   ${({ outline }) => outline && 'background-color: transparent;'}
   ${({ outline, theme }) => outline && `color: ${theme.primary};`}
 
-  ${({ theme }) => theme.mediaWidth.upToSmall`
+  ${({ theme, mobileAutoWidth }) =>
+    !mobileAutoWidth &&
+    theme.mediaWidth.upToSmall`
     width: 100%;
   `}
 

diff --git a/src/state/transactions/type.ts b/src/state/transactions/type.ts
@@ -135,7 +135,7 @@ export enum TRANSACTION_TYPE {
   ELASTIC_REMOVE_LIQUIDITY = 'Elastic Remove Liquidity',
   ELASTIC_INCREASE_LIQUIDITY = 'Elastic Increase Liquidity',
   ELASTIC_ZAP_IN_LIQUIDITY = 'Elastic Zap-in Liquidity',
-  COLLECT_FEE = 'Collect Fee',
+  COLLECT_FEE = 'Collected Fee',
 
   STAKE = 'Stake Into Farm',
   UNSTAKE = 'Unstake From Farm',