react-native-unit-components 1.14.0 → 2.0.0

package/src/components/UNWirePaymentComponent/UNWirePaymentComponent.tsx

@@ -3,19 +3,18 @@ import React, { useState } from 'react';
 import { PresentationMode, WebComponentType } from '../../types/internal/webComponent.types';
 import { withReduxStore } from '../../helpers/store/helpers';
 import { RESPONSE_KEYS, UnitOnLoadResponseEvent } from '../../messages/webMessages/onLoadMessage';
-import { UNAccountData, UNError, UNOnLoadResponse, UNOnLoadResponseData } from '../../types/shared';
+import { UNAccount, UNComponentsError, UNComponentsOnLoadResponse, UNComponentsOnLoadResponseData, UNWirePayment } from '../../types/shared';
 import { WebViewMessage } from '../../messages/webMessages';
 import { PaymentMessage } from '../../messages/webMessages/paymentsMessage';
-import { UnitMessage } from '../../messages/webMessages/unitMessages';
+import { UnitComponentsMessage } from '../../messages/webMessages/unitComponentsMessages';
 import { HeightEvent, PageMessage } from '../../messages/webMessages/pageMessage';
 import { getWirePaymentParams, getWirePaymentScript } from './UNWirePaymentComponent.utils';
-import { UNWirePaymentData, WirePaymentCreatedEvent } from '../../types/shared/wirePayment.types';
 import { UNBaseView } from '../../nativeComponents/UNBaseView';
 import { ensureArray } from '../../utils/onLoadMessages.utils';
+import { WirePaymentCreatedEvent } from '../../messages/webMessages/wirePaymentMessage';
 
 export interface UNWirePaymentComponentProps {
   // inputs
-  customerToken: string;
   accountId?: string;
   fee?: number;
 
@@ -28,8 +27,8 @@ export interface UNWirePaymentComponentProps {
   finalStageDoneButton?: boolean;
 
   // events
-  onPaymentCreated?: (data: UNWirePaymentData) => void;
-  onLoad?: (response: UNOnLoadResponse<[UNAccountData]>) => void;
+  onPaymentCreated?: (data: UNWirePayment) => void;
+  onLoad?: (response: UNComponentsOnLoadResponse<[UNAccount]>) => void;
   onInitialStageBackButtonClicked?: () => void;
   onFinalStageDoneButtonClicked?: () => void;
 }
@@ -44,13 +43,13 @@ const UNWirePaymentComponent = (props: UNWirePaymentComponentProps) => {
     }
 
     if (RESPONSE_KEYS.errors in response) {
-      props.onLoad(response as UNError);
+      props.onLoad(response as UNComponentsError);
       return;
     }
 
     if (RESPONSE_KEYS.account in response) {
       const account = response[RESPONSE_KEYS.account].data;
-      const paymentOnLoad: UNOnLoadResponseData<[UNAccountData]> = {
+      const paymentOnLoad: UNComponentsOnLoadResponseData<[UNAccount]> = {
         data: ensureArray(account),
       };
       props.onLoad(paymentOnLoad);
@@ -63,7 +62,7 @@ const UNWirePaymentComponent = (props: UNWirePaymentComponentProps) => {
 
   const handleWebViewMessage = (message: WebViewMessage) => {
     if (!message || !message.details) return;
-    switch (message.type) {
+    switch (message.type) { 
       case PaymentMessage.INITIAL_STAGE_BACK_BUTTON_CLICKED: {
         props.onInitialStageBackButtonClicked && props.onInitialStageBackButtonClicked();
         break;
@@ -75,7 +74,7 @@ const UNWirePaymentComponent = (props: UNWirePaymentComponentProps) => {
       case PaymentMessage.PAYMENT_CREATED:
         props.onPaymentCreated && props.onPaymentCreated((message.details as WirePaymentCreatedEvent).data);
         break;
-      case UnitMessage.UNIT_ON_LOAD:
+      case UnitComponentsMessage.UNIT_ON_LOAD:
         handleUnitOnLoad(message.details as UnitOnLoadResponseEvent);
         break;
       case PageMessage.PAGE_HEIGHT: {
@@ -91,7 +90,7 @@ const UNWirePaymentComponent = (props: UNWirePaymentComponentProps) => {
 
   const style = presentationMode === PresentationMode.Inherit ? { flex: 1 } : { height: height };
   return (
-    <UNBaseView style={style}>
+    <UNBaseView style={style} fallback={<></>}>
       <WebComponent
         type={WebComponentType.wirePayment}
         presentationMode={presentationMode}

package/src/components/UNWirePaymentComponent/UNWirePaymentComponent.utils.ts

@@ -6,7 +6,6 @@ export const getWirePaymentParams = (props: UNWirePaymentComponentProps) => {
   const feeParam = props.fee ? `fee="${props.fee}"` : '';
   return `
     ${accountIdParam}
-    customer-token="${props.customerToken}"
     ${feeParam}
     is-auto-focus="${props.isAutoFocus || false}"
     initial-stage-back-button="${props.initialStageBackButton ?? false}"

package/src/components/index.ts

@@ -4,7 +4,6 @@ export * from './UNBottomSheetComponent';
 export * from './UNBookPaymentComponent';
 export * from './UNActivityComponent';
 export * from './UNAccountComponent';
-export * from './UNFundAccountPaymentComponent';
 export * from './UNCheckDepositComponent';
 export * from './UNACHDebitComponent';
 export * from './UNACHCreditComponent';
@@ -13,3 +12,5 @@ export * from './UNNextRepaymentComponent';
 export * from './UNWhiteLabelAppComponent';
 export * from './UNPayeeManagementComponent';
 export * from './UNWirePaymentComponent';
+export * from './UNMultiFactorAuthenticationComponent';
+export * from './UNCardActionComponent';

package/src/flows/{UNFlows.ts → UNComponentsFlows.ts}

@@ -1,13 +1,13 @@
 import { UNCardFlows } from './card/UNCardFlows';
-import { UnitSDK } from '../unitSdkManager/UnitSdkManager';
+import { UnitComponentsSDK } from '../unitComponentsSdkManager/UnitComponentsSdkManager';
 
-export class UNFlows {
+export class UNComponentsFlows {
   constructor() {
     console.log('new Flows instance created');
   }
 
   public async startPushProvisioning(cardId: string, customerToken: string) {
-    UnitSDK.setCustomerToken(customerToken);
+    UnitComponentsSDK.setCustomerToken(customerToken);
     await UNCardFlows.startPushProvisioning(cardId, customerToken);
   }
 }

package/src/helpers/BottomSheet/BottomSheet.tsx

@@ -10,7 +10,6 @@ import {
   TouchableOpacity,
   View,
 } from 'react-native';
-import PropTypes from 'prop-types';
 import { CloseIcon } from '../../assets/images';
 import {
   androidStatusBarHeight,
@@ -18,7 +17,7 @@ import {
   statusBarHeight,
 } from '../../components/UNBottomSheetComponent/UNBottomSheetComponent.constants';
 import { getStylesObject } from './BottomSheet.styles';
-import { useAppStateListener } from '../../hooks/useAppStateListener';
+import { useIsBackFromLongBackground } from '../../hooks/useAppStateListener';
 import { BottomSheetNativePlaceType } from '../../types/internal/bottomSheet.types';
 import { UNBaseView } from '../../nativeComponents/UNBaseView';
 
@@ -49,7 +48,7 @@ const BottomSheet = (props: BottomSheetProps) => {
 
   const [dy, setDy] = useState(0);
 
-  const isAppActive = useAppStateListener();
+  const isAppInactive = useIsBackFromLongBackground();
 
   const _parentPanResponder = PanResponder.create({
     onMoveShouldSetPanResponderCapture: (_, gestureState) => {
@@ -78,9 +77,11 @@ const BottomSheet = (props: BottomSheetProps) => {
 
   useEffect(() => {
     // on App Active State change reset the bottom-sheet
-    setContentHeight(0);
-    _dismiss();
-  }, [isAppActive]);
+    if (isAppInactive) {
+      setContentHeight(0);
+      _dismiss(false);
+    }
+  }, [isAppInactive]);
 
   useEffect(() => {
     if (props.isOpen && !isPanelOpened) {
@@ -167,10 +168,10 @@ const BottomSheet = (props: BottomSheetProps) => {
     setToContentHeight(newContentHeight);
   };
 
-  const _dismiss = () => {
+  const _dismiss = (withAnimation = true) => {
     const { animationDuration } = props;
     Animated.timing(panelHeightValue, {
-      duration: animationDuration,
+      duration: withAnimation ? animationDuration : 0,
       easing: Easing.quad,
       toValue: props.sliderMaxHeight,
       useNativeDriver: false,
@@ -235,23 +236,4 @@ const BottomSheet = (props: BottomSheetProps) => {
   );
 };
 
-BottomSheet.propTypes = {
-  children: PropTypes.oneOfType([PropTypes.node]),
-  isOpen: PropTypes.bool,
-  animation: PropTypes.func,
-  animationDuration: PropTypes.number,
-  onOpen: PropTypes.func,
-  onClose: PropTypes.func,
-  expandToMaxHeightEnabled: PropTypes.bool,
-};
-
-BottomSheet.defaultProps = {
-  children: <View />,
-  isOpen: true,
-  animationDuration: 200,
-  onOpen: () => null,
-  onClose: () => null,
-  expandToMaxHeightEnabled: false,
-};
-
 export default BottomSheet;

package/src/helpers/UNKeyboardAvoidingView/UNKeyboardAvoidingView.tsx

@@ -0,0 +1,24 @@
+import { KeyboardAvoidingView, Platform, ViewStyle } from 'react-native';
+import React from 'react';
+import { statusBarHeight } from '../../components/UNBottomSheetComponent/UNBottomSheetComponent.constants';
+
+interface UNKeyboardAvoidingViewProps {
+  children: React.ReactNode,
+  style?: ViewStyle,
+  keyboardVerticalOffset?: number,
+}
+
+const UNKeyboardAvoidingView = ({ children, style, keyboardVerticalOffset }: UNKeyboardAvoidingViewProps) => {
+  return (
+    <KeyboardAvoidingView
+      style={style ?? { height: '100%' }}
+      behavior="padding"
+      keyboardVerticalOffset={keyboardVerticalOffset ?? statusBarHeight}
+      enabled={Platform.OS === 'android'}
+    >
+      {children}
+    </KeyboardAvoidingView>
+  );
+};
+
+export default UNKeyboardAvoidingView;

package/src/helpers/pushProvisioningService/hooks/useCardWallet.ts

@@ -1,15 +1,16 @@
 import { useEffect, useState, useRef } from 'react';
 import { UNWalletCode, UNWalletName } from '../../../types/shared/wallet.types';
 import type { UNWallet } from '../../../types/shared/wallet.types';
-import { UnitSDK } from '../../../unitSdkManager/UnitSdkManager';
+import { UnitComponentsSDK } from '../../../unitComponentsSdkManager/UnitComponentsSdkManager';
 import { getMobileWalletPayload } from '../../../networking/requests/UNWalletPayloadRequest';
 import { useSelector, useDispatch } from 'react-redux';
 import { selectWallet, setSignedNonce } from '../../../slices/pushProvisioningSlice';
 import { useLaunchInitialize } from './useLaunchInitialize';
 import { UNVPErrorType } from '../types';
 import { promiseRejectToUNVPErrorType } from '../helpers';
-import { UNErrorCodes, UNErrorData } from '../../../types/shared/error.types';
-import { isUNError } from '../../../types/internal/errorHelpers';
+import { UNComponentsErrorCodes, UNComponentsErrorData } from '../../../types/shared/error.types';
+import { isUNComponentsError } from '../../../types/internal/errorHelpers';
+import { RootState } from '../../../store';
 
 export type CardToEncryptedPayload = {
   [cardId: string]: string;
@@ -21,6 +22,8 @@ export const useCardWallet = (cardId: string) => {
   const { initializePushProvisioning } = useLaunchInitialize();
   const dispatch = useDispatch();
   const isRecoveringSignedNonceRef = useRef<boolean>(false);
+  const customerToken = useSelector((state: RootState) => state.configuration.customerToken);
+
 
   const shouldRecoverVPSDKForError = (errorType: UNVPErrorType) => {
     const recoveringTypes = [UNVPErrorType.PayloadDecryptionFailed, UNVPErrorType.SessionExpired, UNVPErrorType.InvalidNonce];
@@ -29,8 +32,7 @@ export const useCardWallet = (cardId: string) => {
 
   useEffect(() => {
     const getEncryptedPayload = async () => {
-      const env = UnitSDK.getEnv();
-      const customerToken = UnitSDK.getCustomerToken();
+      const env = UnitComponentsSDK.getEnv();
       if (!env || !customerToken) return;
       // In case we use flow
       if (!signedNonce) {
@@ -42,7 +44,7 @@ export const useCardWallet = (cardId: string) => {
     };
 
     const getCardWalletData = async () => {
-      const currentProvisioningModule = UnitSDK.getPushProvisionModule();
+      const currentProvisioningModule = UnitComponentsSDK.getPushProvisionModule();
       if (!currentProvisioningModule) return;
       try {
         const encryptedPayload = await getEncryptedPayload();
@@ -58,10 +60,10 @@ export const useCardWallet = (cardId: string) => {
         isRecoveringSignedNonceRef.current = true;
 
         // handle unit network api errors
-        if (isUNError(error)) {
-          const errors: UNErrorData[] = error.errors;
+        if (isUNComponentsError(error)) {
+          const errors: UNComponentsErrorData[] = error.errors;
           // errors will return in an array but hold only a single error element
-          if (errors[0]?.code === UNErrorCodes.INVALID_NONCE) {
+          if (errors[0]?.code === UNComponentsErrorCodes.INVALID_NONCE) {
             dispatch(setSignedNonce(null));
           }
           return;
@@ -78,7 +80,7 @@ export const useCardWallet = (cardId: string) => {
     };
 
     getCardWalletData();
-  }, [signedNonce, cardId]);
+  }, [signedNonce, cardId, customerToken]);
 
   return {
     currentUNWallet,

package/src/helpers/pushProvisioningService/hooks/useLaunchInitialize.ts

@@ -1,4 +1,4 @@
-import { UnitSDK } from '../../../unitSdkManager/UnitSdkManager';
+import { UnitComponentsSDK } from '../../../unitComponentsSdkManager/UnitComponentsSdkManager';
 import { useDispatch } from 'react-redux';
 import { setSignedNonce } from '../../../slices/pushProvisioningSlice';
 
@@ -6,7 +6,7 @@ export const useLaunchInitialize = () => {
   const dispatch = useDispatch();
 
   const initializePushProvisioning = async () => {
-    const pushProvisioningModule = UnitSDK.getPushProvisionModule();
+    const pushProvisioningModule = UnitComponentsSDK.getPushProvisionModule();
     if (!pushProvisioningModule) {
       console.error('Missing a PushProvisioningModule');
       return;

package/src/helpers/pushProvisioningService/startProvisioning.ts

@@ -1,8 +1,8 @@
 import type { UNWallet } from '../../types/shared/wallet.types';
-import { UnitSDK } from '../../unitSdkManager/UnitSdkManager';
+import { UnitComponentsSDK } from '../../unitComponentsSdkManager/UnitComponentsSdkManager';
 
 export const launchStartCardProvisioning = async (wallet: UNWallet | null) => {
-  const pushProvisioningModule = UnitSDK.getPushProvisionModule();
+  const pushProvisioningModule = UnitComponentsSDK.getPushProvisionModule();
   if (!pushProvisioningModule) return;
 
   try {

package/src/helpers/pushProvisioningService/types.ts

@@ -7,12 +7,19 @@ export enum UNVPErrorType {
   EmptyEncryptedPayload = 'EmptyEncryptedPayload',
   NoWallets = 'NoWallets',
   InvalidCardId = 'InvalidCardId',
+  InvalidCardLast4Digits = 'InvalidCardLast4Digits',
   ProvisioningNotAllowed = 'ProvisioningNotAllowed',
   CancelledByUser = 'CancelledByUser',
+  AppleWalletProvisioningError = 'AppleWalletProvisioningError',
+  UnableToCreateApplePaymentPassView = 'UnableToCreateApplePaymentPassView',
+  ValidAppleCertificatesNotFound = 'ValidAppleCertificatesNotFound',
   GoogleWalletCreationFailed = 'GoogleWalletCreationFailed',
   UnknownErrorOccurred = 'UnknownErrorOccurred',
   WalletProvisioningInconclusive = 'WalletProvisioningInconclusive',
   WalletProvisioningError = 'WalletProvisioningError',
+  VerificationNotAllowed = 'VerificationNotAllowed',
+  PaymentMethodRemoved = 'PaymentMethodRemoved',
+  SdkInternalError = 'SdkInternalError',
   NetworkFailure = 'NetworkFailure',
   SessionExpired = 'SessionExpired',
   InvalidInfo = 'InvalidInfo',

package/src/hooks/useAppStateListener.ts

@@ -6,14 +6,48 @@ const getIsAppActive = (currentAppState: AppStateStatus) => {
   return currentAppState !== 'background' && currentAppState !== 'inactive';
 };
 
-export const useAppStateListener = () => {
+const BACKGROUND_THRESHOLD = 30000; // 30 seconds in milliseconds
+
+/*
+ * This hook is used to check if the app is in the background for a long period of time.
+ * If yes - returns true and trigger closing the bottomsheet.
+ * If no - returns false and keep the bottomsheet open.
+ *
+ * Returns false unless background time is more than 30 seconds.
+*/
+
+export const useIsBackFromLongBackground = () => {
   const appState = useRef(AppState.currentState);
-  const [isAppActive, setIsAppActive] = useState<boolean>(getIsAppActive(appState.current));
+  const [isLongBackgroundTime, setIsLongBackgroundTime] = useState<boolean>(false);
+  const backgroundTimestamp = useRef<number | null>(null);
+  const activeTimestamp = useRef<number | null>(null);
 
   useEffect(() => {
     const subscription = AppState.addEventListener('change', nextAppState => {
+      const nextAppStateActive = getIsAppActive(nextAppState);
+      const currentAppStateActive = getIsAppActive(appState.current);
+
+      if (!nextAppStateActive && currentAppStateActive) {
+        // Set background timestamp when first entering background
+        backgroundTimestamp.current = Date.now();
+        activeTimestamp.current = null;
+      } else if (nextAppStateActive && !currentAppStateActive) {
+        // Set active timestamp when coming back from background
+        activeTimestamp.current = Date.now();
+
+        // Check if time difference is more than threshold
+        if (activeTimestamp.current - (backgroundTimestamp.current ?? 0) > BACKGROUND_THRESHOLD) {
+          setIsLongBackgroundTime(true);
+        } else {
+          setIsLongBackgroundTime(false);
+        }
+
+        // Reset timestamps for next cycle
+        backgroundTimestamp.current = null;
+        activeTimestamp.current = null;
+      }
+
       appState.current = nextAppState;
-      setIsAppActive(getIsAppActive(appState.current));
     });
 
     return () => {
@@ -21,5 +55,5 @@ export const useAppStateListener = () => {
     };
   }, []);
 
-  return isAppActive;
+  return isLongBackgroundTime;
 };

package/src/hooks/useSnapshotProtection.ts

@@ -1,7 +1,7 @@
 import { Platform } from 'react-native';
 import UNSnapshotProtectionHelper from '../nativeModulesHelpers/UNSanpshotProtectionHelper/UNSnapshotProtectionHelper';
-import { UnitSDK } from '../unitSdkManager/UnitSdkManager';
-import { UNSnapshotProtectionStrategy } from '../types/shared/securitySettings';
+import { UnitComponentsSDK } from '../unitComponentsSdkManager/UnitComponentsSdkManager';
+import { UNComponentsSnapshotProtectionStrategy } from '../types/shared/securitySettings';
 import { useEffect } from 'react';
 
 export const useSnapshotProtection = () => {
@@ -10,11 +10,11 @@ export const useSnapshotProtection = () => {
    * For iOS, a native service is utilized instead.
    */
   useEffect(() => {
-    if (!UnitSDK.isInitialized()) {
+    if (!UnitComponentsSDK.isInitialized()) {
       return;
     }
 
-    if (UnitSDK.getSecuritySettings().snapshotProtectionStrategy == UNSnapshotProtectionStrategy.None) {
+    if (UnitComponentsSDK.getSecuritySettings().snapshotProtectionStrategy == UNComponentsSnapshotProtectionStrategy.None) {
       return;
     }
 

package/src/index.tsx

@@ -2,4 +2,4 @@ export * from './components';
 
 export * from './types/shared';
 
-export { UnitSDK } from './unitSdkManager/UnitSdkManager';
+export { UnitComponentsSDK } from './unitComponentsSdkManager/UnitComponentsSdkManager';

package/src/messages/webMessages/accountMessage.ts

@@ -1,11 +1,11 @@
-import type { UNAccountData } from '../../types/shared';
+import type { UNAccount } from '../../types/shared';
 
 export enum AccountMessage {
   UNIT_ACCOUNT_CHANGED = 'unitAccountChanged'
 }
 
 export interface AccountChangedEvent {
-  account: UNAccountData;
+  account: UNAccount;
 }
 
 export type AccountEvent =

package/src/messages/webMessages/achCreditMessage.ts

@@ -1,8 +1,8 @@
-import type { UNACHData } from '../../types/shared';
+import type { UNPayment } from '../../types/shared';
 
 export interface PaymentCreatedEvent {
-  data: UNACHData
+  data: UNPayment
 }
 
 export type ACHEvent =
-| PaymentCreatedEvent
+  | PaymentCreatedEvent

package/src/messages/webMessages/bookPaymentMessage.ts

@@ -1,8 +1,8 @@
-import type { UNBookPaymentData } from '../../types/shared';
+import type { UNPayment } from '../../types/shared';
 
 export interface PaymentCreatedEvent {
-  data: UNBookPaymentData
+  data: UNPayment
 }
 
 export type BookPaymentEvent =
-| PaymentCreatedEvent
+  | PaymentCreatedEvent

package/src/messages/webMessages/cardMessage.ts

@@ -1,4 +1,4 @@
-import type { UNCardData } from '../../types/shared';
+import type { UNCard } from '../../types/shared';
 
 export enum CardMessage {
   CARD_ACTIVATED = 'unitCardActivated',
@@ -6,11 +6,11 @@ export enum CardMessage {
 }
 
 export interface CardStatusChangedEvent {
-  card: UNCardData;
+  card: UNCard;
 }
 
 export interface CardActivatedEvent {
-  card: UNCardData;
+  card: UNCard;
 }
 
 export type CardEvent =

package/src/messages/webMessages/checkMessage.ts

@@ -1,14 +1,14 @@
-import type { UNCheckDepositData } from '../../types/shared/checkDeposit.types';
+import type { UNCheckDeposit } from '../../types/shared';
 
 export enum CheckMessage {
   // check deposit
-    CHECK_DEPOSIT_CREATED = 'unitCheckDepositCreated',
-    CHECK_DEPOSIT_RESTART_REQUEST = 'unitCheckDepositRestartRequest'
+  CHECK_DEPOSIT_CREATED = 'unitCheckDepositCreated',
+  CHECK_DEPOSIT_RESTART_REQUEST = 'unitCheckDepositRestartRequest'
 }
 
-export type CheckDepositCreatedEvent = UNCheckDepositData
-export type CheckDepositRestartRequestEvent = UNCheckDepositData
+export type CheckDepositCreatedEvent = UNCheckDeposit
+export type CheckDepositRestartRequestEvent = UNCheckDeposit
 
 export type CheckEvent =
-| CheckDepositCreatedEvent
-| CheckDepositRestartRequestEvent
+  | CheckDepositCreatedEvent
+  | CheckDepositRestartRequestEvent

package/src/messages/webMessages/index.ts

@@ -1,29 +1,30 @@
 import type { ACHEvent } from './achCreditMessage';
 import type { BookPaymentEvent } from './bookPaymentMessage';
-
 import type { CardEvent, CardMessage } from './cardMessage';
 import type { PageEvent, PageMessage } from './pageMessage';
 import type { PaymentMessage } from './paymentsMessage';
-import type { UnitEvent, UnitMessage } from './unitMessages';
+import type { UnitEvent, UnitComponentsMessage, MultiFactorAuthenticationFinishedEvent } from './unitComponentsMessages';
 import type { AccountEvent, AccountMessage } from './accountMessage';
 import type { CheckEvent, CheckMessage } from './checkMessage';
 import type { ActivityEvent, ActivityMessage } from './activityMessage';
 import type { MultipleCardsEvent, MultipleCardsMessage } from './multipleCardsMessage';
-import { FundAccountPaymentEvent } from './fundAccountPaymentMessage';
 import { PlaidEvent, PlaidMessage } from './plaidMessages';
 import { PayeeManagementMessage, PayeeManagementEvent } from './payeeManagementMessage';
+import { MultiFactorAuthenticationMessage } from './multiFactorAuthenticationMessage';
+import { WirePaymentCreatedEvent } from './wirePaymentMessage';
 
 export type WebViewMessageType =
   | PageMessage
   | CardMessage
   | MultipleCardsMessage
-  | UnitMessage
+  | UnitComponentsMessage
   | PaymentMessage
   | AccountMessage
   | CheckMessage
   | ActivityMessage
   | PlaidMessage
   | PayeeManagementMessage
+  | MultiFactorAuthenticationMessage
 
 type WebViewEvent =
   | PageEvent
@@ -33,12 +34,13 @@ type WebViewEvent =
   | BookPaymentEvent
   | PaymentMessage
   | ACHEvent
-  | FundAccountPaymentEvent
   | AccountEvent
   | CheckEvent
   | ActivityEvent
   | PlaidEvent
   | PayeeManagementEvent
+  | WirePaymentCreatedEvent
+  | MultiFactorAuthenticationFinishedEvent
 
 export interface WebViewMessage {
   type: WebViewMessageType,

package/src/messages/webMessages/multiFactorAuthenticationMessage.ts

@@ -0,0 +1,3 @@
+export enum MultiFactorAuthenticationMessage {
+  UNIT_MFA_VERIFICATION_TOKEN_CREATED = 'unitMultiFactorAuthVerificationTokenCreated'
+}

package/src/messages/webMessages/multipleCardsMessage.ts

@@ -1,9 +1,9 @@
-import type { UNCardData } from '../../types/shared';
+import type { UNCard } from '../../types/shared';
 
 export enum MultipleCardsMessage {
   UNIT_MULTIPLE_CARDS_CARD_CLICKED = 'unitMultipleCardsCardClicked',
 }
 
-export type MultipleCardsCardClickedEvent = UNCardData;
+export type MultipleCardsCardClickedEvent = UNCard;
 
 export type MultipleCardsEvent = MultipleCardsCardClickedEvent