From db1d264ad3fcf5451c9a20c205eee6f2a6d67367 Mon Sep 17 00:00:00 2001 From: Kristie Huang Date: Fri, 6 Oct 2023 12:11:44 -0400 Subject: [PATCH] fix: unhide native gas token from miniportfolio (#7374) * fix: unhide native gas token from miniportfolio * wip tests & gql types * fix tests, default hide small balances * pr review * fix e2e hidden count --- cypress/e2e/mini-portfolio/accounts.test.ts | 2 +- src/utils/splitHiddenTokens.test.tsx | 73 ++++++++++++++++----- src/utils/splitHiddenTokens.tsx | 26 ++++---- 3 files changed, 69 insertions(+), 32 deletions(-) diff --git a/cypress/e2e/mini-portfolio/accounts.test.ts b/cypress/e2e/mini-portfolio/accounts.test.ts index 3b62e1ccc4..d8c198890d 100644 --- a/cypress/e2e/mini-portfolio/accounts.test.ts +++ b/cypress/e2e/mini-portfolio/accounts.test.ts @@ -53,7 +53,7 @@ describe('Mini Portfolio account drawer', () => { // Verify that wallet state loads correctly cy.get(getTestSelector('mini-portfolio-navbar')).contains('Tokens') - cy.get(getTestSelector('mini-portfolio-page')).contains('Hidden (201)') + cy.get(getTestSelector('mini-portfolio-page')).contains('Hidden (197)') cy.intercept(/graphql/, { fixture: 'mini-portfolio/nfts.json' }) cy.get(getTestSelector('mini-portfolio-navbar')).contains('NFTs').click() diff --git a/src/utils/splitHiddenTokens.test.tsx b/src/utils/splitHiddenTokens.test.tsx index c07a61af8a..e8df81fa3a 100644 --- a/src/utils/splitHiddenTokens.test.tsx +++ b/src/utils/splitHiddenTokens.test.tsx @@ -1,11 +1,23 @@ -import { Currency, TokenBalance } from 'graphql/data/__generated__/types-and-hooks' +import { Chain, Currency, Token, TokenBalance, TokenStandard } from 'graphql/data/__generated__/types-and-hooks' import { splitHiddenTokens } from './splitHiddenTokens' +const nativeToken: Token = { + id: 'native-token', + chain: Chain.Ethereum, + standard: TokenStandard.Native, +} + +const nonnativeToken: Token = { + id: 'nonnative-token', + chain: Chain.Ethereum, + standard: TokenStandard.Erc20, +} + const tokens: TokenBalance[] = [ // low balance { - id: 'low-balance', + id: 'low-balance-native', ownerAddress: '', __typename: 'TokenBalance', denominatedValue: { @@ -17,10 +29,31 @@ const tokens: TokenBalance[] = [ currency: Currency.Eth, tokenProject: { id: '', - tokens: [], + tokens: [nativeToken], isSpam: false, }, }, + token: nativeToken, + }, + { + id: 'low-balance-nonnative', + ownerAddress: '', + __typename: 'TokenBalance', + denominatedValue: { + id: '', + currency: Currency.Usd, + value: 0.01, + }, + tokenProjectMarket: { + id: '', + currency: Currency.Eth, + tokenProject: { + id: '', + tokens: [nonnativeToken], + isSpam: false, + }, + }, + token: nonnativeToken, }, // spam { @@ -36,10 +69,11 @@ const tokens: TokenBalance[] = [ currency: Currency.Eth, tokenProject: { id: '', - tokens: [], + tokens: [nonnativeToken], isSpam: true, }, }, + token: nonnativeToken, }, // valid { @@ -55,10 +89,11 @@ const tokens: TokenBalance[] = [ currency: Currency.Eth, tokenProject: { id: '', - tokens: [], + tokens: [nonnativeToken], isSpam: false, }, }, + token: nonnativeToken, }, // empty value { @@ -75,10 +110,11 @@ const tokens: TokenBalance[] = [ currency: Currency.Eth, tokenProject: { id: '', - tokens: [], + tokens: [nonnativeToken], isSpam: false, }, }, + token: nonnativeToken, }, ] @@ -91,27 +127,32 @@ describe('splitHiddenTokens', () => { expect(hiddenTokens.length).toBe(1) expect(hiddenTokens[0].id).toBe('spam') - expect(visibleTokens.length).toBe(3) - expect(visibleTokens[0].id).toBe('low-balance') - expect(visibleTokens[1].id).toBe('valid') + expect(visibleTokens.length).toBe(4) + expect(visibleTokens[0].id).toBe('low-balance-native') + expect(visibleTokens[1].id).toBe('low-balance-nonnative') + expect(visibleTokens[2].id).toBe('valid') + expect(visibleTokens[3].id).toBe('undefined-value') }) - it('splits low balance into hidden by default', () => { + it('splits non-native low balance into hidden by default', () => { const { visibleTokens, hiddenTokens } = splitHiddenTokens(tokens) expect(hiddenTokens.length).toBe(2) - expect(hiddenTokens[0].id).toBe('low-balance') + expect(hiddenTokens[0].id).toBe('low-balance-nonnative') expect(hiddenTokens[1].id).toBe('spam') - expect(visibleTokens.length).toBe(2) - expect(visibleTokens[0].id).toBe('valid') + expect(visibleTokens.length).toBe(3) + expect(visibleTokens[0].id).toBe('low-balance-native') + expect(visibleTokens[1].id).toBe('valid') + expect(visibleTokens[2].id).toBe('undefined-value') }) it('splits undefined value tokens into visible', () => { const { visibleTokens } = splitHiddenTokens(tokens) - expect(visibleTokens.length).toBe(2) - expect(visibleTokens[0].id).toBe('valid') - expect(visibleTokens[1].id).toBe('undefined-value') + expect(visibleTokens.length).toBe(3) + expect(visibleTokens[0].id).toBe('low-balance-native') + expect(visibleTokens[1].id).toBe('valid') + expect(visibleTokens[2].id).toBe('undefined-value') }) }) diff --git a/src/utils/splitHiddenTokens.tsx b/src/utils/splitHiddenTokens.tsx index a438765ae3..26956676f9 100644 --- a/src/utils/splitHiddenTokens.tsx +++ b/src/utils/splitHiddenTokens.tsx @@ -1,29 +1,25 @@ -import { TokenBalance } from 'graphql/data/__generated__/types-and-hooks' +import { TokenBalance, TokenStandard } from 'graphql/data/__generated__/types-and-hooks' const HIDE_SMALL_USD_BALANCES_THRESHOLD = 1 export function splitHiddenTokens( tokenBalances: TokenBalance[], - options?: { + options: { hideSmallBalances?: boolean - } + } = { hideSmallBalances: true } ) { const visibleTokens: TokenBalance[] = [] const hiddenTokens: TokenBalance[] = [] for (const tokenBalance of tokenBalances) { - const isValidValue = - // if undefined we keep visible (see https://linear.app/uniswap/issue/WEB-1940/[mp]-update-how-we-handle-what-goes-in-hidden-token-section-of-mini) - typeof tokenBalance.denominatedValue?.value === 'undefined' || - // if below $1 - options?.hideSmallBalances === false || - meetsThreshold(tokenBalance) - - if ( - isValidValue && - // a spam token - !tokenBalance.tokenProjectMarket?.tokenProject?.isSpam - ) { + // if undefined we keep visible (see https://linear.app/uniswap/issue/WEB-1940/[mp]-update-how-we-handle-what-goes-in-hidden-token-section-of-mini) + const isUndefinedValue = typeof tokenBalance.denominatedValue?.value === 'undefined' + const shouldHideSmallBalance = + options?.hideSmallBalances && + !meetsThreshold(tokenBalance) && // if below $1 + tokenBalance.token?.standard !== TokenStandard.Native // do not hide native tokens regardless of small balance + const isSpamToken = tokenBalance.tokenProjectMarket?.tokenProject?.isSpam + if ((isUndefinedValue || !shouldHideSmallBalance) && !isSpamToken) { visibleTokens.push(tokenBalance) } else { hiddenTokens.push(tokenBalance)