fix: wbtc vault rewards page + claimable rewards counting

app/src/components/rewards/RewardTokenAmounts/index.tsx

@@ -13,6 +13,7 @@ type Props = {
   size?: number
   variant?: TextVariant
   showDash?: boolean
+  hideZeroAmount?: boolean
   hideTokenImages?: boolean
 } & MarginProps
 
@@ -22,6 +23,7 @@ export default function RewardTokenAmounts({
   variant = 'body',
   showDash = true,
   hideTokenImages = false,
+  hideZeroAmount = false,
   ...styleProps
 }: Props) {
   const rewardsText = useMemo(
@@ -30,7 +32,7 @@ export default function RewardTokenAmounts({
   )
   const isRewardAmountZero = tokenAmounts.reduce((totalAmount, tokenAmount) => totalAmount + tokenAmount.amount, 0) <= 0
 
-  if (showDash && isRewardAmountZero) {
+  if (showDash && (tokenAmounts.length === 0 || (hideZeroAmount && isRewardAmountZero))) {
     return (
       <Text variant={variant} {...styleProps}>
         -

app/src/containers/rewards/ClaimModal/index.tsx

@@ -5,15 +5,13 @@ import Icon, { IconType } from '@lyra/ui/components/Icon'
 import Modal from '@lyra/ui/components/Modal'
 import ModalSection from '@lyra/ui/components/Modal/ModalSection'
 import Text from '@lyra/ui/components/Text'
-import { AccountRewardEpoch, RewardEpochTokenAmount } from '@lyrafinance/lyra-js'
+import { AccountRewardEpoch } from '@lyrafinance/lyra-js'
 import React from 'react'
 import { useState } from 'react'
-import { useMemo } from 'react'
 
 import RowItem from '@/app/components/common/RowItem'
 import { TransactionType } from '@/app/constants/screen'
 import useTransaction from '@/app/hooks/account/useTransaction'
-import useWalletAccount from '@/app/hooks/account/useWalletAccount'
 import { useMutateRewardsPageData } from '@/app/hooks/rewards/useRewardsPageData'
 import formatRewardTokenAmounts from '@/app/utils/formatRewardTokenAmounts'
 import formatTokenName from '@/app/utils/formatTokenName'
@@ -30,34 +28,13 @@ type Props = {
 
 export default function ClaimModal({ accountRewardEpoch, isOpen, onClose }: Props) {
   const [isVaultExpanded, setIsVaultExpanded] = useState(false)
-  const account = useWalletAccount()
   const execute = useTransaction(accountRewardEpoch.lyra.network)
   const mutateRewardsPageData = useMutateRewardsPageData()
-  const allRewardTokenAmounts = useMemo(
-    () => [
-      ...Object.values(accountRewardEpoch.claimableRewards.vaultRewards).flat(),
-      ...accountRewardEpoch.claimableRewards.tradingRewards,
-    ],
-    [accountRewardEpoch]
-  )
+  const { tradingRewards, totalRewards } = accountRewardEpoch.claimableRewards
   const emptyVaultRewards = accountRewardEpoch.globalEpoch
     .totalVaultRewards(accountRewardEpoch.globalEpoch.markets[0].address)
     .map(t => ({ ...t, amount: 0 }))
-  const totalRewards = useMemo(() => {
-    const rewardMap: Record<string, RewardEpochTokenAmount> = {}
-    return Object.values(
-      allRewardTokenAmounts.reduce((map, rewardTokenAmount) => {
-        if (!map[rewardTokenAmount.symbol]) {
-          return {
-            ...map,
-            [rewardTokenAmount.symbol]: rewardTokenAmount,
-          }
-        }
-        map[rewardTokenAmount.symbol].amount += rewardTokenAmount.amount
-        return map
-      }, rewardMap)
-    )
-  }, [allRewardTokenAmounts])
+  const emptyTradingRewards = accountRewardEpoch.globalEpoch.tradingRewards(0, 0)
 
   return (
     <Modal isOpen={isOpen} onClose={onClose} title="Claim Rewards" width={450} centerTitle>
@@ -112,16 +89,13 @@ export default function ClaimModal({ accountRewardEpoch, isOpen, onClose }: Prop
               )
             })}
         </Collapsible>
-
-        {accountRewardEpoch.claimableRewards.tradingRewards.some(reward => reward.amount > 0) ? (
-          <RowItem
-            mx={6}
-            my={6}
-            textVariant="bodyLarge"
-            label="Trading Rewards"
-            value={formatRewardTokenAmounts(accountRewardEpoch.claimableRewards.tradingRewards)}
-          />
-        ) : null}
+        <RowItem
+          mx={6}
+          my={6}
+          textVariant="bodyLarge"
+          label="Trading Rewards"
+          value={formatRewardTokenAmounts(tradingRewards.length ? tradingRewards : emptyTradingRewards)}
+        />
       </ModalSection>
       <CardSeparator />
       <ModalSection>
@@ -135,8 +109,8 @@ export default function ClaimModal({ accountRewardEpoch, isOpen, onClose }: Prop
         mb={6}
         network={accountRewardEpoch.lyra.network}
         transactionType={TransactionType.ClaimRewards}
-        label={'Claim'}
-        isDisabled={account === accountRewardEpoch.account && totalRewards.every(reward => reward.amount === 0)}
+        label="Claim"
+        isDisabled={totalRewards.every(reward => reward.amount === 0)}
         onClick={async () => {
           const tx = await getLyraSDK(accountRewardEpoch.lyra.network).claimRewards(
             accountRewardEpoch.account,

app/src/page_helpers/RewardsVaultsPageHelper/index.tsx

@@ -224,7 +224,7 @@ const RewardsVaultsPageHelper = ({ market, latestRewardEpoch, accountRewardEpoch
                       ml="auto"
                       tokenAmounts={vaultRewards.length ? vaultRewards : epochEmptyVaultRewards}
                       hideTokenImages
-                      showDash={false}
+                      showDash={true}
                     />
                   </Grid>
                 )

sdk/src/account_reward_epoch/index.ts

@@ -29,6 +29,7 @@ import fetchClaimEvents from '../utils/fetchClaimEvents'
 import findMarketX from '../utils/findMarketX'
 import fromBigNumber from '../utils/fromBigNumber'
 import getGlobalContract from '../utils/getGlobalContract'
+import getUniqueRewardTokenAmounts from '../utils/getUniqueRewardTokenAmounts'
 import multicall, { MulticallRequest } from '../utils/multicall'
 import parseClaimAddedEvents from './parseClaimAddedTags'
 
@@ -158,16 +159,8 @@ export class AccountRewardEpoch {
       ? claimAddedEvents.filter(ev => ev.blockNumber >= latestClaimedEvent.blockNumber)
       : claimAddedEvents
     this.claimableRewards = parseClaimAddedEvents(claimableClaimAddedEvents, globalEpoch.epoch)
-    this.totalClaimableVaultRewards = Object.values(
-      Object.values(this.claimableRewards.vaultRewards)
-        .flat()
-        .reduce((map, rewardToken) => {
-          if (!map[rewardToken.address]) {
-            return { ...map, [rewardToken.address]: rewardToken }
-          }
-          map[rewardToken.address].amount += rewardToken.amount
-          return map
-        }, {} as Record<string, RewardEpochTokenAmount>)
+    this.totalClaimableVaultRewards = getUniqueRewardTokenAmounts(
+      Object.values(this.claimableRewards.vaultRewards).flat()
     )
   }
 
@@ -189,7 +182,7 @@ export class AccountRewardEpoch {
     )
     // HACK @michaelxuwu - Filter claimAdded mistake
     const claimAddedEvents = _claimAddedEvents.filter(
-      event => event.rewardToken !== '0xCb9f85730f57732fc899fb158164b9Ed60c77D49'
+      event => event.rewardToken.toLowerCase() !== '0xCb9f85730f57732fc899fb158164b9Ed60c77D49'.toLowerCase()
     )
     return accountEpochDatas
       .map(accountEpochData => {

sdk/src/account_reward_epoch/parseClaimAddedTags.ts

@@ -1,6 +1,7 @@
 import { ClaimAddedEvent, RewardEpochTokenAmount } from '..'
 import { GlobalRewardEpochData } from '../utils/fetchGlobalRewardEpochData'
 import fromBigNumber from '../utils/fromBigNumber'
+import getUniqueRewardTokenAmounts from '../utils/getUniqueRewardTokenAmounts'
 
 enum ClaimAddedProgramTags {
   MMV = 'MMV',
@@ -84,20 +85,7 @@ export default function parseClaimAddedEvents(
       claimableToken.amount += amount
     }
   })
-
-  const totalRewards = Object.values(
-    [...tradingRewards, ...wethLyraRewards, ...stakingRewards, ...Object.values(vaultRewards).flat()].reduce(
-      (map, rewardTokenAmount) => {
-        if (!map[rewardTokenAmount.address]) {
-          map[rewardTokenAmount.address] = rewardTokenAmount
-          return map
-        }
-        map[rewardTokenAmount.address].amount += rewardTokenAmount.amount
-        return map
-      },
-      {} as Record<string, RewardEpochTokenAmount>
-    )
-  )
+  const totalRewards = getUniqueRewardTokenAmounts([...Object.values(vaultRewards).flat(), ...tradingRewards])
 
   return { vaultRewards, tradingRewards, stakingRewards, wethLyraRewards, totalRewards }
 }

sdk/src/global_reward_epoch/index.ts

@@ -282,7 +282,7 @@ export class GlobalRewardEpoch {
   totalVaultRewards(marketAddressOrName: string): RewardEpochTokenAmount[] {
     const market = findMarketX(this.markets, marketAddressOrName)
     const marketKey = market.baseToken.symbol
-    return this.epoch.globalMMVRewards[marketKey]
+    return this.epoch.globalMMVRewards[marketKey] ?? []
   }
 
   totalAverageVaultTokens(marketAddressOrName: string): number {

sdk/src/utils/getUniqueRewardTokenAmounts.ts

@@ -0,0 +1,14 @@
+import { RewardEpochTokenAmount } from '../global_reward_epoch'
+
+export default function getUniqueRewardTokenAmounts(rewardTokenAmount: RewardEpochTokenAmount[]) {
+  return Object.values(
+    rewardTokenAmount.reduce((map, rewardTokenAmount) => {
+      if (!map[rewardTokenAmount.address]) {
+        map[rewardTokenAmount.address] = { ...rewardTokenAmount }
+        return map
+      }
+      map[rewardTokenAmount.address].amount += rewardTokenAmount.amount
+      return map
+    }, {} as Record<string, RewardEpochTokenAmount>)
+  )
+}