feat: implement-page-viewed-event-for-all-main-pages-of-app (#4089)

* init commit: initial constants for pages, implement vote page viewed

* implement swap

* implement pool

* remove charts

* simplify shouldLogImpression

src/components/AmplitudeAnalytics/constants.ts

@@ -17,7 +17,10 @@ export enum EventName {
  * Known pages in the app. Highest order context.
  */
 export const enum PageName {
+  EXPLORE_PAGE = 'explore-page',
+  POOL_PAGE = 'pool-page',
   SWAP_PAGE = 'swap-page',
+  VOTE_PAGE = 'vote-page',
   // alphabetize additional page names.
 }
 

src/pages/CreateProposal/index.tsx

@@ -3,6 +3,8 @@ import { getAddress, isAddress } from '@ethersproject/address'
 import { Trans } from '@lingui/macro'
 import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import { ButtonError } from 'components/Button'
 import { BlueCard } from 'components/Card'
 import { AutoColumn } from 'components/Column'
@@ -225,6 +227,7 @@ ${bodyValue}
   }
 
   return (
+    <Trace page={PageName.VOTE_PAGE} shouldLogImpression>
       <AppBody {...{ maxWidth: '800px' }}>
         <CreateProposalTabs />
         <CreateProposalWrapper>
@@ -232,9 +235,9 @@ ${bodyValue}
             <AutoColumn gap="10px">
               <ThemedText.Link fontWeight={400} color={'primaryText1'}>
                 <Trans>
-                <strong>Tip:</strong> Select an action and describe your proposal for the community. The proposal cannot
-                be modified after submission, so please verify all information before submitting. The voting period will
-                begin immediately and last for 7 days. To propose a custom action,{' '}
+                  <strong>Tip:</strong> Select an action and describe your proposal for the community. The proposal
+                  cannot be modified after submission, so please verify all information before submitting. The voting
+                  period will begin immediately and last for 7 days. To propose a custom action,{' '}
                   <ExternalLink href="https://uniswap.org/docs/v2/governance/governance-reference/#propose">
                     read the docs
                   </ExternalLink>
@@ -263,7 +266,8 @@ ${bodyValue}
           <CreateProposalButton
             proposalThreshold={proposalThreshold}
             hasActiveOrPendingProposal={
-            latestProposalData?.status === ProposalState.ACTIVE || latestProposalData?.status === ProposalState.PENDING
+              latestProposalData?.status === ProposalState.ACTIVE ||
+              latestProposalData?.status === ProposalState.PENDING
             }
             hasEnoughVote={hasEnoughVote}
             isFormInvalid={isFormInvalid}
@@ -283,5 +287,6 @@ ${bodyValue}
         />
         <ProposalSubmissionModal isOpen={attempting} hash={hash} onDismiss={handleDismissSubmissionModal} />
       </AppBody>
+    </Trace>
   )
 }

src/pages/Pool/PositionPage.tsx

@@ -4,6 +4,8 @@ import { Trans } from '@lingui/macro'
 import { Currency, CurrencyAmount, Fraction, Percent, Price, Token } from '@uniswap/sdk-core'
 import { NonfungiblePositionManager, Pool, Position } from '@uniswap/v3-sdk'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import { sendEvent } from 'components/analytics'
 import Badge from 'components/Badge'
 import { ButtonConfirmed, ButtonGray, ButtonPrimary } from 'components/Button'
@@ -567,6 +569,7 @@ export function PositionPage({
       <div />
     </LoadingRows>
   ) : (
+    <Trace page={PageName.POOL_PAGE} shouldLogImpression>
       <>
         <PageWrapper>
           <TransactionConfirmationModal
@@ -738,7 +741,8 @@ export function PositionPage({
                             </ThemedText.LargeHeader>
                           )}
                         </AutoColumn>
-                      {ownsNFT && (feeValue0?.greaterThan(0) || feeValue1?.greaterThan(0) || !!collectMigrationHash) ? (
+                        {ownsNFT &&
+                        (feeValue0?.greaterThan(0) || feeValue1?.greaterThan(0) || !!collectMigrationHash) ? (
                           <ButtonConfirmed
                             disabled={collecting || !!collectMigrationHash}
                             confirmed={!!collectMigrationHash && !isCollectPending}
@@ -906,5 +910,6 @@ export function PositionPage({
         </PageWrapper>
         <SwitchLocaleLink />
       </>
+    </Trace>
   )
 }

src/pages/Pool/index.tsx

 import { Trans } from '@lingui/macro'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import { ButtonGray, ButtonPrimary, ButtonText } from 'components/Button'
 import { AutoColumn } from 'components/Column'
 import { FlyoutAlignment, NewMenu } from 'components/Menu'
@@ -252,6 +254,7 @@ export default function Pool() {
   ]
 
   return (
+    <Trace page={PageName.POOL_PAGE} shouldLogImpression>
       <>
         <PageWrapper>
           <SwapPoolTabs active="pool" />
@@ -323,5 +326,6 @@ export default function Pool() {
         </PageWrapper>
         <SwitchLocaleLink />
       </>
+    </Trace>
   )
 }

src/pages/Pool/v2.tsx

 import { Trans } from '@lingui/macro'
 import { Pair } from '@uniswap/v2-sdk'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import { UNSUPPORTED_V2POOL_CHAIN_IDS } from 'constants/chains'
 import JSBI from 'jsbi'
 import { useContext, useMemo } from 'react'
@@ -135,6 +137,7 @@ export default function Pool() {
   })
 
   return (
+    <Trace page={PageName.POOL_PAGE} shouldLogImpression>
       <>
         <PageWrapper>
           <SwapPoolTabs active={'pool'} />
@@ -151,8 +154,8 @@ export default function Pool() {
                 <RowBetween>
                   <ThemedText.White fontSize={14}>
                     <Trans>
-                    Liquidity providers earn a 0.3% fee on all trades proportional to their share of the pool. Fees are
-                    added to the pool, accrue in real time and can be claimed by withdrawing your liquidity.
+                      Liquidity providers earn a 0.3% fee on all trades proportional to their share of the pool. Fees
+                      are added to the pool, accrue in real time and can be claimed by withdrawing your liquidity.
                     </Trans>
                   </ThemedText.White>
                 </RowBetween>
@@ -277,5 +280,6 @@ export default function Pool() {
         </PageWrapper>
         <SwitchLocaleLink />
       </>
+    </Trace>
   )
 }

src/pages/PoolFinder/index.tsx

 import { Trans } from '@lingui/macro'
 import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import JSBI from 'jsbi'
 import { useCallback, useEffect, useState } from 'react'
 import { Plus } from 'react-feather'
@@ -95,6 +97,7 @@ export default function PoolFinder() {
   )
 
   return (
+    <Trace page={PageName.POOL_PAGE} shouldLogImpression>
       <>
         <AppBody>
           <FindPoolTabs origin={query.get('origin') ?? '/pool/v2'} />
@@ -229,5 +232,6 @@ export default function PoolFinder() {
         </AppBody>
         <SwitchLocaleLink />
       </>
+    </Trace>
   )
 }

src/pages/Swap/index.tsx

@@ -398,7 +398,7 @@ export default function Swap({ history }: RouteComponentProps) {
   const priceImpactTooHigh = priceImpactSeverity > 3 && !isExpertMode
 
   return (
-    <Trace page={PageName.SWAP_PAGE} shouldLogImpression={false}>
+    <Trace page={PageName.SWAP_PAGE} shouldLogImpression>
       <>
         <TokenWarningModal
           isOpen={importTokensNotInDefault.length > 0 && !dismissTokenWarning}

src/pages/Vote/Landing.tsx

 import { Trans } from '@lingui/macro'
 import { CurrencyAmount, Token } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import { ButtonPrimary } from 'components/Button'
 import { AutoColumn } from 'components/Column'
 import { CardBGImage, CardNoise, CardSection, DataCard } from 'components/earn/styled'
@@ -132,6 +134,7 @@ export default function Landing() {
   )
   return (
     <>
+      <Trace page={PageName.VOTE_PAGE} shouldLogImpression>
         <PageWrapper gap="lg" justify="center">
           <DelegateModal
             isOpen={showDelegateModal}
@@ -250,7 +253,10 @@ export default function Landing() {
                   <ThemedText.Main>
                     <Trans>Show Cancelled</Trans>
                   </ThemedText.Main>
-                <Toggle isActive={!hideCancelled} toggle={() => setHideCancelled((hideCancelled) => !hideCancelled)} />
+                  <Toggle
+                    isActive={!hideCancelled}
+                    toggle={() => setHideCancelled((hideCancelled) => !hideCancelled)}
+                  />
                 </RowBetween>
               </AutoColumn>
             )}
@@ -276,6 +282,7 @@ export default function Landing() {
             <Trans>A minimum threshold of 0.25% of the total UNI supply is required to submit proposals</Trans>
           </ThemedText.SubHeader>
         </PageWrapper>
+      </Trace>
       <SwitchLocaleLink />
     </>
   )

src/pages/Vote/VotePage.tsx

@@ -2,6 +2,8 @@ import { BigNumber } from '@ethersproject/bignumber'
 import { Trans } from '@lingui/macro'
 import { CurrencyAmount, Fraction, Token } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
+import { PageName } from 'components/AmplitudeAnalytics/constants'
+import { Trace } from 'components/AmplitudeAnalytics/Trace'
 import ExecuteModal from 'components/vote/ExecuteModal'
 import QueueModal from 'components/vote/QueueModal'
 import { useActiveLocale } from 'hooks/useActiveLocale'
@@ -258,6 +260,7 @@ export default function VotePage({
   }
 
   return (
+    <Trace page={PageName.VOTE_PAGE} shouldLogImpression>
       <>
         <PageWrapper gap="lg" justify="center">
           <VoteModal
@@ -266,7 +269,11 @@ export default function VotePage({
             proposalId={proposalData?.id}
             voteOption={voteOption}
           />
-        <DelegateModal isOpen={showDelegateModal} onDismiss={toggleDelegateModal} title={<Trans>Unlock Votes</Trans>} />
+          <DelegateModal
+            isOpen={showDelegateModal}
+            onDismiss={toggleDelegateModal}
+            title={<Trans>Unlock Votes</Trans>}
+          />
           <QueueModal isOpen={showQueueModal} onDismiss={toggleQueueModal} proposalId={proposalData?.id} />
           <ExecuteModal isOpen={showExecuteModal} onDismiss={toggleExecuteModal} proposalId={proposalData?.id} />
           <ProposalInfo gap="lg" justify="start">
@@ -479,5 +486,6 @@ export default function VotePage({
         </PageWrapper>
         <SwitchLocaleLink />
       </>
+    </Trace>
   )
 }