fix: add two more analytics events for m parity (#5748)

* fix: add two more analytics events for m parity

* pr feedback

src/components/FiatOnrampAnnouncement/index.tsx

 import { Trans } from '@lingui/macro'
+import { sendAnalyticsEvent } from '@uniswap/analytics'
 import { useWeb3React } from '@web3-react/core'
 import fiatMaskUrl from 'assets/svg/fiat_mask.svg'
 import { BaseVariant } from 'featureFlags'
@@ -112,6 +113,7 @@ export function FiatOnrampAnnouncement() {
 
   const toggleWalletDropdown = useToggleWalletDropdown()
   const handleClick = useCallback(() => {
+    sendAnalyticsEvent('FOR Banner Click')
     toggleWalletDropdown()
     acknowledge({ user: true })
   }, [acknowledge, toggleWalletDropdown])

src/components/FiatOnrampModal/index.tsx

@@ -10,7 +10,7 @@ import Circle from '../../assets/images/blue-loader.svg'
 import Modal from '../Modal'
 
 const Wrapper = styled.div`
-  background-color: ${({ theme }) => theme.backgroundSurface};
+  background-color: ${({ theme }) => theme.white};
   border-radius: 20px;
   box-shadow: ${({ theme }) => theme.deepShadow};
   display: flex;

src/components/WalletDropdown/AuthenticatedHeader.tsx

 import { Trans } from '@lingui/macro'
+import { sendAnalyticsEvent } from '@uniswap/analytics'
 import { formatUSDPrice } from '@uniswap/conedison/format'
 import { CurrencyAmount, Token } from '@uniswap/sdk-core'
 import { useWeb3React } from '@web3-react/core'
@@ -250,21 +251,26 @@ const AuthenticatedHeader = () => {
   }, [acknowledge, animateBuyCryptoButtonBorder])
 
   const openFiatOnrampModal = useOpenModal(ApplicationModal.FIAT_ONRAMP)
+  const openFoRModalWithAnalytics = useCallback(() => {
+    sendAnalyticsEvent('Fiat OnRamp Widget Opened')
+    openFiatOnrampModal()
+  }, [openFiatOnrampModal])
+
   const [shouldCheck, setShouldCheck] = useState(false)
   const {
     available: fiatOnrampAvailable,
     availabilityChecked: fiatOnrampAvailabilityChecked,
     error,
     loading: fiatOnrampAvailabilityLoading,
-  } = useFiatOnrampAvailability(shouldCheck, openFiatOnrampModal)
+  } = useFiatOnrampAvailability(shouldCheck, openFoRModalWithAnalytics)
 
   const handleBuyCryptoClick = useCallback(() => {
     if (!fiatOnrampAvailabilityChecked) {
       setShouldCheck(true)
     } else if (fiatOnrampAvailable) {
-      openFiatOnrampModal()
+      openFoRModalWithAnalytics()
     }
-  }, [fiatOnrampAvailabilityChecked, fiatOnrampAvailable, openFiatOnrampModal])
+  }, [fiatOnrampAvailabilityChecked, fiatOnrampAvailable, openFoRModalWithAnalytics])
   const disableBuyCryptoButton = Boolean(
     error || (!fiatOnrampAvailable && fiatOnrampAvailabilityChecked) || fiatOnrampAvailabilityLoading
   )