Commit 332843f4 authored by lynn's avatar lynn Committed by GitHub

fix: add logging for token details (#4925)

logging for token details
parent cee32f97
...@@ -74,6 +74,7 @@ export enum SWAP_PRICE_UPDATE_USER_RESPONSE { ...@@ -74,6 +74,7 @@ export enum SWAP_PRICE_UPDATE_USER_RESPONSE {
* Known pages in the app. Highest order context. * Known pages in the app. Highest order context.
*/ */
export enum PageName { export enum PageName {
TOKEN_DETAILS_PAGE = 'token-details',
TOKENS_PAGE = 'tokens-page', TOKENS_PAGE = 'tokens-page',
POOL_PAGE = 'pool-page', POOL_PAGE = 'pool-page',
SWAP_PAGE = 'swap-page', SWAP_PAGE = 'swap-page',
......
import { useWeb3React } from '@web3-react/core' import { useWeb3React } from '@web3-react/core'
import { PageName } from 'analytics/constants'
import { Trace } from 'analytics/Trace'
import { filterTimeAtom } from 'components/Tokens/state' import { filterTimeAtom } from 'components/Tokens/state'
import { AboutSection } from 'components/Tokens/TokenDetails/About' import { AboutSection } from 'components/Tokens/TokenDetails/About'
import AddressSection from 'components/Tokens/TokenDetails/AddressSection' import AddressSection from 'components/Tokens/TokenDetails/AddressSection'
...@@ -124,67 +126,71 @@ export default function TokenDetails() { ...@@ -124,67 +126,71 @@ export default function TokenDetails() {
) )
return ( return (
<TokenDetailsLayout> <Trace page={PageName.TOKEN_DETAILS_PAGE} properties={{ tokenAddress, tokenName: chainName }} shouldLogImpression>
{tokenQueryData && ( <TokenDetailsLayout>
<> {tokenQueryData && (
<LeftPanel> <>
<BreadcrumbNavLink to={`/tokens/${chainName}`}> <LeftPanel>
<ArrowLeft size={14} /> Tokens <BreadcrumbNavLink to={`/tokens/${chainName}`}>
</BreadcrumbNavLink> <ArrowLeft size={14} /> Tokens
<ChartSection </BreadcrumbNavLink>
token={tokenQueryData} <ChartSection
currency={token} token={tokenQueryData}
nativeCurrency={isNative ? nativeCurrency : undefined} currency={token}
prices={prices} nativeCurrency={isNative ? nativeCurrency : undefined}
/> prices={prices}
<StatsSection />
TVL={tokenQueryData.market?.totalValueLocked?.value} <StatsSection
volume24H={tokenQueryData.market?.volume24H?.value} TVL={tokenQueryData.market?.totalValueLocked?.value}
priceHigh52W={tokenQueryData.market?.priceHigh52W?.value} volume24H={tokenQueryData.market?.volume24H?.value}
priceLow52W={tokenQueryData.market?.priceLow52W?.value} priceHigh52W={tokenQueryData.market?.priceHigh52W?.value}
/> priceLow52W={tokenQueryData.market?.priceLow52W?.value}
<Hr /> />
<AboutSection <Hr />
address={tokenQueryData.address ?? ''} <AboutSection
description={tokenQueryData.project?.description} address={tokenQueryData.address ?? ''}
homepageUrl={tokenQueryData.project?.homepageUrl} description={tokenQueryData.project?.description}
twitterName={tokenQueryData.project?.twitterName} homepageUrl={tokenQueryData.project?.homepageUrl}
/> twitterName={tokenQueryData.project?.twitterName}
<AddressSection address={tokenQueryData.address ?? ''} /> />
</LeftPanel> <AddressSection address={tokenQueryData.address ?? ''} />
<RightPanel> </LeftPanel>
<Widget <RightPanel>
// A null token is still loading, and should not be overridden. <Widget
defaultToken={token === null ? undefined : token ?? nativeCurrency} // A null token is still loading, and should not be overridden.
onReviewSwapClick={onReviewSwap} defaultToken={token === null ? undefined : token ?? nativeCurrency}
/> onReviewSwapClick={onReviewSwap}
{tokenWarning && <TokenSafetyMessage tokenAddress={tokenQueryData.address ?? ''} warning={tokenWarning} />} />
<BalanceSummary {tokenWarning && (
tokenAmount={tokenBalance} <TokenSafetyMessage tokenAddress={tokenQueryData.address ?? ''} warning={tokenWarning} />
nativeCurrencyAmount={nativeCurrencyBalance} )}
isNative={isNative} <BalanceSummary
/> tokenAmount={tokenBalance}
</RightPanel> nativeCurrencyAmount={nativeCurrencyBalance}
isNative={isNative}
/>
</RightPanel>
{tokenQueryAddress && ( {tokenQueryAddress && (
<MobileBalanceSummaryFooter <MobileBalanceSummaryFooter
tokenAmount={tokenBalance} tokenAmount={tokenBalance}
tokenAddress={tokenQueryAddress} tokenAddress={tokenQueryAddress}
nativeCurrencyAmount={nativeCurrencyBalance} nativeCurrencyAmount={nativeCurrencyBalance}
isNative={isNative} isNative={isNative}
/> />
)} )}
<TokenSafetyModal <TokenSafetyModal
isOpen={isBlockedToken || !!continueSwap} isOpen={isBlockedToken || !!continueSwap}
tokenAddress={tokenQueryData.address} tokenAddress={tokenQueryData.address}
onContinue={() => onResolveSwap(true)} onContinue={() => onResolveSwap(true)}
onBlocked={() => navigate(-1)} onBlocked={() => navigate(-1)}
onCancel={() => onResolveSwap(false)} onCancel={() => onResolveSwap(false)}
showCancel={true} showCancel={true}
/> />
</> </>
)} )}
</TokenDetailsLayout> </TokenDetailsLayout>
</Trace>
) )
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment