diff --git a/src/Root.tsx b/src/Root.tsx index 79be49990..2e495fce4 100644 --- a/src/Root.tsx +++ b/src/Root.tsx @@ -22,7 +22,6 @@ import {AppEffects, AppActions} from './store/app'; import {BitPayDarkTheme, BitPayLightTheme} from './themes/bitpay'; import {LogActions} from './store/log'; import {useAppDispatch, useAppSelector, useDeeplinks} from './utils/hooks'; -import analytics from '@segment/analytics-react-native'; import i18n from 'i18next'; import BitpayIdStack, { @@ -82,6 +81,7 @@ import DebugScreen, {DebugScreenParamList} from './navigation/Debug'; import CardActivationStack, { CardActivationStackParamList, } from './navigation/card-activation/CardActivationStack'; +import {logSegmentEvent} from './store/app/app.effects'; // ROOT NAVIGATION CONFIG export type RootStackParamList = { @@ -191,9 +191,6 @@ export default () => { const lockAuthorizedUntil = useAppSelector( ({APP}) => APP.lockAuthorizedUntil, ); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); // MAIN APP INIT useEffect(() => { @@ -325,10 +322,16 @@ export default () => { const tabName = history[history.length - 1].key.split('-')[0]; name = `${tabName} Tab`; } - analytics.screen(name, { - screen: params?.screen || '', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'screen', + name, + { + screen: params?.screen || '', + }, + true, + ), + ); } } }, 300)}> diff --git a/src/components/modal/transact-menu/TransactMenu.tsx b/src/components/modal/transact-menu/TransactMenu.tsx index 0a412d0c3..953c2b490 100644 --- a/src/components/modal/transact-menu/TransactMenu.tsx +++ b/src/components/modal/transact-menu/TransactMenu.tsx @@ -8,9 +8,9 @@ import {ActiveOpacity, SheetContainer} from '../../styled/Containers'; import {BaseText, H6} from '../../styled/Text'; import SheetModal from '../base/sheet/SheetModal'; import Icons from './TransactMenuIcons'; -import analytics from '@segment/analytics-react-native'; -import {useAppSelector} from '../../../utils/hooks'; import {useTranslation} from 'react-i18next'; +import {useAppDispatch} from '../../../utils/hooks'; +import {logSegmentEvent} from '../../../store/app/app.effects'; const TransactButton = styled.View` justify-content: center; @@ -83,9 +83,7 @@ const TransactModal = () => { const [modalVisible, setModalVisible] = useState(false); const hideModal = () => setModalVisible(false); const showModal = () => setModalVisible(true); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); + const dispatch = useAppDispatch(); const TransactMenuList: Array = [ { @@ -94,10 +92,16 @@ const TransactModal = () => { title: t('Buy Crypto'), description: t('Buy crypto with cash'), onPress: () => { - analytics.track('BitPay App - Clicked Buy Crypto', { - from: 'TransactMenu', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Clicked Buy Crypto', + { + context: 'TransactMenu', + }, + true, + ), + ); navigation.navigate('Wallet', { screen: 'Amount', params: { @@ -122,10 +126,16 @@ const TransactModal = () => { title: t('Exchange'), description: t('Swap crypto for another'), onPress: () => { - analytics.track('BitPay App - Clicked Swap Crypto', { - from: 'TransactMenu', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Clicked Swap Crypto', + { + context: 'TransactMenu', + }, + true, + ), + ); navigation.navigate('SwapCrypto', {screen: 'Root'}); }, }, @@ -167,6 +177,11 @@ const TransactModal = () => { img: () => , title: t('Scan'), onPress: () => { + dispatch( + logSegmentEvent('track', 'Open Scanner', { + context: 'TransactMenu', + }), + ); navigation.navigate('Scan', {screen: 'Root'}); }, }; diff --git a/src/navigation/auth/screens/VerifyEmail.tsx b/src/navigation/auth/screens/VerifyEmail.tsx index 05fb242c1..940ad2baa 100644 --- a/src/navigation/auth/screens/VerifyEmail.tsx +++ b/src/navigation/auth/screens/VerifyEmail.tsx @@ -3,6 +3,7 @@ import React, {useEffect, useRef} from 'react'; import {useTranslation} from 'react-i18next'; import styled from 'styled-components/native'; import {Link} from '../../../components/styled/Text'; +import {logSegmentEvent} from '../../../store/app/app.effects'; import {BitPayIdEffects} from '../../../store/bitpay-id'; import {useAppDispatch, useAppSelector} from '../../../utils/hooks'; import {AuthStackParamList} from '../AuthStack'; @@ -77,6 +78,17 @@ const VerifyEmailScreen: React.FC = ({navigation}) => { clearInterval(pollId.current); } + dispatch( + logSegmentEvent( + 'track', + 'Verified Email', + { + email: email || '', + }, + true, + ), + ); + navigation.navigate('CreateAccount'); } }, [isVerified, csrfToken, navigation, dispatch]); diff --git a/src/navigation/card/components/CardDashboard.tsx b/src/navigation/card/components/CardDashboard.tsx index 6e9627df7..039954dd6 100644 --- a/src/navigation/card/components/CardDashboard.tsx +++ b/src/navigation/card/components/CardDashboard.tsx @@ -1,6 +1,5 @@ import {useFocusEffect, useNavigation} from '@react-navigation/native'; import {StackNavigationProp} from '@react-navigation/stack'; -import analytics from '@segment/analytics-react-native'; import React, {useCallback, useLayoutEffect, useMemo} from 'react'; import {useRef, useState} from 'react'; import {useTranslation} from 'react-i18next'; @@ -26,6 +25,7 @@ import {CardProvider} from '../../../constants/card'; import {CARD_WIDTH} from '../../../constants/config.card'; import {navigationRef} from '../../../Root'; import {showBottomNotificationModal} from '../../../store/app/app.actions'; +import {logSegmentEvent} from '../../../store/app/app.effects'; import {selectBrazeCardOffers} from '../../../store/app/app.selectors'; import {CardEffects} from '../../../store/card'; import {Card, UiTransaction} from '../../../store/card/card.models'; @@ -118,6 +118,8 @@ const CardDashboard: React.FC = props => { ); const goToCardSettings = () => { + dispatch(logSegmentEvent('track', 'Clicked Card Settings', {}, true)); + navigation.navigate('Settings', { id: activeCard.id, }); @@ -126,6 +128,8 @@ const CardDashboard: React.FC = props => { goToCardSettingsRef.current = goToCardSettings; const goToReferAndEarn = () => { + dispatch(logSegmentEvent('track', 'Clicked Refer and Earn', {}, true)); + navigation.navigate('Referral', {card: activeCard}); }; const goToReferAndEarnRef = useRef(goToReferAndEarn); @@ -163,10 +167,16 @@ const CardDashboard: React.FC = props => { { text: t('Add funds'), action: () => { - analytics.track('BitPay App - Clicked Buy Crypto', { - from: 'CardDashboard', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Clicked Buy Crypto', + { + context: 'CardDashboard', + }, + true, + ), + ); navigator.navigate('Wallet', { screen: WalletScreens.AMOUNT, params: { diff --git a/src/navigation/card/components/CardOffers.tsx b/src/navigation/card/components/CardOffers.tsx index f07b4b776..79033f159 100644 --- a/src/navigation/card/components/CardOffers.tsx +++ b/src/navigation/card/components/CardOffers.tsx @@ -9,6 +9,7 @@ import { CardContainer, } from '../../../components/styled/Containers'; import {BaseText} from '../../../components/styled/Text'; +import {logSegmentEvent} from '../../../store/app/app.effects'; import {CardEffects} from '../../../store/card'; import { isCaptionedContentCard, @@ -86,6 +87,17 @@ const CardOffers: React.VFC = props => { const onPress = () => { if (!contentCard.id.startsWith('dev_')) { ReactAppboy.logContentCardClicked(contentCard.id); + + dispatch( + logSegmentEvent( + 'track', + 'Clicked Card Offer', + { + id: contentCard.id || '', + }, + true, + ), + ); } dispatch(CardEffects.startOpenDosh(userEmail || '')); diff --git a/src/navigation/card/screens/settings/CustomizeVirtualCard.tsx b/src/navigation/card/screens/settings/CustomizeVirtualCard.tsx index 0d414551b..12db1c889 100644 --- a/src/navigation/card/screens/settings/CustomizeVirtualCard.tsx +++ b/src/navigation/card/screens/settings/CustomizeVirtualCard.tsx @@ -30,6 +30,7 @@ import CardFront from '../../components/CardFront'; import CheckIcon from './CheckIcon'; import * as Styled from './CustomizeVirtualCard.styled'; import {CardBrand} from '../../../../constants/card'; +import {logSegmentEvent} from '../../../../store/app/app.effects'; export interface CustomizeVirtualCardParamList { card: Card; @@ -159,6 +160,12 @@ const CustomizeVirtualCard: React.FC< const onSavePress = () => { dispatch(CardActions.virtualDesignCurrencyUpdated(selectedDesign)); + dispatch( + logSegmentEvent('track', 'Save Virtual Card selected design', { + selectedDesign: selectedDesign || '', + }), + ); + if (navigation.canGoBack()) { navigation.goBack(); } else { diff --git a/src/navigation/card/screens/settings/Referral.tsx b/src/navigation/card/screens/settings/Referral.tsx index 517c78a92..223386903 100644 --- a/src/navigation/card/screens/settings/Referral.tsx +++ b/src/navigation/card/screens/settings/Referral.tsx @@ -45,6 +45,7 @@ import ReferredUsersSkeleton from '../../components/ReferredUsersSkeleton'; import ReferralCodeSkeleton from '../../components/ReferralCodeSkeleton'; import {BASE_BITPAY_URLS} from '../../../../constants/config'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../../store/app/app.effects'; export interface ReferralParamList { card: Card; @@ -152,6 +153,9 @@ const Referral = ({}) => { if (!copied) { Clipboard.setString(code); setCopied(true); + dispatch( + logSegmentEvent('track', 'Copied Share Referral Code', {}, true), + ); } }; @@ -177,6 +181,10 @@ const Referral = ({}) => { await Share.share({ message, }); + + dispatch( + logSegmentEvent('track', 'Clicked Share Referral Code', {}, true), + ); } catch (e) {} }; const currentDate = new Date().getTime(); diff --git a/src/navigation/coinbase/components/CoinbaseIntro.tsx b/src/navigation/coinbase/components/CoinbaseIntro.tsx index 0ab3a0084..3f427f9b9 100644 --- a/src/navigation/coinbase/components/CoinbaseIntro.tsx +++ b/src/navigation/coinbase/components/CoinbaseIntro.tsx @@ -10,6 +10,7 @@ import Coinbase from '../../../api/coinbase/index'; import {AppEffects} from '../../../store/app'; import {useAppDispatch} from '../../../utils/hooks'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../store/app/app.effects'; const signupUrl: string = 'https://www.coinbase.com/signup'; @@ -63,6 +64,16 @@ const CoinbaseIntro = () => { } else { url = signupUrl; } + dispatch( + logSegmentEvent( + 'track', + 'Clicked Connect to Coinbase', + { + context, + }, + true, + ), + ); dispatch(AppEffects.openUrlWithInAppBrowser(url)); }; diff --git a/src/navigation/coinbase/screens/CoinbaseAccount.tsx b/src/navigation/coinbase/screens/CoinbaseAccount.tsx index 1d4a2324d..a09ee6095 100644 --- a/src/navigation/coinbase/screens/CoinbaseAccount.tsx +++ b/src/navigation/coinbase/screens/CoinbaseAccount.tsx @@ -51,6 +51,7 @@ import { import Amount from '../../wallet/screens/Amount'; import {Wallet} from '../../../store/wallet/wallet.models'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../store/app/app.effects'; const AccountContainer = styled.View` flex: 1; @@ -321,6 +322,16 @@ const CoinbaseAccount = ({ dispatch( showOnGoingProcessModal(OnGoingProcessMessages.FETCHING_COINBASE_DATA), ); + dispatch( + logSegmentEvent( + 'track', + 'Clicked Receive', + { + context: 'CoinbaseAccount', + }, + true, + ), + ); dispatch(coinbaseCreateAddress(accountId)) .then(async newAddress => { dispatch(dismissOnGoingProcessModal()); @@ -353,6 +364,16 @@ const CoinbaseAccount = ({ const onSelectedWallet = async (newWallet?: Wallet) => { setWalletModalVisible(false); + dispatch( + logSegmentEvent( + 'track', + 'Clicked Send', + { + context: 'CoinbaseAccount', + }, + true, + ), + ); if (newWallet) { setSelectedWallet(newWallet); await sleep(500); diff --git a/src/navigation/coinbase/screens/CoinbaseSettings.tsx b/src/navigation/coinbase/screens/CoinbaseSettings.tsx index 4b7245afe..0df57835c 100644 --- a/src/navigation/coinbase/screens/CoinbaseSettings.tsx +++ b/src/navigation/coinbase/screens/CoinbaseSettings.tsx @@ -31,6 +31,7 @@ import {COINBASE_ENV} from '../../../api/coinbase/coinbase.constants'; import CoinbaseSvg from '../../../../assets/img/logos/coinbase.svg'; import {CoinbaseStackParamList} from '../CoinbaseStack'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../store/app/app.effects'; const SettingsContainer = styled.SafeAreaView` flex: 1; @@ -149,6 +150,7 @@ const CoinbaseSettings = () => { const deleteAccount = async () => { await dispatch(coinbaseDisconnectAccount()); + dispatch(logSegmentEvent('track', 'Coinbase Disconnected', {}, true)); if (fromScreen === 'CoinbaseDashboard') { navigation.navigate('Tabs', {screen: 'Home'}); } else { diff --git a/src/navigation/onboarding/screens/OnboardingStart.tsx b/src/navigation/onboarding/screens/OnboardingStart.tsx index 46e31060d..be5a8e875 100644 --- a/src/navigation/onboarding/screens/OnboardingStart.tsx +++ b/src/navigation/onboarding/screens/OnboardingStart.tsx @@ -130,7 +130,7 @@ const OnboardingStart: React.VFC = () => { const askForTrackingThenNavigate = useCallback( async (cb: () => void) => { haptic('impactLight'); - await dispatch(askForTrackingPermissionAndEnableSdks()); + await dispatch(askForTrackingPermissionAndEnableSdks(true)); cb(); }, [dispatch], diff --git a/src/navigation/services/buy-crypto/screens/BuyCryptoOffers.tsx b/src/navigation/services/buy-crypto/screens/BuyCryptoOffers.tsx index 017b2cf34..6d8ecc708 100644 --- a/src/navigation/services/buy-crypto/screens/BuyCryptoOffers.tsx +++ b/src/navigation/services/buy-crypto/screens/BuyCryptoOffers.tsx @@ -49,7 +49,10 @@ import { showBottomNotificationModal, dismissBottomNotificationModal, } from '../../../../store/app/app.actions'; -import {openUrlWithInAppBrowser} from '../../../../store/app/app.effects'; +import { + logSegmentEvent, + openUrlWithInAppBrowser, +} from '../../../../store/app/app.effects'; import {BuyCryptoActions} from '../../../../store/buy-crypto'; import {simplexPaymentData} from '../../../../store/buy-crypto/buy-crypto.models'; import {createWalletAddress} from '../../../../store/wallet/effects/address/address'; @@ -58,7 +61,6 @@ import {APP_NAME} from '../../../../constants/config'; import {isPaymentMethodSupported} from '../utils/buy-crypto-utils'; import {formatFiatAmount} from '../../../../utils/helper-methods'; import {PaymentMethod} from '../constants/BuyCryptoConstants'; -import analytics from '@segment/analytics-react-native'; import {useTranslation} from 'react-i18next'; export interface BuyCryptoOffersProps { @@ -285,9 +287,6 @@ const BuyCryptoOffers: React.FC = () => { const [updateView, setUpdateView] = useState(false); const createdOn = useAppSelector(({WALLET}: RootState) => WALLET.createdOn); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); const getSimplexQuote = (): void => { logger.debug('Simplex getting quote'); @@ -372,6 +371,7 @@ const BuyCryptoOffers: React.FC = () => { }) .catch((err: any) => { console.log('Simplex getting quote: FAILED', err); + showSimplexError(err); }); } }; @@ -392,6 +392,23 @@ const BuyCryptoOffers: React.FC = () => { logger.error('Simplex error: ' + msg); + dispatch( + logSegmentEvent( + 'track', + 'Failed Buy Crypto', + { + exchange: 'simplex', + context: 'BuyCryptoOffers', + message: msg || '', + paymentMethod: paymentMethod.method || '', + amount: Number(amount) || '', + coin: coin || '', + fiatCurrency: fiatCurrency || '', + }, + true, + ), + ); + offers.simplex.errorMsg = msg; offers.simplex.fiatMoney = undefined; offers.simplex.expanded = false; @@ -420,6 +437,23 @@ const BuyCryptoOffers: React.FC = () => { } } + dispatch( + logSegmentEvent( + 'track', + 'Failed Buy Crypto', + { + exchange: 'wyre', + context: 'BuyCryptoOffers', + message: msg || '', + paymentMethod: paymentMethod.method || '', + amount: Number(amount) || '', + coin: coin || '', + fiatCurrency: fiatCurrency || '', + }, + true, + ), + ); + logger.error('Crypto offer error: ' + msg); offers.wyre.errorMsg = msg; offers.wyre.fiatMoney = undefined; @@ -510,6 +544,7 @@ const BuyCryptoOffers: React.FC = () => { }) .catch((err: any) => { console.log('Wyre getting quote: FAILED', err); + showWyreError(err); }); } }; @@ -581,15 +616,20 @@ const BuyCryptoOffers: React.FC = () => { }), ); - analytics.track('BitPay App - Requested Crypto Purchase', { - exchange: 'simplex', - walletId: selectedWallet.id, - fiatAmount: amount, - fiatCurrency: fiatCurrency, - paymentMethod: paymentMethod.method, - coin: selectedWallet.currencyAbbreviation, - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Requested Crypto Purchase', + { + exchange: 'simplex', + fiatAmount: amount, + fiatCurrency: fiatCurrency, + paymentMethod: paymentMethod.method, + coin: selectedWallet.currencyAbbreviation, + }, + true, + ), + ); const paymentUrl: string = getPaymentUrl( selectedWallet, @@ -667,15 +707,20 @@ const BuyCryptoOffers: React.FC = () => { }; const continueToWyre = (paymentUrl: string) => { - analytics.track('BitPay App - Requested Crypto Purchase', { - exchange: 'wyre', - walletId: selectedWallet.id, - fiatAmount: amount, - fiatCurrency: fiatCurrency, - paymentMethod: paymentMethod.method, - coin: selectedWallet.currencyAbbreviation, - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Requested Crypto Purchase', + { + exchange: 'wyre', + fiatAmount: amount, + fiatCurrency: fiatCurrency, + paymentMethod: paymentMethod.method, + coin: selectedWallet.currencyAbbreviation, + }, + true, + ), + ); Linking.openURL(paymentUrl) .then(() => { navigation.goBack(); diff --git a/src/navigation/services/buy-crypto/screens/BuyCryptoRoot.tsx b/src/navigation/services/buy-crypto/screens/BuyCryptoRoot.tsx index 99ac6fc9d..bb22966b3 100644 --- a/src/navigation/services/buy-crypto/screens/BuyCryptoRoot.tsx +++ b/src/navigation/services/buy-crypto/screens/BuyCryptoRoot.tsx @@ -38,11 +38,11 @@ import SelectorArrowRight from '../../../../../assets/img/selector-arrow-right.s import {simplexSupportedCoins} from '../utils/simplex-utils'; import {wyreSupportedCoins} from '../utils/wyre-utils'; import {sleep} from '../../../../utils/helper-methods'; -import analytics from '@segment/analytics-react-native'; import {AppActions} from '../../../../store/app'; import {IsERCToken} from '../../../../store/wallet/utils/currency'; import {isPaymentMethodSupported} from '../utils/buy-crypto-utils'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../../store/app/app.effects'; const CtaContainer = styled.View` margin: 20px 15px; @@ -60,9 +60,6 @@ const BuyCryptoRoot: React.FC< const theme = useTheme(); const logger = useLogger(); const allKeys = useAppSelector(({WALLET}: RootState) => WALLET.keys); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); const keys = useAppSelector(({WALLET}) => WALLET.keys); const countryData = useAppSelector(({LOCATION}) => LOCATION.countryData); @@ -294,14 +291,19 @@ const BuyCryptoRoot: React.FC< }; const continueToViewOffers = () => { - analytics.track('BitPay App - Buy Crypto "View Offers"', { - walletId: selectedWallet!.id, - fiatAmount: amount, - fiatCurrency, - paymentMethod: selectedPaymentMethod.method, - coin: selectedWallet!.currencyAbbreviation, - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Buy Crypto "View Offers"', + { + fiatAmount: amount, + fiatCurrency, + paymentMethod: selectedPaymentMethod.method, + coin: selectedWallet!.currencyAbbreviation, + }, + true, + ), + ); navigation.navigate('BuyCryptoOffers', { amount, diff --git a/src/navigation/services/swap-crypto/screens/ChangellyCheckout.tsx b/src/navigation/services/swap-crypto/screens/ChangellyCheckout.tsx index e1ff7776e..0e70c7319 100644 --- a/src/navigation/services/swap-crypto/screens/ChangellyCheckout.tsx +++ b/src/navigation/services/swap-crypto/screens/ChangellyCheckout.tsx @@ -64,7 +64,10 @@ import { ArrowContainer, } from '../styled/SwapCryptoCheckout.styled'; import {startGetRates} from '../../../../store/wallet/effects'; -import {startOnGoingProcessModal} from '../../../../store/app/app.effects'; +import { + logSegmentEvent, + startOnGoingProcessModal, +} from '../../../../store/app/app.effects'; import { dismissOnGoingProcessModal, showBottomNotificationModal, @@ -77,7 +80,6 @@ import { import {changellyTxData} from '../../../../store/swap-crypto/swap-crypto.models'; import {SwapCryptoActions} from '../../../../store/swap-crypto'; import SelectorArrowRight from '../../../../../assets/img/selector-arrow-right.svg'; -import analytics from '@segment/analytics-react-native'; import {useTranslation} from 'react-i18next'; // Styled @@ -133,9 +135,6 @@ const ChangellyCheckout: React.FC = () => { const key = useAppSelector( ({WALLET}) => WALLET.keys[fromWalletSelected.keyId], ); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); const [showPaymentSentModal, setShowPaymentSentModal] = useState(false); const [resetSwipeButton, setResetSwipeButton] = useState(false); const [txData, setTxData] = useState(); @@ -342,6 +341,21 @@ const ChangellyCheckout: React.FC = () => { /* later */ clearInterval(countDown); } + dispatch( + logSegmentEvent( + 'track', + 'Failed Swap Crypto', + { + exchange: 'changelly', + context: 'ChangellyCheckout', + message: 'The time to make the payment expired', + amountFrom: amountFrom || '', + fromCoin: fromWalletSelected.currencyAbbreviation || '', + toCoin: toWalletSelected.currencyAbbreviation || '', + }, + true, + ), + ); return; } @@ -526,20 +540,39 @@ const ChangellyCheckout: React.FC = () => { logger.debug('Saved swap with: ' + JSON.stringify(newData)); - analytics.track('BitPay App - Successful Crypto Swap', { - fromWalletId: fromWalletSelected.id, - toWalletId: toWalletSelected.id, - fromCoin: fromWalletSelected.currencyAbbreviation, - toCoin: toWalletSelected.currencyAbbreviation, - amountFrom: amountFrom, - exchange: 'changelly', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Successful Crypto Swap', + { + fromCoin: fromWalletSelected.currencyAbbreviation, + toCoin: toWalletSelected.currencyAbbreviation, + amountFrom: amountFrom, + exchange: 'changelly', + }, + true, + ), + ); }; const showError = async (msg?: string, title?: string, actions?: any) => { dispatch(dismissOnGoingProcessModal()); await sleep(1000); + dispatch( + logSegmentEvent( + 'track', + 'Failed Swap Crypto', + { + exchange: 'changelly', + context: 'ChangellyCheckout', + message: msg || '', + amountFrom: amountFrom || '', + fromCoin: fromWalletSelected.currencyAbbreviation || '', + toCoin: toWalletSelected.currencyAbbreviation || '', + }, + true, + ), + ); dispatch( showBottomNotificationModal({ type: 'error', diff --git a/src/navigation/services/swap-crypto/screens/SwapCryptoRoot.tsx b/src/navigation/services/swap-crypto/screens/SwapCryptoRoot.tsx index 9aa2d3e66..28070b0dc 100644 --- a/src/navigation/services/swap-crypto/screens/SwapCryptoRoot.tsx +++ b/src/navigation/services/swap-crypto/screens/SwapCryptoRoot.tsx @@ -57,6 +57,7 @@ import {changellyGetCurrencies} from '../../../../store/swap-crypto/effects/chan import { startOnGoingProcessModal, openUrlWithInAppBrowser, + logSegmentEvent, } from '../../../../store/app/app.effects'; import { dismissOnGoingProcessModal, @@ -64,7 +65,6 @@ import { } from '../../../../store/app/app.actions'; import ArrowDown from '../../../../../assets/img/services/swap-crypto/down-arrow.svg'; import SelectorArrowDown from '../../../../../assets/img/selector-arrow-down.svg'; -import analytics from '@segment/analytics-react-native'; import {AppActions} from '../../../../store/app'; import {useTranslation} from 'react-i18next'; @@ -80,9 +80,6 @@ const SwapCryptoRoot: React.FC = () => { const navigation = useNavigation(); const dispatch = useAppDispatch(); const logger = useLogger(); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); const keys = useAppSelector(({WALLET}) => WALLET.keys); const countryData = useAppSelector(({LOCATION}) => LOCATION.countryData); const route = useRoute>(); @@ -580,15 +577,19 @@ const SwapCryptoRoot: React.FC = () => { }; const continueToCheckout = () => { - analytics.track('BitPay App - Requested Swap Crypto', { - fromWalletId: fromWalletSelected!.id, - toWalletId: toWalletSelected!.id, - fromCoin: fromWalletSelected!.currencyAbbreviation, - toCoin: toWalletSelected!.currencyAbbreviation, - amountFrom: amountFrom, - exchange: 'changelly', - appUser: user?.eid || '', - }); + dispatch( + logSegmentEvent( + 'track', + 'Requested Swap Crypto', + { + fromCoin: fromWalletSelected!.currencyAbbreviation, + toCoin: toWalletSelected!.currencyAbbreviation, + amountFrom: amountFrom, + exchange: 'changelly', + }, + true, + ), + ); navigation.navigate('SwapCrypto', { screen: 'ChangellyCheckout', params: { diff --git a/src/navigation/tabs/contacts/screens/ContactsAdd.tsx b/src/navigation/tabs/contacts/screens/ContactsAdd.tsx index dc20f5a39..aa58f0a78 100644 --- a/src/navigation/tabs/contacts/screens/ContactsAdd.tsx +++ b/src/navigation/tabs/contacts/screens/ContactsAdd.tsx @@ -34,6 +34,7 @@ import {LightBlack, NeutralSlate, Slate} from '../../../../styles/colors'; import {CurrencyImage} from '../../../../components/currency-image/CurrencyImage'; import WalletIcons from '../../../wallet/components/WalletIcons'; import {useTranslation} from 'react-i18next'; +import {logSegmentEvent} from '../../../../store/app/app.effects'; const InputContainer = styled.View<{hideInput?: boolean}>` display: ${({hideInput}) => (!hideInput ? 'flex' : 'none')}; @@ -294,6 +295,11 @@ const ContactsAdd: React.FC = () => { ); const goToScan = () => { + dispatch( + logSegmentEvent('track', 'Open Scanner', { + context: 'contactsAdd', + }), + ); navigation.navigate('Scan', { screen: 'Root', params: { diff --git a/src/navigation/tabs/home/HomeRoot.tsx b/src/navigation/tabs/home/HomeRoot.tsx index 8b19480c2..8c6c789a8 100644 --- a/src/navigation/tabs/home/HomeRoot.tsx +++ b/src/navigation/tabs/home/HomeRoot.tsx @@ -9,7 +9,10 @@ import { setShowKeyMigrationFailureModal, showBottomNotificationModal, } from '../../../store/app/app.actions'; -import {startRefreshBrazeContent} from '../../../store/app/app.effects'; +import { + logSegmentEvent, + startRefreshBrazeContent, +} from '../../../store/app/app.effects'; import { selectBrazeDoMore, selectBrazeQuickLinks, @@ -62,9 +65,6 @@ const HomeRoot = () => { ({APP}) => APP.keyMigrationFailureModalHasBeenShown, ); const defaultAltCurrency = useAppSelector(({APP}) => APP.defaultAltCurrency); - const user = useAppSelector( - ({APP, BITPAY_ID}) => BITPAY_ID.user[APP.network], - ); const hasKeys = Object.values(keys).length; const cardGroups = useAppSelector(selectCardGroups); const hasCards = cardGroups.length > 0; @@ -202,6 +202,16 @@ const HomeRoot = () => { ), ); } else { + dispatch( + logSegmentEvent( + 'track', + 'Clicked Receive', + { + context: 'HomeRoot', + }, + true, + ), + ); navigation.navigate('Wallet', { screen: 'GlobalSelect', params: {context: 'receive'}, @@ -228,12 +238,15 @@ const HomeRoot = () => { { text: 'Add funds', action: () => { - analytics.track( - 'BitPay App - Clicked Buy Crypto', - { - from: 'HomeRoot', - appUser: user?.eid || '', - }, + dispatch( + logSegmentEvent( + 'track', + 'Clicked Buy Crypto', + { + context: 'HomeRoot', + }, + true, + ), ); navigation.navigate('Wallet', { screen: 'Amount', @@ -263,6 +276,16 @@ const HomeRoot = () => { }), ); } else { + dispatch( + logSegmentEvent( + 'track', + 'Clicked Send', + { + context: 'HomeRoot', + }, + true, + ), + ); navigation.navigate('Wallet', { screen: 'GlobalSelect', params: {context: 'send'}, diff --git a/src/navigation/tabs/home/components/Crypto.tsx b/src/navigation/tabs/home/components/Crypto.tsx index a550187b4..b959b1a90 100644 --- a/src/navigation/tabs/home/components/Crypto.tsx +++ b/src/navigation/tabs/home/components/Crypto.tsx @@ -47,6 +47,7 @@ import {COINBASE_ENV} from '../../../../api/coinbase/coinbase.constants'; import {WrongPasswordError} from '../../../wallet/components/ErrorMessages'; import {useTranslation} from 'react-i18next'; import {t} from 'i18next'; +import {logSegmentEvent} from '../../../../store/app/app.effects'; const CryptoContainer = styled.View` background: ${({theme}) => (theme.dark ? '#111111' : Feather)}; @@ -295,16 +296,26 @@ const Crypto = () => {