chore: group third-party initializations (#6097)

* chore: clean up 3P initialization

* chore: integrations

src/index.tsx

 import '@reach/dialog/styles.css'
 import 'inter-ui'
 import 'polyfills'
-import 'components/analytics'
+import 'integrations'
 
 import { ApolloProvider } from '@apollo/client'
-import * as Sentry from '@sentry/react'
 import { FeatureFlagsProvider } from 'featureFlags'
 import { apolloClient } from 'graphql/data/apollo'
 import { BlockNumberProvider } from 'lib/hooks/useBlockNumber'
@@ -14,7 +13,6 @@ import { createRoot } from 'react-dom/client'
 import { QueryClient, QueryClientProvider } from 'react-query'
 import { Provider } from 'react-redux'
 import { HashRouter } from 'react-router-dom'
-import { isSentryEnabled } from 'utils/env'
 
 import Web3Provider from './components/Web3Provider'
 import { LanguageProvider } from './i18n'
@@ -33,20 +31,6 @@ if (window.ethereum) {
   window.ethereum.autoRefreshOnNetworkChange = false
 }
 
-if (isSentryEnabled()) {
-  Sentry.init({
-    dsn: process.env.REACT_APP_SENTRY_DSN,
-    release: process.env.REACT_APP_GIT_COMMIT_HASH,
-    /**
-     * TODO(INFRA-143)
-     * According to Sentry, this shouldn't be necessary, as they default to `3` when not set.
-     * Unfortunately, that doesn't work right now, so we workaround it by explicitly setting
-     * the `normalizeDepth` to `10`. This should be removed once the issue is fixed.
-     */
-    normalizeDepth: 10,
-  })
-}
-
 function Updaters() {
   return (
     <>

src/integrations.ts

+import 'components/analytics'
+
+import * as Sentry from '@sentry/react'
+import { initializeAnalytics, OriginApplication } from '@uniswap/analytics'
+import { SharedEventName } from '@uniswap/analytics-events'
+import { isSentryEnabled } from 'utils/env'
+import { getEnvName, isProductionEnv } from 'utils/env'
+
+// Dump some metadata into the window to allow client verification.
+window.GIT_COMMIT_HASH = process.env.REACT_APP_GIT_COMMIT_HASH
+
+// Actual KEYs are set by proxy servers.
+const AMPLITUDE_DUMMY_KEY = '00000000000000000000000000000000'
+export const STATSIG_DUMMY_KEY = 'client-0000000000000000000000000000000000000000000'
+
+Sentry.init({
+  dsn: process.env.REACT_APP_SENTRY_DSN,
+  release: process.env.REACT_APP_GIT_COMMIT_HASH,
+  environment: getEnvName(),
+  enabled: isSentryEnabled(),
+  /**
+   * TODO(INFRA-143)
+   * According to Sentry, this shouldn't be necessary, as they default to `3` when not set.
+   * Unfortunately, that doesn't work right now, so we workaround it by explicitly setting
+   * the `normalizeDepth` to `10`. This should be removed once the issue is fixed.
+   */
+  normalizeDepth: 10,
+})
+
+initializeAnalytics(AMPLITUDE_DUMMY_KEY, OriginApplication.INTERFACE, {
+  proxyUrl: process.env.REACT_APP_AMPLITUDE_PROXY_URL,
+  defaultEventName: SharedEventName.PAGE_VIEWED,
+  commitHash: process.env.REACT_APP_GIT_COMMIT_HASH,
+  isProductionEnv: isProductionEnv(),
+})

src/pages/App.tsx

-import {
-  getDeviceId,
-  initializeAnalytics,
-  OriginApplication,
-  sendAnalyticsEvent,
-  Trace,
-  user,
-} from '@uniswap/analytics'
+import { getDeviceId, sendAnalyticsEvent, Trace, user } from '@uniswap/analytics'
 import { CustomUserProperties, getBrowser, InterfacePageName, SharedEventName } from '@uniswap/analytics-events'
 import { useWeb3React } from '@web3-react/core'
 import Loader from 'components/Loader'
@@ -13,6 +6,7 @@ import { MenuDropdown } from 'components/NavBar/MenuDropdown'
 import TopLevelModals from 'components/TopLevelModals'
 import { useFeatureFlagsIsLoaded } from 'featureFlags'
 import ApeModeQueryParamReader from 'hooks/useApeModeQueryParamReader'
+import { STATSIG_DUMMY_KEY } from 'integrations'
 import { Box } from 'nft/components/Box'
 import { lazy, Suspense, useEffect, useMemo, useState } from 'react'
 import { Navigate, Route, Routes, useLocation } from 'react-router-dom'
@@ -22,7 +16,7 @@ import styled from 'styled-components/macro'
 import { SpinnerSVG } from 'theme/components'
 import { flexRowNoWrap } from 'theme/styles'
 import { Z_INDEX } from 'theme/zIndex'
-import { getEnvName, isProductionEnv } from 'utils/env'
+import { getEnvName } from 'utils/env'
 import { getCLS, getFCP, getFID, getLCP, Metric } from 'web-vitals'
 
 import { useAnalyticsReporter } from '../components/analytics'
@@ -57,23 +51,6 @@ const Collection = lazy(() => import('nft/pages/collection'))
 const Profile = lazy(() => import('nft/pages/profile/profile'))
 const Asset = lazy(() => import('nft/pages/asset/Asset'))
 
-// Placeholder API key. Actual API key used in the proxy server
-const AMPLITUDE_DUMMY_KEY = '00000000000000000000000000000000'
-const AMPLITUDE_PROXY_URL = process.env.REACT_APP_AMPLITUDE_PROXY_URL
-const STATSIG_DUMMY_KEY = 'client-0000000000000000000000000000000000000000000'
-const STATSIG_PROXY_URL = process.env.REACT_APP_STATSIG_PROXY_URL
-const COMMIT_HASH = process.env.REACT_APP_GIT_COMMIT_HASH
-
-// Dump some metadata into the window to allow client verification.
-window.GIT_COMMIT_HASH = COMMIT_HASH
-
-initializeAnalytics(AMPLITUDE_DUMMY_KEY, OriginApplication.INTERFACE, {
-  proxyUrl: AMPLITUDE_PROXY_URL,
-  defaultEventName: SharedEventName.PAGE_VIEWED,
-  commitHash: COMMIT_HASH,
-  isProductionEnv: isProductionEnv(),
-})
-
 const BodyWrapper = styled.div`
   display: flex;
   flex-direction: column;
@@ -220,7 +197,7 @@ export default function App() {
           waitForInitialization={false}
           options={{
             environment: { tier: getEnvName() },
-            api: STATSIG_PROXY_URL,
+            api: process.env.REACT_APP_STATSIG_PROXY_URL,
           }}
         >
           <HeaderWrapper transparent={isHeaderTransparent}>