Skip to content

I
interface
Commit f9f804c3 authored by Vignesh Mohankumar's avatar Vignesh Mohankumar Committed by GitHub
Browse files
Options

feat: add page view traces for / and /about (#5594) 

* feat: add page view traces for / and /about

* update analytics

* page name

* import
parent 0a0b56b1
Hide whitespace changes
Inline Side-by-side
Showing with 63 additions and 57 deletions
src/pages/About/index.tsx
View file @ f9f804c3
import { Trace } from '@uniswap/analytics'
import { PageName } from '@uniswap/analytics-events'
import { ButtonOutlined } from 'components/Button' import { ButtonOutlined } from 'components/Button'
import { useLayoutEffect, useRef, useState } from 'react' import { useLayoutEffect, useRef, useState } from 'react'
import { useIsDarkMode } from 'state/user/hooks' import { useIsDarkMode } from 'state/user/hooks'
...@@ -135,56 +137,58 @@ export default function About() { ...@@ -135,56 +137,58 @@ export default function About() {
const thumbnailImgSrc = isDarkMode ? selectedStep?.darkImgSrc : selectedStep?.lightImgSrc const thumbnailImgSrc = isDarkMode ? selectedStep?.darkImgSrc : selectedStep?.lightImgSrc
return ( return (
<Page isDarkMode={isDarkMode} titleHeight={titleHeight}> <Trace page={PageName.ABOUT_PAGE} shouldLogImpression>
<Content> <Page isDarkMode={isDarkMode} titleHeight={titleHeight}>
<Title ref={titleRef} isDarkMode={isDarkMode}> <Content>
The best way to buy, sell and own crypto and NFTs <Title ref={titleRef} isDarkMode={isDarkMode}>
</Title> The best way to buy, sell and own crypto and NFTs
<PoweredBySection> </Title>
<PoweredBySection>
<div>
<SubTitle isDarkMode={isDarkMode}>Powered by the Uniswap Protocol</SubTitle>
</div>
<Intro>
<IntroCopy>
The Uniswap Protocol is the world’s leading decentralized exchange protocol, allowing anyone to swap
tokens, list a token, or provide liquidity in a pool to earn fees.
</IntroCopy>
<ActionsContainer>
<InfoButton as="a" rel="noopener noreferrer" href="https://uniswap.org" target="_blank">
Learn more
</InfoButton>
<InfoButton as="a" rel="noopener noreferrer" href="https://docs.uniswap.org" target="_blank">
Read the docs
</InfoButton>
</ActionsContainer>
</Intro>
</PoweredBySection>
<CardGrid>
{CARDS.map((card) => (
<Card key={card.title} {...card} />
))}
</CardGrid>
<div> <div>
<SubTitle isDarkMode={isDarkMode}>Powered by the Uniswap Protocol</SubTitle> <SubTitle isDarkMode={isDarkMode}>Get Started</SubTitle>
<Panels>
<ThumbnailContainer>
<Thumbnail alt="Thumbnail" src={thumbnailImgSrc} />
</ThumbnailContainer>
<StepList>
{STEPS.map((step, index) => (
<Step
expanded={selectedStepIndex === index}
onClick={() => setSelectedStepIndex(index)}
index={index}
key={step.title}
title={step.title}
description={step.description}
/>
))}
</StepList>
</Panels>
</div> </div>
<Intro> </Content>
<IntroCopy> </Page>
The Uniswap Protocol is the world’s leading decentralized exchange protocol, allowing anyone to swap </Trace>
tokens, list a token, or provide liquidity in a pool to earn fees.
</IntroCopy>
<ActionsContainer>
<InfoButton as="a" rel="noopener noreferrer" href="https://uniswap.org" target="_blank">
Learn more
</InfoButton>
<InfoButton as="a" rel="noopener noreferrer" href="https://docs.uniswap.org" target="_blank">
Read the docs
</InfoButton>
</ActionsContainer>
</Intro>
</PoweredBySection>
<CardGrid>
{CARDS.map((card) => (
<Card key={card.title} {...card} />
))}
</CardGrid>
<div>
<SubTitle isDarkMode={isDarkMode}>Get Started</SubTitle>
<Panels>
<ThumbnailContainer>
<Thumbnail alt="Thumbnail" src={thumbnailImgSrc} />
</ThumbnailContainer>
<StepList>
{STEPS.map((step, index) => (
<Step
expanded={selectedStepIndex === index}
onClick={() => setSelectedStepIndex(index)}
index={index}
key={step.title}
title={step.title}
description={step.description}
/>
))}
</StepList>
</Panels>
</div>
</Content>
</Page>
) )
} }
src/pages/Landing/index.tsx
View file @ f9f804c3
import { Trace } from '@uniswap/analytics'
import { PageName } from '@uniswap/analytics-events'
import { BaseButton } from 'components/Button' import { BaseButton } from 'components/Button'
import { LandingPageVariant, useLandingPageFlag } from 'featureFlags/flags/landingPage' import { LandingPageVariant, useLandingPageFlag } from 'featureFlags/flags/landingPage'
import Swap from 'pages/Swap' import Swap from 'pages/Swap'
...@@ -152,7 +154,7 @@ export default function Landing() { ...@@ -152,7 +154,7 @@ export default function Landing() {
if (landingPageFlag === LandingPageVariant.Control || !isOpen) return null if (landingPageFlag === LandingPageVariant.Control || !isOpen) return null
return ( return (
<> <Trace page={PageName.LANDING_PAGE} shouldLogImpression>
<PageWrapper isDarkMode={isDarkMode}> <PageWrapper isDarkMode={isDarkMode}>
<TitleWrapper> <TitleWrapper>
<TitleText isDarkMode={isDarkMode}>Trade crypto & NFTs with confidence.</TitleText> <TitleText isDarkMode={isDarkMode}>Trade crypto & NFTs with confidence.</TitleText>
...@@ -170,6 +172,6 @@ export default function Landing() { ...@@ -170,6 +172,6 @@ export default function Landing() {
</ActionsWrapper> </ActionsWrapper>
</PageWrapper> </PageWrapper>
<Swap /> <Swap />
</> </Trace>
) )
} }
yarn.lock
View file @ f9f804c3
...@@ -4190,10 +4190,10 @@ ...@@ -4190,10 +4190,10 @@
"@typescript-eslint/types" "4.33.0" "@typescript-eslint/types" "4.33.0"
eslint-visitor-keys "^2.0.0" eslint-visitor-keys "^2.0.0"
"@uniswap/analytics-events@1.1.0": "@uniswap/analytics-events@1.2.0":
version "1.1.0" version "1.2.0"
resolved "https://registry.yarnpkg.com/@uniswap/analytics-events/-/analytics-events-1.1.0.tgz#459236d86f864039c3931d21ba80f41575d2ce4e" resolved "https://registry.yarnpkg.com/@uniswap/analytics-events/-/analytics-events-1.2.0.tgz#9a509cd782dcf170b3b7cf1207126ee197658cc5"
integrity sha512-ZJ99dLhJ4q2c0g0PoMxDPbeC010DrdIBLf7jnUsTf/hYm2LfHryr31Sv204xNO7rWVWHi1dk6jdab8DdBnHgPA== integrity sha512-CGvvG6jiGx/ez5rJqWavAV3CDlecX2ZR7oBl1mMYVSnzXv9GsoleeiZAYcETJvEt2hKhmEq0tg7xjwP0pMav9A==
"@uniswap/analytics@1.2.0": "@uniswap/analytics@1.2.0":
version "1.2.0" version "1.2.0"
...@@ -4329,7 +4329,7 @@ ...@@ -4329,7 +4329,7 @@
resolved "https://registry.yarnpkg.com/@uniswap/token-lists/-/token-lists-1.0.0-beta.30.tgz#2103ca23b8007c59ec71718d34cdc97861c409e5" resolved "https://registry.yarnpkg.com/@uniswap/token-lists/-/token-lists-1.0.0-beta.30.tgz#2103ca23b8007c59ec71718d34cdc97861c409e5"
integrity sha512-HwY2VvkQ8lNR6ks5NqQfAtg+4IZqz3KV1T8d2DlI8emIn9uMmaoFbIOg0nzjqAVKKnZSbMTRRtUoAh6mmjRvog== integrity sha512-HwY2VvkQ8lNR6ks5NqQfAtg+4IZqz3KV1T8d2DlI8emIn9uMmaoFbIOg0nzjqAVKKnZSbMTRRtUoAh6mmjRvog==
"@uniswap/universal-router-sdk@^1.2.1", "@uniswap/universal-router-sdk@1.2.2": "@uniswap/universal-router-sdk@1.2.2", "@uniswap/universal-router-sdk@^1.2.1":
version "1.2.2" version "1.2.2"
resolved "https://registry.yarnpkg.com/@uniswap/universal-router-sdk/-/universal-router-sdk-1.2.2.tgz#26ece606279d1cd9823277b74cd43575caf160e9" resolved "https://registry.yarnpkg.com/@uniswap/universal-router-sdk/-/universal-router-sdk-1.2.2.tgz#26ece606279d1cd9823277b74cd43575caf160e9"
integrity sha512-L+MkvMiLyG1vfpEoLbe9xquSApSrfe1m0iLuIjgkZ4qR2Kb0NU8nZXNqeyTJmTZhNbYYIJA0AwRawAN+90NKIw== integrity sha512-L+MkvMiLyG1vfpEoLbe9xquSApSrfe1m0iLuIjgkZ4qR2Kb0NU8nZXNqeyTJmTZhNbYYIJA0AwRawAN+90NKIw==
......
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