Commit 4e0c9b36 authored by lynn's avatar lynn Committed by GitHub

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
parent 64cb9f3f
...@@ -17,7 +17,10 @@ export enum EventName { ...@@ -17,7 +17,10 @@ export enum EventName {
* Known pages in the app. Highest order context. * Known pages in the app. Highest order context.
*/ */
export const enum PageName { export const enum PageName {
EXPLORE_PAGE = 'explore-page',
POOL_PAGE = 'pool-page',
SWAP_PAGE = 'swap-page', SWAP_PAGE = 'swap-page',
VOTE_PAGE = 'vote-page',
// alphabetize additional page names. // alphabetize additional page names.
} }
......
...@@ -3,6 +3,8 @@ import { getAddress, isAddress } from '@ethersproject/address' ...@@ -3,6 +3,8 @@ import { getAddress, isAddress } from '@ethersproject/address'
import { Trans } from '@lingui/macro' import { Trans } from '@lingui/macro'
import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core' import { Currency, CurrencyAmount, Token } from '@uniswap/sdk-core'
import { useWeb3React } from '@web3-react/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 { ButtonError } from 'components/Button'
import { BlueCard } from 'components/Card' import { BlueCard } from 'components/Card'
import { AutoColumn } from 'components/Column' import { AutoColumn } from 'components/Column'
...@@ -225,63 +227,66 @@ ${bodyValue} ...@@ -225,63 +227,66 @@ ${bodyValue}
} }
return ( return (
<AppBody {...{ maxWidth: '800px' }}> <Trace page={PageName.VOTE_PAGE} shouldLogImpression>
<CreateProposalTabs /> <AppBody {...{ maxWidth: '800px' }}>
<CreateProposalWrapper> <CreateProposalTabs />
<BlueCard> <CreateProposalWrapper>
<AutoColumn gap="10px"> <BlueCard>
<ThemedText.Link fontWeight={400} color={'primaryText1'}> <AutoColumn gap="10px">
<Trans> <ThemedText.Link fontWeight={400} color={'primaryText1'}>
<strong>Tip:</strong> Select an action and describe your proposal for the community. The proposal cannot <Trans>
be modified after submission, so please verify all information before submitting. The voting period will <strong>Tip:</strong> Select an action and describe your proposal for the community. The proposal
begin immediately and last for 7 days. To propose a custom action,{' '} cannot be modified after submission, so please verify all information before submitting. The voting
<ExternalLink href="https://uniswap.org/docs/v2/governance/governance-reference/#propose"> period will begin immediately and last for 7 days. To propose a custom action,{' '}
read the docs <ExternalLink href="https://uniswap.org/docs/v2/governance/governance-reference/#propose">
</ExternalLink> read the docs
. </ExternalLink>
</Trans> .
</ThemedText.Link> </Trans>
</AutoColumn> </ThemedText.Link>
</BlueCard> </AutoColumn>
</BlueCard>
<ProposalActionSelector onClick={handleActionSelectorClick} proposalAction={proposalAction} />
<ProposalActionDetail <ProposalActionSelector onClick={handleActionSelectorClick} proposalAction={proposalAction} />
proposalAction={proposalAction} <ProposalActionDetail
currency={currencyValue} proposalAction={proposalAction}
amount={amountValue} currency={currencyValue}
toAddress={toAddressValue} amount={amountValue}
onCurrencySelect={handleCurrencySelect} toAddress={toAddressValue}
onAmountInput={handleAmountInput} onCurrencySelect={handleCurrencySelect}
onToAddressInput={handleToAddressInput} onAmountInput={handleAmountInput}
onToAddressInput={handleToAddressInput}
/>
<ProposalEditor
title={titleValue}
body={bodyValue}
onTitleInput={handleTitleInput}
onBodyInput={handleBodyInput}
/>
<CreateProposalButton
proposalThreshold={proposalThreshold}
hasActiveOrPendingProposal={
latestProposalData?.status === ProposalState.ACTIVE ||
latestProposalData?.status === ProposalState.PENDING
}
hasEnoughVote={hasEnoughVote}
isFormInvalid={isFormInvalid}
handleCreateProposal={handleCreateProposal}
/>
{!hasEnoughVote ? (
<AutonomousProposalCTA>
Don’t have 2.5M votes? Anyone can create an autonomous proposal using{' '}
<ExternalLink href="https://fish.vote">fish.vote</ExternalLink>
</AutonomousProposalCTA>
) : null}
</CreateProposalWrapper>
<ProposalActionSelectorModal
isOpen={modalOpen}
onDismiss={handleDismissActionSelector}
onProposalActionSelect={(proposalAction: ProposalAction) => handleActionChange(proposalAction)}
/> />
<ProposalEditor <ProposalSubmissionModal isOpen={attempting} hash={hash} onDismiss={handleDismissSubmissionModal} />
title={titleValue} </AppBody>
body={bodyValue} </Trace>
onTitleInput={handleTitleInput}
onBodyInput={handleBodyInput}
/>
<CreateProposalButton
proposalThreshold={proposalThreshold}
hasActiveOrPendingProposal={
latestProposalData?.status === ProposalState.ACTIVE || latestProposalData?.status === ProposalState.PENDING
}
hasEnoughVote={hasEnoughVote}
isFormInvalid={isFormInvalid}
handleCreateProposal={handleCreateProposal}
/>
{!hasEnoughVote ? (
<AutonomousProposalCTA>
Don’t have 2.5M votes? Anyone can create an autonomous proposal using{' '}
<ExternalLink href="https://fish.vote">fish.vote</ExternalLink>
</AutonomousProposalCTA>
) : null}
</CreateProposalWrapper>
<ProposalActionSelectorModal
isOpen={modalOpen}
onDismiss={handleDismissActionSelector}
onProposalActionSelect={(proposalAction: ProposalAction) => handleActionChange(proposalAction)}
/>
<ProposalSubmissionModal isOpen={attempting} hash={hash} onDismiss={handleDismissSubmissionModal} />
</AppBody>
) )
} }
This diff is collapsed.
import { Trans } from '@lingui/macro' import { Trans } from '@lingui/macro'
import { useWeb3React } from '@web3-react/core' 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 { ButtonGray, ButtonPrimary, ButtonText } from 'components/Button'
import { AutoColumn } from 'components/Column' import { AutoColumn } from 'components/Column'
import { FlyoutAlignment, NewMenu } from 'components/Menu' import { FlyoutAlignment, NewMenu } from 'components/Menu'
...@@ -252,76 +254,78 @@ export default function Pool() { ...@@ -252,76 +254,78 @@ export default function Pool() {
] ]
return ( return (
<> <Trace page={PageName.POOL_PAGE} shouldLogImpression>
<PageWrapper> <>
<SwapPoolTabs active="pool" /> <PageWrapper>
<AutoColumn gap="lg" justify="center"> <SwapPoolTabs active="pool" />
<AutoColumn gap="lg" style={{ width: '100%' }}> <AutoColumn gap="lg" justify="center">
<TitleRow style={{ marginTop: '1rem' }} padding={'0'}> <AutoColumn gap="lg" style={{ width: '100%' }}>
<ThemedText.Body fontSize={'20px'}> <TitleRow style={{ marginTop: '1rem' }} padding={'0'}>
<Trans>Pools Overview</Trans> <ThemedText.Body fontSize={'20px'}>
</ThemedText.Body> <Trans>Pools Overview</Trans>
<ButtonRow> </ThemedText.Body>
{showV2Features && ( <ButtonRow>
<Menu {showV2Features && (
menuItems={menuItems} <Menu
flyoutAlignment={FlyoutAlignment.LEFT} menuItems={menuItems}
ToggleUI={(props: any) => ( flyoutAlignment={FlyoutAlignment.LEFT}
<MoreOptionsButton {...props}> ToggleUI={(props: any) => (
<MoreOptionsText> <MoreOptionsButton {...props}>
<Trans>More</Trans> <MoreOptionsText>
<ChevronDown size={15} /> <Trans>More</Trans>
</MoreOptionsText> <ChevronDown size={15} />
</MoreOptionsButton> </MoreOptionsText>
)} </MoreOptionsButton>
)}
/>
)}
<ResponsiveButtonPrimary id="join-pool-button" as={Link} to="/add/ETH">
+ <Trans>New Position</Trans>
</ResponsiveButtonPrimary>
</ButtonRow>
</TitleRow>
<MainContentWrapper>
{positionsLoading ? (
<PositionsLoadingPlaceholder />
) : filteredPositions && closedPositions && filteredPositions.length > 0 ? (
<PositionList
positions={filteredPositions}
setUserHideClosedPositions={setUserHideClosedPositions}
userHideClosedPositions={userHideClosedPositions}
/> />
) : (
<ErrorContainer>
<ThemedText.Body color={theme.text3} textAlign="center">
<InboxIcon strokeWidth={1} />
<div>
<Trans>Your active V3 liquidity positions will appear here.</Trans>
</div>
</ThemedText.Body>
{!showConnectAWallet && closedPositions.length > 0 && (
<ButtonText
style={{ marginTop: '.5rem' }}
onClick={() => setUserHideClosedPositions(!userHideClosedPositions)}
>
<Trans>Show closed positions</Trans>
</ButtonText>
)}
{showConnectAWallet && (
<ButtonPrimary style={{ marginTop: '2em', padding: '8px 16px' }} onClick={toggleWalletModal}>
<Trans>Connect a wallet</Trans>
</ButtonPrimary>
)}
</ErrorContainer>
)} )}
<ResponsiveButtonPrimary id="join-pool-button" as={Link} to="/add/ETH"> </MainContentWrapper>
+ <Trans>New Position</Trans> <HideSmall>
</ResponsiveButtonPrimary> <CTACards />
</ButtonRow> </HideSmall>
</TitleRow> </AutoColumn>
<MainContentWrapper>
{positionsLoading ? (
<PositionsLoadingPlaceholder />
) : filteredPositions && closedPositions && filteredPositions.length > 0 ? (
<PositionList
positions={filteredPositions}
setUserHideClosedPositions={setUserHideClosedPositions}
userHideClosedPositions={userHideClosedPositions}
/>
) : (
<ErrorContainer>
<ThemedText.Body color={theme.text3} textAlign="center">
<InboxIcon strokeWidth={1} />
<div>
<Trans>Your active V3 liquidity positions will appear here.</Trans>
</div>
</ThemedText.Body>
{!showConnectAWallet && closedPositions.length > 0 && (
<ButtonText
style={{ marginTop: '.5rem' }}
onClick={() => setUserHideClosedPositions(!userHideClosedPositions)}
>
<Trans>Show closed positions</Trans>
</ButtonText>
)}
{showConnectAWallet && (
<ButtonPrimary style={{ marginTop: '2em', padding: '8px 16px' }} onClick={toggleWalletModal}>
<Trans>Connect a wallet</Trans>
</ButtonPrimary>
)}
</ErrorContainer>
)}
</MainContentWrapper>
<HideSmall>
<CTACards />
</HideSmall>
</AutoColumn> </AutoColumn>
</AutoColumn> </PageWrapper>
</PageWrapper> <SwitchLocaleLink />
<SwitchLocaleLink /> </>
</> </Trace>
) )
} }
This diff is collapsed.
This diff is collapsed.
...@@ -398,7 +398,7 @@ export default function Swap({ history }: RouteComponentProps) { ...@@ -398,7 +398,7 @@ export default function Swap({ history }: RouteComponentProps) {
const priceImpactTooHigh = priceImpactSeverity > 3 && !isExpertMode const priceImpactTooHigh = priceImpactSeverity > 3 && !isExpertMode
return ( return (
<Trace page={PageName.SWAP_PAGE} shouldLogImpression={false}> <Trace page={PageName.SWAP_PAGE} shouldLogImpression>
<> <>
<TokenWarningModal <TokenWarningModal
isOpen={importTokensNotInDefault.length > 0 && !dismissTokenWarning} isOpen={importTokensNotInDefault.length > 0 && !dismissTokenWarning}
......
This diff is collapsed.
This diff is collapsed.
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