@imtbl/checkout-widgets 2.24.8 → 2.24.9-0

package/src/widgets/swap/views/ApproveERC20Onboarding.tsx

@@ -1,6 +1,6 @@
 import { Box } from '@biom3/react';
 import {
-  useCallback, useContext, useEffect, useMemo, useState,
+  useCallback, useContext, useMemo, useState,
 } from 'react';
 import { CheckoutError, CheckoutErrorType, TokenInfo } from '@imtbl/checkout-sdk';
 import { useTranslation } from 'react-i18next';
@@ -22,16 +22,12 @@ import { ConnectLoaderContext } from '../../../context/connect-loader-context/Co
 import { SpendingCapHero } from '../../../components/Hero/SpendingCapHero';
 import { WalletApproveHero } from '../../../components/Hero/WalletApproveHero';
 import { EventTargetContext } from '../../../context/event-target-context/EventTargetContext';
-import { UserJourney, useAnalytics } from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 import { isPassportProvider } from '../../../lib/provider';
 
 export interface ApproveERC20Props {
   data: ApproveERC20SwapData;
 }
 
-const APPROVE_SPENDING = 'ApproveSpending';
-const APPROVE_SWAP = 'ApproveSwap';
-
 export function ApproveERC20Onboarding({ data }: ApproveERC20Props) {
   const { t } = useTranslation();
   const { swapState: { allowedTokens } } = useContext(SwapContext);
@@ -51,19 +47,6 @@ export function ApproveERC20Onboarding({ data }: ApproveERC20Props) {
   // reject transaction flags
   const [rejectedSpending, setRejectedSpending] = useState(false);
   const [rejectedSwap, setRejectedSwap] = useState(false);
-
-  const { page, track } = useAnalytics();
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.SWAP,
-      screen: noApprovalTransaction ? APPROVE_SWAP : APPROVE_SPENDING,
-      extras: {
-        swapFormInfo: data.swapFormInfo,
-      },
-    });
-  }, []);
-
   // Get symbol from swap info for approve amount text
   const fromToken = useMemo(
     () => allowedTokens.find(
@@ -152,15 +135,6 @@ export function ApproveERC20Onboarding({ data }: ApproveERC20Props) {
 
   const handleApproveSpendingClick = useCallback(async () => {
     if (loading) return;
-    track({
-      userJourney: UserJourney.SWAP,
-      screen: APPROVE_SPENDING,
-      control: APPROVE_SPENDING,
-      controlType: 'Button',
-      extras: {
-        autoProceed: data.autoProceed,
-      },
-    });
     setLoading(true);
 
     if (!checkout || !provider) {
@@ -256,15 +230,6 @@ export function ApproveERC20Onboarding({ data }: ApproveERC20Props) {
 
   const handleApproveSwapClick = useCallback(async () => {
     if (loading) return;
-    track({
-      userJourney: UserJourney.SWAP,
-      screen: APPROVE_SWAP,
-      control: APPROVE_SWAP,
-      controlType: 'Button',
-      extras: {
-        autoProceed: data.autoProceed,
-      },
-    });
     setLoading(true);
 
     if (!checkout || !provider) {

package/src/widgets/swap/views/SwapCoins.tsx

@@ -19,7 +19,6 @@ import { SwapContext } from '../context/SwapContext';
 import { NotEnoughImx } from '../../../components/NotEnoughImx/NotEnoughImx';
 import { IMX_TOKEN_SYMBOL } from '../../../lib';
 import { EventTargetContext } from '../../../context/event-target-context/EventTargetContext';
-import { UserJourney, useAnalytics } from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 import { isPassportProvider } from '../../../lib/provider';
 import { LoadingView } from '../../../views/loading/LoadingView';
 import { orchestrationEvents } from '../../../lib/orchestrationEvents';
@@ -70,22 +69,6 @@ export function SwapCoins({
   } = useContext(ConnectLoaderContext);
 
   const [showNotEnoughImxDrawer, setShowNotEnoughImxDrawer] = useState(false);
-
-  const { page } = useAnalytics();
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.SWAP,
-      screen: 'SwapCoins',
-      extras: {
-        fromAmount,
-        toAmount,
-        fromTokenAddress,
-        toTokenAddress,
-      },
-    });
-  }, []);
-
   useEffect(() => {
     if (hasZeroBalance(tokenBalances, IMX_TOKEN_SYMBOL) && !isPassportProvider(provider)) {
       setShowNotEnoughImxDrawer(true);

package/src/widgets/swap/views/SwapInProgress.tsx

@@ -10,7 +10,6 @@ import {
   SwapWidgetViews,
 } from '../../../context/view-context/SwapViewContextTypes';
 import { LoadingView } from '../../../views/loading/LoadingView';
-import { UserJourney, useAnalytics } from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 
 interface SwapInProgressProps {
   transactionResponse: TransactionResponse;
@@ -23,19 +22,6 @@ export function SwapInProgress({
 }: SwapInProgressProps) {
   const { t } = useTranslation();
   const { viewDispatch } = useContext(ViewContext);
-
-  const { page } = useAnalytics();
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.SWAP,
-      screen: 'SwapInProgress',
-      extras: {
-        swapFormInfo: swapForm,
-      },
-    });
-  }, []);
-
   useEffect(() => {
     (async () => {
       try {

package/src/widgets/transfer/TransferForm.tsx

@@ -10,7 +10,6 @@ import { SelectInput } from '../../components/FormComponents/SelectInput/SelectI
 import { TextInputForm } from '../../components/FormComponents/TextInputForm/TextInputForm';
 import { HeaderNavigation } from '../../components/Header/HeaderNavigation';
 import { SimpleLayout } from '../../components/SimpleLayout/SimpleLayout';
-import { useAnalytics, UserJourney } from '../../context/analytics-provider/SegmentAnalyticsProvider';
 import { CryptoFiatContext } from '../../context/crypto-fiat-context/CryptoFiatContext';
 import { EventTargetContext } from '../../context/event-target-context/EventTargetContext';
 import { orchestrationEvents } from '../../lib/orchestrationEvents';
@@ -42,9 +41,7 @@ export function TransferForm({
   title: string;
   coinAmountTitle: string;
 }) {
-  const { t } = useTranslation();
-  const { track } = useAnalytics();
-  const { eventTargetState: { eventTarget } } = useContext(EventTargetContext);
+  const { t } = useTranslation(); const { eventTargetState: { eventTarget } } = useContext(EventTargetContext);
   const { cryptoFiatState } = useContext(CryptoFiatContext);
 
   const tokenOptions = useMemo(
@@ -88,36 +85,20 @@ export function TransferForm({
 
   const handleTokenChange = useCallback(
     (optionKey: OptionKey) => {
-      track({
-        screen: 'TransferToken',
-        userJourney: UserJourney.TRANSFER,
-        control: 'SelectToken',
-        controlType: 'Select',
-        extras: { token: optionKey },
-      });
       if (typeof optionKey !== 'string') throw new Error('Invalid token address');
       setViewState((s) => ({ ...s, tokenAddress: optionKey, amountError: '' }));
     },
-    [setViewState, track],
+    [setViewState],
   );
 
   const handleMaxButtonClick = useCallback(() => {
     if (!token) throw new Error('Token not found');
     if (!token.balance) throw new Error('Token balance not found');
-
-    track({
-      screen: 'TransferToken',
-      userJourney: UserJourney.TRANSFER,
-      control: 'Max',
-      controlType: 'Button',
-      extras: { token: token.id, amount: token.balance.fullBalance },
-    });
-
     setViewState((s) => {
       if (!token.balance) throw new Error('Token balance not found');
       return { ...s, amount: token.balance.fullBalance };
     });
-  }, [token, setViewState, track]);
+  }, [token, setViewState]);
 
   const handleRecipientAddressChange = useCallback((value: string) => {
     setViewState((s) => ({ ...s, toAddress: value, toAddressError: '' }));
@@ -188,9 +169,6 @@ export function TransferForm({
               onSelectChange={handleTokenChange}
               selectedOption={token?.id}
               defaultTokenImage={defaultTokenImage}
-              userJourney={UserJourney.TRANSFER}
-              screen="TransferToken"
-              control="Token"
               theme={config.theme}
               themeOverrides={config.themeOverrides}
             />

package/src/widgets/transfer/TransferWidget.tsx

@@ -10,10 +10,6 @@ import { CloudImage, Stack, useTheme } from '@biom3/react';
 import { isAddress, isError, parseUnits } from 'ethers';
 import { StrongCheckoutWidgetsConfig } from '../../lib/withDefaultWidgetConfig';
 import { LoadingView } from '../../views/loading/LoadingView';
-import {
-  useAnalytics,
-  UserJourney,
-} from '../../context/analytics-provider/SegmentAnalyticsProvider';
 import { ConnectLoaderContext } from '../../context/connect-loader-context/ConnectLoaderContext';
 import { getRemoteImage } from '../../lib/utils';
 import {
@@ -41,8 +37,6 @@ function TransferWidgetInner(props: TransferWidgetInputs) {
   const { t } = useTranslation();
   const { cryptoFiatDispatch } = useContext(CryptoFiatContext);
   const { eventTargetState: { eventTarget } } = useContext(EventTargetContext);
-  const { track } = useAnalytics();
-
   const {
     connectLoaderState: { checkout, provider },
   } = useContext(ConnectLoaderContext);
@@ -89,15 +83,6 @@ function TransferWidgetInner(props: TransferWidgetInputs) {
 
   const onSend = useCallback(async () => {
     if (viewState.type !== 'FORM') throw new Error('Unexpected state');
-
-    track({
-      screen: 'TransferToken',
-      userJourney: UserJourney.TRANSFER,
-      control: 'Send',
-      controlType: 'Button',
-      extras: { token: viewState.tokenAddress, amount: viewState.amount },
-    });
-
     if (!isAddress(viewState.toAddress)) {
       setViewState((s) => ({ ...s, toAddressError: 'Invalid wallet address' }));
       return;
@@ -177,13 +162,6 @@ function TransferWidgetInner(props: TransferWidgetInputs) {
         && 'code' in e.error
         && e.error.code === TRANSACTION_CANCELLED_ERROR_CODE
       ) {
-        track({
-          screen: 'TransferToken',
-          userJourney: UserJourney.TRANSFER,
-          control: 'TranactionCancel',
-          controlType: 'Event',
-          extras: { token: viewState.tokenAddress, amount: viewState.amount },
-        });
         sendRejectedEvent(eventTarget, 'Transaction cancelled');
       } else {
         // eslint-disable-next-line no-console
@@ -192,7 +170,7 @@ function TransferWidgetInner(props: TransferWidgetInputs) {
         setViewState({ ...viewState, type: 'FORM' }); // TODO: We should be showing a failed view here
       }
     }
-  }, [viewState, eventTarget, track]);
+  }, [viewState, eventTarget]);
 
   switch (viewState.type) {
     case 'INITIALISING':

package/src/widgets/wallet/WalletWidgetRoot.tsx

@@ -12,7 +12,6 @@ import { Base } from '../BaseWidgetRoot';
 import { ConnectLoader, ConnectLoaderParams } from '../../components/ConnectLoader/ConnectLoader';
 import { isValidWalletProvider } from '../../lib/validations/widgetValidators';
 import { ThemeProvider } from '../../components/ThemeProvider/ThemeProvider';
-import { CustomAnalyticsProvider } from '../../context/analytics-provider/CustomAnalyticsProvider';
 import { LoadingView } from '../../views/loading/LoadingView';
 import { HandoverProvider } from '../../context/handover-context/HandoverProvider';
 import { sendWalletWidgetCloseEvent } from './WalletWidgetEvents';
@@ -79,32 +78,32 @@ export class Wallet extends Base<WidgetType.WALLET> {
 
     this.reactRoot.render(
       <React.StrictMode>
-        <CustomAnalyticsProvider checkout={this.checkout}>
-          <ThemeProvider id="wallet-container" config={this.strongConfig()}>
-            <HandoverProvider>
-              <ConnectLoader
-                widgetConfig={this.strongConfig()}
-                params={connectLoaderParams}
-                closeEvent={() => sendWalletWidgetCloseEvent(window)}
-              >
-                <Suspense
-                  fallback={
-                    <LoadingView loadingText={t('views.LOADING_VIEW.text')} />
+
+        <ThemeProvider id="wallet-container" config={this.strongConfig()}>
+          <HandoverProvider>
+            <ConnectLoader
+              widgetConfig={this.strongConfig()}
+              params={connectLoaderParams}
+              closeEvent={() => sendWalletWidgetCloseEvent(window)}
+            >
+              <Suspense
+                fallback={
+                  <LoadingView loadingText={t('views.LOADING_VIEW.text')} />
                   }
-                >
-                  <WalletWidget
-                    config={this.strongConfig()}
-                    walletConfig={{
-                      showDisconnectButton:
+              >
+                <WalletWidget
+                  config={this.strongConfig()}
+                  walletConfig={{
+                    showDisconnectButton:
                         this.properties.config?.showDisconnectButton!,
-                      showNetworkMenu: this.properties.config?.showNetworkMenu!,
-                    }}
-                  />
-                </Suspense>
-              </ConnectLoader>
-            </HandoverProvider>
-          </ThemeProvider>
-        </CustomAnalyticsProvider>
+                    showNetworkMenu: this.properties.config?.showNetworkMenu!,
+                  }}
+                />
+              </Suspense>
+            </ConnectLoader>
+          </HandoverProvider>
+        </ThemeProvider>
+
       </React.StrictMode>,
     );
   }

package/src/widgets/wallet/components/BalanceItem/BalanceItem.tsx

@@ -18,10 +18,6 @@ import { formatZeroAmount, tokenValueFormat } from '../../../../lib/utils';
 import { ConnectLoaderContext } from '../../../../context/connect-loader-context/ConnectLoaderContext';
 import { isPassportProvider } from '../../../../lib/provider';
 import { EventTargetContext } from '../../../../context/event-target-context/EventTargetContext';
-import {
-  UserJourney,
-  useAnalytics,
-} from '../../../../context/analytics-provider/SegmentAnalyticsProvider';
 
 export interface BalanceItemProps {
   balanceInfo: BalanceInfo;
@@ -34,9 +30,7 @@ export function BalanceItem({
   theme,
   bridgeToL2OnClick,
 }: BalanceItemProps) {
-  const { connectLoaderState } = useContext(ConnectLoaderContext);
-  const { track } = useAnalytics();
-  const { checkout, provider } = connectLoaderState;
+  const { connectLoaderState } = useContext(ConnectLoaderContext); const { checkout, provider } = connectLoaderState;
   const fiatAmount = `≈ USD $${formatZeroAmount(balanceInfo.fiatAmount)}`;
   const { walletState } = useContext(WalletContext);
   const { supportedTopUps, network } = walletState;
@@ -126,17 +120,6 @@ export function BalanceItem({
   ]);
 
   const handleAddTokenClick = () => {
-    track({
-      userJourney: UserJourney.WALLET,
-      screen: 'WalletBalances',
-      control: 'AddTokens',
-      controlType: 'Button',
-      extras: {
-        tokenSymbol: balanceInfo.symbol,
-        tokenAddress: balanceInfo.address,
-      },
-    });
-
     if (isAddTokensEnabled) {
       orchestrationEvents.sendRequestAddTokensEvent(
         eventTarget,
@@ -184,18 +167,6 @@ export function BalanceItem({
         <MenuItem.OverflowPopoverMenu
           size="small"
           testId="token-menu"
-          onClick={() => {
-            track({
-              userJourney: UserJourney.WALLET,
-              screen: 'WalletBalances',
-              control: 'BalanceItem',
-              controlType: 'Button',
-              extras: {
-                tokenSymbol: balanceInfo.symbol,
-                tokenAddress: balanceInfo.address,
-              },
-            });
-          }}
         >
           <MenuItem
             testId="balance-item-add-option"
@@ -209,16 +180,6 @@ export function BalanceItem({
             testId="balance-item-swap-option"
             sx={ShowMenuItem(isSwapEnabled)}
             onClick={() => {
-              track({
-                userJourney: UserJourney.WALLET,
-                screen: 'WalletBalances',
-                control: 'SwapTokens',
-                controlType: 'Button',
-                extras: {
-                  tokenSymbol: balanceInfo.symbol,
-                  tokenAddress: balanceInfo.address,
-                },
-              });
               orchestrationEvents.sendRequestSwapEvent(
                 eventTarget,
                 IMTBLWidgetEvents.IMTBL_WALLET_WIDGET_EVENT,
@@ -237,16 +198,6 @@ export function BalanceItem({
             testId="balance-item-move-option"
             sx={ShowMenuItem(isBridgeEnabled)}
             onClick={() => {
-              track({
-                userJourney: UserJourney.WALLET,
-                screen: 'WalletBalances',
-                control: 'MoveTokens',
-                controlType: 'Button',
-                extras: {
-                  tokenSymbol: balanceInfo.symbol,
-                  tokenAddress: balanceInfo.address,
-                },
-              });
               bridgeToL2OnClick(balanceInfo.address);
             }}
           >

package/src/widgets/wallet/components/NetworkMenu/NetworkMenu.tsx

@@ -33,7 +33,6 @@ import {
   ConnectLoaderContext,
 } from '../../../../context/connect-loader-context/ConnectLoaderContext';
 import { EventTargetContext } from '../../../../context/event-target-context/EventTargetContext';
-import { UserJourney, useAnalytics } from '../../../../context/analytics-provider/SegmentAnalyticsProvider';
 
 export function NetworkMenu() {
   const { t } = useTranslation();
@@ -46,21 +45,9 @@ export function NetworkMenu() {
   const [allowedNetworks, setNetworks] = useState<NetworkInfo[] | undefined>(
     [],
   );
-  const { track } = useAnalytics();
-
   const switchNetwork = useCallback(
     async (chainId: ChainId) => {
       if (!checkout || !provider || !network || Number(network.chainId) === chainId) return;
-      track({
-        userJourney: UserJourney.WALLET,
-        screen: 'WalletBalances',
-        control: 'SwitchNetwork',
-        controlType: 'Button',
-        extras: {
-          chainId,
-        },
-      });
-
       try {
         const switchNetworkResult = await checkout.switchNetwork({
           provider,

package/src/widgets/wallet/components/WalletAddress/WalletAddress.tsx

@@ -6,10 +6,6 @@ import {
 import { useEffect, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { WrappedBrowserProvider } from '@imtbl/checkout-sdk';
-import {
-  UserJourney,
-  useAnalytics,
-} from '../../../../context/analytics-provider/SegmentAnalyticsProvider';
 import { getWalletLogoByName } from '../../../../lib/logoUtils';
 import { getWalletProviderNameByProvider, isPassportProvider } from '../../../../lib/provider';
 import { abbreviateWalletAddress } from '../../../../lib/utils';
@@ -36,9 +32,6 @@ export function WalletAddress({
   const [isCopied, setIsCopied] = useState(false);
 
   const { t } = useTranslation();
-
-  const { track } = useAnalytics();
-
   const ctaIcon = useMemo<AllIconKeys>(() => {
     if (isPassportProvider(provider) && !showL1Warning) {
       return 'ShowPassword';
@@ -57,12 +50,6 @@ export function WalletAddress({
 
   const handleIconClick = async () => {
     if (walletAddress && ctaIcon === 'CopyText') {
-      track({
-        userJourney: UserJourney.WALLET,
-        screen: 'Settings',
-        control: 'CopyWalletAddress',
-        controlType: 'Button',
-      });
       navigator.clipboard.writeText(walletAddress);
       setIsCopied(true);
       setTimeout(() => setIsCopied(false), 1000);

package/src/widgets/wallet/views/CoinInfo.tsx

@@ -1,4 +1,4 @@
-import { useContext, useEffect } from 'react';
+import { useContext } from 'react';
 import { Link } from '@biom3/react';
 import { useTranslation } from 'react-i18next';
 import { FooterLogo } from '../../../components/Footer/FooterLogo';
@@ -9,22 +9,11 @@ import { IMXCoinsHero } from '../../../components/Hero/IMXCoinsHero';
 import { ConnectLoaderContext } from '../../../context/connect-loader-context/ConnectLoaderContext';
 import { isPassportProvider } from '../../../lib/provider';
 import { FAQS_LINK } from '../../../lib';
-import { UserJourney, useAnalytics } from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 
 export function CoinInfo() {
   const { t } = useTranslation();
   const { connectLoaderState: { provider } } = useContext(ConnectLoaderContext);
   const isPassport = isPassportProvider(provider);
-
-  const { page } = useAnalytics();
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.WALLET,
-      screen: 'CoinInfo',
-    });
-  }, []);
-
   return (
     <SimpleLayout
       testId="coin-info"

package/src/widgets/wallet/views/Settings.tsx

@@ -1,5 +1,5 @@
 import { Box, Button } from '@biom3/react';
-import { useContext, useEffect, useState } from 'react';
+import { useContext, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useWalletConnect } from '../../../lib/hooks/useWalletConnect';
 import { isWalletConnectProvider } from '../../../lib/provider';
@@ -17,10 +17,6 @@ import {
 } from './SettingsStyles';
 import { ConnectLoaderContext } from '../../../context/connect-loader-context/ConnectLoaderContext';
 import { EventTargetContext } from '../../../context/event-target-context/EventTargetContext';
-import {
-  UserJourney,
-  useAnalytics,
-} from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 import { TransferAssetsL1Warning } from '../components/TransferAssetsL1Warning';
 
 export interface SettingsProps {
@@ -38,16 +34,6 @@ export function Settings({ showDisconnectButton }: SettingsProps) {
   } = useContext(EventTargetContext);
 
   const { ethereumProvider } = useWalletConnect();
-
-  const { page } = useAnalytics();
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.WALLET,
-      screen: 'Settings',
-    });
-  }, []);
-
   // disconnect all Wallet Connect pairings and disconnect the provider
   // so that restoreSession doesn't pick up the previous sessions
   const handleWCDisconnect = async () => {

package/src/widgets/wallet/views/WalletBalances.tsx

@@ -29,7 +29,6 @@ import {
 import { orchestrationEvents } from '../../../lib/orchestrationEvents';
 import { ConnectLoaderContext } from '../../../context/connect-loader-context/ConnectLoaderContext';
 import { EventTargetContext } from '../../../context/event-target-context/EventTargetContext';
-import { UserJourney, useAnalytics } from '../../../context/analytics-provider/SegmentAnalyticsProvider';
 import { BalanceInfo, mapTokenBalancesWithConversions } from '../functions/tokenBalances';
 import { isPassportProvider } from '../../../lib/provider';
 
@@ -60,9 +59,6 @@ export function WalletBalances({
   const { conversions } = cryptoFiatState;
   const isPassport = isPassportProvider(provider);
   const enableNetworkMenu = !isPassport && showNetworkMenu;
-
-  const { track, page } = useAnalytics();
-
   const balanceInfos: BalanceInfo[] = useMemo(
     () => {
       if (!network?.chainId) return [];
@@ -71,14 +67,6 @@ export function WalletBalances({
     },
     [tokenBalances, conversions, network?.chainId],
   );
-
-  useEffect(() => {
-    page({
-      userJourney: UserJourney.WALLET,
-      screen: 'WalletBalances',
-    });
-  }, []);
-
   useEffect(() => {
     (async () => {
       if (!checkout) return;
@@ -120,12 +108,6 @@ export function WalletBalances({
   }, [checkout, network, supportedTopUps]);
 
   const handleAddCoinsClick = () => {
-    track({
-      userJourney: UserJourney.WALLET,
-      screen: 'WalletBalances',
-      control: 'AddCoins',
-      controlType: 'Button',
-    });
     orchestrationEvents.sendRequestAddTokensEvent(eventTarget, IMTBLWidgetEvents.IMTBL_WALLET_WIDGET_EVENT, {});
   };
 
@@ -148,12 +130,6 @@ export function WalletBalances({
               sx={ButtonNavigationStyles()}
               iconVariant="bold"
               onClick={() => {
-                track({
-                  userJourney: UserJourney.WALLET,
-                  screen: 'WalletBalances',
-                  control: 'Settings',
-                  controlType: 'Button',
-                });
                 viewDispatch({
                   payload: {
                     type: ViewActions.UPDATE_VIEW,

package/tsconfig.json

@@ -12,7 +12,6 @@
     "jsxImportSource": "@emotion/react",
     "experimentalDecorators": true,
     "types": [
-      "@segment/analytics-next",
       "jest",
       "node"
     ],