fix: learn more url [prod] (#7482)

* fix: learn more url

* fix: snapshots

---------

Co-authored-by: charity-sock-pacifist <interface-github@example.com>

.env

@@ -4,9 +4,8 @@ REACT_APP_AMPLITUDE_PROXY_URL="https://api.uniswap.org/v1/amplitude-proxy"
 REACT_APP_AWS_API_REGION="us-east-2"
 REACT_APP_AWS_API_ENDPOINT="https://beta.api.uniswap.org/v1/graphql"
 REACT_APP_BNB_RPC_URL="https://rough-sleek-hill.bsc.quiknode.pro/413cc98cbc776cda8fdf1d0f47003583ff73d9bf"
-REACT_APP_BASE_GOERLI_RPC_URL="https://wiser-compatible-mansion.base-goerli.quiknode.pro/5874f36248e17020a1006149e7f68c63967e1f45/"
-REACT_APP_BASE_MAINNET_RPC_URL="https://cool-white-diagram.base-mainnet.quiknode.pro/d8f036f35dfab2c68f32dfa822cd971e7a25a117/"
 REACT_APP_INFURA_KEY="4bf032f2d38a4ed6bb975b80d6340847"
+REACT_APP_QUICKNODE_MAINNET_RPC_URL="https://magical-alien-tab.quiknode.pro/669e87e569a8277d3fbd9e202f9df93189f19f4c"
 REACT_APP_MOONPAY_API="https://api.moonpay.com"
 REACT_APP_MOONPAY_LINK="https://us-central1-uniswap-mobile.cloudfunctions.net/signMoonpayLinkV2?platform=web&env=staging"
 REACT_APP_MOONPAY_PUBLISHABLE_KEY="pk_test_DycfESRid31UaSxhI5yWKe1r5E5kKSz"

.env.production

@@ -12,4 +12,5 @@ REACT_APP_MOONPAY_PUBLISHABLE_KEY="pk_live_uQG4BJC4w3cxnqpcSqAfohdBFDTsY6E"
 REACT_APP_SENTRY_ENABLED=true
 REACT_APP_SENTRY_TRACES_SAMPLE_RATE=0.00003
 REACT_APP_STATSIG_PROXY_URL="https://api.uniswap.org/v1/statsig-proxy"
-THE_GRAPH_SCHEMA_ENDPOINT="https://api.thegraph.com/subgraphs/name/uniswap/uniswap-v3"
+REACT_APP_QUICKNODE_MAINNET_RPC_URL="https://ultra-blue-flower.quiknode.pro/770b22d5f362c537bc8fe19b034c45b22958f880"
+THE_GRAPH_SCHEMA_ENDPOINT="https://api.thegraph.com/subgraphs/name/uniswap/uniswap-v3?source=uniswap"

.eslintrc.js

@@ -28,7 +28,20 @@ module.exports = {
     {
       files: ['**/*.ts', '**/*.tsx'],
       rules: {
-        '@typescript-eslint/no-restricted-imports': ['error', restrictedImports],
+        '@typescript-eslint/no-restricted-imports': [
+          'error',
+          {
+            ...restrictedImports,
+            paths: [
+              ...restrictedImports.paths,
+              {
+                name: '@uniswap/smart-order-router',
+                message: 'Only import types, unless you are in the client-side SOR, to preserve lazy-loading.',
+                allowTypeImports: true,
+              },
+            ],
+          },
+        ],
         'import/no-restricted-paths': [
           'error',
           {
@@ -57,6 +70,13 @@ module.exports = {
             ],
           },
         ],
+        'no-restricted-syntax': [
+          'error',
+          {
+            selector: ':matches(ExportAllDeclaration)',
+            message: 'Barrel exports bloat the bundle size by preventing tree-shaking.',
+          },
+        ],
       },
     },
     {

.github/CODEOWNERS

@@ -1 +1 @@
-@uniswap/web-admins
+* @uniswap/web-reviewers

.github/workflows/1-main-to-staging.yml

@@ -64,7 +64,7 @@ jobs:
 
       - name: Add CODEOWNERS
         run: |
-          echo '@uniswap/web-admins' > CODEOWNERS
+          echo '* @uniswap/web-admins' > CODEOWNERS
           git add CODEOWNERS
           git commit -m 'ci: add global CODEOWNERS'
 

.github/workflows/test.yml

@@ -11,6 +11,7 @@ on:
       - main
       - releases/staging
   pull_request:
+  workflow_dispatch:
 
 jobs:
   lint:
@@ -224,8 +225,9 @@ jobs:
           path: node_modules/.cache
           key: ${{ runner.os }}-cloud-jest-${{ github.run_id }}
           restore-keys: ${{ runner.os }}-cloud-jest-
-      # Only use 1 worker, so the other can be used for the proxy server under test.
-      - run: yarn test:cloud --coverage --maxWorkers=1
+      # Ignore start:cloud output so it doesn't flood the test output.
+      # Only use 1 worker for testing, as the other is used to run start:cloud (the proxy server under test).
+      - run: yarn start-server-and-test 'yarn start:cloud >/dev/null' 3000 'yarn test:cloud --coverage --maxWorkers=1'
       - uses: codecov/codecov-action@v3
         with:
           token: ${{ secrets.CODECOV_TOKEN }}
@@ -251,7 +253,7 @@ jobs:
 
   post:
     if: ${{ github.ref_name == 'main' || github.ref_name == 'releases/staging' }}
-    needs: [pre, lint, typecheck, deps-tests, unit-tests, cypress-test-matrix]
+    needs: [pre, lint, typecheck, deps-tests, unit-tests, cypress-test-matrix, cloud-tests]
     runs-on: ubuntu-latest
     steps:
       - uses: actions/github-script@v6.4.1
@@ -272,4 +274,5 @@ jobs:
             ${{ needs.typecheck.result == 'success' }} &&
             ${{ needs.deps-tests.result == 'success' }} &&
             ${{ needs.unit-tests.result == 'success' }} &&
-            ${{ needs.cypress-test-matrix.result == 'success' }}
+            ${{ needs.cypress-test-matrix.result == 'success' }} &&
+            ${{ needs.cloud-tests.result == 'success' }}

CODEOWNERS

@@ -0,0 +1 @@
+* @uniswap/web-admins

README.md

@@ -69,10 +69,10 @@ Other things to note:
 
 The Uniswap Interface supports swapping, adding liquidity, removing liquidity and migrating liquidity for Uniswap protocol V2.
 
-- Swap on Uniswap V2: <https://app.uniswap.org/#/swap?use=v2>
-- View V2 liquidity: <https://app.uniswap.org/#/pools/v2>
-- Add V2 liquidity: <https://app.uniswap.org/#/add/v2>
-- Migrate V2 liquidity to V3: <https://app.uniswap.org/#/migrate/v2>
+- Swap on Uniswap V2: <https://app.uniswap.org/swap?use=v2>
+- View V2 liquidity: <https://app.uniswap.org/pools/v2>
+- Add V2 liquidity: <https://app.uniswap.org/add/v2>
+- Migrate V2 liquidity to V3: <https://app.uniswap.org/migrate/v2>
 
 ## Accessing Uniswap V1
 

codecov.yml

@@ -9,6 +9,7 @@ ignore:
   - "**/styled.tsx"
   - "**/constants/**/*"
   - "constants/**/*"
+  - "src/dev/*"
 
 coverage:
   status:

codegen.yml

@@ -1,5 +1,5 @@
 overrideExisting: true
-schema: 'https://api.thegraph.com/subgraphs/name/uniswap/uniswap-v3'
+schema: 'https://api.thegraph.com/subgraphs/name/uniswap/uniswap-v3?source=uniswap'
 generates:
   ./src/graphql/thegraph/schema/schema.graphql:
     plugins:

craco.config.cjs

@@ -5,7 +5,6 @@ const { execSync } = require('child_process')
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const path = require('path')
 const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin')
-const TerserPlugin = require('terser-webpack-plugin')
 const { IgnorePlugin, ProvidePlugin } = require('webpack')
 const { RetryChunkLoadPlugin } = require('webpack-retry-chunk-load-plugin')
 
@@ -131,6 +130,12 @@ module.exports = {
         },
       })
 
+      // Retain source maps for node_modules packages:
+      webpackConfig.module.rules[0] = {
+        ...webpackConfig.module.rules[0],
+        exclude: /node_modules/,
+      }
+
       // Configure webpack transpilation (create-react-app specifies transpilation rules in a oneOf):
       webpackConfig.module.rules[1].oneOf = webpackConfig.module.rules[1].oneOf.map((rule) => {
         if (rule.loader && rule.loader.match(/babel-loader/)) {
@@ -140,18 +145,20 @@ module.exports = {
         return rule
       })
 
+      // Run terser compression on node_modules before tree-shaking, so that tree-shaking is more effective.
+      // This works by eliminating dead code, so that webpack can identify unused imports and tree-shake them;
+      // it is only necessary for node_modules - it is done through linting for our own source code -
+      // see https://medium.com/engineering-housing/dead-code-elimination-and-tree-shaking-at-housing-part-1-307a94b30f23#7e03:
+      webpackConfig.module.rules.push({
+        enforce: 'post',
+        test: /node_modules.*\.(js)$/,
+        loader: path.join(__dirname, 'scripts/terser-loader.js'),
+        options: { compress: true, mangle: false },
+      })
+
       // Configure webpack optimization:
       webpackConfig.optimization = Object.assign(
         webpackConfig.optimization,
-        {
-          minimize: isProduction,
-          minimizer: [
-            new TerserPlugin({
-              minify: TerserPlugin.swcMinify,
-              parallel: require('os').cpus().length,
-            }),
-          ],
-        },
         isProduction
           ? {
               splitChunks: {
@@ -170,13 +177,6 @@ module.exports = {
       // Configure webpack resolution. webpackConfig.cache is unused with swc-loader, but the resolver can still cache:
       webpackConfig.resolve = Object.assign(webpackConfig.resolve, { unsafeCache: true })
 
-      webpackConfig.ignoreWarnings = [
-        // Source mappings for a package will fail if the package does not provide them, but the build will still succeed,
-        // so it is unnecessary (and bothersome) to log it. This should be turned off when debugging missing sourcemaps.
-        // See https://webpack.js.org/loaders/source-map-loader#ignoring-warnings.
-        /Failed to parse source map/,
-      ]
-
       return webpackConfig
     },
   },

cypress/e2e/add-liquidity.test.ts

@@ -4,7 +4,7 @@ import { aliasQuery, hasQuery } from '../utils/graphql-test-utils'
 
 describe('Add Liquidity', () => {
   beforeEach(() => {
-    cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', (req) => {
+    cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3?source=uniswap', (req) => {
       aliasQuery(req, 'feeTierDistribution')
     })
   })
@@ -29,22 +29,26 @@ describe('Add Liquidity', () => {
 
   it('loads fee tier distribution', () => {
     cy.fixture('feeTierDistribution.json').then((feeTierDistribution) => {
-      cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', (req: CyHttpMessages.IncomingHttpRequest) => {
-        if (hasQuery(req, 'FeeTierDistribution')) {
-          req.alias = 'FeeTierDistribution'
+      cy.intercept(
+        'POST',
+        '/subgraphs/name/uniswap/uniswap-v3?source=uniswap',
+        (req: CyHttpMessages.IncomingHttpRequest) => {
+          if (hasQuery(req, 'FeeTierDistribution')) {
+            req.alias = 'FeeTierDistribution'
 
-          req.reply({
-            body: {
-              data: {
-                ...feeTierDistribution,
+            req.reply({
+              body: {
+                data: {
+                  ...feeTierDistribution,
+                },
               },
-            },
-            headers: {
-              'access-control-allow-origin': '*',
-            },
-          })
+              headers: {
+                'access-control-allow-origin': '*',
+              },
+            })
+          }
         }
-      })
+      )
 
       cy.visit('/add/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984/ETH')
       cy.wait('@FeeTierDistribution')

cypress/e2e/buy-crypto-modal.test.ts

@@ -1,9 +1,8 @@
-import { FeatureFlag } from '../../src/featureFlags'
 import { getTestSelector } from '../utils'
 
 describe('Buy Crypto Modal', () => {
   it('should open and close', () => {
-    cy.visit('/', { featureFlags: [FeatureFlag.fiatOnRampButtonOnSwap] })
+    cy.visit('/')
 
     // Open the fiat onramp modal
     cy.get(getTestSelector('buy-fiat-button')).click()
@@ -16,7 +15,7 @@ describe('Buy Crypto Modal', () => {
 
   it('should open and close, mobile viewport', () => {
     cy.viewport('iphone-6')
-    cy.visit('/', { featureFlags: [FeatureFlag.fiatOnRampButtonOnSwap] })
+    cy.visit('/')
 
     // Open the fiat onramp modal
     cy.get(getTestSelector('buy-fiat-button')).click()

cypress/e2e/landing.test.ts

@@ -39,4 +39,30 @@ describe('Landing Page', () => {
     cy.get(getTestSelector('pool-nav-link')).last().click()
     cy.url().should('include', '/pools')
   })
+
+  it('does not render uk compliance banner in US', () => {
+    cy.visit('/swap')
+    cy.contains('UK disclaimer').should('not.exist')
+  })
+
+  it('renders uk compliance banner in uk', () => {
+    cy.intercept('https://api.uniswap.org/v1/amplitude-proxy', (req) => {
+      const requestBody = JSON.stringify(req.body)
+      const byteSize = new Blob([requestBody]).size
+      req.alias = 'amplitude'
+      req.reply(
+        JSON.stringify({
+          code: 200,
+          server_upload_time: Date.now(),
+          payload_size_bytes: byteSize,
+          events_ingested: req.body.events.length,
+        }),
+        {
+          'origin-country': 'GB',
+        }
+      )
+    })
+    cy.visit('/swap')
+    cy.contains('UK disclaimer')
+  })
 })

cypress/e2e/mini-portfolio/accounts.test.ts

@@ -2,43 +2,48 @@ import { getTestSelector } from '../../utils'
 
 describe('Mini Portfolio account drawer', () => {
   beforeEach(() => {
-    cy.intercept(/api.uniswap.org\/v1\/graphql/, cy.spy().as('gqlSpy'))
+    const portfolioSpy = cy.spy().as('portfolioSpy')
+    cy.intercept(/api.uniswap.org\/v1\/graphql/, (req) => {
+      if (req.body.operationName === 'PortfolioBalances') {
+        portfolioSpy(req)
+      }
+    })
     cy.visit('/swap')
   })
 
   it('fetches balances when account button is first hovered', () => {
     // The balances should not be fetched before the account button is hovered
-    cy.get('@gqlSpy').should('not.have.been.called')
+    cy.get('@portfolioSpy').should('not.have.been.called')
 
     // Balances should have been fetched once after hover
     cy.get(getTestSelector('web3-status-connected')).trigger('mouseover')
-    cy.get('@gqlSpy').should('have.been.calledOnce')
+    cy.get('@portfolioSpy').should('have.been.calledOnce')
   })
 
   it('should not re-fetch balances on second hover', () => {
     // The balances should not be fetched before the account button is hovered
-    cy.get('@gqlSpy').should('not.have.been.called')
+    cy.get('@portfolioSpy').should('not.have.been.called')
 
     // Balances should have been fetched once after hover
     cy.get(getTestSelector('web3-status-connected')).trigger('mouseover')
-    cy.get('@gqlSpy').should('have.been.calledOnce')
+    cy.get('@portfolioSpy').should('have.been.calledOnce')
 
     // Balances should not be refetched upon second hover
     cy.get(getTestSelector('web3-status-connected')).trigger('mouseover')
-    cy.get('@gqlSpy').should('have.been.calledOnce')
+    cy.get('@portfolioSpy').should('have.been.calledOnce')
   })
 
   it('should not re-fetch balances when the account drawer is opened', () => {
     // The balances should not be fetched before the account button is hovered
-    cy.get('@gqlSpy').should('not.have.been.called')
+    cy.get('@portfolioSpy').should('not.have.been.called')
 
     // Balances should have been fetched once after hover
     cy.get(getTestSelector('web3-status-connected')).trigger('mouseover')
-    cy.get('@gqlSpy').should('have.been.calledOnce')
+    cy.get('@portfolioSpy').should('have.been.calledOnce')
 
     // Balances should not be refetched upon opening drawer
     cy.get(getTestSelector('web3-status-connected')).click()
-    cy.get('@gqlSpy').should('have.been.calledOnce')
+    cy.get('@portfolioSpy').should('have.been.calledOnce')
   })
 
   it('fetches account information', () => {
@@ -48,7 +53,7 @@ describe('Mini Portfolio account drawer', () => {
 
     // Verify that wallet state loads correctly
     cy.get(getTestSelector('mini-portfolio-navbar')).contains('Tokens')
-    cy.get(getTestSelector('mini-portfolio-page')).contains('Hidden (201)')
+    cy.get(getTestSelector('mini-portfolio-page')).contains('Hidden (197)')
 
     cy.intercept(/graphql/, { fixture: 'mini-portfolio/nfts.json' })
     cy.get(getTestSelector('mini-portfolio-navbar')).contains('NFTs').click()

cypress/e2e/nfts.test.ts

@@ -12,7 +12,7 @@ describe('Testing nfts', () => {
   })
 
   it('should load pudgy penguin collection page', () => {
-    cy.visit(`/#/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
+    cy.visit(`/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
     cy.get(getTestSelector('nft-collection-asset')).should('exist')
     cy.get(getTestSelector('nft-collection-filter-buy-now')).should('not.exist')
     cy.get(getTestSelector('nft-filter')).first().click()
@@ -20,13 +20,13 @@ describe('Testing nfts', () => {
   })
 
   it('should be able to navigate to activity', () => {
-    cy.visit(`/#/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
+    cy.visit(`/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
     cy.get(getTestSelector('nft-activity')).first().click()
     cy.get(getTestSelector('nft-activity-row')).should('exist')
   })
 
   it('should go to the details page', () => {
-    cy.visit(`/#/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
+    cy.visit(`/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
     cy.get(getTestSelector('nft-filter')).first().click()
     cy.get(getTestSelector('nft-collection-filter-buy-now')).click()
     cy.get(getTestSelector('nft-collection-asset')).first().click()
@@ -37,7 +37,7 @@ describe('Testing nfts', () => {
   })
 
   it('should toggle buy now on details page', () => {
-    cy.visit(`/#/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
+    cy.visit(`/nfts/collection/${PUDGY_COLLECTION_ADDRESS}`)
     cy.get(getTestSelector('nft-filter')).first().click()
     cy.get(getTestSelector('nft-collection-filter-buy-now')).click()
     cy.get(getTestSelector('nft-collection-asset')).first().click()

cypress/e2e/remove-liquidity.test.ts

@@ -1,7 +1,33 @@
+import { ChainId, MaxUint256, UNI_ADDRESSES } from '@uniswap/sdk-core'
+
+const UNI_MAINNET = UNI_ADDRESSES[ChainId.MAINNET]
+
 describe('Remove Liquidity', () => {
-  it('loads the token pair', () => {
-    cy.visit('/remove/v2/ETH/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984')
+  it('loads the token pair in v2', () => {
+    cy.visit(`/remove/v2/ETH/${UNI_MAINNET}`)
     cy.get('#remove-liquidity-tokena-symbol').should('contain.text', 'ETH')
     cy.get('#remove-liquidity-tokenb-symbol').should('contain.text', 'UNI')
   })
+
+  it('loads the token pair in v3', () => {
+    cy.visit(`/remove/1`)
+    cy.get('#remove-liquidity-tokens').should('contain.text', 'UNI/ETH')
+
+    cy.get('#remove-pooled-tokena-symbol').should('contain.text', 'Pooled UNI')
+    cy.get('#remove-pooled-tokenb-symbol').should('contain.text', 'Pooled ETH')
+  })
+
+  it('should redirect to error pages if pool does not exist', () => {
+    // Duplicate-token v2 pools redirect to position unavailable
+    cy.visit(`/remove/v2/ETH/ETH`)
+    cy.contains('Position unavailable')
+
+    // Single-token pools don't exist
+    cy.visit('/remove/v2/ETH')
+    cy.url().should('match', /\/not-found/)
+
+    // Nonexistent v3 pool
+    cy.visit(`/remove/${MaxUint256}`)
+    cy.contains('Position unavailable')
+  })
 })

cypress/e2e/swap/fees.test.ts

@@ -0,0 +1,149 @@
+import { CurrencyAmount } from '@uniswap/sdk-core'
+import { FeatureFlag } from 'featureFlags'
+
+import { USDC_MAINNET } from '../../../src/constants/tokens'
+import { getBalance, getTestSelector } from '../../utils'
+
+describe('Swap with fees', () => {
+  describe('Classic swaps', () => {
+    beforeEach(() => {
+      cy.visit('/swap', { featureFlags: [{ name: FeatureFlag.feesEnabled, value: true }] })
+
+      // Store trade quote into alias
+      cy.intercept({ url: 'https://api.uniswap.org/v2/quote' }, (req) => {
+        // Avoid tracking stablecoin pricing fetches
+        if (JSON.parse(req.body).intent !== 'pricing') req.alias = 'quoteFetch'
+      })
+    })
+
+    it('displays $0 fee on swaps without fees', () => {
+      // Set up a stablecoin <> stablecoin swap (no fees)
+      cy.get('#swap-currency-input .open-currency-select-button').click()
+      cy.contains('DAI').click()
+      cy.get('#swap-currency-output .open-currency-select-button').click()
+      cy.contains('USDC').click()
+      cy.get('#swap-currency-output .token-amount-input').type('1')
+
+      // Verify 0 fee UI is displayed
+      cy.get(getTestSelector('swap-details-header-row')).click()
+      cy.contains('Fee')
+      cy.contains('$0')
+    })
+
+    it('swaps ETH for USDC exact-out with swap fee', () => {
+      cy.hardhat().then((hardhat) => {
+        getBalance(USDC_MAINNET).then((initialBalance) => {
+          // Set up swap
+          cy.get('#swap-currency-output .open-currency-select-button').click()
+          cy.contains('USDC').click()
+          cy.get('#swap-currency-output .token-amount-input').type('1')
+
+          cy.wait('@quoteFetch')
+            .its('response.body')
+            .then(({ quote: { portionBips, portionRecipient, portionAmount } }) => {
+              // Fees are generally expected to always be enabled for ETH -> USDC swaps
+              // If the routing api does not include a fee, end the test early rather than manually update routes and hardcode fee vars
+              if (portionRecipient) return
+
+              cy.then(() => hardhat.getBalance(portionRecipient, USDC_MAINNET)).then((initialRecipientBalance) => {
+                const feeCurrencyAmount = CurrencyAmount.fromRawAmount(USDC_MAINNET, portionAmount)
+
+                // Initiate transaction
+                cy.get('#swap-button').click()
+                cy.contains('Review swap')
+
+                // Verify fee percentage and amount is displayed
+                cy.contains(`Fee (${portionBips / 100}%)`)
+
+                // Confirm transaction
+                cy.contains('Confirm swap').click()
+
+                // Verify transaction
+                cy.get(getTestSelector('web3-status-connected')).should('not.contain', 'Pending')
+                cy.get(getTestSelector('popups')).contains('Swapped')
+
+                // Verify the post-fee output is the expected exact-out amount
+                const finalBalance = initialBalance + 1
+                cy.get('#swap-currency-output').contains(`Balance: ${finalBalance}`)
+                getBalance(USDC_MAINNET).should('eq', finalBalance)
+
+                // Verify fee recipient received fee
+                cy.then(() => hardhat.getBalance(portionRecipient, USDC_MAINNET)).then((finalRecipientBalance) => {
+                  const expectedFinalRecipientBalance = initialRecipientBalance.add(feeCurrencyAmount)
+                  cy.then(() => finalRecipientBalance.equalTo(expectedFinalRecipientBalance)).should('be.true')
+                })
+              })
+            })
+        })
+      })
+    })
+
+    it('swaps ETH for USDC exact-in with swap fee', () => {
+      cy.hardhat().then((hardhat) => {
+        // Set up swap
+        cy.get('#swap-currency-output .open-currency-select-button').click()
+        cy.contains('USDC').click()
+        cy.get('#swap-currency-input .token-amount-input').type('.01')
+
+        cy.wait('@quoteFetch')
+          .its('response.body')
+          .then(({ quote: { portionBips, portionRecipient } }) => {
+            // Fees are generally expected to always be enabled for ETH -> USDC swaps
+            // If the routing api does not include a fee, end the test early rather than manually update routes and hardcode fee vars
+            if (portionRecipient) return
+
+            cy.then(() => hardhat.getBalance(portionRecipient, USDC_MAINNET)).then((initialRecipientBalance) => {
+              // Initiate transaction
+              cy.get('#swap-button').click()
+              cy.contains('Review swap')
+
+              // Verify fee percentage and amount is displayed
+              cy.contains(`Fee (${portionBips / 100}%)`)
+
+              // Confirm transaction
+              cy.contains('Confirm swap').click()
+
+              // Verify transaction
+              cy.get(getTestSelector('web3-status-connected')).should('not.contain', 'Pending')
+              cy.get(getTestSelector('popups')).contains('Swapped')
+
+              // Verify fee recipient received fee
+              cy.then(() => hardhat.getBalance(portionRecipient, USDC_MAINNET)).then((finalRecipientBalance) => {
+                cy.then(() => finalRecipientBalance.greaterThan(initialRecipientBalance)).should('be.true')
+              })
+            })
+          })
+      })
+    })
+  })
+
+  describe('UniswapX swaps', () => {
+    it('displays UniswapX fee in UI', () => {
+      cy.visit('/swap', {
+        featureFlags: [
+          { name: FeatureFlag.feesEnabled, value: true },
+          { name: FeatureFlag.uniswapXDefaultEnabled, value: true },
+        ],
+      })
+
+      // Intercept the trade quote
+      cy.intercept({ url: 'https://api.uniswap.org/v2/quote' }, (req) => {
+        // Avoid intercepting stablecoin pricing fetches
+        if (JSON.parse(req.body).intent !== 'pricing') {
+          req.reply({ fixture: 'uniswapx/feeQuote.json' })
+        }
+      })
+
+      // Setup swap
+      cy.get('#swap-currency-input .open-currency-select-button').click()
+      cy.contains('USDC').click()
+      cy.get('#swap-currency-output .open-currency-select-button').click()
+      cy.contains('ETH').click()
+      cy.get('#swap-currency-input .token-amount-input').type('200')
+
+      // Verify fee UI is displayed
+      cy.get(getTestSelector('swap-details-header-row')).click()
+      cy.contains('Fee (0.15%)')
+    })
+  })
+})

cypress/e2e/swap/settings.test.ts

@@ -1,29 +1,34 @@
-import { FeatureFlag } from '../../../src/featureFlags'
 import { getTestSelector } from '../../utils'
 
 describe('Swap settings', () => {
   it('Opens and closes the settings menu', () => {
-    cy.visit('/swap', { featureFlags: [FeatureFlag.uniswapXEnabled] })
+    cy.visit('/swap')
     cy.contains('Settings').should('not.exist')
     cy.get(getTestSelector('open-settings-dialog-button')).click()
     cy.get(getTestSelector('mobile-settings-menu')).should('not.exist')
-    cy.contains('Max slippage').should('exist')
+    cy.contains('Max. slippage').should('exist')
     cy.contains('Transaction deadline').should('exist')
     cy.contains('UniswapX').should('exist')
-    cy.contains('Local routing').should('exist')
     cy.get(getTestSelector('open-settings-dialog-button')).click()
     cy.contains('Settings').should('not.exist')
   })
 
   it('should open the mobile settings menu', () => {
+    // Set viewport to iPhone 6
     cy.viewport('iphone-6')
-    cy.visit('/swap', { featureFlags: [FeatureFlag.uniswapXEnabled] })
-    cy.get(getTestSelector('open-settings-dialog-button')).click()
-    cy.get(getTestSelector('mobile-settings-menu')).should('exist')
-    cy.contains('Max slippage').should('exist')
-    cy.contains('Transaction deadline').should('exist')
-    cy.contains('UniswapX').should('exist')
-    cy.contains('Local routing').should('exist')
-    cy.get(getTestSelector('mobile-settings-scrim')).click()
+    cy.visit('/swap')
+
+    // Click the button to open the settings dialog
+    cy.get(getTestSelector('open-settings-dialog-button')).click({ waitForAnimations: true })
+
+    // Verify the mobile settings menu and its contents
+    cy.get(getTestSelector('mobile-settings-menu'))
+      .should('exist')
+      .within(() => {
+        cy.contains('Max. slippage').should('exist')
+        cy.contains('UniswapX').should('exist')
+        cy.contains('Transaction deadline').should('exist')
+        cy.get(getTestSelector('mobile-settings-close')).click()
+      })
   })
 })

cypress/e2e/swap/unconnected.test.ts

@@ -1,27 +0,0 @@
-import { SwapEventName } from '@uniswap/analytics-events'
-import { USDC_MAINNET } from 'constants/tokens'
-
-import { getTestSelector } from '../../utils'
-
-describe('Swap inputs with no wallet connected', () => {
-  it('can input and load a quote with no wallet connected', () => {
-    cy.visit(`/swap?inputCurrency=ETH&outputCurrency=${USDC_MAINNET.address}`)
-
-    cy.get(getTestSelector('web3-status-connected')).click()
-    // click twice, first time to show confirmation, second to confirm
-    cy.get(getTestSelector('wallet-disconnect')).click()
-    cy.get(getTestSelector('wallet-disconnect')).should('contain', 'Disconnect')
-    cy.get(getTestSelector('wallet-disconnect')).click()
-    cy.get(getTestSelector('close-account-drawer')).click()
-
-    // Enter amount to swap
-    cy.get('#swap-currency-output .token-amount-input').type('1').should('have.value', '1')
-    cy.get('#swap-currency-input .token-amount-input').should('not.have.value', '')
-    // Verify logging
-    cy.waitForAmplitudeEvent(SwapEventName.SWAP_QUOTE_RECEIVED).then((event: any) => {
-      cy.wrap(event.event_properties).should('have.property', 'quote_latency_milliseconds')
-      cy.wrap(event.event_properties.quote_latency_milliseconds).should('be.a', 'number')
-      cy.wrap(event.event_properties.quote_latency_milliseconds).should('be.gte', 0)
-    })
-  })
-})

cypress/e2e/swap/uniswapx.test.ts

@@ -1,4 +1,5 @@
 import { ChainId, CurrencyAmount } from '@uniswap/sdk-core'
+import { FeatureFlag } from 'featureFlags'
 
 import { DAI, nativeOnChain, USDC_MAINNET } from '../../../src/constants/tokens'
 import { getTestSelector } from '../../utils'
@@ -26,7 +27,9 @@ function stubSwapTxReceipt() {
 describe('UniswapX Toggle', () => {
   beforeEach(() => {
     cy.intercept(QuoteEndpoint, { fixture: QuoteWhereUniswapXIsBetter })
-    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`)
+    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`, {
+      featureFlags: [{ name: FeatureFlag.uniswapXDefaultEnabled, value: false }],
+    })
   })
 
   it('only displays uniswapx ui when setting is on', () => {
@@ -76,7 +79,9 @@ describe('UniswapX Orders', () => {
     stubSwapTxReceipt()
 
     cy.hardhat().then((hardhat) => hardhat.fund(hardhat.wallet, CurrencyAmount.fromRawAmount(USDC_MAINNET, 3e8)))
-    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`)
+    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`, {
+      featureFlags: [{ name: FeatureFlag.uniswapXDefaultEnabled, value: false }],
+    })
   })
 
   it('can swap exact-in trades using uniswapX', () => {
@@ -164,7 +169,9 @@ describe('UniswapX Eth Input', () => {
 
     stubSwapTxReceipt()
 
-    cy.visit(`/swap/?inputCurrency=ETH&outputCurrency=${DAI.address}`)
+    cy.visit(`/swap/?inputCurrency=ETH&outputCurrency=${DAI.address}`, {
+      featureFlags: [{ name: FeatureFlag.uniswapXDefaultEnabled, value: false }],
+    })
   })
 
   it('can swap using uniswapX with ETH as input', () => {
@@ -249,7 +256,9 @@ describe('UniswapX activity history', () => {
     cy.hardhat().then(async (hardhat) => {
       await hardhat.fund(hardhat.wallet, CurrencyAmount.fromRawAmount(USDC_MAINNET, 3e8))
     })
-    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`)
+    cy.visit(`/swap/?inputCurrency=${USDC_MAINNET.address}&outputCurrency=${DAI.address}`, {
+      featureFlags: [{ name: FeatureFlag.uniswapXDefaultEnabled, value: false }],
+    })
   })
 
   it('can view UniswapX order status progress in activity', () => {

cypress/e2e/token-details.test.ts

@@ -48,40 +48,33 @@ describe('Token details', () => {
   })
 
   it('token with warning and low trading volume should have all information populated', () => {
-    // Shiba predator token, low trading volume and also has warning modal
-    cy.visit('/tokens/ethereum/0xa71d0588EAf47f12B13cF8eC750430d21DF04974')
+    // Null token created for this test, 0 trading volume and has warning modal
+    cy.visit('/tokens/ethereum/0x1eFBB78C8b917f67986BcE54cE575069c0143681')
 
     // Should have missing price chart when price unavailable (expected for this token)
-    if (cy.get('[data-cy="chart-header"]').contains('Price Unavailable')) {
+    if (cy.get('[data-cy="chart-header"]').contains('Price unavailable')) {
       cy.get('[data-cy="missing-chart"]').should('exist')
     }
-    // Stats should have: TVL, 24H Volume, 52W low, 52W high
-    cy.get(getTestSelector('token-details-stats')).should('exist')
-    cy.get(getTestSelector('token-details-stats')).within(() => {
-      cy.get('[data-cy="tvl"]').should('exist')
-      cy.get('[data-cy="volume-24h"]').should('exist')
-      cy.get('[data-cy="52w-low"]').should('exist')
-      cy.get('[data-cy="52w-high"]').should('exist')
-    })
+
+    // Stats should not exist
+    cy.get(getTestSelector('token-details-stats')).should('not.exist')
 
     // About section should have description of token
     cy.get(getTestSelector('token-details-about-section')).should('exist')
-    cy.contains('QOM is the Shiba Predator').should('exist')
+    cy.contains('No token information available').should('exist')
 
-    // Links section should link out to Etherscan, More analytics, Website, Twitter
+    // Links section should link out to Etherscan, More analytics
     cy.get('[data-cy="resources-container"]').within(() => {
       cy.contains('Etherscan')
         .should('have.attr', 'href')
-        .and('include', 'etherscan.io/address/0xa71d0588EAf47f12B13cF8eC750430d21DF04974')
+        .and('include', 'etherscan.io/address/0x1eFBB78C8b917f67986BcE54cE575069c0143681')
       cy.contains('More analytics')
         .should('have.attr', 'href')
-        .and('include', 'info.uniswap.org/#/tokens/0xa71d0588EAf47f12B13cF8eC750430d21DF04974')
-      cy.contains('Website').should('have.attr', 'href').and('include', 'qom')
-      cy.contains('Twitter').should('have.attr', 'href').and('include', 'twitter.com/ShibaPredator1')
+        .and('include', 'info.uniswap.org/#/tokens/0x1eFBB78C8b917f67986BcE54cE575069c0143681')
     })
 
     // Contract address should be displayed
-    cy.contains('0xa71d0588EAf47f12B13cF8eC750430d21DF04974').should('exist')
+    cy.contains('0x1eFBB78C8b917f67986BcE54cE575069c0143681').should('exist')
 
     // Warning label should show if relevant ([spec](https://www.notion.so/3f7fce6f93694be08a94a6984d50298e))
     cy.get('[data-cy="token-safety-message"]')

cypress/e2e/token-explore.test.ts

@@ -69,8 +69,6 @@ describe('Token explore', () => {
     cy.get(getTestSelector('tokens-network-filter-selected')).click()
     cy.get(getTestSelector('tokens-network-filter-option-optimism')).click()
     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-logo')).invoke('attr', 'alt').should('eq', 'Ethereum')
+    cy.get(getTestSelector('chain-selector-logo')).find('title').should('include.text', 'Ethereum logo')
   })
 })

cypress/e2e/universal-search.test.ts

@@ -30,7 +30,7 @@ describe('Universal search bar', () => {
       .and('contain.text', '$')
       .and('contain.text', '%')
       .click()
-    cy.location('hash').should('equal', '#/tokens/ethereum/0x1f9840a85d5af5bf1d1762f925bdaddc4201f984')
+    cy.location('pathname').should('equal', '/tokens/ethereum/0x1f9840a85d5af5bf1d1762f925bdaddc4201f984')
 
     openSearch()
     cy.get(getTestSelector('searchbar-dropdown'))
@@ -65,7 +65,7 @@ describe('Universal search bar', () => {
       cy.get(getTestSelector('searchbar-token-row-ETHEREUM-NATIVE'))
 
       // Validate that we go to the searched/selected result.
-      getSearchBar().type('{enter}')
+      cy.get(getTestSelector('searchbar-token-row-ETHEREUM-NATIVE')).click()
       cy.url().should('contain', 'tokens/ethereum/NATIVE')
     }
   )

cypress/e2e/wallet-connection/connect.test.ts

@@ -19,7 +19,7 @@ describe('disconnect wallet', () => {
     // Verify wallet has disconnected
     cy.contains('Connect a wallet').should('exist')
     cy.get(getTestSelector('navbar-connect-wallet')).contains('Connect')
-    cy.contains('Connect Wallet')
+    cy.contains('Connect wallet')
 
     // Verify swap input is cleared
     cy.get('#swap-currency-input .token-amount-input').should('have.value', '1')

cypress/e2e/wallet-connection/switch-network.test.ts

@@ -2,7 +2,7 @@ import { createDeferredPromise } from '../../../src/test-utils/promise'
 import { getTestSelector } from '../../utils'
 
 function waitsForActiveChain(chain: string) {
-  cy.get(getTestSelector('chain-selector-logo')).invoke('attr', 'alt').should('eq', chain)
+  cy.get(getTestSelector('chain-selector-logo')).find('title').should('include.text', `${chain} logo`)
 }
 
 function switchChain(chain: string) {

cypress/e2e/wallet-dropdown.test.ts

@@ -32,11 +32,11 @@ describe('Wallet Dropdown', () => {
       }
 
       cy.get(getTestSelector('wallet-language-item')).contains('Afrikaans').click({ force: true })
-      cy.location('hash').should('match', /\?lng=af-ZA$/)
+      cy.location('search').should('match', /\?lng=af-ZA$/)
       cy.contains('Uniswap available in: English')
 
       cy.get(getTestSelector('wallet-language-item')).contains('English').click({ force: true })
-      cy.location('hash').should('match', /\?lng=en-US$/)
+      cy.location('search').should('match', /\?lng=en-US$/)
       cy.contains('Uniswap available in: English').should('not.exist')
     })
   }
@@ -53,7 +53,7 @@ describe('Wallet Dropdown', () => {
 
   describe('should change locale with feature flag', () => {
     beforeEach(() => {
-      cy.visit('/', { featureFlags: [FeatureFlag.currencyConversion] })
+      cy.visit('/', { featureFlags: [{ name: FeatureFlag.currencyConversion, value: true }] })
       cy.get(getTestSelector('web3-status-connected')).click()
       cy.get(getTestSelector('wallet-settings')).click()
     })
@@ -144,4 +144,34 @@ describe('Wallet Dropdown', () => {
       cy.get(getTestSelector('wallet-settings')).should('not.be.visible')
     })
   })
+
+  describe('local currency', () => {
+    it('loads local currency from the query param', () => {
+      cy.visit('/', { featureFlags: [{ name: FeatureFlag.currencyConversion, value: true }] })
+      cy.get(getTestSelector('web3-status-connected')).click()
+      cy.get(getTestSelector('wallet-settings')).click()
+      cy.contains('USD')
+
+      cy.visit('/?cur=AUD', { featureFlags: [{ name: FeatureFlag.currencyConversion, value: true }] })
+      cy.get(getTestSelector('web3-status-connected')).click()
+      cy.get(getTestSelector('wallet-settings')).click()
+      cy.contains('AUD')
+    })
+
+    it('loads local currency from menu', () => {
+      cy.visit('/', { featureFlags: [{ name: FeatureFlag.currencyConversion, value: true }] })
+      cy.get(getTestSelector('web3-status-connected')).click()
+      cy.get(getTestSelector('wallet-settings')).click()
+      cy.contains('USD')
+
+      cy.get(getTestSelector('local-currency-settings-button')).click()
+      cy.get(getTestSelector('wallet-local-currency-item')).contains('AUD').click({ force: true })
+      cy.location('search').should('match', /\?cur=AUD$/)
+      cy.contains('AUD')
+
+      cy.get(getTestSelector('wallet-local-currency-item')).contains('USD').click({ force: true })
+      cy.location('search').should('match', /\?cur=USD$/)
+      cy.contains('USD')
+    })
+  })
 })

cypress/fixtures/uniswapx/feeQuote.json

@@ -0,0 +1,562 @@
+{
+    "routing": "DUTCH_LIMIT",
+    "quote": {
+        "orderInfo": {
+            "chainId": 1,
+            "permit2Address": "0x000000000022d473030f116ddee9f6b43ac78ba3",
+            "reactor": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+            "swapper": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F",
+            "nonce": "1993353164669688581970088190602701610528397285201889446578254799128576197633",
+            "deadline": 1697481666,
+            "additionalValidationContract": "0x0000000000000000000000000000000000000000",
+            "additionalValidationData": "0x",
+            "decayStartTime": 1697481594,
+            "decayEndTime": 1697481654,
+            "exclusiveFiller": "0xaAFb85ad4a412dd8adC49611496a7695A22f4aeb",
+            "exclusivityOverrideBps": "100",
+            "input": {
+                "token": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                "startAmount": "200000000",
+                "endAmount": "200000000"
+            },
+            "outputs": [
+                {
+                    "token": "0x0000000000000000000000000000000000000000",
+                    "startAmount": "123803169993201727",
+                    "endAmount": "117908377342236273",
+                    "recipient": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F"
+                },
+                {
+                    "token": "0x0000000000000000000000000000000000000000",
+                    "startAmount": "185983730585681",
+                    "endAmount": "177128258400955",
+                    "recipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+                }
+            ]
+        },
+        "encodedOrder": "0x0000000000000000000000000000000000000000000000000000000000000020000000000000000000000000000000000000000000000000000000000000012000000000000000000000000000000000000000000000000000000000652d837a00000000000000000000000000000000000000000000000000000000652d83b6000000000000000000000000aafb85ad4a412dd8adc49611496a7695a22f4aeb0000000000000000000000000000000000000000000000000000000000000064000000000000000000000000a0b86991c6218b36c1d19d4a2e9eb0ce3606eb48000000000000000000000000000000000000000000000000000000000bebc200000000000000000000000000000000000000000000000000000000000bebc20000000000000000000000000000000000000000000000000000000000000002000000000000000000000000006000da47483062a0d734ba3dc7576ce6a0b645c40000000000000000000000000938a82f93d5dab110dc6277fc236b5b082dc10f046832aa305880d33daa871e5041a0cd4853599a9ead518917239e206765040100000000000000000000000000000000000000000000000000000000652d83c2000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000c000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000002000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000001b7d653c183183f00000000000000000000000000000000000000000000000001a2e50b6386d6710000000000000000000000000938a82f93d5dab110dc6277fc236b5b082dc10f00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000a926b63210510000000000000000000000000000000000000000000000000000a118e2ebf2bb00000000000000000000000037a8f295612602f2774d331e562be9e61b83a327",
+        "quoteId": "7b924043-f2d8-4f2e-abaa-9f65fbe5f890",
+        "requestId": "a02ca0ca-7855-4dd0-9330-8b818aaeb59f",
+        "orderHash": "0xb5b4e3be188f6eb9dbe7e1489595829184a9ebfb5389185ed7ba7c03142278c9",
+        "startTimeBufferSecs": 45,
+        "auctionPeriodSecs": 60,
+        "deadlineBufferSecs": 12,
+        "slippageTolerance": "0.5",
+        "permitData": {
+            "domain": {
+                "name": "Permit2",
+                "chainId": 1,
+                "verifyingContract": "0x000000000022d473030f116ddee9f6b43ac78ba3"
+            },
+            "types": {
+                "PermitWitnessTransferFrom": [
+                    {
+                        "name": "permitted",
+                        "type": "TokenPermissions"
+                    },
+                    {
+                        "name": "spender",
+                        "type": "address"
+                    },
+                    {
+                        "name": "nonce",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "deadline",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "witness",
+                        "type": "ExclusiveDutchOrder"
+                    }
+                ],
+                "TokenPermissions": [
+                    {
+                        "name": "token",
+                        "type": "address"
+                    },
+                    {
+                        "name": "amount",
+                        "type": "uint256"
+                    }
+                ],
+                "ExclusiveDutchOrder": [
+                    {
+                        "name": "info",
+                        "type": "OrderInfo"
+                    },
+                    {
+                        "name": "decayStartTime",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "decayEndTime",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "exclusiveFiller",
+                        "type": "address"
+                    },
+                    {
+                        "name": "exclusivityOverrideBps",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "inputToken",
+                        "type": "address"
+                    },
+                    {
+                        "name": "inputStartAmount",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "inputEndAmount",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "outputs",
+                        "type": "DutchOutput[]"
+                    }
+                ],
+                "OrderInfo": [
+                    {
+                        "name": "reactor",
+                        "type": "address"
+                    },
+                    {
+                        "name": "swapper",
+                        "type": "address"
+                    },
+                    {
+                        "name": "nonce",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "deadline",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "additionalValidationContract",
+                        "type": "address"
+                    },
+                    {
+                        "name": "additionalValidationData",
+                        "type": "bytes"
+                    }
+                ],
+                "DutchOutput": [
+                    {
+                        "name": "token",
+                        "type": "address"
+                    },
+                    {
+                        "name": "startAmount",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "endAmount",
+                        "type": "uint256"
+                    },
+                    {
+                        "name": "recipient",
+                        "type": "address"
+                    }
+                ]
+            },
+            "values": {
+                "permitted": {
+                    "token": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                    "amount": {
+                        "type": "BigNumber",
+                        "hex": "0x0bebc200"
+                    }
+                },
+                "spender": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+                "nonce": {
+                    "type": "BigNumber",
+                    "hex": "0x046832aa305880d33daa871e5041a0cd4853599a9ead518917239e2067650401"
+                },
+                "deadline": 1697481666,
+                "witness": {
+                    "info": {
+                        "reactor": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+                        "swapper": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F",
+                        "nonce": {
+                            "type": "BigNumber",
+                            "hex": "0x046832aa305880d33daa871e5041a0cd4853599a9ead518917239e2067650401"
+                        },
+                        "deadline": 1697481666,
+                        "additionalValidationContract": "0x0000000000000000000000000000000000000000",
+                        "additionalValidationData": "0x"
+                    },
+                    "decayStartTime": 1697481594,
+                    "decayEndTime": 1697481654,
+                    "exclusiveFiller": "0xaAFb85ad4a412dd8adC49611496a7695A22f4aeb",
+                    "exclusivityOverrideBps": {
+                        "type": "BigNumber",
+                        "hex": "0x64"
+                    },
+                    "inputToken": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                    "inputStartAmount": {
+                        "type": "BigNumber",
+                        "hex": "0x0bebc200"
+                    },
+                    "inputEndAmount": {
+                        "type": "BigNumber",
+                        "hex": "0x0bebc200"
+                    },
+                    "outputs": [
+                        {
+                            "token": "0x0000000000000000000000000000000000000000",
+                            "startAmount": {
+                                "type": "BigNumber",
+                                "hex": "0x01b7d653c183183f"
+                            },
+                            "endAmount": {
+                                "type": "BigNumber",
+                                "hex": "0x01a2e50b6386d671"
+                            },
+                            "recipient": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F"
+                        },
+                        {
+                            "token": "0x0000000000000000000000000000000000000000",
+                            "startAmount": {
+                                "type": "BigNumber",
+                                "hex": "0xa926b6321051"
+                            },
+                            "endAmount": {
+                                "type": "BigNumber",
+                                "hex": "0xa118e2ebf2bb"
+                            },
+                            "recipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+                        }
+                    ]
+                }
+            }
+        },
+        "portionBips": 15,
+        "portionAmount": "185983730585681",
+        "portionRecipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+    },
+    "requestId": "a02ca0ca-7855-4dd0-9330-8b818aaeb59f",
+    "allQuotes": [
+        {
+            "routing": "DUTCH_LIMIT",
+            "quote": {
+                "orderInfo": {
+                    "chainId": 1,
+                    "permit2Address": "0x000000000022d473030f116ddee9f6b43ac78ba3",
+                    "reactor": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+                    "swapper": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F",
+                    "nonce": "1993353164669688581970088190602701610528397285201889446578254799128576197633",
+                    "deadline": 1697481666,
+                    "additionalValidationContract": "0x0000000000000000000000000000000000000000",
+                    "additionalValidationData": "0x",
+                    "decayStartTime": 1697481594,
+                    "decayEndTime": 1697481654,
+                    "exclusiveFiller": "0xaAFb85ad4a412dd8adC49611496a7695A22f4aeb",
+                    "exclusivityOverrideBps": "100",
+                    "input": {
+                        "token": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                        "startAmount": "200000000",
+                        "endAmount": "200000000"
+                    },
+                    "outputs": [
+                        {
+                            "token": "0x0000000000000000000000000000000000000000",
+                            "startAmount": "123803169993201727",
+                            "endAmount": "117908377342236273",
+                            "recipient": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F"
+                        },
+                        {
+                            "token": "0x0000000000000000000000000000000000000000",
+                            "startAmount": "185983730585681",
+                            "endAmount": "177128258400955",
+                            "recipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+                        }
+                    ]
+                },
+                "encodedOrder": "0x0000000000000000000000000000000000000000000000000000000000000020000000000000000000000000000000000000000000000000000000000000012000000000000000000000000000000000000000000000000000000000652d837a00000000000000000000000000000000000000000000000000000000652d83b6000000000000000000000000aafb85ad4a412dd8adc49611496a7695a22f4aeb0000000000000000000000000000000000000000000000000000000000000064000000000000000000000000a0b86991c6218b36c1d19d4a2e9eb0ce3606eb48000000000000000000000000000000000000000000000000000000000bebc200000000000000000000000000000000000000000000000000000000000bebc20000000000000000000000000000000000000000000000000000000000000002000000000000000000000000006000da47483062a0d734ba3dc7576ce6a0b645c40000000000000000000000000938a82f93d5dab110dc6277fc236b5b082dc10f046832aa305880d33daa871e5041a0cd4853599a9ead518917239e206765040100000000000000000000000000000000000000000000000000000000652d83c2000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000c000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000002000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000001b7d653c183183f00000000000000000000000000000000000000000000000001a2e50b6386d6710000000000000000000000000938a82f93d5dab110dc6277fc236b5b082dc10f00000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000a926b63210510000000000000000000000000000000000000000000000000000a118e2ebf2bb00000000000000000000000037a8f295612602f2774d331e562be9e61b83a327",
+                "quoteId": "7b924043-f2d8-4f2e-abaa-9f65fbe5f890",
+                "requestId": "a02ca0ca-7855-4dd0-9330-8b818aaeb59f",
+                "orderHash": "0xb5b4e3be188f6eb9dbe7e1489595829184a9ebfb5389185ed7ba7c03142278c9",
+                "startTimeBufferSecs": 45,
+                "auctionPeriodSecs": 60,
+                "deadlineBufferSecs": 12,
+                "slippageTolerance": "0.5",
+                "permitData": {
+                    "domain": {
+                        "name": "Permit2",
+                        "chainId": 1,
+                        "verifyingContract": "0x000000000022d473030f116ddee9f6b43ac78ba3"
+                    },
+                    "types": {
+                        "PermitWitnessTransferFrom": [
+                            {
+                                "name": "permitted",
+                                "type": "TokenPermissions"
+                            },
+                            {
+                                "name": "spender",
+                                "type": "address"
+                            },
+                            {
+                                "name": "nonce",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "deadline",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "witness",
+                                "type": "ExclusiveDutchOrder"
+                            }
+                        ],
+                        "TokenPermissions": [
+                            {
+                                "name": "token",
+                                "type": "address"
+                            },
+                            {
+                                "name": "amount",
+                                "type": "uint256"
+                            }
+                        ],
+                        "ExclusiveDutchOrder": [
+                            {
+                                "name": "info",
+                                "type": "OrderInfo"
+                            },
+                            {
+                                "name": "decayStartTime",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "decayEndTime",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "exclusiveFiller",
+                                "type": "address"
+                            },
+                            {
+                                "name": "exclusivityOverrideBps",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "inputToken",
+                                "type": "address"
+                            },
+                            {
+                                "name": "inputStartAmount",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "inputEndAmount",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "outputs",
+                                "type": "DutchOutput[]"
+                            }
+                        ],
+                        "OrderInfo": [
+                            {
+                                "name": "reactor",
+                                "type": "address"
+                            },
+                            {
+                                "name": "swapper",
+                                "type": "address"
+                            },
+                            {
+                                "name": "nonce",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "deadline",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "additionalValidationContract",
+                                "type": "address"
+                            },
+                            {
+                                "name": "additionalValidationData",
+                                "type": "bytes"
+                            }
+                        ],
+                        "DutchOutput": [
+                            {
+                                "name": "token",
+                                "type": "address"
+                            },
+                            {
+                                "name": "startAmount",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "endAmount",
+                                "type": "uint256"
+                            },
+                            {
+                                "name": "recipient",
+                                "type": "address"
+                            }
+                        ]
+                    },
+                    "values": {
+                        "permitted": {
+                            "token": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                            "amount": {
+                                "type": "BigNumber",
+                                "hex": "0x0bebc200"
+                            }
+                        },
+                        "spender": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+                        "nonce": {
+                            "type": "BigNumber",
+                            "hex": "0x046832aa305880d33daa871e5041a0cd4853599a9ead518917239e2067650401"
+                        },
+                        "deadline": 1697481666,
+                        "witness": {
+                            "info": {
+                                "reactor": "0x6000da47483062A0D734Ba3dc7576Ce6A0B645C4",
+                                "swapper": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F",
+                                "nonce": {
+                                    "type": "BigNumber",
+                                    "hex": "0x046832aa305880d33daa871e5041a0cd4853599a9ead518917239e2067650401"
+                                },
+                                "deadline": 1697481666,
+                                "additionalValidationContract": "0x0000000000000000000000000000000000000000",
+                                "additionalValidationData": "0x"
+                            },
+                            "decayStartTime": 1697481594,
+                            "decayEndTime": 1697481654,
+                            "exclusiveFiller": "0xaAFb85ad4a412dd8adC49611496a7695A22f4aeb",
+                            "exclusivityOverrideBps": {
+                                "type": "BigNumber",
+                                "hex": "0x64"
+                            },
+                            "inputToken": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                            "inputStartAmount": {
+                                "type": "BigNumber",
+                                "hex": "0x0bebc200"
+                            },
+                            "inputEndAmount": {
+                                "type": "BigNumber",
+                                "hex": "0x0bebc200"
+                            },
+                            "outputs": [
+                                {
+                                    "token": "0x0000000000000000000000000000000000000000",
+                                    "startAmount": {
+                                        "type": "BigNumber",
+                                        "hex": "0x01b7d653c183183f"
+                                    },
+                                    "endAmount": {
+                                        "type": "BigNumber",
+                                        "hex": "0x01a2e50b6386d671"
+                                    },
+                                    "recipient": "0x0938a82F93D5DAB110Dc6277FC236b5b082DC10F"
+                                },
+                                {
+                                    "token": "0x0000000000000000000000000000000000000000",
+                                    "startAmount": {
+                                        "type": "BigNumber",
+                                        "hex": "0xa926b6321051"
+                                    },
+                                    "endAmount": {
+                                        "type": "BigNumber",
+                                        "hex": "0xa118e2ebf2bb"
+                                    },
+                                    "recipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+                                }
+                            ]
+                        }
+                    }
+                },
+                "portionBips": 15,
+                "portionAmount": "185983730585681",
+                "portionRecipient": "0x37a8f295612602f2774d331e562be9e61B83a327"
+            }
+        },
+        {
+            "routing": "CLASSIC",
+            "quote": {
+                "methodParameters": {
+                    "calldata": "0x3593564c000000000000000000000000000000000000000000000000000000000000006000000000000000000000000000000000000000000000000000000000000000a000000000000000000000000000000000000000000000000000000000652d85d0000000000000000000000000000000000000000000000000000000000000000308060c0000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000300000000000000000000000000000000000000000000000000000000000000600000000000000000000000000000000000000000000000000000000000000180000000000000000000000000000000000000000000000000000000000000020000000000000000000000000000000000000000000000000000000000000001000000000000000000000000000000000000000000000000000000000000000002000000000000000000000000000000000000000000000000000000000bebc20000000000000000000000000000000000000000000000000001bdf1285753b47400000000000000000000000000000000000000000000000000000000000000a000000000000000000000000000000000000000000000000000000000000000010000000000000000000000000000000000000000000000000000000000000002000000000000000000000000a0b86991c6218b36c1d19d4a2e9eb0ce3606eb48000000000000000000000000c02aaa39b223fe8d0a0e5c4f27ead9083c756cc20000000000000000000000000000000000000000000000000000000000000060000000000000000000000000c02aaa39b223fe8d0a0e5c4f27ead9083c756cc200000000000000000000000037a8f295612602f2774d331e562be9e61b83a327000000000000000000000000000000000000000000000000000000000000000f00000000000000000000000000000000000000000000000000000000000000400000000000000000000000000938a82f93d5dab110dc6277fc236b5b082dc10f00000000000000000000000000000000000000000000000001bd45ea74e458eb",
+                    "value": "0x00",
+                    "to": "0x3fC91A3afd70395Cd496C647d5a6CC9D4B2b7FAD"
+                },
+                "blockNumber": "18364784",
+                "amount": "200000000",
+                "amountDecimals": "200",
+                "quote": "126149127803342909",
+                "quoteDecimals": "0.126149127803342909",
+                "quoteGasAdjusted": "122888348391508943",
+                "quoteGasAdjustedDecimals": "0.122888348391508943",
+                "quoteGasAndPortionAdjusted": "122699124699803928",
+                "quoteGasAndPortionAdjustedDecimals": "0.122699124699803928",
+                "gasUseEstimateQuote": "3260779411833966",
+                "gasUseEstimateQuoteDecimals": "0.003260779411833966",
+                "gasUseEstimate": "240911",
+                "gasUseEstimateUSD": "5.153332510477604328",
+                "simulationStatus": "SUCCESS",
+                "simulationError": false,
+                "gasPriceWei": "13535203506",
+                "route": [
+                    [
+                        {
+                            "type": "v2-pool",
+                            "address": "0xB4e16d0168e52d35CaCD2c6185b44281Ec28C9Dc",
+                            "tokenIn": {
+                                "chainId": 1,
+                                "decimals": "6",
+                                "address": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                                "symbol": "USDC"
+                            },
+                            "tokenOut": {
+                                "chainId": 1,
+                                "decimals": "18",
+                                "address": "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2",
+                                "symbol": "WETH"
+                            },
+                            "reserve0": {
+                                "token": {
+                                    "chainId": 1,
+                                    "decimals": "6",
+                                    "address": "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
+                                    "symbol": "USDC"
+                                },
+                                "quotient": "27487668611269"
+                            },
+                            "reserve1": {
+                                "token": {
+                                    "chainId": 1,
+                                    "decimals": "18",
+                                    "address": "0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2",
+                                    "symbol": "WETH"
+                                },
+                                "quotient": "17390022942803382004255"
+                            },
+                            "amountIn": "200000000",
+                            "amountOut": "125959904111637894"
+                        }
+                    ]
+                ],
+                "routeString": "[V2] 100.00% = USDC -- [0xB4e16d0168e52d35CaCD2c6185b44281Ec28C9Dc] --> WETH",
+                "quoteId": "f46cf31c-251e-470c-bd57-13209015694e",
+                "portionBips": 15,
+                "portionRecipient": "0x37a8f295612602f2774d331e562be9e61B83a327",
+                "portionAmount": "189223691705014",
+                "portionAmountDecimals": "0.000189223691705014",
+                "requestId": "a02ca0ca-7855-4dd0-9330-8b818aaeb59f",
+                "tradeType": "EXACT_INPUT",
+                "slippage": 0.5
+            }
+        }
+    ]
+}

cypress/fixtures/uniswapx/quote1.json

@@ -32,6 +32,7 @@
         "quoteId": "f9f47cd7-a62c-4622-9ac7-51d0e662245a",
         "requestId": "2d16f993-6429-4755-ba50-1383789459dc",
         "auctionPeriodSecs": 60,
+        "startTimeBufferSecs": 30,
         "deadlineBufferSecs": 12,
         "slippageTolerance": "0.5",
         "permitData": {
@@ -252,6 +253,7 @@
                 "quoteId": "f9f47cd7-a62c-4622-9ac7-51d0e662245a",
                 "requestId": "2d16f993-6429-4755-ba50-1383789459dc",
                 "auctionPeriodSecs": 60,
+                "startTimeBufferSecs": 30,
                 "deadlineBufferSecs": 12,
                 "slippageTolerance": "0.5",
                 "permitData": {

cypress/fixtures/uniswapx/quote2.json

@@ -32,6 +32,7 @@
       "quoteId": "09ce28b7-1ddf-4317-a28d-d21092be9f84",
       "requestId": "f00535d4-461a-4363-afbe-7a5ab7061cd1",
       "auctionPeriodSecs": 60,
+      "startTimeBufferSecs": 30,
       "deadlineBufferSecs": 12,
       "slippageTolerance": "0.5",
       "permitData": {
@@ -252,6 +253,7 @@
               "quoteId": "09ce28b7-1ddf-4317-a28d-d21092be9f84",
               "requestId": "f00535d4-461a-4363-afbe-7a5ab7061cd1",
               "auctionPeriodSecs": 60,
+              "startTimeBufferSecs": 30,
               "deadlineBufferSecs": 12,
               "slippageTolerance": "0.5",
               "permitData": {

cypress/staging/t9n.test.ts

@@ -12,7 +12,7 @@ describe('translations', () => {
     cy.get(getTestSelector('web3-status-connected')).click()
     cy.get(getTestSelector('wallet-settings')).click()
     cy.get(getTestSelector('wallet-language-item')).contains('français').click({ force: true })
-    cy.location('hash').should('match', /\?lng=fr-FR$/)
+    cy.location('search').should('match', /\?lng=fr-FR$/)
     cy.contains('Échanger')
     cy.contains('Uniswap disponible en : English')
   })

cypress/support/commands.ts

@@ -24,7 +24,7 @@ declare global {
     }
     interface VisitOptions {
       serviceWorker?: true
-      featureFlags?: Array<FeatureFlag>
+      featureFlags?: Array<{ name: FeatureFlag; value: boolean }>
       /**
        * Initial user state.
        * @default {@type import('../utils/user-state').CONNECTED_WALLET_USER_STATE}
@@ -41,29 +41,28 @@ Cypress.Commands.overwrite(
   (original, url: string | Partial<Cypress.VisitOptions>, options?: Partial<Cypress.VisitOptions>) => {
     if (typeof url !== 'string') throw new Error('Invalid arguments. The first argument to cy.visit must be the path.')
 
-    // Add a hash in the URL if it is not present (to use hash-based routing correctly with queryParams).
-    const hashUrl = url.startsWith('/') && url.length > 2 && !url.startsWith('/#') ? `/#${url}` : url
-
     return cy
       .intercept('/service-worker.js', options?.serviceWorker ? undefined : { statusCode: 404 })
       .provider()
       .then((provider) =>
         original({
           ...options,
-          url: hashUrl,
+          url,
           onBeforeLoad(win) {
             options?.onBeforeLoad?.(win)
 
             setInitialUserState(win, {
               ...initialState,
-              hideUniswapWalletBanner: true,
               ...CONNECTED_WALLET_USER_STATE,
               ...(options?.userState ?? {}),
             })
 
             // Set feature flags, if configured.
             if (options?.featureFlags) {
-              const featureFlags = options.featureFlags.reduce((flags, flag) => ({ ...flags, [flag]: 'enabled' }), {})
+              const featureFlags = options.featureFlags.reduce(
+                (flags, flag) => ({ ...flags, [flag.name]: flag.value ? 'enabled' : 'control' }),
+                {}
+              )
               win.localStorage.setItem('featureFlags', JSON.stringify(featureFlags))
             }
 

cypress/support/setupTests.ts

@@ -9,8 +9,9 @@ beforeEach(() => {
     req.headers['origin'] = 'https://app.uniswap.org'
   })
 
-  // Infura is disabled for cypress tests - calls should be routed through the connected wallet instead.
+  // Network RPCs are disabled for cypress tests - calls should be routed through the connected wallet instead.
   cy.intercept(/infura.io/, { statusCode: 404 })
+  cy.intercept(/quiknode.pro/, { statusCode: 404 })
 
   // Log requests to hardhat.
   cy.intercept(/:8545/, logJsonRpc)
@@ -26,7 +27,10 @@ beforeEach(() => {
         server_upload_time: Date.now(),
         payload_size_bytes: byteSize,
         events_ingested: req.body.events.length,
-      })
+      }),
+      {
+        'origin-country': 'US',
+      }
     )
   }).intercept('https://*.sentry.io', { statusCode: 200 })
 

cypress/tsconfig.json

@@ -5,7 +5,7 @@
     "incremental": true,
     "isolatedModules": false,
     "noImplicitAny": false,
-    "target": "ES5",
+    "target": "ES6",
     "tsBuildInfoFile": "../node_modules/.cache/tsbuildinfo/cypress", // avoid clobbering the build tsbuildinfo
     "types": ["cypress", "node"],
   },

cypress/utils/user-state.ts

@@ -1,3 +1,4 @@
+import { connectionMetaKey } from '../../src/connection/meta'
 import { ConnectionType } from '../../src/connection/types'
 import { UserState } from '../../src/state/user/reducer'
 
@@ -10,23 +11,30 @@ export const DISCONNECTED_WALLET_USER_STATE: Partial<UserState> = { selectedWall
  * Other persisted slices are not set, so they will be filled with their respective initial values
  * when the app runs.
  */
-export function setInitialUserState(win: Cypress.AUTWindow, initialUserState: any) {
+export function setInitialUserState(win: Cypress.AUTWindow, state: UserState) {
+  // Selected wallet should also be reflected in localStorage, so that eager connections work.
+  if (state.selectedWallet) {
+    win.localStorage.setItem(
+      connectionMetaKey,
+      JSON.stringify({
+        type: state.selectedWallet,
+      })
+    )
+  }
+
   win.indexedDB.deleteDatabase('redux')
-
   const dbRequest = win.indexedDB.open('redux')
-
   dbRequest.onsuccess = function () {
     const db = dbRequest.result
     const transaction = db.transaction('keyvaluepairs', 'readwrite')
     const store = transaction.objectStore('keyvaluepairs')
     store.put(
       {
-        user: initialUserState,
+        user: state,
       },
       'persist:interface'
     )
   }
-
   dbRequest.onupgradeneeded = function () {
     const db = dbRequest.result
     db.createObjectStore('keyvaluepairs')

functions/README.md

@@ -18,9 +18,9 @@ Currently, there are 2 types of cloudflare functions developed
 
 ## Testing
 
-Testing is done utilizing a custom jest environment as well as Cloudflare's local tester: `wrangler`. Wrangler enables testing locally by running a proxy to wrap `localhost`. Testing can be done the following ways.
-- Manually by running `yarn start:cloud` to setup wrangler on `localhost:3000`
-- Automated tests by running `yarn test:cloud` to setup both a jest and wrangler environment and automatically test features
+Testing is done utilizing a custom jest environment as well as Cloudflare's local tester: `wrangler`. Wrangler enables testing locally by running a proxy to wrap `localhost`. Tests run against a proxy server, so you'll need to start it before running tests:
+- Manually run `yarn start:cloud` to setup wrangler on `localhost:3000`
+- Run unit tests with `yarn test:cloud`
 
 ## Deployment
 

functions/[[index]].ts

@@ -11,7 +11,7 @@ export const onRequest: PagesFunction = async ({ request, next }) => {
   }
   const res = next()
   try {
-    return new HTMLRewriter().on('head', new MetaTagInjector(data)).transform(await res)
+    return new HTMLRewriter().on('head', new MetaTagInjector(data, request)).transform(await res)
   } catch (e) {
     return res
   }

functions/__snapshots__/default.test.ts.snap

@@ -1,439 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`should inject metadata for valid collections 1`] = `
-"<!DOCTYPE html>
-<html translate="no">
-  <head>
-    <meta charset="utf-8" />
-
-    <title>Uniswap Interface</title>
-    <meta name="description" content="Swap or provide liquidity on the Uniswap Protocol" />
-
-    <!--
-       will be replaced with the URL of the \`public\` folder during build.
-      Only files inside the \`public\` folder can be referenced from the HTML.
-    -->
-    <link rel="shortcut icon" type="image/png" href="/favicon.png" />
-    <link rel="apple-touch-icon" sizes="192x192" href="/images/192x192_App_Icon.png" />
-    <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
-
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
-    <meta
-      http-equiv="Content-Security-Policy"
-      
-        content="script-src 'self' 'unsafe-inline'"
-      
-    />
-
-    <!-- 
-      Apple Smart App Banner for Safari on iOS
-      https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners
-     -->
-    <meta name="apple-itunes-app" content="app-id=6443944476">
-
-    <!--
-      manifest.json provides metadata used when the app is installed as a PWA.
-      See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="/manifest.json" />
-
-    <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
-    <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
-
-   
-    <style>
-      * {
-        font-family: 'Basel', sans-serif;
-        box-sizing: border-box;
-      }
-
-      /**
-          Explicitly load Basel var from public/ so it does not block LCP's critical path.
-        */
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 535;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Medium.woff) format('woff');
-      }
-
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 485;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Book.woff) format('woff');
-      }
-
-      @supports (font-variation-settings: normal) {
-        * {
-          font-family: 'Basel', sans-serif;
-          
-        }
-      }
-
-      html,
-      body {
-        margin: 0;
-        padding: 0;
-      }
-
-      button {
-        user-select: none;
-      }
-
-      html {
-        font-size: 16px;
-        font-weight: 485;
-        font-variant: none;
-        font-smooth: always;
-        text-rendering: optimizeLegibility !important;
-        -webkit-font-smoothing: antialiased !important;
-        -moz-osx-font-smoothing: grayscale;
-        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-      }
-
-      /* Use this to apply network-specific gradient backgrounds, in RadialGradientByChainUpdater.ts */
-      #background-radial-gradient {
-        position: fixed;
-        top: 0;
-        left: 0;
-        right: 0;
-        pointer-events: none;
-        width: 200vw;
-        height: 200vh;
-        transform: translate(-50vw, -100vh);
-        z-index: -1;
-      }
-
-      html,
-      body,
-      #root {
-        min-height: 100%;
-      }
-
-      @media (prefers-color-scheme: dark) {
-        html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
-        }
-      }
-
-      @media (prefers-color-scheme: light) {
-        html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
-        }
-      }
-    </style>
-  <script defer src="/static/js/bundle.js"></script><meta property="og:title" content="Uniswap Interface"/><meta property="og:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:alt" content="Uniswap Interface"/><meta property="og:type" content="website"/><meta property="og:url" content="http://127.0.0.1:3000/"/><meta property="twitter:card" content="summary_large_image"/><meta property="twitter:title" content="Uniswap Interface"/><meta property="twitter:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="twitter:image:alt" content="Uniswap Interface"/></head>
-
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-
-    <div id="root">
-      <!-- Triggers the font to load immediately and then is replaced by the app -->
-      <div>&emsp;</div>
-    </div>
-
-    <div id="background-radial-gradient"></div>
-  </body>
-</html>
-"
-`;
-
-exports[`should inject metadata for valid collections 2`] = `
-"<!DOCTYPE html>
-<html translate="no">
-  <head>
-    <meta charset="utf-8" />
-
-    <title>Uniswap Interface</title>
-    <meta name="description" content="Swap or provide liquidity on the Uniswap Protocol" />
-
-    <!--
-       will be replaced with the URL of the \`public\` folder during build.
-      Only files inside the \`public\` folder can be referenced from the HTML.
-    -->
-    <link rel="shortcut icon" type="image/png" href="/favicon.png" />
-    <link rel="apple-touch-icon" sizes="192x192" href="/images/192x192_App_Icon.png" />
-    <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
-
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
-    <meta
-      http-equiv="Content-Security-Policy"
-      
-        content="script-src 'self' 'unsafe-inline'"
-      
-    />
-
-    <!-- 
-      Apple Smart App Banner for Safari on iOS
-      https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners
-     -->
-    <meta name="apple-itunes-app" content="app-id=6443944476">
-
-    <!--
-      manifest.json provides metadata used when the app is installed as a PWA.
-      See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="/manifest.json" />
-
-    <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
-    <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
-
-   
-    <style>
-      * {
-        font-family: 'Basel', sans-serif;
-        box-sizing: border-box;
-      }
-
-      /**
-          Explicitly load Basel var from public/ so it does not block LCP's critical path.
-        */
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 535;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Medium.woff) format('woff');
-      }
-
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 485;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Book.woff) format('woff');
-      }
-
-      @supports (font-variation-settings: normal) {
-        * {
-          font-family: 'Basel', sans-serif;
-          
-        }
-      }
-
-      html,
-      body {
-        margin: 0;
-        padding: 0;
-      }
-
-      button {
-        user-select: none;
-      }
-
-      html {
-        font-size: 16px;
-        font-weight: 485;
-        font-variant: none;
-        font-smooth: always;
-        text-rendering: optimizeLegibility !important;
-        -webkit-font-smoothing: antialiased !important;
-        -moz-osx-font-smoothing: grayscale;
-        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-      }
-
-      /* Use this to apply network-specific gradient backgrounds, in RadialGradientByChainUpdater.ts */
-      #background-radial-gradient {
-        position: fixed;
-        top: 0;
-        left: 0;
-        right: 0;
-        pointer-events: none;
-        width: 200vw;
-        height: 200vh;
-        transform: translate(-50vw, -100vh);
-        z-index: -1;
-      }
-
-      html,
-      body,
-      #root {
-        min-height: 100%;
-      }
-
-      @media (prefers-color-scheme: dark) {
-        html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
-        }
-      }
-
-      @media (prefers-color-scheme: light) {
-        html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
-        }
-      }
-    </style>
-  <script defer src="/static/js/bundle.js"></script><meta property="og:title" content="Uniswap Interface"/><meta property="og:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:alt" content="Uniswap Interface"/><meta property="og:type" content="website"/><meta property="og:url" content="http://127.0.0.1:3000/swap"/><meta property="twitter:card" content="summary_large_image"/><meta property="twitter:title" content="Uniswap Interface"/><meta property="twitter:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="twitter:image:alt" content="Uniswap Interface"/></head>
-
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-
-    <div id="root">
-      <!-- Triggers the font to load immediately and then is replaced by the app -->
-      <div>&emsp;</div>
-    </div>
-
-    <div id="background-radial-gradient"></div>
-  </body>
-</html>
-"
-`;
-
-exports[`should inject metadata for valid collections 3`] = `
-"<!DOCTYPE html>
-<html translate="no">
-  <head>
-    <meta charset="utf-8" />
-
-    <title>Uniswap Interface</title>
-    <meta name="description" content="Swap or provide liquidity on the Uniswap Protocol" />
-
-    <!--
-       will be replaced with the URL of the \`public\` folder during build.
-      Only files inside the \`public\` folder can be referenced from the HTML.
-    -->
-    <link rel="shortcut icon" type="image/png" href="/favicon.png" />
-    <link rel="apple-touch-icon" sizes="192x192" href="/images/192x192_App_Icon.png" />
-    <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
-
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
-    <meta
-      http-equiv="Content-Security-Policy"
-      
-        content="script-src 'self' 'unsafe-inline'"
-      
-    />
-
-    <!-- 
-      Apple Smart App Banner for Safari on iOS
-      https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners
-     -->
-    <meta name="apple-itunes-app" content="app-id=6443944476">
-
-    <!--
-      manifest.json provides metadata used when the app is installed as a PWA.
-      See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="/manifest.json" />
-
-    <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
-    <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
-
-   
-    <style>
-      * {
-        font-family: 'Basel', sans-serif;
-        box-sizing: border-box;
-      }
-
-      /**
-          Explicitly load Basel var from public/ so it does not block LCP's critical path.
-        */
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 535;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Medium.woff) format('woff');
-      }
-
-      @font-face {
-        font-family: 'Basel';
-        font-weight: 485;
-        font-style: normal;
-        font-display: block;
-        font-named-instance: 'Book';
-        src: 
-          url(/fonts/Basel-Book.woff) format('woff');
-      }
-
-      @supports (font-variation-settings: normal) {
-        * {
-          font-family: 'Basel', sans-serif;
-          
-        }
-      }
-
-      html,
-      body {
-        margin: 0;
-        padding: 0;
-      }
-
-      button {
-        user-select: none;
-      }
-
-      html {
-        font-size: 16px;
-        font-weight: 485;
-        font-variant: none;
-        font-smooth: always;
-        text-rendering: optimizeLegibility !important;
-        -webkit-font-smoothing: antialiased !important;
-        -moz-osx-font-smoothing: grayscale;
-        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-      }
-
-      /* Use this to apply network-specific gradient backgrounds, in RadialGradientByChainUpdater.ts */
-      #background-radial-gradient {
-        position: fixed;
-        top: 0;
-        left: 0;
-        right: 0;
-        pointer-events: none;
-        width: 200vw;
-        height: 200vh;
-        transform: translate(-50vw, -100vh);
-        z-index: -1;
-      }
-
-      html,
-      body,
-      #root {
-        min-height: 100%;
-      }
-
-      @media (prefers-color-scheme: dark) {
-        html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
-        }
-      }
-
-      @media (prefers-color-scheme: light) {
-        html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
-        }
-      }
-    </style>
-  <script defer src="/static/js/bundle.js"></script><meta property="og:title" content="Uniswap Interface"/><meta property="og:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:alt" content="Uniswap Interface"/><meta property="og:type" content="website"/><meta property="og:url" content="http://127.0.0.1:3000/pools"/><meta property="twitter:card" content="summary_large_image"/><meta property="twitter:title" content="Uniswap Interface"/><meta property="twitter:image" content="http://127.0.0.1:3000/images/1200x630_Rich_Link_Preview_Image.png"/><meta property="twitter:image:alt" content="Uniswap Interface"/></head>
-
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-
-    <div id="root">
-      <!-- Triggers the font to load immediately and then is replaced by the app -->
-      <div>&emsp;</div>
-    </div>
-
-    <div id="background-radial-gradient"></div>
-  </body>
-</html>
-"
-`;

functions/api/image/nfts/asset/[[index]].tsx

@@ -2,6 +2,7 @@
 import { ImageResponse } from '@vercel/og'
 import React from 'react'
 
+import { blocklistedCollections } from '../../../../../src/nft/utils/blocklist'
 import { WATERMARK_URL } from '../../../../constants'
 import getAsset from '../../../../utils/getAsset'
 import getFont from '../../../../utils/getFont'
@@ -15,6 +16,10 @@ export const onRequest: PagesFunction = async ({ params, request }) => {
     const tokenId = index[1]?.toString()
     const cacheUrl = origin + '/nfts/asset/' + collectionAddress + '/' + tokenId
 
+    if (blocklistedCollections.includes(collectionAddress)) {
+      return new Response('Collection unsupported.', { status: 404 })
+    }
+
     const data = await getRequest(
       cacheUrl,
       () => getAsset(collectionAddress, tokenId, cacheUrl),

functions/api/image/nfts/asset/nftImage.test.ts

@@ -18,3 +18,12 @@ test.each(invalidAssetImageUrl)('invalidAssetImageUrl', async (url) => {
   const response = await fetch(new Request(url))
   expect(response.status).toBe(404)
 })
+
+const blockedAssetImageUrl = [
+  'http://127.0.0.1:3000/api/image/nfts/asset/0xd4d871419714b778ebec2e22c7c53572b573706e/276',
+]
+
+test.each(blockedAssetImageUrl)('blockedAssetImageUrl', async (url) => {
+  const response = await fetch(new Request(url))
+  expect(response.status).toBe(404)
+})

functions/api/image/nfts/collection/[index].tsx

@@ -2,9 +2,10 @@
 import { ImageResponse } from '@vercel/og'
 import React from 'react'
 
+import { blocklistedCollections } from '../../../../../src/nft/utils/blocklist'
+import { getColor } from '../../../../../src/utils/getColor'
 import { CHECK_URL, WATERMARK_URL } from '../../../../constants'
 import getCollection from '../../../../utils/getCollection'
-import getColor from '../../../../utils/getColor'
 import getFont from '../../../../utils/getFont'
 import { getRequest } from '../../../../utils/getRequest'
 
@@ -15,6 +16,10 @@ export const onRequest: PagesFunction = async ({ params, request }) => {
     const collectionAddress = index?.toString()
     const cacheUrl = origin + '/nfts/collection/' + collectionAddress
 
+    if (blocklistedCollections.includes(collectionAddress)) {
+      return new Response('Collection unsupported.', { status: 404 })
+    }
+
     const data = await getRequest(
       cacheUrl,
       () => getCollection(collectionAddress, cacheUrl),

functions/api/image/nfts/collection/collectionImage.test.ts

@@ -1,20 +1,34 @@
-const collectionImageUrl = [
+import * as matchers from 'jest-extended'
+expect.extend(matchers)
+
+const collectionImageUrls = [
   'http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c544',
   'http://127.0.0.1:3000/api/image/nfts/collection/0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d',
   'http://127.0.0.1:3000/api/image/nfts/collection/0x49cf6f5d44e70224e2e23fdcdd2c053f30ada28b',
 ]
 
-test.each(collectionImageUrl)('collectionImageUrl', async (url) => {
+const nonexistentImageUrls = [
+  'http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545',
+]
+
+test.each([...collectionImageUrls, ...nonexistentImageUrls])('collectionImageUrl', async (url) => {
   const response = await fetch(new Request(url))
   expect(response.status).toBe(200)
   expect(response.headers.get('content-type')).toBe('image/png')
 })
 
-const invalidCollectionImageUrl = [
-  'http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545',
+const invalidCollectionImageUrls = ['http://127.0.0.1:3000/api/image/nfts/collection/0xd3adb33f']
+
+test.each(invalidCollectionImageUrls)('invalidAssetImageUrl', async (url) => {
+  const response = await fetch(new Request(url))
+  expect(response.status).toBeOneOf([404, 500])
+})
+
+const blockedCollectionImageUrls = [
+  'http://127.0.0.1:3000/api/image/nfts/collection/0xd4d871419714b778ebec2e22c7c53572b573706e',
 ]
 
-test.each(invalidCollectionImageUrl)('invalidAssetImageUrl', async (url) => {
+test.each(blockedCollectionImageUrls)('blockedCollectionImageUrl', async (url) => {
   const response = await fetch(new Request(url))
-  expect(response.status).toBe(404)
+  expect(response.status).toBeOneOf([404, 500])
 })

functions/api/image/tokens/[[index]].tsx

@@ -2,8 +2,8 @@
 import { ImageResponse } from '@vercel/og'
 import React from 'react'
 
+import { getColor } from '../../../../src/utils/getColor'
 import { WATERMARK_URL } from '../../../constants'
-import getColor from '../../../utils/getColor'
 import getFont from '../../../utils/getFont'
 import getNetworkLogoUrl from '../../../utils/getNetworkLogoURL'
 import { getRequest } from '../../../utils/getRequest'

functions/components/metaTagInjector.test.ts

@@ -6,12 +6,15 @@ test('should append meta tag to element', () => {
   } as unknown as Element
   const property = 'property'
   const content = 'content'
-  const injector = new MetaTagInjector({
-    title: 'test',
-    url: 'testUrl',
-    image: 'testImage',
-    description: 'testDescription',
-  })
+  const injector = new MetaTagInjector(
+    {
+      title: 'test',
+      url: 'testUrl',
+      image: 'testImage',
+      description: 'testDescription',
+    },
+    new Request('http://localhost')
+  )
   injector.append(element, property, content)
   expect(element.append).toHaveBeenCalledWith(`<meta property="${property}" content="${content}"/>`, { html: true })
 
@@ -36,3 +39,22 @@ test('should append meta tag to element', () => {
 
   expect(element.append).toHaveBeenCalledTimes(13)
 })
+
+test('should pass through header blocked paths', () => {
+  const element = {
+    append: jest.fn(),
+  } as unknown as Element
+  const request = new Request('http://localhost')
+  request.headers.set('x-blocked-paths', '/')
+  const injector = new MetaTagInjector(
+    {
+      title: 'test',
+      url: 'testUrl',
+      image: 'testImage',
+      description: 'testDescription',
+    },
+    request
+  )
+  injector.element(element)
+  expect(element.append).toHaveBeenCalledWith(`<meta property="x:blocked-paths" content="/"/>`, { html: true })
+})

functions/components/metaTagInjector.ts

@@ -10,7 +10,7 @@ type MetaTagInjectorInput = {
  * to inject meta tags into the <head> of an HTML document.
  */
 export class MetaTagInjector implements HTMLRewriterElementContentHandlers {
-  constructor(private input: MetaTagInjectorInput) {}
+  constructor(private input: MetaTagInjectorInput, private request: Request) {}
 
   append(element: Element, property: string, content: string) {
     element.append(`<meta property="${property}" content="${content}"/>`, { html: true })
@@ -38,5 +38,10 @@ export class MetaTagInjector implements HTMLRewriterElementContentHandlers {
       this.append(element, 'twitter:image', this.input.image)
       this.append(element, 'twitter:image:alt', this.input.title)
     }
+
+    const blockedPaths = this.request.headers.get('x-blocked-paths')
+    if (blockedPaths) {
+      this.append(element, 'x:blocked-paths', blockedPaths)
+    }
   }
 }

functions/constants.ts

@@ -1,76 +1,2 @@
 export const WATERMARK_URL = 'https://app.uniswap.org/images/324x74_App_Watermark.png'
 export const CHECK_URL = 'https://app.uniswap.org/images/54x54_Verified_Check.svg'
-
-export const DEFAULT_COLOR = [35, 43, 43]
-
-export const predefinedTokenColors: { [key: string]: number[] } = {
-  // old WBTC
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599/logo.png':
-    [240, 146, 65],
-  // new WBTC
-  'https://assets.coingecko.com/coins/images/7598/large/wrapped_bitcoin_wbtc.png?1548822744': [240, 146, 65],
-  // DAI
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x6B175474E89094C44Da98b954EedeAC495271d0F/logo.png':
-    [250, 176, 27],
-  // UNI
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984/logo.png':
-    [230, 53, 140],
-  // BUSD
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x4Fabb145d64652a948d72533023f6E7A623C7C53/logo.png':
-    [239, 186, 9],
-  // AI-X
-  'https://s2.coinmarketcap.com/static/img/coins/64x64/26984.png': [41, 161, 241],
-  // ETH
-  'https://token-icons.s3.amazonaws.com/eth.png': [73, 112, 213],
-  // HARRYPOTTERSHIBAINUBITCOIN
-  'https://assets.coingecko.com/coins/images/30323/large/hpos10i_logo_casino_night-dexview.png?1684117567': [
-    222, 49, 16,
-  ],
-  // PEPE
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x6982508145454Ce325dDbE47a25d4ec3d2311933/logo.png':
-    [62, 174, 20],
-  // Unibot V2
-  'https://s2.coinmarketcap.com/static/img/coins/64x64/25436.png': [74, 10, 79],
-  // UNIBOT v1
-  'https://assets.coingecko.com/coins/images/30462/small/logonoline_%281%29.png?1687510315': [74, 10, 79],
-  // USDC
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png':
-    [0, 102, 217],
-  // HEX
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x2b591e99afE9f32eAA6214f7B7629768c40Eeb39/logo.png':
-    [249, 63, 140],
-  // MONG
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x1ce270557C1f68Cfb577b856766310Bf8B47FD9C/logo.png':
-    [169, 109, 255],
-  // ARB
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xB50721BCf8d664c30412Cfbc6cf7a15145234ad1/logo.png':
-    [41, 161, 241],
-  // PSYOP
-  'https://s2.coinmarketcap.com/static/img/coins/64x64/25422.png': [232, 143, 0],
-  // MATIC
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x7D1AfA7B718fb893dB30A3aBc0Cfc608AaCfeBB0/logo.png':
-    [169, 109, 255],
-  // TURBO
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA35923162C49cF95e6BF26623385eb431ad920D3/logo.png':
-    [189, 110, 41],
-  // AIDOGE
-  'https://assets.coingecko.com/coins/images/29852/large/photo_2023-04-18_14-25-28.jpg?1681799160': [41, 161, 241],
-  // SIMPSON
-  'https://assets.coingecko.com/coins/images/30243/large/1111.png?1683692033': [232, 143, 0],
-  // OX
-  'https://assets.coingecko.com/coins/images/30604/large/Logo2.png?1685522119': [41, 89, 217],
-  // ANGLE
-  'https://assets.coingecko.com/coins/images/19060/large/ANGLE_Token-light.png?1666774221': [255, 85, 85],
-  // APE
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x4d224452801ACEd8B2F0aebE155379bb5D594381/logo.png':
-    [5, 74, 169],
-  // GUSD
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x056Fd409E1d7A124BD7017459dFEa2F387b6d5Cd/logo.png':
-    [0, 164, 189],
-  // OGN
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0x8207c1FfC5B6804F6024322CcF34F29c3541Ae26/logo.png':
-    [5, 74, 169],
-  // RPL
-  'https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xD33526068D116cE69F19A9ee46F0bd304F21A51f/logo.png':
-    [255, 123, 79],
-}

functions/global-setup.ts

@@ -1,19 +0,0 @@
-import { setup } from 'jest-dev-server'
-
-module.exports = async function globalSetup() {
-  globalThis.servers = await setup({
-    command: `yarn start:cloud`,
-    port: 3000,
-    launchTimeout: 120000, // takes ~2m on CI
-  })
-  // Wait for wrangler to return a request before running tests
-  for (let i = 0; i < 3; i++) {
-    const res = await fetch(new Request('http://127.0.0.1:3000/tokens/ethereum/NATIVE'))
-    if (res.ok) {
-      return
-    }
-    // Set timeout to make sure the server isn't flooded with requests if wrangler is not running
-    await new Promise((resolve) => setTimeout(resolve, 500 * (i + 1)))
-  }
-  throw new Error('Failed to start server')
-}

functions/global-teardown.ts

@@ -1,5 +0,0 @@
-import { teardown } from 'jest-dev-server'
-
-module.exports = async function globalTeardown() {
-  await teardown(globalThis.servers)
-}

functions/global.d.ts

@@ -1,6 +0,0 @@
-import { setup } from 'jest-dev-server'
-
-declare global {
-  // eslint-disable-next-line no-var
-  var servers: Awaited<ReturnType<typeof setup>>
-}

functions/jest.config.json

@@ -1,6 +1,4 @@
 {
-  "globalSetup": "<rootDir>/global-setup.ts",
-  "globalTeardown": "<rootDir>/global-teardown.ts",
   "setupFilesAfterEnv": ["<rootDir>/setupAfterEnv.ts"],
   "preset": "ts-jest",
   "transform": {

functions/nfts/asset/[[index]].ts

@@ -8,7 +8,7 @@ export const onRequest: PagesFunction = async ({ params, request, next }) => {
     const { index } = params
     const collectionAddress = index[0]?.toString()
     const tokenId = index[1]?.toString()
-    return getMetadataRequest(res, request.url, () => getAsset(collectionAddress, tokenId, request.url))
+    return getMetadataRequest(res, request, () => getAsset(collectionAddress, tokenId, request.url))
   } catch (e) {
     return res
   }

functions/nfts/asset/__snapshots__/nft.test.ts.snap

@@ -17,7 +17,7 @@ exports[`should inject metadata for valid assets 1`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -37,6 +37,9 @@ exports[`should inject metadata for valid assets 1`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -119,13 +122,13 @@ exports[`should inject metadata for valid assets 1`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -162,7 +165,7 @@ exports[`should inject metadata for valid assets 2`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -182,6 +185,9 @@ exports[`should inject metadata for valid assets 2`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -264,13 +270,13 @@ exports[`should inject metadata for valid assets 2`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -307,7 +313,7 @@ exports[`should inject metadata for valid assets 3`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -327,6 +333,9 @@ exports[`should inject metadata for valid assets 3`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -409,13 +418,13 @@ exports[`should inject metadata for valid assets 3`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>

functions/nfts/collection/[index].ts

@@ -7,7 +7,7 @@ export const onRequest: PagesFunction = async ({ params, request, next }) => {
   try {
     const { index } = params
     const collectionAddress = index?.toString()
-    return getMetadataRequest(res, request.url, () => getCollection(collectionAddress, request.url))
+    return getMetadataRequest(res, request, () => getCollection(collectionAddress, request.url))
   } catch (e) {
     return res
   }

functions/nfts/collection/__snapshots__/collection.test.ts.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`should inject metadata for valid collections 1`] = `
+exports[`should inject metadata for collections 1`] = `
 "<!DOCTYPE html>
 <html translate="no">
   <head>
@@ -17,7 +17,7 @@ exports[`should inject metadata for valid collections 1`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -37,6 +37,9 @@ exports[`should inject metadata for valid collections 1`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -119,13 +122,13 @@ exports[`should inject metadata for valid collections 1`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -145,7 +148,7 @@ exports[`should inject metadata for valid collections 1`] = `
 "
 `;
 
-exports[`should inject metadata for valid collections 2`] = `
+exports[`should inject metadata for collections 2`] = `
 "<!DOCTYPE html>
 <html translate="no">
   <head>
@@ -162,7 +165,7 @@ exports[`should inject metadata for valid collections 2`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -182,6 +185,9 @@ exports[`should inject metadata for valid collections 2`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -264,13 +270,13 @@ exports[`should inject metadata for valid collections 2`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -290,7 +296,7 @@ exports[`should inject metadata for valid collections 2`] = `
 "
 `;
 
-exports[`should inject metadata for valid collections 3`] = `
+exports[`should inject metadata for collections 3`] = `
 "<!DOCTYPE html>
 <html translate="no">
   <head>
@@ -307,7 +313,7 @@ exports[`should inject metadata for valid collections 3`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -327,6 +333,9 @@ exports[`should inject metadata for valid collections 3`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -409,13 +418,13 @@ exports[`should inject metadata for valid collections 3`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -434,3 +443,151 @@ exports[`should inject metadata for valid collections 3`] = `
 </html>
 "
 `;
+
+exports[`should inject metadata for collections 4`] = `
+"<!DOCTYPE html>
+<html translate="no">
+  <head>
+    <meta charset="utf-8" />
+
+    <title>Uniswap Interface</title>
+
+    <!--
+       will be replaced with the URL of the \`public\` folder during build.
+      Only files inside the \`public\` folder can be referenced from the HTML.
+    -->
+    <link rel="shortcut icon" type="image/png" href="/favicon.png" />
+    <link rel="apple-touch-icon" sizes="192x192" href="/images/192x192_App_Icon.png" />
+    <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
+
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <meta name="theme-color" content="#fff" />
+    <meta
+      http-equiv="Content-Security-Policy"
+      
+        content="script-src 'self' 'unsafe-inline'"
+      
+    />
+
+    <!-- 
+      Apple Smart App Banner for Safari on iOS
+      https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners
+     -->
+    <meta name="apple-itunes-app" content="app-id=6443944476">
+
+    <!--
+      manifest.json provides metadata used when the app is installed as a PWA.
+      See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="/manifest.json" />
+
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
+    <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
+    <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
+
+   
+    <style>
+      * {
+        font-family: 'Basel', sans-serif;
+        box-sizing: border-box;
+      }
+
+      /**
+          Explicitly load Basel var from public/ so it does not block LCP's critical path.
+        */
+      @font-face {
+        font-family: 'Basel';
+        font-weight: 535;
+        font-style: normal;
+        font-display: block;
+        font-named-instance: 'Book';
+        src: 
+          url(/fonts/Basel-Medium.woff) format('woff');
+      }
+
+      @font-face {
+        font-family: 'Basel';
+        font-weight: 485;
+        font-style: normal;
+        font-display: block;
+        font-named-instance: 'Book';
+        src: 
+          url(/fonts/Basel-Book.woff) format('woff');
+      }
+
+      @supports (font-variation-settings: normal) {
+        * {
+          font-family: 'Basel', sans-serif;
+          
+        }
+      }
+
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+      }
+
+      button {
+        user-select: none;
+      }
+
+      html {
+        font-size: 16px;
+        font-weight: 485;
+        font-variant: none;
+        font-smooth: always;
+        text-rendering: optimizeLegibility !important;
+        -webkit-font-smoothing: antialiased !important;
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+      }
+
+      /* Use this to apply network-specific gradient backgrounds, in RadialGradientByChainUpdater.ts */
+      #background-radial-gradient {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        pointer-events: none;
+        width: 200vw;
+        height: 200vh;
+        transform: translate(-50vw, -100vh);
+        z-index: -1;
+      }
+
+      html,
+      body,
+      #root {
+        min-height: 100%;
+      }
+
+      @media (prefers-color-scheme: dark) {
+        html {
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
+        }
+      }
+
+      @media (prefers-color-scheme: light) {
+        html {
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
+        }
+      }
+    </style>
+  <script defer src="/static/js/bundle.js"></script><meta property="og:title" content="0xed5af388653567af2f388e6224dc7c4b3241c545 on Uniswap"/><meta property="og:image" content="http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545"/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="630"/><meta property="og:image:alt" content="0xed5af388653567af2f388e6224dc7c4b3241c545 on Uniswap"/><meta property="og:type" content="website"/><meta property="og:url" content="http://127.0.0.1:3000/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545"/><meta property="twitter:card" content="summary_large_image"/><meta property="twitter:title" content="0xed5af388653567af2f388e6224dc7c4b3241c545 on Uniswap"/><meta property="twitter:image" content="http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545"/><meta property="twitter:image:alt" content="0xed5af388653567af2f388e6224dc7c4b3241c545 on Uniswap"/></head>
+
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+
+    <div id="root">
+      <!-- Triggers the font to load immediately and then is replaced by the app -->
+      <div>&emsp;</div>
+    </div>
+
+    <div id="background-radial-gradient"></div>
+  </body>
+</html>
+"
+`;

functions/nfts/collection/collection.test.ts

@@ -16,7 +16,15 @@ const collections = [
   },
 ]
 
-test.each(collections)('should inject metadata for valid collections', async (collection) => {
+const nonexistentCollections = [
+  {
+    address: '0xed5af388653567af2f388e6224dc7c4b3241c545',
+    collectionName: '0xed5af388653567af2f388e6224dc7c4b3241c545',
+    image: 'http://127.0.0.1:3000/api/image/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545',
+  },
+]
+
+test.each([...collections, ...nonexistentCollections])('should inject metadata for collections', async (collection) => {
   const url = 'http://127.0.0.1:3000/nfts/collection/' + collection.address
   const body = await fetch(new Request(url)).then((res) => res.text())
   expect(body).toMatchSnapshot()
@@ -35,25 +43,23 @@ test.each(collections)('should inject metadata for valid collections', async (co
 })
 
 const invalidCollections = [
-  'http://127.0.0.1:3000/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545',
-  'http://127.0.0.1:3000/nfts/collection/0xed5af388653567af2f388e6224dc7c4b3241c545//',
+  {
+    address: '0xd3adb33f',
+  },
 ]
 
-test.each(invalidCollections)(
-  'should not inject metadata for invalid collection urls',
-  async (url) => {
-    const body = await fetch(new Request(url)).then((res) => res.text())
-    expect(body).not.toContain('og:title')
-    expect(body).not.toContain('og:image')
-    expect(body).not.toContain('og:image:width')
-    expect(body).not.toContain('og:image:height')
-    expect(body).not.toContain('og:type')
-    expect(body).not.toContain('og:url')
-    expect(body).not.toContain('og:image:alt')
-    expect(body).not.toContain('twitter:card')
-    expect(body).not.toContain('twitter:title')
-    expect(body).not.toContain('twitter:image')
-    expect(body).not.toContain('twitter:image:alt')
-  },
-  50000
-)
+test.each(invalidCollections)('should not inject metadata for nonexistent collections', async (collection) => {
+  const url = 'http://127.0.0.1:3000/nfts/collection/' + collection.address
+  const body = await fetch(new Request(url)).then((res) => res.text())
+  expect(body).not.toContain('og:title')
+  expect(body).not.toContain('og:image')
+  expect(body).not.toContain('og:image:width')
+  expect(body).not.toContain('og:image:height')
+  expect(body).not.toContain('og:type')
+  expect(body).not.toContain('og:url')
+  expect(body).not.toContain('og:image:alt')
+  expect(body).not.toContain('twitter:card')
+  expect(body).not.toContain('twitter:title')
+  expect(body).not.toContain('twitter:image')
+  expect(body).not.toContain('twitter:image:alt')
+})

functions/tokens/[[index]].ts

@@ -11,7 +11,7 @@ export const onRequest: PagesFunction = async ({ params, request, next }) => {
     if (!tokenAddress) {
       return res
     }
-    return getMetadataRequest(res, request.url, () => getToken(networkName, tokenAddress, request.url))
+    return getMetadataRequest(res, request, () => getToken(networkName, tokenAddress, request.url))
   } catch (e) {
     return res
   }

functions/tokens/__snapshots__/token.test.ts.snap

@@ -17,7 +17,7 @@ exports[`should inject metadata for valid tokens 1`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -37,6 +37,9 @@ exports[`should inject metadata for valid tokens 1`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -119,13 +122,13 @@ exports[`should inject metadata for valid tokens 1`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -162,7 +165,7 @@ exports[`should inject metadata for valid tokens 2`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -182,6 +185,9 @@ exports[`should inject metadata for valid tokens 2`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -264,13 +270,13 @@ exports[`should inject metadata for valid tokens 2`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -307,7 +313,7 @@ exports[`should inject metadata for valid tokens 3`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -327,6 +333,9 @@ exports[`should inject metadata for valid tokens 3`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -409,13 +418,13 @@ exports[`should inject metadata for valid tokens 3`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>
@@ -452,7 +461,7 @@ exports[`should inject metadata for valid tokens 4`] = `
     <link rel="apple-touch-icon" sizes="512x512" href="/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       
@@ -472,6 +481,9 @@ exports[`should inject metadata for valid tokens 4`] = `
     -->
     <link rel="manifest" href="/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 
@@ -554,13 +566,13 @@ exports[`should inject metadata for valid tokens 4`] = `
 
       @media (prefers-color-scheme: dark) {
         html {
-          background: linear-gradient(180deg, #202738 0%, #070816 100%);
+          background: linear-gradient(rgb(19, 19, 19) 0%, rgb(19, 19, 19) 100%);
         }
       }
 
       @media (prefers-color-scheme: light) {
         html {
-          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0.51) 0%, rgba(255, 255, 255, 0) 100%), #FFFFFF
+          background: radial-gradient(100% 100% at 50% 0%, rgba(255, 184, 226, 0) 0%, rgba(255, 255, 255, 0) 100%), rgb(255, 255, 255);
         }
       }
     </style>

functions/utils/getColor.test.ts

@@ -1,39 +0,0 @@
-import { DEFAULT_COLOR } from '../constants'
-import getColor from './getColor'
-
-test('should return the average color of a black PNG image', async () => {
-  const image = 'https://static.vecteezy.com/system/resources/previews/001/209/957/original/square-png.png'
-  const color = await getColor(image)
-  expect(color).toEqual([0, 0, 0])
-})
-
-test('should return the average color of a blue PNG image', async () => {
-  const image = 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTB2Ztcim-RKbOu57kfjYpXnnS1MO5YMUaUH9Lk5Eg&s'
-  const color = await getColor(image)
-  expect(color).toEqual([2, 6, 251])
-})
-
-test('should return the average color of a white PNG image', async () => {
-  const image = 'https://www.cac.cornell.edu/wiki/images/4/44/White_square.png'
-  const color = await getColor(image)
-  expect(color).toEqual([255, 255, 255])
-})
-
-test('should return the average color of a white PNG image with whiteness dimmed', async () => {
-  const image = 'https://www.cac.cornell.edu/wiki/images/4/44/White_square.png'
-  const color = await getColor(image, true)
-  expect(color).toEqual(DEFAULT_COLOR)
-})
-
-test('should return the average color of a black JPG image', async () => {
-  const image =
-    'https://imageio.forbes.com/specials-images/imageserve/5ed6636cdd5d320006caf841/0x0.jpg?format=jpg&width=1200'
-  const color = await getColor(image)
-  expect(color).toEqual([0, 0, 0])
-})
-
-test('should return default color for a gif image', async () => {
-  const image = 'https://thumbs.gfycat.com/AgitatedLiveAgouti-size_restricted.gif'
-  const color = await getColor(image)
-  expect(color).toEqual(DEFAULT_COLOR)
-})

functions/utils/getRequest.ts

@@ -4,13 +4,13 @@ import { Data } from './cache'
 
 export async function getMetadataRequest(
   res: Promise<Response>,
-  url: string,
+  request: Request,
   getData: () => Promise<Data | undefined>
 ) {
   try {
-    const cachedData = await getRequest(url, getData, (data): data is Data => true)
+    const cachedData = await getRequest(request.url, getData, (data): data is Data => true)
     if (cachedData) {
-      return new HTMLRewriter().on('head', new MetaTagInjector(cachedData)).transform(await res)
+      return new HTMLRewriter().on('head', new MetaTagInjector(cachedData, request)).transform(await res)
     } else {
       return res
     }

package.json

@@ -13,6 +13,7 @@
     "graphql:generate:thegraph": "graphql-codegen --config graphql.thegraph.codegen.config.ts",
     "graphql:generate": "yarn graphql:generate:data && yarn graphql:generate:thegraph",
     "graphql": "yarn graphql:fetch && yarn graphql:generate",
+    "sitemap:generate": "node scripts/generate-sitemap.js",
     "i18n:extract": "lingui extract --locale en-US",
     "i18n:compile": "lingui compile",
     "i18n": "yarn i18n:extract --clean && yarn i18n:compile",
@@ -20,14 +21,14 @@
     "start": "craco start",
     "start:cloud": "NODE_OPTIONS=--dns-result-order=ipv4first PORT=3001 npx wrangler pages dev --compatibility-flags=nodejs_compat --compatibility-date=2023-08-01 --proxy=3001 --port=3000 -- yarn start",
     "build": "craco build",
-    "analyze": "source-map-explorer 'build/static/js/*.js' --only-mapped",
-    "serve": "serve build -l 3000",
+    "analyze": "source-map-explorer 'build/static/js/*.js' --no-border-checks --gzip",
+    "serve": "serve build -s -l 3000",
     "lint": "yarn eslint --ignore-path .gitignore --cache --cache-location node_modules/.cache/eslint/ .",
     "typecheck": "tsc",
     "typecheck:cloud": "tsc -p functions/tsconfig.json",
     "typecheck:cypress": "tsc -p cypress/tsconfig.json",
     "test": "craco test",
-    "test:cloud": "NODE_OPTIONS=--experimental-vm-modules yarn jest functions --config=functions/jest.config.json",
+    "test:cloud": "yarn jest functions --config=functions/jest.config.json",
     "cypress:open": "cypress open --browser chrome --e2e",
     "cypress:run": "cypress run --browser chrome --e2e",
     "deduplicate": "yarn-deduplicate --strategy=highest",
@@ -105,7 +106,6 @@
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
     "@types/react-redux": "^7.1.24",
-    "@types/react-router-dom": "^5.3.3",
     "@types/react-table": "^7.7.12",
     "@types/react-virtualized-auto-sizer": "^1.0.0",
     "@types/react-window": "^1.8.2",
@@ -115,6 +115,7 @@
     "@types/ua-parser-js": "^0.7.36",
     "@types/uuid": "^8.3.4",
     "@types/wcag-contrast": "^3.0.0",
+    "@types/xml2js": "^0.4.12",
     "@uniswap/default-token-list": "^11.2.0",
     "@uniswap/eslint-config": "^1.2.0",
     "@vanilla-extract/jest-transform": "^1.1.1",
@@ -134,7 +135,6 @@
     "hardhat": "^2.14.0",
     "husky": "^8.0.3",
     "jest": "^29.6.1",
-    "jest-dev-server": "^9.0.0",
     "jest-extended": "^4.0.1",
     "jest-fail-on-console": "^3.1.1",
     "jest-fetch-mock": "^3.0.3",
@@ -152,7 +152,9 @@
     "resize-observer-polyfill": "^1.5.1",
     "serve": "^11.3.2",
     "source-map-explorer": "^2.5.3",
+    "start-server-and-test": "^2.0.0",
     "swc-loader": "^0.2.3",
+    "terser": "^5.19.4",
     "terser-webpack-plugin": "^5.3.9",
     "ts-jest": "^29.1.1",
     "ts-transform-graphql-tag": "^0.2.1",
@@ -161,7 +163,7 @@
     "typescript": "^4.9.4",
     "webpack": "^5.88.2",
     "webpack-retry-chunk-load-plugin": "^3.1.1",
-    "wrangler": "^3.5.0",
+    "wrangler": "^3.7.0",
     "yarn-deduplicate": "^6.0.0"
   },
   "dependencies": {
@@ -189,9 +191,10 @@
     "@sentry/react": "^7.45.0",
     "@sentry/tracing": "^7.45.0",
     "@sentry/types": "^7.45.0",
+    "@types/react-helmet": "^6.1.7",
     "@types/react-window-infinite-loader": "^1.0.6",
-    "@uniswap/analytics": "^1.4.0",
-    "@uniswap/analytics-events": "^2.18.0",
+    "@uniswap/analytics": "1.5.0",
+    "@uniswap/analytics-events": "^2.24.0",
     "@uniswap/governance": "^1.0.2",
     "@uniswap/liquidity-staker": "^1.0.2",
     "@uniswap/merkle-distributor": "^1.0.1",
@@ -201,8 +204,8 @@
     "@uniswap/sdk-core": "^4.0.3",
     "@uniswap/smart-order-router": "^3.15.0",
     "@uniswap/token-lists": "^1.0.0-beta.33",
-    "@uniswap/uniswapx-sdk": "^1.3.0",
-    "@uniswap/universal-router-sdk": "^1.5.6",
+    "@uniswap/uniswapx-sdk": "^1.4.1",
+    "@uniswap/universal-router-sdk": "^1.5.8",
     "@uniswap/v2-core": "^1.0.1",
     "@uniswap/v2-periphery": "^1.1.0-beta.0",
     "@uniswap/v2-sdk": "^3.2.0",
@@ -220,16 +223,16 @@
     "@visx/react-spring": "^2.12.2",
     "@visx/responsive": "^2.10.0",
     "@visx/shape": "^2.11.1",
-    "@web3-react/coinbase-wallet": "^8.2.2",
-    "@web3-react/core": "^8.2.2",
-    "@web3-react/eip1193": "^8.2.2",
-    "@web3-react/empty": "^8.2.2",
-    "@web3-react/gnosis-safe": "^8.2.3",
-    "@web3-react/metamask": "^8.2.3",
-    "@web3-react/network": "^8.2.2",
-    "@web3-react/types": "^8.2.2",
-    "@web3-react/url": "^8.2.2",
-    "@web3-react/walletconnect-v2": "^8.5.0",
+    "@web3-react/coinbase-wallet": "^8.2.3",
+    "@web3-react/core": "^8.2.3",
+    "@web3-react/eip1193": "^8.2.3",
+    "@web3-react/empty": "^8.2.3",
+    "@web3-react/gnosis-safe": "^8.2.4",
+    "@web3-react/metamask": "^8.2.4",
+    "@web3-react/network": "^8.2.3",
+    "@web3-react/types": "^8.2.3",
+    "@web3-react/url": "^8.2.3",
+    "@web3-react/walletconnect-v2": "^8.5.1",
     "ajv": "^8.11.0",
     "ajv-formats": "^2.1.1",
     "array.prototype.flat": "^1.2.4",
@@ -253,6 +256,8 @@
     "ms": "^2.1.3",
     "multicodec": "^3.0.1",
     "multihashes": "^4.0.2",
+    "nock": "^13.3.3",
+    "node-fetch": "^3.3.2",
     "node-vibrant": "^3.2.1-alpha.1",
     "numbro": "^2.3.6",
     "polished": "^3.3.2",
@@ -263,7 +268,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-feather": "^2.0.8",
-    "react-ga4": "^1.4.1",
+    "react-helmet": "^6.1.0",
     "react-infinite-scroll-component": "^6.1.0",
     "react-is": "^17.0.2",
     "react-markdown": "^4.3.1",
@@ -293,6 +298,7 @@
     "workbox-navigation-preload": "^6.1.0",
     "workbox-precaching": "^6.1.0",
     "workbox-routing": "^6.1.0",
+    "xml2js": "^0.6.2",
     "zustand": "^4.3.6"
   },
   "engines": {

patches/@vercel+og+0.5.8.patch

@@ -1,5 +1,5 @@
 diff --git a/node_modules/@vercel/og/dist/index.edge.js b/node_modules/@vercel/og/dist/index.edge.js
-index 5187f88..c4a1c41 100644
+index 5187f88..eda01d0 100644
 --- a/node_modules/@vercel/og/dist/index.edge.js
 +++ b/node_modules/@vercel/og/dist/index.edge.js
 @@ -18673,8 +18673,8 @@ var Resvg2 = class extends Resvg {
@@ -13,12 +13,11 @@ index 5187f88..c4a1c41 100644
  
  // src/emoji/index.ts
  var U200D = String.fromCharCode(8205);
-@@ -18809,18 +18809,18 @@ async function render(satori, resvg, opts, defaultFonts, element) {
+@@ -18809,18 +18809,15 @@ async function render(satori, resvg, opts, defaultFonts, element) {
  // src/index.edge.ts
  var initializedResvg = initWasm(resvg_wasm);
  var initializedYoga = initYoga(yoga_wasm).then((yoga2) => Ll(yoga2));
 -var fallbackFont = fetch(new URL("./noto-sans-v27-latin-regular.ttf", import.meta.url)).then((res) => res.arrayBuffer());
-+// var fallbackFont = fetch(new URL("https://fonts.gstatic.com/s/notosans/v28/o-0IIpQlx3QUlC5A4PNr6zRF.ttf", import.meta.url)).then((res) => res.arrayBuffer());
  var ImageResponse = class {
    constructor(element, options = {}) {
      const result = new ReadableStream({
@@ -26,22 +25,22 @@ index 5187f88..c4a1c41 100644
          await initializedYoga;
          await initializedResvg;
 -        const fontData = await fallbackFont;
-+        // const fontData = await fallbackFont;
          const fonts = [
            {
              name: "sans serif",
 -            data: fontData,
-+            // data: fontData,
              weight: 700,
              style: "normal"
            }
 diff --git a/node_modules/@vercel/og/dist/types.d.ts b/node_modules/@vercel/og/dist/types.d.ts
-index dde26cc..eb59ff4 100644
+index dde26cc..d075e99 100644
 --- a/node_modules/@vercel/og/dist/types.d.ts
 +++ b/node_modules/@vercel/og/dist/types.d.ts
-@@ -30,7 +30,7 @@ declare type ImageOptions = {
+@@ -28,9 +28,8 @@ declare type ImageOptions = {
+      * A list of fonts to use.
+      *
       * @type {{ data: ArrayBuffer; name: string; weight?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900; style?: 'normal' | 'italic' }[]}
-      * @default Noto Sans Latin Regular.
+-     * @default Noto Sans Latin Regular.
       */
 -    fonts?: SatoriOptions['fonts'];
 +    fonts: SatoriOptions['fonts'];

patches/@web3-react+coinbase-wallet+8.2.3.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/@web3-react/coinbase-wallet/dist/index.js b/node_modules/@web3-react/coinbase-wallet/dist/index.js
+index f38d06e..4f8fa19 100644
+--- a/node_modules/@web3-react/coinbase-wallet/dist/index.js
++++ b/node_modules/@web3-react/coinbase-wallet/dist/index.js
+@@ -62,7 +62,7 @@ class CoinbaseWallet extends types_1.Connector {
+         return __awaiter(this, void 0, void 0, function* () {
+             if (this.eagerConnection)
+                 return;
+-            yield (this.eagerConnection = Promise.resolve().then(() => __importStar(require('@coinbase/wallet-sdk'))).then((m) => {
++            yield (this.eagerConnection = Promise.resolve().then(async () => __importStar(await import('@coinbase/wallet-sdk'))).then((m) => {
+                 const _a = this.options, { url } = _a, options = __rest(_a, ["url"]);
+                 this.coinbaseWallet = new m.default(options);
+                 this.provider = this.coinbaseWallet.makeWeb3Provider(url);

patches/@web3-react+gnosis-safe+8.2.4.patch

@@ -0,0 +1,15 @@
+diff --git a/node_modules/@web3-react/gnosis-safe/dist/index.js b/node_modules/@web3-react/gnosis-safe/dist/index.js
+index 015a33c..4cd7cde 100644
+--- a/node_modules/@web3-react/gnosis-safe/dist/index.js
++++ b/node_modules/@web3-react/gnosis-safe/dist/index.js
+@@ -68,8 +68,8 @@ class GnosisSafe extends types_1.Connector {
+             if (this.eagerConnection)
+                 return;
+             // kick off import early to minimize waterfalls
+-            const SafeAppProviderPromise = Promise.resolve().then(() => __importStar(require('@safe-global/safe-apps-provider'))).then(({ SafeAppProvider }) => SafeAppProvider);
+-            yield (this.eagerConnection = Promise.resolve().then(() => __importStar(require('@safe-global/safe-apps-sdk'))).then((m) => __awaiter(this, void 0, void 0, function* () {
++            const SafeAppProviderPromise = Promise.resolve().then(async () => __importStar(await import('@safe-global/safe-apps-provider'))).then(({ SafeAppProvider }) => SafeAppProvider);
++            yield (this.eagerConnection = Promise.resolve().then(async () => __importStar(await import('@safe-global/safe-apps-sdk'))).then((m) => __awaiter(this, void 0, void 0, function* () {
+                 this.sdk = new m.default(this.options);
+                 const safe = yield Promise.race([
+                     this.sdk.safe.getInfo(),

patches/@web3-react+metamask+8.2.4.patch

@@ -0,0 +1,13 @@
+diff --git a/node_modules/@web3-react/metamask/dist/index.js b/node_modules/@web3-react/metamask/dist/index.js
+index c8476dd..c0bfce7 100644
+--- a/node_modules/@web3-react/metamask/dist/index.js
++++ b/node_modules/@web3-react/metamask/dist/index.js
+@@ -54,7 +54,7 @@ class MetaMask extends types_1.Connector {
+         return __awaiter(this, void 0, void 0, function* () {
+             if (this.eagerConnection)
+                 return;
+-            return (this.eagerConnection = Promise.resolve().then(() => __importStar(require('@metamask/detect-provider'))).then((m) => __awaiter(this, void 0, void 0, function* () {
++            return (this.eagerConnection = Promise.resolve().then(async () => __importStar(await import('@metamask/detect-provider'))).then((m) => __awaiter(this, void 0, void 0, function* () {
+                 var _a, _b;
+                 const provider = yield m.default(this.options);
+                 if (provider) {

patches/@web3-react+walletconnect-v2+8.5.1.patch

@@ -0,0 +1,28 @@
+diff --git a/node_modules/@web3-react/walletconnect-v2/dist/index.js b/node_modules/@web3-react/walletconnect-v2/dist/index.js
+index 1a36d14..908b8c5 100644
+--- a/node_modules/@web3-react/walletconnect-v2/dist/index.js
++++ b/node_modules/@web3-react/walletconnect-v2/dist/index.js
+@@ -84,7 +84,7 @@ class WalletConnect extends types_1.Connector {
+         return __awaiter(this, void 0, void 0, function* () {
+             const rpcMap = this.rpcMap ? (0, utils_1.getBestUrlMap)(this.rpcMap, this.timeout) : undefined;
+             const chainProps = this.getChainProps(this.chains, this.optionalChains, desiredChainId);
+-            const ethProviderModule = yield Promise.resolve().then(() => __importStar(require('@walletconnect/ethereum-provider')));
++            const ethProviderModule = yield Promise.resolve().then(async () => __importStar(await import('@walletconnect/ethereum-provider')));
+             this.provider = yield ethProviderModule.default.init(Object.assign(Object.assign(Object.assign({}, this.options), chainProps), { rpcMap: yield rpcMap }));
+             return this.provider
+                 .on('disconnect', this.disconnectListener)
+diff --git a/node_modules/@web3-react/walletconnect-v2/dist/utils.js b/node_modules/@web3-react/walletconnect-v2/dist/utils.js
+index 17539b6..9ea6371 100644
+--- a/node_modules/@web3-react/walletconnect-v2/dist/utils.js
++++ b/node_modules/@web3-react/walletconnect-v2/dist/utils.js
+@@ -62,8 +62,8 @@ function getBestUrl(urls, timeout) {
+         if (urls.length === 1)
+             return urls[0];
+         const [HttpConnection, JsonRpcProvider] = yield Promise.all([
+-            Promise.resolve().then(() => __importStar(require('@walletconnect/jsonrpc-http-connection'))).then(({ HttpConnection }) => HttpConnection),
+-            Promise.resolve().then(() => __importStar(require('@walletconnect/jsonrpc-provider'))).then(({ JsonRpcProvider }) => JsonRpcProvider),
++            Promise.resolve().then(async () => __importStar(await import('@walletconnect/jsonrpc-http-connection'))).then(({ HttpConnection }) => HttpConnection),
++            Promise.resolve().then(async () => __importStar(await import('@walletconnect/jsonrpc-provider'))).then(({ JsonRpcProvider }) => JsonRpcProvider),
+         ]);
+         // the below returns the first url for which there's been a successful call, prioritized by index
+         return new Promise((resolve) => {

public/.well-known/assetlinks.json

@@ -3,27 +3,27 @@
     "relation": ["delegate_permission/common.handle_all_urls"],
     "target": {
       "namespace": "android_app",
-      "package_name": "com.uniswap",
+      "package_name": "com.uniswap.mobile",
       "sha256_cert_fingerprints":
-        ["97:A5:81:51:DA:AF:8F:6E:65:3A:90:1E:82:12:6C:FB:61:2D:36:C7:CF:20:61:6B:A3:4C:52:CA:BC:58:43:8E", "F9:E9:E3:F0:04:28:66:62:81:44:50:7E:D6:A9:5F:B9:65:39:02:70:1D:13:74:15:D3:E1:A3:1B:D4:38:3A:1F"]
+        ["49:D9:3D:5D:FB:AA:64:A4:64:80:85:0F:39:A8:C1:D9:25:D3:D4:BC:8E:6B:1F:45:0C:EA:AF:B1:0C:27:DF:B8", "F9:E9:E3:F0:04:28:66:62:81:44:50:7E:D6:A9:5F:B9:65:39:02:70:1D:13:74:15:D3:E1:A3:1B:D4:38:3A:1F"]
     }
   },
   {
     "relation": ["delegate_permission/common.handle_all_urls"],
     "target": {
       "namespace": "android_app",
-      "package_name": "com.uniswap.beta",
+      "package_name": "com.uniswap.mobile.beta",
       "sha256_cert_fingerprints":
-        ["E5:39:87:DC:4D:FD:4C:1B:A6:74:36:7D:3A:3B:6B:ED:9E:B3:66:89:92:8A:1B:B8:FC:1B:22:56:56:B4:46:A3", "54:4B:62:33:17:9B:5F:A8:E6:5D:D3:A6:E5:9D:80:5F:A5:02:7F:E2:14:B8:C1:7A:AC:4B:8D:E0:65:49:87:41"]
+        ["75:41:9C:2D:01:4A:88:4E:8D:C6:EF:E5:51:54:28:6B:99:05:31:43:AD:84:B4:EB:39:28:B8:C3:C4:CE:48:E3", "54:4B:62:33:17:9B:5F:A8:E6:5D:D3:A6:E5:9D:80:5F:A5:02:7F:E2:14:B8:C1:7A:AC:4B:8D:E0:65:49:87:41"]
     }
   },
   {
     "relation": ["delegate_permission/common.handle_all_urls"],
     "target": {
       "namespace": "android_app",
-      "package_name": "com.uniswap.dev",
+      "package_name": "com.uniswap.mobile.dev",
       "sha256_cert_fingerprints":
-        ["5A:6D:23:50:2F:1E:0D:01:DC:96:65:F3:3A:18:4C:4C:8C:67:E0:09:99:9B:B1:9B:BF:44:99:D0:D1:D0:FC:5E", "02:E6:1C:76:8C:75:C3:78:C8:8C:FE:7B:2E:8F:4B:E1:FA:47:F2:F6:1A:DB:57:69:4A:41:99:C6:71:2C:AB:E3", "FA:C6:17:45:DC:09:03:78:6F:B9:ED:E6:2A:96:2B:39:9F:73:48:F0:BB:6F:89:9B:83:32:66:75:91:03:3B:9C"]
+        ["45:F8:15:02:C5:4F:AD:82:E7:51:F0:9C:D1:CA:77:C8:C9:BF:06:A6:D9:5A:55:4F:9E:B8:5F:81:33:2B:D0:DB", "02:E6:1C:76:8C:75:C3:78:C8:8C:FE:7B:2E:8F:4B:E1:FA:47:F2:F6:1A:DB:57:69:4A:41:99:C6:71:2C:AB:E3", "FA:C6:17:45:DC:09:03:78:6F:B9:ED:E6:2A:96:2B:39:9F:73:48:F0:BB:6F:89:9B:83:32:66:75:91:03:3B:9C"]
     }
   }
 ]

public/CODEOWNERS

@@ -1 +0,0 @@
-@uniswap/web-admins

public/index.html

@@ -14,7 +14,7 @@
     <link rel="apple-touch-icon" sizes="512x512" href="%PUBLIC_URL%/images/512x512_App_Icon.png" />
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
-    <meta name="theme-color" content="#FC72FF" />
+    <meta name="theme-color" content="#fff" />
     <meta
       http-equiv="Content-Security-Policy"
       <% if (process.env.REACT_APP_CSP_ALLOW_UNSAFE_EVAL) { %>
@@ -36,6 +36,9 @@
     -->
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
 
+    <link rel="preconnect" href="https://api.uniswap.org/" crossorigin/>
+    <link rel="preconnect" href="https://mainnet.infura.io/" crossorigin/>
+
     <link rel="preload" href="%PUBLIC_URL%/fonts/Basel-Book.woff" as="font" type="font/woff" crossorigin />
     <link rel="preload" href="%PUBLIC_URL%/fonts/Basel-Medium.woff" as="font" type="font/woff" crossorigin />
 

public/robots.txt

@@ -0,0 +1,10 @@
+# *
+User-agent: *
+Disallow: /static/js/
+Allow: /
+
+# Host
+Host: https://app.uniswap.org
+
+# Sitemaps
+Sitemap: https://app.uniswap.org/sitemap.xml

scripts/generate-sitemap.js

@@ -0,0 +1,108 @@
+/* eslint-env node */
+
+const fs = require('fs')
+const { parseStringPromise, Builder } = require('xml2js')
+
+const weekMs = 7 * 24 * 60 * 60 * 1000
+const nowISO = new Date().toISOString()
+
+const getTopTokensQuery = (chain) => `
+  query {
+    topTokens(pageSize: 100, page: 1, chain: ${chain}, orderBy: VOLUME) {
+      address
+    }
+  }
+`
+const chains = ['ETHEREUM', 'ARBITRUM', 'OPTIMISM', 'POLYGON', 'BASE', 'BNB', 'CELO']
+
+const nftTopCollectionsQuery = `
+  query {
+    topCollections(first: 100, duration: MAX) {
+      edges {
+        node {
+          nftContracts {
+            address
+          }
+        }
+      }
+    }
+  }
+`
+
+fs.readFile('./public/sitemap.xml', 'utf8', async (err, data) => {
+  const sitemapURLs = {}
+  try {
+    const sitemap = await parseStringPromise(data)
+    if (sitemap.urlset.url) {
+      sitemap.urlset.url.forEach((url) => {
+        const lastMod = new Date(url.lastmod).getTime()
+        if (lastMod < Date.now() - weekMs) {
+          url.lastmod = nowISO
+        }
+        sitemapURLs[url.loc] = true
+      })
+    }
+
+    for (const chainName of chains) {
+      const tokensResponse = await fetch('https://api.uniswap.org/v1/graphql', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+          Origin: 'https://app.uniswap.org',
+        },
+        body: JSON.stringify({ query: getTopTokensQuery(chainName) }),
+      })
+      const tokensJSON = await tokensResponse.json()
+      const tokenAddresses = tokensJSON.data.topTokens.map((token) => token.address.toLowerCase())
+
+      tokenAddresses.forEach((address) => {
+        const tokenURL = `https://app.uniswap.org/tokens/${chainName.toLowerCase()}/${address}`
+        if (!(tokenURL in sitemapURLs)) {
+          sitemap.urlset.url.push({
+            loc: [tokenURL],
+            lastmod: [nowISO],
+            priority: [0.8],
+          })
+        }
+      })
+    }
+
+    const nftResponse = await fetch('https://api.uniswap.org/v1/graphql', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        Origin: 'https://app.uniswap.org',
+      },
+      body: JSON.stringify({ query: nftTopCollectionsQuery }),
+    })
+    const nftJSON = await nftResponse.json()
+    const collectionAddresses = nftJSON.data.topCollections.edges.map((edge) => edge.node.nftContracts[0].address)
+    collectionAddresses.forEach((address) => {
+      const collectionURL = `https://app.uniswap.org/nfts/collection/${address}`
+      if (!(collectionURL in sitemapURLs)) {
+        sitemap.urlset.url.push({
+          loc: [collectionURL],
+          lastmod: [nowISO],
+          priority: [0.7],
+        })
+      }
+    })
+
+    const builder = new Builder()
+    const xml = builder.buildObject(sitemap)
+    const path = './public/sitemap.xml'
+    fs.writeFile(path, xml, (error) => {
+      if (error) throw error
+      const stats = fs.statSync(path)
+      const fileSizeBytes = stats.size
+      const fileSizeMegabytes = fileSizeBytes / (1024 * 1024)
+
+      if (fileSizeMegabytes > 50) {
+        throw new Error('Generated sitemap file size exceeds 50MB')
+      }
+      console.log('Sitemap updated')
+    })
+  } catch (e) {
+    console.error(e)
+  }
+})

scripts/terser-loader.js

@@ -0,0 +1,15 @@
+/* eslint-env node */
+
+const { minify } = require('terser')
+
+module.exports = async function terserLoader(source, map, meta) {
+  const callback = this.async()
+  const options = this.getOptions()
+  try {
+    const data = await minify(source, options)
+    const { code } = data || {}
+    callback(null, code, map, meta)
+  } catch (e) {
+    callback(e)
+  }
+}

src/abis/fee-on-transfer-detector.json

@@ -0,0 +1,133 @@
+[
+  {
+    "inputs": [
+      {
+        "internalType": "address",
+        "name": "_factoryV2",
+        "type": "address"
+      }
+    ],
+    "stateMutability": "nonpayable",
+    "type": "constructor"
+  },
+  {
+    "inputs": [],
+    "name": "PairLookupFailed",
+    "type": "error"
+  },
+  {
+    "inputs": [],
+    "name": "SameToken",
+    "type": "error"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "address[]",
+        "name": "tokens",
+        "type": "address[]"
+      },
+      {
+        "internalType": "address",
+        "name": "baseToken",
+        "type": "address"
+      },
+      {
+        "internalType": "uint256",
+        "name": "amountToBorrow",
+        "type": "uint256"
+      }
+    ],
+    "name": "batchValidate",
+    "outputs": [
+      {
+        "components": [
+          {
+            "internalType": "uint256",
+            "name": "buyFeeBps",
+            "type": "uint256"
+          },
+          {
+            "internalType": "uint256",
+            "name": "sellFeeBps",
+            "type": "uint256"
+          }
+        ],
+        "internalType": "struct TokenFees[]",
+        "name": "fotResults",
+        "type": "tuple[]"
+      }
+    ],
+    "stateMutability": "nonpayable",
+    "type": "function"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "address",
+        "name": "",
+        "type": "address"
+      },
+      {
+        "internalType": "uint256",
+        "name": "amount0",
+        "type": "uint256"
+      },
+      {
+        "internalType": "uint256",
+        "name": "",
+        "type": "uint256"
+      },
+      {
+        "internalType": "bytes",
+        "name": "data",
+        "type": "bytes"
+      }
+    ],
+    "name": "uniswapV2Call",
+    "outputs": [],
+    "stateMutability": "nonpayable",
+    "type": "function"
+  },
+  {
+    "inputs": [
+      {
+        "internalType": "address",
+        "name": "token",
+        "type": "address"
+      },
+      {
+        "internalType": "address",
+        "name": "baseToken",
+        "type": "address"
+      },
+      {
+        "internalType": "uint256",
+        "name": "amountToBorrow",
+        "type": "uint256"
+      }
+    ],
+    "name": "validate",
+    "outputs": [
+      {
+        "components": [
+          {
+            "internalType": "uint256",
+            "name": "buyFeeBps",
+            "type": "uint256"
+          },
+          {
+            "internalType": "uint256",
+            "name": "sellFeeBps",
+            "type": "uint256"
+          }
+        ],
+        "internalType": "struct TokenFees",
+        "name": "fotResult",
+        "type": "tuple"
+      }
+    ],
+    "stateMutability": "nonpayable",
+    "type": "function"
+  }
+]

src/analytics/index.tsx

@@ -52,3 +52,8 @@ export const sendAnalyticsEvent: typeof sendAnalyticsTraceEvent = (event, proper
     sendAnalyticsTraceEvent(event, properties)
   }
 }
+
+// This is only used for initial page load so we can get the user's country
+export const sendInitializationEvent: typeof sendAnalyticsTraceEvent = (event, properties) => {
+  sendAnalyticsTraceEvent(event, properties)
+}

src/assets/images/bnbCircle.svg

@@ -1,20 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 26.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 2496 2496" style="enable-background:new 0 0 2496 2496;" xml:space="preserve">
-<g>
-	<path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F0B90B;" d="M1248,0c689.3,0,1248,558.7,1248,1248s-558.7,1248-1248,1248
-		S0,1937.3,0,1248S558.7,0,1248,0L1248,0z"/>
-	<path style="fill:#FFFFFF;" d="M685.9,1248l0.9,330l280.4,165v193.2l-444.5-260.7v-524L685.9,1248L685.9,1248z M685.9,918v192.3
-		l-163.3-96.6V821.4l163.3-96.6l164.1,96.6L685.9,918L685.9,918z M1084.3,821.4l163.3-96.6l164.1,96.6L1247.6,918L1084.3,821.4
-		L1084.3,821.4z"/>
-	<path style="fill:#FFFFFF;" d="M803.9,1509.6v-193.2l163.3,96.6v192.3L803.9,1509.6L803.9,1509.6z M1084.3,1812.2l163.3,96.6
-		l164.1-96.6v192.3l-164.1,96.6l-163.3-96.6V1812.2L1084.3,1812.2z M1645.9,821.4l163.3-96.6l164.1,96.6v192.3l-164.1,96.6V918
-		L1645.9,821.4L1645.9,821.4L1645.9,821.4z M1809.2,1578l0.9-330l163.3-96.6v524l-444.5,260.7v-193.2L1809.2,1578L1809.2,1578
-		L1809.2,1578z"/>
-	<polygon style="fill:#FFFFFF;" points="1692.1,1509.6 1528.8,1605.3 1528.8,1413 1692.1,1316.4 1692.1,1509.6 	"/>
-	<path style="fill:#FFFFFF;" d="M1692.1,986.4l0.9,193.2l-281.2,165v330.8l-163.3,95.7l-163.3-95.7v-330.8l-281.2-165V986.4
-		L968,889.8l279.5,165.8l281.2-165.8l164.1,96.6H1692.1L1692.1,986.4z M803.9,656.5l443.7-261.6l444.5,261.6l-163.3,96.6
-		l-281.2-165.8L967.2,753.1L803.9,656.5L803.9,656.5z"/>
-</g>
-</svg>

src/assets/svg/arbitrum_logo.svg

@@ -1,9 +0,0 @@
-<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0.53125 5.04465V10.9554C0.53125 11.3328 0.742546 11.6817 1.08477 11.8698L6.44755 14.8258C6.78977 15.0139 7.21107 15.0139 7.55329 14.8258L12.9161 11.8698C13.2583 11.6817 13.4696 11.3328 13.4696 10.9554V5.04465C13.4696 4.66726 13.2583 4.31833 12.9161 4.13026L7.55329 1.17426C7.21107 0.986184 6.78977 0.986184 6.44755 1.17426L1.08347 4.13026C0.74125 4.31833 0.53125 4.66726 0.53125 5.04465Z" fill="#213147"/>
-<path d="M8.17051 9.14643L7.40569 11.1484C7.38495 11.2041 7.38495 11.2648 7.40569 11.3204L8.72143 14.7652L10.2433 13.9263L8.4168 9.14643C8.37532 9.03631 8.21199 9.03631 8.17051 9.14643Z" fill="#12AAFF"/>
-<path d="M9.70391 5.77961C9.66243 5.66949 9.4991 5.66949 9.45762 5.77961L8.6928 7.78162C8.67206 7.83731 8.67206 7.89793 8.6928 7.95361L10.8485 13.5934L12.3704 12.7545L9.70391 5.77961Z" fill="#12AAFF"/>
-<path d="M7 1.39574C7.03759 1.39574 7.07519 1.40564 7.10889 1.42296L12.9124 4.62147C12.9798 4.65859 13.0213 4.72789 13.0213 4.80089V11.1967C13.0213 11.2709 12.9798 11.339 12.9124 11.3761L7.10889 14.5746C7.07648 14.5932 7.03759 14.6018 7 14.6018C6.96241 14.6018 6.92482 14.5919 6.89111 14.5746L1.08759 11.3786C1.02019 11.3415 0.978704 11.2722 0.978704 11.1992V4.80213C0.978704 4.72789 1.02019 4.65983 1.08759 4.62271L6.89111 1.4242C6.92482 1.40564 6.96241 1.39574 7 1.39574ZM7 0.461548C6.79389 0.461548 6.58648 0.512279 6.40111 0.614978L0.598889 3.81226C0.228148 4.01642 0 4.3938 0 4.80213V11.1979C0 11.6062 0.228148 11.9836 0.598889 12.1878L6.40241 15.3863C6.58778 15.4878 6.79389 15.5397 7.0013 15.5397C7.20741 15.5397 7.41482 15.489 7.60019 15.3863L13.4037 12.1878C13.7744 11.9836 14.0026 11.6062 14.0026 11.1979V4.80213C14.0026 4.3938 13.7744 4.01642 13.4037 3.81226L7.59889 0.614978C7.41352 0.512279 7.20611 0.461548 7 0.461548Z" fill="#9DCCED"/>
-<path d="M3.16162 13.6008L3.6957 12.2051L4.77033 13.0576L3.7657 13.9336L3.16162 13.6008Z" fill="#213147"/>
-<path d="M6.51113 4.3443H5.03983C4.92965 4.3443 4.83113 4.40988 4.79354 4.50887L1.63965 12.7619L3.1615 13.6008L6.63428 4.51258C6.66669 4.43091 6.60317 4.3443 6.51113 4.3443Z" fill="white"/>
-<path d="M9.08579 4.3443H7.6145C7.50431 4.3443 7.40579 4.40988 7.3682 4.50887L3.76709 13.9324L5.28894 14.7713L9.20894 4.51258C9.24005 4.43091 9.17653 4.3443 9.08579 4.3443Z" fill="white"/>
-</svg>

src/assets/svg/avax_square_logo.svg

@@ -1,11 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_298_130193)">
-<path d="M12.9346 2.74121H3.05566V11.7259H12.9346V2.74121Z" fill="white"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M15.9998 0C15.9998 4.41538 15.9998 15.9947 15.9998 15.9947C11.5844 15.9947 0.00590861 15.9947 0.00590861 15.9947L0.00488281 5.43594e-05C4.42027 5.43594e-05 15.9998 0 15.9998 0ZM5.73493 11.1815H4.18339C3.85736 11.1815 3.69632 11.1815 3.59813 11.1187C3.49207 11.0499 3.42726 10.936 3.4194 10.8103C3.41351 10.6945 3.49404 10.553 3.65508 10.2702L7.48603 3.51765C7.64905 3.2309 7.73153 3.08753 7.83562 3.03451C7.94756 2.97755 8.08112 2.97755 8.19307 3.03451C8.29716 3.08753 8.37965 3.2309 8.54265 3.51765L9.33022 4.89243L9.33423 4.89945C9.51029 5.20707 9.59958 5.36307 9.63856 5.52679C9.68176 5.70552 9.68176 5.89406 9.63856 6.07278C9.59928 6.23775 9.5109 6.39488 9.33218 6.70715L7.31987 10.2643L7.31466 10.2734C7.13744 10.5836 7.04762 10.7408 6.92315 10.8594C6.78763 10.9891 6.62462 11.0833 6.44589 11.1364C6.28288 11.1815 6.10024 11.1815 5.73493 11.1815ZM9.65309 11.1815H11.8763C12.2043 11.1815 12.3693 11.1815 12.4675 11.1168C12.5735 11.048 12.6403 10.9321 12.6463 10.8065C12.6519 10.6944 12.5731 10.5584 12.4188 10.2921C12.4134 10.283 12.4081 10.2738 12.4027 10.2644L11.2891 8.35932L11.2764 8.33787C11.1199 8.07325 11.0409 7.93962 10.9395 7.88797C10.8276 7.831 10.6959 7.831 10.584 7.88797C10.4819 7.94099 10.3994 8.08044 10.2364 8.36128L9.12674 10.2663L9.12294 10.2729C8.9605 10.5533 8.87932 10.6934 8.88518 10.8084C8.89303 10.9341 8.95784 11.0499 9.06389 11.1187C9.16014 11.1815 9.32511 11.1815 9.65309 11.1815Z" fill="#E84142"/>
-</g>
-<defs>
-<clipPath id="clip0_298_130193">
-<rect width="16" height="16" fill="white"/>
-</clipPath>
-</defs>
-</svg>

src/assets/svg/base_logo.svg

@@ -1,11 +0,0 @@
-<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M0 14C0 6.26801 6.26801 0 14 0V0C21.732 0 28 6.26801 28 14V14C28 21.732 21.732 28 14 28V28C6.26801 28 0 21.732 0 14V14Z" fill="#0052FF"/>
-<g clip-path="url(#clip0_13924_33076)">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M23.3332 14.0003C23.3332 19.155 19.1472 23.3337 13.9836 23.3337C9.08459 23.3337 5.06565 19.5724 4.6665 14.7849H17.0245V13.2158H4.6665C5.06565 8.42825 9.08459 4.66699 13.9836 4.66699C19.1472 4.66699 23.3332 8.84566 23.3332 14.0003Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_13924_33076">
-<rect width="18.6667" height="18.6667" fill="white" transform="translate(4.66675 4.66699)"/>
-</clipPath>
-</defs>
-</svg>

src/assets/svg/base_square_logo.svg

@@ -1,11 +0,0 @@
-<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="28" height="28" rx="8" fill="#0052FF"/>
-<g clip-path="url(#clip0_13921_13252)">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M23.3332 14.0003C23.3332 19.155 19.1472 23.3337 13.9836 23.3337C9.08459 23.3337 5.06565 19.5724 4.6665 14.7849H17.0245V13.2158H4.6665C5.06565 8.42825 9.08459 4.66699 13.9836 4.66699C19.1472 4.66699 23.3332 8.84566 23.3332 14.0003Z" fill="white"/>
-</g>
-<defs>
-<clipPath id="clip0_13921_13252">
-<rect width="18.6667" height="18.6667" fill="white" transform="translate(4.66675 4.66699)"/>
-</clipPath>
-</defs>
-</svg>

src/assets/svg/bnb_square_logo.svg

@@ -1,21 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect x="0" y="0" width="16" height="16" rx="3" fill="#F0B90B"/>
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 2496 2496" style="enable-background:new 0 0 2496 2496;" xml:space="preserve">
-<g>
-	<path style="fill-rule:evenodd;clip-rule:evenodd;fill:#F0B90B;" d="M1248,0c689.3,0,1248,558.7,1248,1248s-558.7,1248-1248,1248
-		S0,1937.3,0,1248S558.7,0,1248,0L1248,0z"/>
-	<path style="fill:#FFFFFF;" d="M685.9,1248l0.9,330l280.4,165v193.2l-444.5-260.7v-524L685.9,1248L685.9,1248z M685.9,918v192.3
-		l-163.3-96.6V821.4l163.3-96.6l164.1,96.6L685.9,918L685.9,918z M1084.3,821.4l163.3-96.6l164.1,96.6L1247.6,918L1084.3,821.4
-		L1084.3,821.4z"/>
-	<path style="fill:#FFFFFF;" d="M803.9,1509.6v-193.2l163.3,96.6v192.3L803.9,1509.6L803.9,1509.6z M1084.3,1812.2l163.3,96.6
-		l164.1-96.6v192.3l-164.1,96.6l-163.3-96.6V1812.2L1084.3,1812.2z M1645.9,821.4l163.3-96.6l164.1,96.6v192.3l-164.1,96.6V918
-		L1645.9,821.4L1645.9,821.4L1645.9,821.4z M1809.2,1578l0.9-330l163.3-96.6v524l-444.5,260.7v-193.2L1809.2,1578L1809.2,1578
-		L1809.2,1578z"/>
-	<polygon style="fill:#FFFFFF;" points="1692.1,1509.6 1528.8,1605.3 1528.8,1413 1692.1,1316.4 1692.1,1509.6 	"/>
-	<path style="fill:#FFFFFF;" d="M1692.1,986.4l0.9,193.2l-281.2,165v330.8l-163.3,95.7l-163.3-95.7v-330.8l-281.2-165V986.4
-		L968,889.8l279.5,165.8l281.2-165.8l164.1,96.6H1692.1L1692.1,986.4z M803.9,656.5l443.7-261.6l444.5,261.6l-163.3,96.6
-		l-281.2-165.8L967.2,753.1L803.9,656.5L803.9,656.5z"/>
-</g>
-</svg>
-</svg>

src/assets/svg/celo_square_logo.svg

@@ -1,5 +0,0 @@
-<svg width="250" height="250" viewBox="0 0 250 250" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect width="250" height="250" rx="40" fill="#FCFF52"/>
-<path style="fill:black;" d="M188.9,60.7H60.7v128.2h128.2v-44.8h-21.3c-7.3,16.3-23.8,27.7-42.7,27.7c-26,0-47.1-21.3-47.1-47.1c0-25.9,21.1-47,47.1-47
-	c19.3,0,35.8,11.7,43.1,28.4h20.9V60.7z"/>
-</svg>

src/assets/svg/ethereum_square_logo.svg

@@ -1,16 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<rect x="0" y="0" width="16" height="16" rx="3" fill="#627EEA"/>
-<circle cx="8" cy="8" r="8"/>
-<g clip-path="url(#clip0_12246_121533)">
-<circle cx="8" cy="8" r="8" fill="url(#pattern0)"/>
-</g>
-<defs>
-<pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
-<use xlink:href="#image0_12246_121533" transform="scale(0.0078125)"/>
-</pattern>
-<clipPath id="clip0_12246_121533">
-<rect x="0" y="0" width="16" height="16" rx="8" fill="white"/>
-</clipPath>
-<image id="image0_12246_121533" width="128" height="128" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAAAXNSR0IArs4c6QAADd9JREFUeNrtXdtzE+cV38kweWpm+tI8JZP8EZ0pL+UhferkfyAzFqEpadq0hbRNUlsYQ2ycBEgCgQQIgVxMbC6BAHbEJZg7dW4OpeCWwDTNDOyuLFuybMsXfT2/tWVkWavd1e5K58g6M9+Q8cTS+ju//b5z/R1Nq0F5Ppr46cpm8xcroubyFU3m+oYmY39Do97d0KRfoH/76d/b9K9JP89Yy/pv62f9s/9PN34Hv4vPwGfhM7W68JNVUfWTp9fqv440Ge2RRqOXFHiPFKhCWfTZ+A58F74T313XQIUlGlUP0lv5RCRqtkQa9YukjMnQFO6w8N3WM9Cz4JnwbHUNhSQrovGlkSZ9K216vFoKdwGIOJ4Rz1rXWADyTDTxeCSqv0wbe5Or0kuA4SaeHX9DXZMepSFq/Jw28FBDo5GVpviFy8hafwv9TXXNOh3zzfov6Qjtka90u1NB78HfWNd0gUTWmr+yLPgaVfwCIMCToL+5/sZH44+Qa9W5WBRfxK3sxB4sRlduSSRqrKYjMbVolX//WkhhL7Ani+O4j+rL6Ai8ttgVX+RauIa9qfG3Xm+tDcs+RI+B9qjmToNVLfFHKWJ2vq5gt6eBfr5mbIPIWuNJK9lSV6zXZWLvJB/5D1AApK1+5PsOIrVhL8UlbMiy7agrMKArgfZSTKKpoc14iHLpMUkb/OZHQ6pxa5x5zID2lPaWefIm9TC5M32SlP/MOl0Zg1PqWG9aUY6fu6vY99yG1M94GnsticfozhqQdryeOJ9W09NZ9cU/Rq2TQIBdMIC9ZvfmS1T+39+Kq6mp7BwATl8dVX/caIoAAfaczZ0v7djPrYE7EwqSAwDW/u6UlMhhX9VtAlim0gy+3Np9KKlykg8ArPXvDApJJhmxqnkHlp8v1NV77hVDJUembQHQfSFtGYeCXMTKxwlmgjwy/erevlGVL4UAwHqna1hS+VlbFcK7MiN8698dVNls1hEAWC+8bsqJGFYqbIzEjtTY/oqorn64O6kKxQ4AB0+NIF8vJncA3YSf0hWc1YOFX0zsAIDVvichKosYaip5Jp8vU/l/ftVUY+NZzwCIXRpVz24wBOUN9NbQKnkkZ/a+vD6u7KQUALDeP5KUVlSyLISjX24Z16Z9Q6qUOAEA6+U344KuAuNaoFcBoWqNVOX/pllXOiV7/ALg6NkR9XRUVC3BmsBKtyVX70JxTuIGAFhvfDgkKDagpwIpKyPLskuq8l98I64mJ7OBAeD0lVH1fJshySvo8t2xI7mS5vr3GeVG3AIA6+MTKVF74KsDSXK7FkK5bsULALCatw9KMgh7y27UlKp8+O1DqenQAIAiEhiXYiKg5TSkSu7SxV3tRbwCAGt7p6Rkkd7jze2jXnapysfxDIWGDQCs1a+ZcvbGCz/BDDmDyEZLdefHCeVVygXAgZicZBF06rK+L/G41JDvh8eSqhwpFwBYbbsTYkLEruhqwGsjUfko5hwdm644AGKX0mrVehmxAejWTdh3QCIArvSPqXLFDwCwdh9OSrkGbjqFfZdKVP6rlLP3I34BgPXiFhnJopIUduC4k6b8ldTNc9ecrDoAjpwZsSqOBBjKW+0bOhmTMNqtw6dHlF8JAgBYSDsLuAbiRUvJQXUqTfl/3WyqiYksGwCcogDU71sNAdeA+UQR699skQaA7/6dUUFIUADAgivK3xswW4qlfS9KUv62/cMqKAkSAFjRbbyTRdD1/FJvoj2vJuu217WqxVCDw1NsAXD8XNoyThnbAZPzqO7BfS/p7f/8YloFKUEDAGtrB2+DEDrPj/23S1F+07a452RPNQBwhlrNUYrO+BRoF1n4ceuHiUCVjzax67cy6pOeVOAg6Pw8xdgOyCsUCXXMSoAL9flBSYbcR/QKwHWDsta+PahadyXU3qNJq54gKBBs2MnUICSdW8rHMCQJyod/PTI67VvxQ8lpdfGbsQVKBgByC/wAOw8Mqx6yNfwCAPbKb1t47qk1CAsTsSQA4MLXY74U/6M+qc5SW/gZG0XlAyC31lFxyVtkzKG03A8Idh7kWT0E3dP9bz7FXfk4msuVgTsZetud3+RiAMhfm/YlrDu9XBAgaskwIrgc+f8NrN0VSrDg7fUiE9QL8PUNut8vuz/CnQCQWxupAOSDz5IWoZQXACBnwa16CLrXZocqsgVAVyzlWvGgfbn07ZirN75cAMzZCUQ0sYuO9pgHO+G195lVD5HuWVf/riGGjvGMs89/15hUvV/a3+9hACC3mncMqm1kJxxzYSecujxq8ROxqhbmnAP45sZ4ScX/578ZdSYgl61cAOSvzWQnHIiVthP2HU3yygk0YF4uU/7eYjJJxI7f3oT/ng40aBMEAHKr/b2ElRW0sxMY8RL3a7NDk9nx95qJ+ckexACufDcWaJAmLADk1gayE3YfGlYnL80HKxteYtK9xpHwCdm0nNyLT6lzX83E1sNQfJgAmIsnUGBp+/4hdbz3PhCY8BKb2uz4dHb8vbf/NxG60isFgDmDkQJLW4hj4OCpFA9eYtI9OwAcOzcyF5+v5KoEAObZCXvIaPxgiAEAmF0BSKGCzq3WAfA3KiNn0GFssjQCc02ex3rTNQcAXHG/40I7N2sE9nMOA2+hYxIBFOkAQJ0g7nxm4WDLDbwggd17z6dJsQAA5zDLcTSke5wA3XL6AOIWf68UALxEJFVcawFmVze7ZJBT2hRH6Cs7E6rnAt9IICJ9bhpE/lBtxjErGcQsHbyRwqiXKaPnxL6BaCF6A05f5QOAKC14MU73fO5KA41dVesBmsz1aAlbzu1ogvWPmj3k0J1cJRhWHx1PVR0AuJ5WNjuWYltkk4hzcIgEWgUhHEvCYP3nqn+RE8Cb7vQ7OHaPfjFScQDArXvWBUEE3FqEuPFdqHHg4A1YJWFci0L/sokYP8bvF4HeuJ2xegKcBkKg6OLk5fABALfODWsorrL8knPQz3NpILWKQjmXhReSPaKBA/kBpw3EG7mLsnBhAQCFKk7E0Whfe/fAwmdYt2OQiwt4T0RjCEq4CyVNqWHc+06EDPC/u2KpwAAAo81pmhieCYwlsUsLvRSMqmPZGMK5NQxvkh6fsi31dlNnhzp/sHuWCwDYF25KuWAPgCnEjm5+JSN20XmtYdybQ3FsIkVsJ6gAdoofYPNhedsVlNi5dX9qd3brYAugAsiWZfwqvwlk85pDJbSHoya/lIAWHlY2TgynDiPU5TkBAEaoU4s3XFR0ATvFIl7fy6saeEF7uASCCLyFbujf0fq1y0Unzks0AubTvON6LnxLP3cCERbKvbpdRCM7GNLLLyCIkEIRg+M4lXbXH/g9VRS1OMwABqgQeUT/HlxMN6FZXDUHTrqLNyBczXHiWFGKGCkkUYikeWn9Rk8hgOMUVnbyKJDDf++wt4wko+pfZ5IoSTRxqA/wIpgXCHewHNoW+Pub93mvSeBKJ29LEyeJKBIWfbERsE4Cd9JLDB5eQDlVSchhcJ0wZksUKY0qFj53uRyB/yRGkFJzAJHR6yizLhGJHqcrhy1V7GxQ6KYUEMCd88MLhJxBfn0eijd2dA77yiqilV0sWbREuviv/jXuizgCXgVoYXLegB/lc+r7K5suXtrACIRo/XIGBsEShiCUU55AxMAIiSNjQNrghzpuMdDFux4ZI3Vo1Gdn01UDAJM+v9LLy9AoiWPjVkTL5xD0AwDkKLgPjvI8Nk7q4MgXCqqIwgYAcv4i6OHLGRwpdXSsl5GxfgHAprrHbeHHYhke7ZVTsBwAoORMwl74Gh49Wy/YKQ0ASOfei0+FBgBUH6+UMDuYdKf5FQodPkJGREoaCHA8T05lAwcAij/WCBgZC51Bd1oQEokaqyVeBU5VROUAgB3Xn23Uz1itBSWUPlxCxsQ1aQCwqohuZQIDwMcnUjL+btIVdKYFKRRHXiZxpjAyc2AQ9QsAq7pHxIhYIwtdaWEIfXCrxKsAJBN+AYD0s4yjX2/VwpKZq0A/LxEEpaqInADw9idCXD7STeBHf6Gsaok/ypFb0E8VUSkAHDrFt7qnkPAJutEqIZG1xpMS7QFUAWWKVBHZAQCnRtW5/Nze+6QTrZJC6cU2iVfB3iJVRHYAABOJDG/HaNMqLXTXPEC+ZodEEGBYlBMA9h5JSvH3O6ALrRqC8mLimYlJA0BhFVEhAPhX98xx/MRsS7wrJQ1txkMUeOiTBoK2vCqiQgCA7kVAsKcPe69xkGeiqYfJEBmQBgK0bBcCAJ1HAoy+Aey5xkkiLYnHpIEgV0WUA4CE6h7sMfZa4yhApbTrAH37YBxBdQ+neT52xz67N7+YTSDNMEQfH1i8uBt8bO58N96BVBeRsav3oCZJrDiBFSySFzFkFeGjPayanx9c2Fhe7oBDbL/i4d0wE0hSs4jVyupVLLFTwSthyUw9Qf1KcCjmaA09pVvVK4GqVSSWl1WijCu0Sh6OpwGhfY3EauMwqnexFzX91pcsOW/UuxbxXd8VWOm26GuBulcktqH5adfy3bFTkycCNTFK60r22qVbdqPmYhL0ss+QVNSCx2AFcw557s+vywxdzQxnkbxUs5W1o2d3TctSF0eDcSk47jiTWeLZ8IyOVGx18ZdoAtUp+G5BelxNlnN8t/UM9Cx4JnEJm5oIMxPtObjvMQDB8iTCHH9Dn21Z8PRd+M4FlOt14SEYhoSJWJFG8ylrLiINSIQFPkuJ3z87MNvE+HRrWf9t/ax/5lQhTwS/Q7+Lz8BnzQ1YqjH5P29N0rBVv2N5AAAAAElFTkSuQmCC"/>
-</defs>
-</svg>

src/assets/svg/expando-icon-closed.svg

@@ -0,0 +1,3 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.6376 8.86202C11.8982 9.12269 11.8982 9.54407 11.6376 9.80473L8.97089 12.4714C8.84089 12.6014 8.6702 12.6667 8.49954 12.6667C8.32887 12.6667 8.15818 12.6014 8.02818 12.4714L5.36152 9.80473C5.10085 9.54407 5.10085 9.12269 5.36152 8.86202C5.62218 8.60136 6.04356 8.60136 6.30422 8.86202L8.49954 11.0573L10.6948 8.86202C10.9555 8.60136 11.3769 8.60136 11.6376 8.86202ZM6.30422 7.13807L8.49954 4.94275L10.6948 7.13807C10.8248 7.26807 10.9955 7.33338 11.1662 7.33338C11.3369 7.33338 11.5076 7.26807 11.6376 7.13807C11.8982 6.8774 11.8982 6.45602 11.6376 6.19536L8.97089 3.52869C8.71022 3.26802 8.28885 3.26802 8.02818 3.52869L5.36152 6.19536C5.10085 6.45602 5.10085 6.8774 5.36152 7.13807C5.62218 7.39873 6.04356 7.39873 6.30422 7.13807Z" fill="#5E5E5E"/>
+</svg>

src/assets/svg/expando-icon-opened.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.1376 11.5287C11.3982 11.7894 11.3982 12.2107 11.1376 12.4714C11.0076 12.6014 10.8369 12.6667 10.6662 12.6667C10.4955 12.6667 10.3248 12.6014 10.1948 12.4714L7.99954 10.2761L5.80422 12.4714C5.54356 12.7321 5.12218 12.7321 4.86152 12.4714C4.60085 12.2107 4.60085 11.7894 4.86152 11.5287L7.52818 8.86202C7.78885 8.60136 8.21022 8.60136 8.47089 8.86202L11.1376 11.5287ZM7.52818 7.13807C7.65818 7.26807 7.82887 7.33338 7.99954 7.33338C8.1702 7.33338 8.34089 7.26807 8.47089 7.13807L11.1376 4.4714C11.3982 4.21073 11.3982 3.78936 11.1376 3.52869C10.8769 3.26802 10.4555 3.26802 10.1948 3.52869L7.99954 5.724L5.80422 3.52869C5.54356 3.26802 5.12218 3.26802 4.86152 3.52869C4.60085 3.78936 4.60085 4.21073 4.86152 4.4714L7.52818 7.13807Z" fill="#5E5E5E"/>
+</svg>

src/assets/svg/matic-token-icon.svg

@@ -1,4 +1,15 @@
-<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg">
-<circle cx="512" cy="512" r="512" fill="#8247E5"/>
-<path d="M681.469 402.456C669.189 395.312 653.224 395.312 639.716 402.456L543.928 457.228L478.842 492.949L383.055 547.721C370.774 554.865 354.81 554.865 341.301 547.721L265.162 504.856C252.882 497.712 244.286 484.614 244.286 470.325V385.786C244.286 371.498 251.654 358.4 265.162 351.256L340.073 309.581C352.353 302.437 368.318 302.437 381.827 309.581L456.737 351.256C469.018 358.4 477.614 371.498 477.614 385.786V440.558L542.7 403.646V348.874C542.7 334.586 535.332 321.488 521.824 314.344L383.055 235.758C370.774 228.614 354.81 228.614 341.301 235.758L200.076 314.344C186.567 321.488 179.199 334.586 179.199 348.874V507.237C179.199 521.525 186.567 534.623 200.076 541.767L341.301 620.353C353.582 627.498 369.546 627.498 383.055 620.353L478.842 566.772L543.928 529.86L639.716 476.279C651.996 469.135 667.961 469.135 681.469 476.279L756.38 517.953C768.66 525.098 777.257 538.195 777.257 552.484V637.023C777.257 651.312 769.888 664.409 756.38 671.553L681.469 714.419C669.189 721.563 653.224 721.563 639.716 714.419L564.805 672.744C552.525 665.6 543.928 652.502 543.928 638.214V583.442L478.842 620.353V675.125C478.842 689.414 486.21 702.512 499.719 709.656L640.944 788.242C653.224 795.386 669.189 795.386 682.697 788.242L823.922 709.656C836.203 702.512 844.799 689.414 844.799 675.125V516.763C844.799 502.474 837.431 489.377 823.922 482.232L681.469 402.456Z" fill="white"/>
+<svg width="490" height="490" viewBox="0 0 490 490" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7383_35741)">
+<circle cx="245" cy="245" r="245" fill="url(#paint0_linear_7383_35741)"/>
+<path d="M315.83 297.85L385.12 257.84C388.79 255.72 391.06 251.78 391.06 247.54V167.53C391.06 163.3 388.78 159.35 385.12 157.23L315.83 117.22C312.16 115.1 307.61 115.11 303.94 117.22L234.65 157.23C230.98 159.35 228.71 163.3 228.71 167.53V310.52L180.12 338.57L131.53 310.52V254.41L180.12 226.36L212.17 244.86V207.22L186.06 192.15C184.26 191.11 182.2 190.56 180.11 190.56C178.02 190.56 175.96 191.11 174.17 192.15L104.88 232.16C101.21 234.28 98.9404 238.22 98.9404 242.46V322.47C98.9404 326.7 101.22 330.65 104.88 332.77L174.17 372.78C177.83 374.89 182.39 374.89 186.06 372.78L255.35 332.78C259.02 330.66 261.29 326.71 261.29 322.48V179.49L262.17 178.99L309.88 151.44L358.47 179.49V235.6L309.88 263.65L277.88 245.17V282.81L303.94 297.86C307.61 299.97 312.16 299.97 315.83 297.86V297.85Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_7383_35741" x1="-175" y1="4.36391e-07" x2="416" y2="367" gradientUnits="userSpaceOnUse">
+<stop stop-color="#A229C5"/>
+<stop offset="1" stop-color="#7B3FE4"/>
+</linearGradient>
+<clipPath id="clip0_7383_35741">
+<rect width="490" height="490" fill="white"/>
+</clipPath>
+</defs>
 </svg>

src/assets/svg/optimistic_ethereum.svg

@@ -1,5 +0,0 @@
-<svg width="500" height="500" viewBox="0 0 500 500" fill="none" xmlns="http://www.w3.org/2000/svg">
-<circle cx="250" cy="250" r="250" fill="#FF0420"/>
-<path d="M177.133 316.446C162.247 316.446 150.051 312.943 140.544 305.938C131.162 298.808 126.471 288.676 126.471 275.541C126.471 272.789 126.784 269.411 127.409 265.408C129.036 256.402 131.35 245.581 134.352 232.947C142.858 198.547 164.812 181.347 200.213 181.347C209.845 181.347 218.476 182.973 226.107 186.225C233.738 189.352 239.742 194.106 244.12 200.486C248.498 206.74 250.688 214.246 250.688 223.002C250.688 225.629 250.375 228.944 249.749 232.947C247.873 244.08 245.621 254.901 242.994 265.408C238.616 282.546 231.048 295.368 220.29 303.874C209.532 312.255 195.147 316.446 177.133 316.446ZM179.76 289.426C186.766 289.426 192.707 287.362 197.586 283.234C202.59 279.106 206.155 272.789 208.281 264.283C211.158 252.524 213.348 242.266 214.849 233.51C215.349 230.883 215.599 228.194 215.599 225.441C215.599 214.058 209.657 208.366 197.774 208.366C190.768 208.366 184.764 210.43 179.76 214.558C174.882 218.687 171.379 225.004 169.253 233.51C167.001 241.891 164.749 252.149 162.498 264.283C161.997 266.784 161.747 269.411 161.747 272.163C161.747 283.672 167.752 289.426 179.76 289.426Z" fill="white"/>
-<path d="M259.303 314.57C257.927 314.57 256.863 314.132 256.113 313.256C255.487 312.255 255.3 311.13 255.55 309.879L281.444 187.914C281.694 186.538 282.382 185.412 283.508 184.536C284.634 183.661 285.822 183.223 287.073 183.223H336.985C350.87 183.223 362.003 186.1 370.384 191.854C378.891 197.609 383.144 205.927 383.144 216.81C383.144 219.937 382.769 223.19 382.018 226.567C378.891 240.953 372.574 251.586 363.067 258.466C353.685 265.346 340.8 268.786 324.413 268.786H299.082L290.451 309.879C290.2 311.255 289.512 312.38 288.387 313.256C287.261 314.132 286.072 314.57 284.822 314.57H259.303ZM325.727 242.892C330.98 242.892 335.546 241.453 339.424 238.576C343.427 235.699 346.054 231.571 347.305 226.192C347.68 224.065 347.868 222.189 347.868 220.563C347.868 216.935 346.805 214.183 344.678 212.307C342.551 210.305 338.924 209.305 333.795 209.305H311.278L304.148 242.892H325.727Z" fill="white"/>
-</svg>

src/assets/svg/polygon-matic-logo.svg

@@ -1,16 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 24.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 38.4 33.5" style="enable-background:new 0 0 38.4 33.5;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#8247E5;}
-</style>
-<g>
-	<path class="st0" d="M29,10.2c-0.7-0.4-1.6-0.4-2.4,0L21,13.5l-3.8,2.1l-5.5,3.3c-0.7,0.4-1.6,0.4-2.4,0L5,16.3
-		c-0.7-0.4-1.2-1.2-1.2-2.1v-5c0-0.8,0.4-1.6,1.2-2.1l4.3-2.5c0.7-0.4,1.6-0.4,2.4,0L16,7.2c0.7,0.4,1.2,1.2,1.2,2.1v3.3l3.8-2.2V7
-		c0-0.8-0.4-1.6-1.2-2.1l-8-4.7c-0.7-0.4-1.6-0.4-2.4,0L1.2,5C0.4,5.4,0,6.2,0,7v9.4c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7
-		c0.7,0.4,1.6,0.4,2.4,0l5.5-3.2l3.8-2.2l5.5-3.2c0.7-0.4,1.6-0.4,2.4,0l4.3,2.5c0.7,0.4,1.2,1.2,1.2,2.1v5c0,0.8-0.4,1.6-1.2,2.1
-		L29,28.8c-0.7,0.4-1.6,0.4-2.4,0l-4.3-2.5c-0.7-0.4-1.2-1.2-1.2-2.1V21l-3.8,2.2v3.3c0,0.8,0.4,1.6,1.2,2.1l8.1,4.7
-		c0.7,0.4,1.6,0.4,2.4,0l8.1-4.7c0.7-0.4,1.2-1.2,1.2-2.1V17c0-0.8-0.4-1.6-1.2-2.1L29,10.2z"/>
-</g>
-</svg>

src/components/About/AboutFooter.tsx

@@ -2,7 +2,8 @@ import { BrowserEvent, InterfaceElementName, SharedEventName } from '@uniswap/an
 import { TraceEvent } from 'analytics'
 import { useDisableNFTRoutes } from 'hooks/useDisableNFTRoutes'
 import styled from 'styled-components'
-import { BREAKPOINTS, ExternalLink, StyledRouterLink } from 'theme'
+import { BREAKPOINTS } from 'theme'
+import { ExternalLink, StyledRouterLink } from 'theme/components'
 import { useIsDarkMode } from 'theme/components/ThemeToggle'
 
 import { DiscordIcon, GithubIcon, TwitterIcon } from './Icons'

src/components/AccountDrawer/AuthenticatedHeader.tsx

@@ -5,39 +5,38 @@ import { useWeb3React } from '@web3-react/core'
 import { sendAnalyticsEvent, TraceEvent } from 'analytics'
 import { ButtonEmphasis, ButtonSize, LoadingButtonSpinner, ThemeButton } from 'components/Button'
 import Column from 'components/Column'
-import { ArrowChangeDown } from 'components/Icons/ArrowChangeDown'
-import { ArrowChangeUp } from 'components/Icons/ArrowChangeUp'
 import { Power } from 'components/Icons/Power'
 import { Settings } from 'components/Icons/Settings'
 import { AutoRow } from 'components/Row'
 import { LoadingBubble } from 'components/Tokens/loading'
-import { formatDelta } from 'components/Tokens/TokenDetails/PriceChart'
+import { DeltaArrow } from 'components/Tokens/TokenDetails/Delta'
 import Tooltip from 'components/Tooltip'
 import { getConnection } from 'connection'
 import { useDisableNFTRoutes } from 'hooks/useDisableNFTRoutes'
 import useENSName from 'hooks/useENSName'
+import { useIsNotOriginCountry } from 'hooks/useIsNotOriginCountry'
 import { useProfilePageState, useSellAsset, useWalletCollections } from 'nft/hooks'
 import { useIsNftClaimAvailable } from 'nft/hooks/useIsNftClaimAvailable'
 import { ProfilePageStateType } from 'nft/types'
 import { useCallback, useState } from 'react'
-import { CreditCard, IconProps, Info } from 'react-feather'
+import { CreditCard, Info } from 'react-feather'
 import { useNavigate } from 'react-router-dom'
 import { useAppDispatch } from 'state/hooks'
 import { updateSelectedWallet } from 'state/user/reducer'
-import styled, { useTheme } from 'styled-components'
-import { CopyHelper, ExternalLink, ThemedText } from 'theme'
+import styled from 'styled-components'
+import { CopyHelper, ExternalLink, ThemedText } from 'theme/components'
 import { shortenAddress } from 'utils'
-import { formatNumber, NumberType } from 'utils/formatNumbers'
+import { NumberType, useFormatter } from 'utils/formatNumbers'
 
 import { useCloseModal, useFiatOnrampAvailability, useOpenModal, useToggleModal } from '../../state/application/hooks'
 import { ApplicationModal } from '../../state/application/reducer'
 import { useUserHasAvailableClaim, useUserUnclaimedAmount } from '../../state/claim/hooks'
 import StatusIcon from '../Identicon/StatusIcon'
+import { useCachedPortfolioBalancesQuery } from '../PrefetchBalancesWrapper/PrefetchBalancesWrapper'
 import { useToggleAccountDrawer } from '.'
 import IconButton, { IconHoverText, IconWithConfirmTextButton } from './IconButton'
 import MiniPortfolio from './MiniPortfolio'
 import { portfolioFadeInAnimation } from './MiniPortfolio/PortfolioRow'
-import { useCachedPortfolioBalancesQuery } from './PrefetchBalancesWrapper'
 
 const AuthenticatedHeaderWrapper = styled.div`
   padding: 20px 16px;
@@ -119,7 +118,7 @@ const AccountNamesWrapper = styled.div`
   width: 100%;
   flex-direction: column;
   justify-content: center;
-  gap: 2px;
+  margin-left: 8px;
 `
 
 const StyledInfoIcon = styled(Info)`
@@ -151,15 +150,6 @@ const PortfolioDrawerContainer = styled(Column)`
   flex: 1;
 `
 
-export function PortfolioArrow({ change, ...rest }: { change: number } & IconProps) {
-  const theme = useTheme()
-  return change < 0 ? (
-    <ArrowChangeDown color={theme.critical} width={16} {...rest} />
-  ) : (
-    <ArrowChangeUp color={theme.success} width={16} {...rest} />
-  )
-}
-
 export default function AuthenticatedHeader({ account, openSettings }: { account: string; openSettings: () => void }) {
   const { connector } = useWeb3React()
   const { ENSName } = useENSName(account)
@@ -170,6 +160,8 @@ export default function AuthenticatedHeader({ account, openSettings }: { account
   const resetSellAssets = useSellAsset((state) => state.reset)
   const clearCollectionFilters = useWalletCollections((state) => state.clearCollectionFilters)
   const isClaimAvailable = useIsNftClaimAvailable((state) => state.isClaimAvailable)
+  const shouldShowBuyFiatButton = useIsNotOriginCountry('GB')
+  const { formatNumber, formatPercent } = useFormatter()
 
   const shouldDisableNFTRoutes = useDisableNFTRoutes()
 
@@ -279,16 +271,20 @@ export default function AuthenticatedHeader({ account, openSettings }: { account
         {totalBalance !== undefined ? (
           <FadeInColumn gap="xs">
             <ThemedText.HeadlineLarge fontWeight={535} data-testid="portfolio-total-balance">
-              {formatNumber(totalBalance, NumberType.PortfolioBalance)}
+              {formatNumber({
+                input: totalBalance,
+                type: NumberType.PortfolioBalance,
+              })}
             </ThemedText.HeadlineLarge>
             <AutoRow marginBottom="20px">
               {absoluteChange !== 0 && percentChange && (
                 <>
-                  <PortfolioArrow change={absoluteChange as number} />
+                  <DeltaArrow delta={absoluteChange} />
                   <ThemedText.BodySecondary>
-                    {`${formatNumber(Math.abs(absoluteChange as number), NumberType.PortfolioBalance)} (${formatDelta(
-                      percentChange
-                    )})`}
+                    {`${formatNumber({
+                      input: Math.abs(absoluteChange as number),
+                      type: NumberType.PortfolioBalance,
+                    })} (${formatPercent(percentChange)})`}
                   </ThemedText.BodySecondary>
                 </>
               )}
@@ -310,26 +306,28 @@ export default function AuthenticatedHeader({ account, openSettings }: { account
             <Trans>View and sell NFTs</Trans>
           </HeaderButton>
         )}
-        <HeaderButton
-          size={ButtonSize.medium}
-          emphasis={ButtonEmphasis.highSoft}
-          onClick={handleBuyCryptoClick}
-          disabled={disableBuyCryptoButton}
-          data-testid="wallet-buy-crypto"
-        >
-          {error ? (
-            <ThemedText.BodyPrimary>{error}</ThemedText.BodyPrimary>
-          ) : (
-            <>
-              {fiatOnrampAvailabilityLoading ? (
-                <StyledLoadingButtonSpinner />
-              ) : (
-                <CreditCard height="20px" width="20px" />
-              )}{' '}
-              <Trans>Buy crypto</Trans>
-            </>
-          )}
-        </HeaderButton>
+        {shouldShowBuyFiatButton && (
+          <HeaderButton
+            size={ButtonSize.medium}
+            emphasis={ButtonEmphasis.highSoft}
+            onClick={handleBuyCryptoClick}
+            disabled={disableBuyCryptoButton}
+            data-testid="wallet-buy-crypto"
+          >
+            {error ? (
+              <ThemedText.BodyPrimary>{error}</ThemedText.BodyPrimary>
+            ) : (
+              <>
+                {fiatOnrampAvailabilityLoading ? (
+                  <StyledLoadingButtonSpinner />
+                ) : (
+                  <CreditCard height="20px" width="20px" />
+                )}{' '}
+                <Trans>Buy crypto</Trans>
+              </>
+            )}
+          </HeaderButton>
+        )}
         {Boolean(!fiatOnrampAvailable && fiatOnrampAvailabilityChecked) && (
           <FiatOnrampNotAvailableText marginTop="8px">
             <Trans>Not available in your region</Trans>

src/components/AccountDrawer/DefaultMenu.tsx

@@ -1,11 +1,12 @@
 import { useWeb3React } from '@web3-react/core'
 import Column from 'components/Column'
 import WalletModal from 'components/WalletModal'
-import { useCallback, useEffect, useState } from 'react'
+import { useCallback, useEffect, useMemo, useState } from 'react'
 import styled from 'styled-components'
 
 import AuthenticatedHeader from './AuthenticatedHeader'
 import LanguageMenu from './LanguageMenu'
+import LocalCurrencyMenu from './LocalCurrencyMenu'
 import SettingsMenu from './SettingsMenu'
 
 const DefaultMenuWrap = styled(Column)`
@@ -17,6 +18,7 @@ enum MenuState {
   DEFAULT,
   SETTINGS,
   LANGUAGE_SETTINGS,
+  LOCAL_CURRENCY_SETTINGS,
 }
 
 function DefaultMenu({ drawerOpen }: { drawerOpen: boolean }) {
@@ -27,6 +29,7 @@ function DefaultMenu({ drawerOpen }: { drawerOpen: boolean }) {
   const openSettings = useCallback(() => setMenu(MenuState.SETTINGS), [])
   const closeSettings = useCallback(() => setMenu(MenuState.DEFAULT), [])
   const openLanguageSettings = useCallback(() => setMenu(MenuState.LANGUAGE_SETTINGS), [])
+  const openLocalCurrencySettings = useCallback(() => setMenu(MenuState.LOCAL_CURRENCY_SETTINGS), [])
 
   useEffect(() => {
     if (!drawerOpen && menu !== MenuState.DEFAULT) {
@@ -39,20 +42,30 @@ function DefaultMenu({ drawerOpen }: { drawerOpen: boolean }) {
     return
   }, [drawerOpen, menu, closeSettings])
 
-  return (
-    <DefaultMenuWrap>
-      {menu === MenuState.DEFAULT &&
-        (isAuthenticated ? (
+  const SubMenu = useMemo(() => {
+    switch (menu) {
+      case MenuState.DEFAULT:
+        return isAuthenticated ? (
           <AuthenticatedHeader account={account} openSettings={openSettings} />
         ) : (
           <WalletModal openSettings={openSettings} />
-        ))}
-      {menu === MenuState.SETTINGS && (
-        <SettingsMenu onClose={closeSettings} openLanguageSettings={openLanguageSettings} />
-      )}
-      {menu === MenuState.LANGUAGE_SETTINGS && <LanguageMenu onClose={openSettings} />}
-    </DefaultMenuWrap>
-  )
+        )
+      case MenuState.SETTINGS:
+        return (
+          <SettingsMenu
+            onClose={closeSettings}
+            openLanguageSettings={openLanguageSettings}
+            openLocalCurrencySettings={openLocalCurrencySettings}
+          />
+        )
+      case MenuState.LANGUAGE_SETTINGS:
+        return <LanguageMenu onClose={openSettings} />
+      case MenuState.LOCAL_CURRENCY_SETTINGS:
+        return <LocalCurrencyMenu onClose={openSettings} />
+    }
+  }, [account, closeSettings, isAuthenticated, menu, openLanguageSettings, openLocalCurrencySettings, openSettings])
+
+  return <DefaultMenuWrap>{SubMenu}</DefaultMenuWrap>
 }
 
 export default DefaultMenu

src/components/AccountDrawer/DownloadButton.tsx

@@ -1,7 +1,7 @@
 import { InterfaceElementName } from '@uniswap/analytics-events'
 import { PropsWithChildren, useCallback } from 'react'
 import styled from 'styled-components'
-import { ClickableStyle } from 'theme'
+import { ClickableStyle } from 'theme/components'
 import { openDownloadApp } from 'utils/openDownloadApp'
 
 const StyledButton = styled.button<{ padded?: boolean; branded?: boolean }>`

src/components/AccountDrawer/GitVersionRow.tsx

@@ -2,7 +2,7 @@ import { Trans } from '@lingui/macro'
 import Tooltip from 'components/Tooltip'
 import useCopyClipboard from 'hooks/useCopyClipboard'
 import styled from 'styled-components'
-import { ThemedText } from 'theme'
+import { ThemedText } from 'theme/components'
 
 const Container = styled.div`
   width: 100%;

src/components/AccountDrawer/LanguageMenu.tsx

@@ -2,36 +2,21 @@ import { Trans } from '@lingui/macro'
 import { LOCALE_LABEL, SUPPORTED_LOCALES, SupportedLocale } from 'constants/locales'
 import { useActiveLocale } from 'hooks/useActiveLocale'
 import { useLocationLinkProps } from 'hooks/useLocationLinkProps'
-import { Check } from 'react-feather'
-import { Link } from 'react-router-dom'
-import styled, { useTheme } from 'styled-components'
-import { ClickableStyle, ThemedText } from 'theme'
 
+import { MenuColumn, MenuItem } from './shared'
 import { SlideOutMenu } from './SlideOutMenu'
 
-const InternalLinkMenuItem = styled(Link)`
-  ${ClickableStyle}
-  flex: 1;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 12px 0;
-  justify-content: space-between;
-  text-decoration: none;
-  color: ${({ theme }) => theme.neutral1};
-`
-
 function LanguageMenuItem({ locale, isActive }: { locale: SupportedLocale; isActive: boolean }) {
   const { to, onClick } = useLocationLinkProps(locale)
-  const theme = useTheme()
-
-  if (!to) return null
 
   return (
-    <InternalLinkMenuItem onClick={onClick} to={to}>
-      <ThemedText.BodySmall data-testid="wallet-language-item">{LOCALE_LABEL[locale]}</ThemedText.BodySmall>
-      {isActive && <Check color={theme.accent1} opacity={1} size={20} />}
-    </InternalLinkMenuItem>
+    <MenuItem
+      label={LOCALE_LABEL[locale]}
+      onClick={onClick}
+      to={to}
+      isActive={isActive}
+      testId="wallet-language-item"
+    />
   )
 }
 
@@ -50,7 +35,9 @@ export function LanguageMenuItems() {
 export default function LanguageMenu({ onClose }: { onClose: () => void }) {
   return (
     <SlideOutMenu title={<Trans>Language</Trans>} onClose={onClose}>
-      <LanguageMenuItems />
+      <MenuColumn>
+        <LanguageMenuItems />
+      </MenuColumn>
     </SlideOutMenu>
   )
 }

src/components/AccountDrawer/LocalCurrencyMenu.tsx

@@ -0,0 +1,61 @@
+import { Trans } from '@lingui/macro'
+import { getLocalCurrencyIcon, SUPPORTED_LOCAL_CURRENCIES, SupportedLocalCurrency } from 'constants/localCurrencies'
+import { useActiveLocalCurrency } from 'hooks/useActiveLocalCurrency'
+import { useLocalCurrencyLinkProps } from 'hooks/useLocalCurrencyLinkProps'
+import { useMemo } from 'react'
+import styled from 'styled-components'
+
+import { MenuColumn, MenuItem } from './shared'
+import { SlideOutMenu } from './SlideOutMenu'
+
+const StyledLocalCurrencyIcon = styled.div`
+  width: 20px;
+  height: 20px;
+  border-radius: 100%;
+  overflow: hidden;
+`
+
+function LocalCurrencyMenuItem({
+  localCurrency,
+  isActive,
+}: {
+  localCurrency: SupportedLocalCurrency
+  isActive: boolean
+}) {
+  const { to, onClick } = useLocalCurrencyLinkProps(localCurrency)
+
+  const LocalCurrencyIcon = useMemo(() => {
+    return <StyledLocalCurrencyIcon>{getLocalCurrencyIcon(localCurrency)}</StyledLocalCurrencyIcon>
+  }, [localCurrency])
+
+  if (!to) return null
+
+  return (
+    <MenuItem
+      label={localCurrency}
+      logo={LocalCurrencyIcon}
+      isActive={isActive}
+      to={to}
+      onClick={onClick}
+      testId="wallet-local-currency-item"
+    />
+  )
+}
+
+export default function LocalCurrencyMenu({ onClose }: { onClose: () => void }) {
+  const activeLocalCurrency = useActiveLocalCurrency()
+
+  return (
+    <SlideOutMenu title={<Trans>Currency</Trans>} onClose={onClose}>
+      <MenuColumn>
+        {SUPPORTED_LOCAL_CURRENCIES.map((localCurrency) => (
+          <LocalCurrencyMenuItem
+            localCurrency={localCurrency}
+            isActive={activeLocalCurrency === localCurrency}
+            key={localCurrency}
+          />
+        ))}
+      </MenuColumn>
+    </SlideOutMenu>
+  )
+}

src/components/AccountDrawer/MiniPortfolio/Activity/ActivityRow.tsx

@@ -8,7 +8,7 @@ import { TransactionStatus } from 'graphql/data/__generated__/types-and-hooks'
 import useENSName from 'hooks/useENSName'
 import { useCallback } from 'react'
 import styled from 'styled-components'
-import { EllipsisStyle, ThemedText } from 'theme'
+import { EllipsisStyle, ThemedText } from 'theme/components'
 import { shortenAddress } from 'utils'
 import { ExplorerDataType, getExplorerLink } from 'utils/getExplorerLink'