feat: ✨🤑 Portfolios 🖼✨ (Uniswap#6216)

* feat: squash mgtm differences w/ public repo into new base commit to fix rebase issues going forward

* feat: new settings menu (Uniswap#85)

* feat: new settings flow

* feat: add statsig geo gate for MGTM assets (Uniswap#91)

* init
* feat: geo-gate mgtm features & wallet tab

* feat: new theme toggle (Uniswap#86)

* feat: new theme toggle

* fix: import

* refactor: polish

* refactor: use enum instead of string union

* feat: mini portfolio tabs (Uniswap#88)

* feat: mini portfolio tabs

* feat: feature flag

* feat: portfolio query (Uniswap#89)

* feat: portfolio balance query

* polish

* fix: added todo for api key

* feat: tokens mini-portfolio tab (Uniswap#93)

* feat: tokens tab

* fix: lint

* fix: pr comment polish

* fix: snapshot update

* feat: common portfolio row component (Uniswap#99)

* feat: porfolio row component

* fix: updated layout

* feat: update token row design (Uniswap#100)

* feat: porfolio row component

* fix: updated layout

* fix: updated tokens tab to latest design

* fix: unnused export

* feat: dropdown drawer (Uniswap#95)

* inital drawer

* feat: animated drawer

* fix: attempt animation perf fix

* fix: lint

* feat: better animations

* fix: scrim

* refactor: const name

* test: update chain switcher test

* test: update chain switcher test id

* feat: Add NFT tab for mini porftolio (Uniswap#104)

* add NFT tab

* add min width to verified icon size

* add keyArgs to nftBalances query so that different callers dont override query cache

* revert yarn node changes

* use flex shrink

* move styled components to top

* navigate to nft page

* update snapshot test after adding gap to Row

* Update src/components/WalletDropdown/MiniPortfolio/NFT.tsx

Co-authored-by: cartcrom <[email protected]>

---------

Co-authored-by: cartcrom <[email protected]>

* fix scroll behavior (Uniswap#105)

* feat: portfolio loading state (Uniswap#106)

* feat: loading state for token row

* fix: revert hardcoded loading states

* fix: removed unused component

* feat: activity feed tab (Uniswap#103)

* init

* feat: ens avatars

* feat: etherscan api experiment

* fix: ignore error policy

* polish

* fix: query pageSize

* fix: revert redux change

* fix: small polish item

* fix: pr comments

* fix: translated activity titles

* fix: typing and todo comment

* todo comment

* fix: accidental chain name mismatch

* feat: remove dropdown chevron (Uniswap#110)

* feat: small drawer UI updates (Uniswap#109)

* feat: small changes

* fix: resize status icon w/ ens

* fix: commented css

* feat: activity loading state (Uniswap#108)

* feat: activity loading state

* fix: unused wrapper

* fix: activity/nftbalance cache overlap

* fix: mp sidebar width adjustment (Uniswap#112)

* fix: mp sidebar width adjustment

* fix: navbar breakpoints

* feat: nav bar MenuDropdown updates (Uniswap#107)

* feat: nav bar MenuDropdown updates

* fix: pool breakpoints

* fix: pool in menu dropdown

* fix: lints

* fix: tests

* feat: swap click updates (Uniswap#111)

* feat: swap click updates

* fix: updates

* fix: simplify

* fix: snapshots

* fix: snapshots

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* fix: MP scrollbar (Uniswap#115)

* feat: hide small balances in token list (Uniswap#116)

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* chore: merge

* fix: updates

* feat: show the hidden tokens at the bottom

* feat: empty balance state for tokens (Uniswap#118)

* feat: empty balance state for tokens

* fix: balance change check

* fix: token inputs on TDP widget (Uniswap#120)

* feat: remove quick swap button (Uniswap#125)

* fix: nft activity descriptor (Uniswap#119)

* fix: improper substring usage error

* pr comments + small fix

* feat: add mini portfolio events (Uniswap#126)

* add events

* fix failing snapshot test

* incorporate eddie comment

* fix chain switching (Uniswap#127)

* feat: pre-parse activity to catch errors (Uniswap#129)

* feat: update wallet option icons (Uniswap#128)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* feat: uni icons avatars (Uniswap#130)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* feat: update avatar / icon logic

* fix: remove testing hardcoded socks balance

* fix: add isTrustWallet check

* feat: pools tab (Uniswap#122)

* init

* feat: working cross-chain calls

* feat: inline range text

* feat: better multicall perf

* feat: loading state

* feat: pools persist between mounts

* feat: polish

* fix: small refactors

* remove stuff to split into sep pr

* fix: remove comment

* fix: judo PR comments

* fix: currencyKey case

* fix: eddie's comment

* fix (Uniswap#134)

* feat: removed microsite content, updated responsiveness for wallet tab (Uniswap#137)

* fix: injector unit tests (Uniswap#136)

* fix: injector unit tests

* fix: lint

---------

Co-authored-by: cartcrom <[email protected]>

* feat: toggle closed positions (Uniswap#138)

* rename file

* refactored hidden row to use for closed positions

* fix: remove unnused atom

* fix: lint

* feat: MP tab empty states (Uniswap#132)

* feat: squash mgtm differences w/ public repo into new base commit to fix rebase issues going forward

* feat: new settings menu (Uniswap#85)

* feat: new settings flow

* feat: add statsig geo gate for MGTM assets (Uniswap#91)

* init
* feat: geo-gate mgtm features & wallet tab

* feat: new theme toggle (Uniswap#86)

* feat: new theme toggle

* fix: import

* refactor: polish

* refactor: use enum instead of string union

* feat: mini portfolio tabs (Uniswap#88)

* feat: mini portfolio tabs

* feat: feature flag

* feat: portfolio query (Uniswap#89)

* feat: portfolio balance query

* polish

* fix: added todo for api key

* feat: tokens mini-portfolio tab (Uniswap#93)

* feat: tokens tab

* fix: lint

* fix: pr comment polish

* fix: snapshot update

* feat: common portfolio row component (Uniswap#99)

* feat: porfolio row component

* fix: updated layout

* feat: update token row design (Uniswap#100)

* feat: porfolio row component

* fix: updated layout

* fix: updated tokens tab to latest design

* fix: unnused export

* feat: dropdown drawer (Uniswap#95)

* inital drawer

* feat: animated drawer

* fix: attempt animation perf fix

* fix: lint

* feat: better animations

* fix: scrim

* refactor: const name

* test: update chain switcher test

* test: update chain switcher test id

* feat: Add NFT tab for mini porftolio (Uniswap#104)

* add NFT tab

* add min width to verified icon size

* add keyArgs to nftBalances query so that different callers dont override query cache

* revert yarn node changes

* use flex shrink

* move styled components to top

* navigate to nft page

* update snapshot test after adding gap to Row

* Update src/components/WalletDropdown/MiniPortfolio/NFT.tsx

Co-authored-by: cartcrom <[email protected]>

---------

Co-authored-by: cartcrom <[email protected]>

* fix scroll behavior (Uniswap#105)

* feat: portfolio loading state (Uniswap#106)

* feat: loading state for token row

* fix: revert hardcoded loading states

* fix: removed unused component

* feat: activity feed tab (Uniswap#103)

* init

* feat: ens avatars

* feat: etherscan api experiment

* fix: ignore error policy

* polish

* fix: query pageSize

* fix: revert redux change

* fix: small polish item

* fix: pr comments

* fix: translated activity titles

* fix: typing and todo comment

* todo comment

* fix: accidental chain name mismatch

* feat: remove dropdown chevron (Uniswap#110)

* feat: small drawer UI updates (Uniswap#109)

* feat: small changes

* fix: resize status icon w/ ens

* fix: commented css

* init

* feat: working cross-chain calls

* feat: inline range text

* feat: better multicall perf

* feat: activity loading state (Uniswap#108)

* feat: activity loading state

* fix: unused wrapper

* feat: loading state

* feat: pools persist between mounts

* fix: activity/nftbalance cache overlap

* fix: mp sidebar width adjustment (Uniswap#112)

* fix: mp sidebar width adjustment

* fix: navbar breakpoints

* feat: nav bar MenuDropdown updates (Uniswap#107)

* feat: nav bar MenuDropdown updates

* fix: pool breakpoints

* fix: pool in menu dropdown

* fix: lints

* fix: tests

* feat: swap click updates (Uniswap#111)

* feat: swap click updates

* fix: updates

* fix: simplify

* fix: snapshots

* fix: snapshots

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* fix: MP scrollbar (Uniswap#115)

* feat: hide small balances in token list (Uniswap#116)

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* chore: merge

* fix: updates

* feat: show the hidden tokens at the bottom

* feat: empty balance state for tokens (Uniswap#118)

* feat: empty balance state for tokens

* fix: balance change check

* fix: token inputs on TDP widget (Uniswap#120)

* feat: polish

* fix: small refactors

* remove stuff to split into sep pr

* fix: remove comment

* feat: remove quick swap button (Uniswap#125)

* fix: nft activity descriptor (Uniswap#119)

* fix: improper substring usage error

* pr comments + small fix

* feat: add mini portfolio events (Uniswap#126)

* add events

* fix failing snapshot test

* incorporate eddie comment

* fix chain switching (Uniswap#127)

* feat: pre-parse activity to catch errors (Uniswap#129)

* fix: activity/nftbalance cache overlap

* fix: mp sidebar width adjustment (Uniswap#112)

* fix: mp sidebar width adjustment

* fix: navbar breakpoints

* feat: nav bar MenuDropdown updates (Uniswap#107)

* feat: nav bar MenuDropdown updates

* fix: pool breakpoints

* fix: pool in menu dropdown

* fix: lints

* fix: tests

* feat: swap click updates (Uniswap#111)

* feat: swap click updates

* fix: updates

* fix: simplify

* fix: snapshots

* fix: snapshots

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* fix: MP scrollbar (Uniswap#115)

* feat: hide small balances in token list (Uniswap#116)

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* chore: merge

* fix: updates

* feat: show the hidden tokens at the bottom

* feat: empty balance state for tokens (Uniswap#118)

* feat: empty balance state for tokens

* fix: balance change check

* fix: token inputs on TDP widget (Uniswap#120)

* feat: remove quick swap button (Uniswap#125)

* fix: nft activity descriptor (Uniswap#119)

* fix: improper substring usage error

* pr comments + small fix

* feat: add mini portfolio events (Uniswap#126)

* add events

* fix failing snapshot test

* incorporate eddie comment

* fix chain switching (Uniswap#127)

* feat: pre-parse activity to catch errors (Uniswap#129)

* feat: start empty state updates

* feat: update wallet option icons (Uniswap#128)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* feat: empty wallet states w/ good positioning

* feat: finish empty states w/ theme aware icons

* fix: judo PR comments

* fix: currencyKey case

* feat: uni icons avatars (Uniswap#130)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* feat: update avatar / icon logic

* fix: remove testing hardcoded socks balance

* fix: add isTrustWallet check

* fix: eddie's comment

* feat: pools tab (Uniswap#122)

* init

* feat: working cross-chain calls

* feat: inline range text

* feat: better multicall perf

* feat: loading state

* feat: pools persist between mounts

* feat: polish

* fix: small refactors

* remove stuff to split into sep pr

* fix: remove comment

* fix: judo PR comments

* fix: currencyKey case

* fix: eddie's comment

* fix (Uniswap#134)

* feat: removed microsite content, updated responsiveness for wallet tab (Uniswap#137)

* fix: injector unit tests (Uniswap#136)

* fix: injector unit tests

* fix: lint

---------

Co-authored-by: cartcrom <[email protected]>

* fix: pool loading state

* fix: simplify pools loading state

* fix: removed unused var

* feat: toggle closed positions (Uniswap#138)

* rename file

* refactored hidden row to use for closed positions

* fix: remove unnused atom

* fix: lint

* fix: dry

* fix: lint

* fix: address review comments

* fix: lints

* fix: bad merge

---------

Co-authored-by: cartcrom <[email protected]>
Co-authored-by: cartcrom <[email protected]>
Co-authored-by: Tina <[email protected]>
Co-authored-by: lynn <[email protected]>

* make sure mp is above tax service banner (Uniswap#142)

* feat: add git version number to settings menu (Uniswap#141)

* fix: remove unicon tooltip (Uniswap#146)

* feat: remove unicon tooltip from mobile and timer prop

* fix: flip bool logic

* fix: small nits for mp from fred (Uniswap#150)

* fixes

* fix

* feat: Local tx activity (Uniswap#148)

* local swap working

* feat: cross-chain

* fix: revert query changes

* feat: local approvals

* feat: wrapped activity

* feat: local lp tx history

* fix: add doc comment

* fix: linted

* fix: no pools render error (Uniswap#152)

* feat: mp activity feed design tweaks  (Uniswap#145)

* feat: squash mgtm differences w/ public repo into new base commit to fix rebase issues going forward

* feat: new settings menu (Uniswap#85)

* feat: new settings flow

* feat: add statsig geo gate for MGTM assets (Uniswap#91)

* init
* feat: geo-gate mgtm features & wallet tab

* feat: new theme toggle (Uniswap#86)

* feat: new theme toggle

* fix: import

* refactor: polish

* refactor: use enum instead of string union

* feat: mini portfolio tabs (Uniswap#88)

* feat: mini portfolio tabs

* feat: feature flag

* feat: portfolio query (Uniswap#89)

* feat: portfolio balance query

* polish

* fix: added todo for api key

* feat: tokens mini-portfolio tab (Uniswap#93)

* feat: tokens tab

* fix: lint

* fix: pr comment polish

* fix: snapshot update

* feat: common portfolio row component (Uniswap#99)

* feat: porfolio row component

* fix: updated layout

* feat: update token row design (Uniswap#100)

* feat: porfolio row component

* fix: updated layout

* fix: updated tokens tab to latest design

* fix: unnused export

* feat: dropdown drawer (Uniswap#95)

* inital drawer

* feat: animated drawer

* fix: attempt animation perf fix

* fix: lint

* feat: better animations

* fix: scrim

* refactor: const name

* test: update chain switcher test

* test: update chain switcher test id

* feat: Add NFT tab for mini porftolio (Uniswap#104)

* add NFT tab

* add min width to verified icon size

* add keyArgs to nftBalances query so that different callers dont override query cache

* revert yarn node changes

* use flex shrink

* move styled components to top

* navigate to nft page

* update snapshot test after adding gap to Row

* Update src/components/WalletDropdown/MiniPortfolio/NFT.tsx

Co-authored-by: cartcrom <[email protected]>

---------

Co-authored-by: cartcrom <[email protected]>

* fix scroll behavior (Uniswap#105)

* feat: portfolio loading state (Uniswap#106)

* feat: loading state for token row

* fix: revert hardcoded loading states

* fix: removed unused component

* feat: activity feed tab (Uniswap#103)

* init

* feat: ens avatars

* feat: etherscan api experiment

* fix: ignore error policy

* polish

* fix: query pageSize

* fix: revert redux change

* fix: small polish item

* fix: pr comments

* fix: translated activity titles

* fix: typing and todo comment

* todo comment

* fix: accidental chain name mismatch

* feat: remove dropdown chevron (Uniswap#110)

* feat: small drawer UI updates (Uniswap#109)

* feat: small changes

* fix: resize status icon w/ ens

* fix: commented css

* feat: activity loading state (Uniswap#108)

* feat: activity loading state

* fix: unused wrapper

* fix: activity/nftbalance cache overlap

* fix: mp sidebar width adjustment (Uniswap#112)

* fix: mp sidebar width adjustment

* fix: navbar breakpoints

* feat: nav bar MenuDropdown updates (Uniswap#107)

* feat: nav bar MenuDropdown updates

* fix: pool breakpoints

* fix: pool in menu dropdown

* fix: lints

* fix: tests

* feat: swap click updates (Uniswap#111)

* feat: swap click updates

* fix: updates

* fix: simplify

* fix: snapshots

* fix: snapshots

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* fix: MP scrollbar (Uniswap#115)

* feat: hide small balances in token list (Uniswap#116)

* feat: collapse button (Uniswap#113)

* feat: collapse button

* fix: esc keypress and animation

* chore: merge

* fix: updates

* feat: show the hidden tokens at the bottom

* feat: empty balance state for tokens (Uniswap#118)

* feat: empty balance state for tokens

* fix: balance change check

* fix: token inputs on TDP widget (Uniswap#120)

* feat: remove quick swap button (Uniswap#125)

* fix: nft activity descriptor (Uniswap#119)

* fix: improper substring usage error

* pr comments + small fix

* feat: add mini portfolio events (Uniswap#126)

* add events

* fix failing snapshot test

* incorporate eddie comment

* fix chain switching (Uniswap#127)

* feat: pre-parse activity to catch errors (Uniswap#129)

* feat: update wallet option icons (Uniswap#128)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* wip

* feat: uni icons avatars (Uniswap#130)

* feat: update wallet option icons

* feat: theme-aware injected logo, svg logos

* fix: rabby extension

* feat: update avatar / icon logic

* fix: remove testing hardcoded socks balance

* fix: add isTrustWallet check

* feat: pools tab (Uniswap#122)

* init

* feat: working cross-chain calls

* feat: inline range text

* feat: better multicall perf

* feat: loading state

* feat: pools persist between mounts

* feat: polish

* fix: small refactors

* remove stuff to split into sep pr

* fix: remove comment

* fix: judo PR comments

* fix: currencyKey case

* fix: eddie's comment

* fix (Uniswap#134)

* wip with activity status icons

* feat: removed microsite content, updated responsiveness for wallet tab (Uniswap#137)

* fix: injector unit tests (Uniswap#136)

* fix: injector unit tests

* fix: lint

---------

Co-authored-by: cartcrom <[email protected]>

* temp

* in progress

* text, and activity status changes working. missing logo changes

* fix lint issues

* refactor: square logo location

* feat: merge other activity changes

---------

Co-authored-by: cartcrom <[email protected]>
Co-authored-by: cartcrom <[email protected]>
Co-authored-by: Tina <[email protected]>
Co-authored-by: eddie <[email protected]>

* feat: portfolio polling/refetching/performance (Uniswap#154)

* init

* feat: implement asset polling & tx updating balances

* add refetching to activity tab

* fix: re-add error policy

* fix: add TODO

* fix: fix scroll + console warnings on mini portfolio nfts (Uniswap#155)

* fixes

* rename

* init (Uniswap#158)

* fix: browser wallet icons (Uniswap#156)

* fix: moved border radius css (Uniswap#157)

* feat: token details state for BNB (Uniswap#151)

* fix: update token details missing flow

* refactor

* fix: lint

* fix: add bnb to queries

* feat: add comment explaining unsupported chains

* fix: remove buy crypto animation (Uniswap#160)

* fix: price display pools tab (Uniswap#159)

* fix: price display pools tab

* fix: lint

* feat: pools tab performance (Uniswap#123)

* init

* fix: pr comments

* update cache return type

* refactor: rename type

* fix: further pr comments

* fix: remove stringify

* refactor: readability and caching

* fix: zach pr comments

* fix: removed hardcoded value

* feat: catch position errors for chains

* fix: add todo comment for followup ticket

* fix: build issue from merge conflict

* refactor: split up token caching function

* feat: separate array slicing into util with tests

* feat: close wallet drawer on wallet connection (Uniswap#161)

* feat: close wallet drawer on wallet connection

* feat: added comment explaining fetchPolicy

* fix: only close if open

* refactor: add comment about ref

* fix: revert change to useAllTokens & rename with more descriptive name (Uniswap#163)

* fix: square Arbitrum logo design changes  (Uniswap#162)

* feat: close wallet drawer on wallet connection

* feat: added comment explaining fetchPolicy

* fix: only close if open

* init

* fixes

* fix border radius

---------

Co-authored-by: cartcrom <[email protected]>

* fix: token loading state (Uniswap#165)

* fix: remove unnused code and comments

* fix: privacy policy date

* fix: revert readme change

* fix: remove unnused FOR file

* fix: missed query id

* fix: add id to portfolios query

* fix: widget cypress test

---------

Co-authored-by: Tina <[email protected]>
Co-authored-by: eddie <[email protected]>
Co-authored-by: lynn <[email protected]>

cypress/e2e/landing.test.ts

@@ -25,6 +25,7 @@ describe('Landing Page', () => {
   })
 
   it('allows navigation to pool', () => {
+    cy.viewport(2000, 1600)
     cy.get(getTestSelector('pool-nav-link')).first().click()
     cy.url().should('include', '/pools')
   })

cypress/e2e/link.test.ts

@@ -1,6 +1,7 @@
 // see https://github.com/Uniswap/interface/pull/4115
 describe('Link', () => {
   it('should update route', () => {
+    cy.viewport(2000, 1600)
     cy.visit('/')
     cy.contains('Pool').click()
     cy.get('[data-cy="join-pool-button"]').should('exist')

cypress/e2e/swap-widget.cy.ts

@@ -17,7 +17,7 @@ describe('swap widget integration tests', () => {
     // open token selector...
     cy.contains('Select token').click()
     // select token...
-    cy.contains(outputText).click()
+    cy.contains(outputText).click({ force: true })
 
     cy.get('body')
       .then(($body) => {

cypress/e2e/token-explore.test.ts

@@ -69,6 +69,6 @@ describe('Token explore', () => {
     cy.get(getTestSelector('tokens-network-filter-selected')).should('contain', 'Optimism')
     cy.reload()
     cy.get(getTestSelector('tokens-network-filter-selected')).should('contain', 'Optimism')
-    cy.get(getTestSelector('chain-selector')).last().should('contain', 'Ethereum')
+    cy.get(getTestSelector('chain-selector-logo')).invoke('attr', 'alt').should('eq', 'Ethereum')
   })
 })

cypress/e2e/wallet-dropdown.test.ts

@@ -1,51 +1,80 @@
 import { getTestSelector } from '../utils'
 
+function visit(darkMode: boolean) {
+  cy.visit('/swap', {
+    onBeforeLoad(win) {
+      cy.stub(win, 'matchMedia')
+        .withArgs('(prefers-color-scheme: dark)')
+        .returns({
+          matches: darkMode,
+          addEventListener() {
+            // do nothing
+          },
+        })
+    },
+  })
+}
+
 describe('Wallet Dropdown', () => {
   before(() => {
     cy.visit('/pools')
   })
 
   it('should change the theme', () => {
     cy.get(getTestSelector('web3-status-connected')).click()
-    cy.get(getTestSelector('wallet-select-theme')).click()
-    cy.get(getTestSelector('wallet-select-theme')).contains('Light theme').should('exist')
+    cy.get(getTestSelector('wallet-settings')).click()
+    cy.get(getTestSelector('theme-lightmode')).click()
+
+    cy.get(getTestSelector('theme-lightmode')).should('not.have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-darkmode')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-auto')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+
+    cy.get(getTestSelector('theme-darkmode')).click()
+    cy.get(getTestSelector('theme-lightmode')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-darkmode')).should('not.have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-auto')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+
+    cy.get(getTestSelector('theme-auto')).click()
+    cy.get(getTestSelector('theme-lightmode')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-darkmode')).should('have.css', 'background-color', 'rgba(0, 0, 0, 0)')
+    cy.get(getTestSelector('theme-auto')).should('not.have.css', 'background-color', 'rgba(0, 0, 0, 0)')
   })
 
   it('should select a language', () => {
-    cy.get(getTestSelector('wallet-select-language')).click()
     cy.get(getTestSelector('wallet-language-item')).contains('Deutsch').click({ force: true })
     cy.get(getTestSelector('wallet-header')).should('contain', 'Sprache')
     cy.get(getTestSelector('wallet-language-item')).contains('English').click({ force: true })
     cy.get(getTestSelector('wallet-header')).should('contain', 'Language')
     cy.get(getTestSelector('wallet-back')).click()
   })
 
-  it('should be able to view transactions', () => {
-    cy.get(getTestSelector('wallet-transactions')).click()
-    cy.get(getTestSelector('wallet-empty-transaction-text')).should('exist')
-    cy.get(getTestSelector('wallet-back')).click()
-  })
-
   it('should change the theme when not connected', () => {
     cy.get(getTestSelector('wallet-disconnect')).click()
-    cy.get(getTestSelector('wallet-select-theme')).click()
-    cy.get(getTestSelector('wallet-select-theme')).contains('Dark theme').should('exist')
-    cy.get(getTestSelector('wallet-select-theme')).click()
-    cy.get(getTestSelector('wallet-select-theme')).contains('Light theme').should('exist')
+    cy.get(getTestSelector('wallet-settings')).click()
+    cy.get(getTestSelector('theme-lightmode')).should('exist')
   })
 
   it('should select a language when not connected', () => {
-    cy.get(getTestSelector('wallet-select-language')).click()
     cy.get(getTestSelector('wallet-language-item')).contains('Deutsch').click({ force: true })
     cy.get(getTestSelector('wallet-header')).should('contain', 'Sprache')
     cy.get(getTestSelector('wallet-language-item')).contains('English').click({ force: true })
     cy.get(getTestSelector('wallet-header')).should('contain', 'Language')
     cy.get(getTestSelector('wallet-back')).click()
   })
 
-  it('should open the wallet connect modal from the drop down when not connected', () => {
-    cy.get(getTestSelector('wallet-connect-wallet')).click()
-    cy.get(getTestSelector('wallet-modal')).should('exist')
-    cy.get(getTestSelector('wallet-modal-close')).click()
+  it('should properly use dark system theme when auto theme setting is selected', () => {
+    visit(true)
+    cy.get(getTestSelector('web3-status-connected')).click()
+    cy.get(getTestSelector('wallet-settings')).click()
+    cy.get(getTestSelector('theme-auto')).click()
+    cy.get(getTestSelector('wallet-header')).should('have.css', 'color', 'rgb(152, 161, 192)')
+  })
+
+  it('should properly use light system theme when auto theme setting is selected', () => {
+    visit(false)
+    cy.get(getTestSelector('web3-status-connected')).click()
+    cy.get(getTestSelector('wallet-settings')).click()
+    cy.get(getTestSelector('theme-auto')).click()
+    cy.get(getTestSelector('wallet-header')).should('have.css', 'color', 'rgb(119, 128, 160)')
   })
 })

package.json

@@ -136,7 +136,7 @@
     "@sentry/tracing": "^7.40.0",
     "@types/react-window-infinite-loader": "^1.0.6",
     "@uniswap/analytics": "^1.3.1",
-    "@uniswap/analytics-events": "^2.6.0",
+    "@uniswap/analytics-events": "^2.7.0",
     "@uniswap/conedison": "^1.4.0",
     "@uniswap/governance": "^1.0.2",
     "@uniswap/liquidity-staker": "^1.0.2",
@@ -201,6 +201,7 @@
     "polished": "^3.3.2",
     "polyfill-object.fromentries": "^1.0.1",
     "popper-max-size-modifier": "^0.2.0",
+    "qrcode.react": "^3.1.0",
     "qs": "^6.9.4",
     "rc-slider": "^10.0.1",
     "react": "^18.2.0",