react-native-unit-components 1.15.0 → 2.0.1

package/src/components/UNPayeeManagementComponent/UNPayeeManagementComponent.tsx

@@ -2,16 +2,24 @@ import React, { useRef } from 'react';
 import type WebView from 'react-native-webview';
 import {
   RequestRefreshEvent,
-  UnitMessage,
-} from '../../messages/webMessages/unitMessages';
+  UnitComponentsMessage,
+} from '../../messages/webMessages/unitComponentsMessages';
 import { WebComponent } from '../../webComponent/WebComponent';
 import type { WebViewMessage } from '../../messages/webMessages';
 import { PresentationMode, WebComponentType } from '../../types/internal/webComponent.types';
 import { withReduxStore } from '../../helpers/store/helpers';
-import { UNError, UNOnLoadResponse, UNPayeeConnectedAccount, UNPayeeCounterparty, UNPayeeManagementComponentPaginationType, UNPayeeManagementMenuItem, UNPlaidAccountFilter } from '../../types/shared';
+import { 
+  UNConnectedAccount, 
+  UNCounterparty, 
+  UNComponentsError, 
+  UNComponentsOnLoadResponse, 
+  UNPayeeManagementComponentPaginationType, 
+  UNPayeeManagementMenuItem, 
+  UNPlaidAccountFilter 
+} from '../../types/shared';
 import { getPayeeParams, getPayeeManagementScript, injectRefreshEventIfNeeded, injectUnitPlaidResponse, injectUnitOpenPlaid, injectUnitPlaidExit } from './UNPayeeManagementComponent.utils';
 import { BottomSheetRenderingType, BottomSheetSlotData, SlotRendering } from '../../types/internal/bottomSheet.types';
-import { RequestRenderingEvent } from '../../messages/webMessages/unitMessages';
+import { RequestRenderingEvent } from '../../messages/webMessages/unitComponentsMessages';
 import { useDispatch } from 'react-redux';
 import { setEvent } from '../../slices/SharedEventsSlice';
 import { BottomSheetNativeMessage } from '../../messages/nativeMessages/bottomSheetMessage';
@@ -24,7 +32,6 @@ import { RESPONSE_KEYS, UnitOnLoadResponseEvent } from '../../messages/webMessag
 
 export interface UNPayeeManagementComponentProps {
   // inputs
-  customerToken: string;
   menuItems?: UNPayeeManagementMenuItem[];
   queryFilter?: string;
   paginationType?: UNPayeeManagementComponentPaginationType;
@@ -46,13 +53,13 @@ export interface UNPayeeManagementComponentProps {
   plaidLinkCustomizationName?: string;
 
   // events
-  onLoad?: (response: UNOnLoadResponse<[UNPayeeCounterparty]>) => void;
-  onCounterpartyCreated?: (counterparty: UNPayeeCounterparty) => void;
-  onCounterpartyDeleted?: (counterparty: UNPayeeCounterparty) => void;
+  onLoad?: (response: UNComponentsOnLoadResponse<[UNCounterparty]>) => void;
+  onCounterpartyCreated?: (counterparty: UNCounterparty) => void;
+  onCounterpartyDeleted?: (counterparty: UNCounterparty) => void;
 
-  onConnectedAccountCreated?: (connectedAccount: UNPayeeConnectedAccount) => void;
-  onMicroDepositConnectionCreated?: (onnectedAccount: UNPayeeCounterparty) => void;
-  onMicroDepositConnectionRejected?: (connectedAccount: UNPayeeConnectedAccount) => void;
+  onConnectedAccountCreated?: (connectedAccount: UNConnectedAccount) => void;
+  onMicroDepositConnectionCreated?: (onnectedAccount: UNCounterparty) => void;
+  onMicroDepositConnectionRejected?: (connectedAccount: UNConnectedAccount) => void;
 }
 
 const UNPayeeManagementComponent = (props: UNPayeeManagementComponentProps) => {
@@ -81,11 +88,11 @@ const UNPayeeManagementComponent = (props: UNPayeeManagementComponentProps) => {
     });
   };
 
-  const reportCounterpartyDeleted = (counterparty: UNPayeeCounterparty) => {
+  const reportCounterpartyDeleted = (counterparty: UNCounterparty) => {
     props.onCounterpartyDeleted && props.onCounterpartyDeleted(counterparty);
   };
 
-  useListenerToEvent({ busEventKey: UnitMessage.UNIT_REQUEST_REFRESH, action: requestRefresh });
+  useListenerToEvent({ busEventKey: UnitComponentsMessage.UNIT_REQUEST_REFRESH, action: requestRefresh });
   useListenerToEvent({ busEventKey: PlaidMessage.UNIT_OPEN_PLAID, action: openPlaid });
   useListenerToEvent({ busEventKey: PayeeManagementMessage.UNIT_COUNTERPARTY_DELETED, action: reportCounterpartyDeleted });
 
@@ -111,12 +118,12 @@ const UNPayeeManagementComponent = (props: UNPayeeManagementComponentProps) => {
     }
 
     if (RESPONSE_KEYS.errors in response) {
-      props.onLoad(response as UNError);
+      props.onLoad(response as UNComponentsError);
       return;
     }
 
     if (RESPONSE_KEYS.counterpartiesResult in response) {
-      props.onLoad(response[RESPONSE_KEYS.counterpartiesResult] as UNOnLoadResponse<[UNPayeeCounterparty]>);
+      props.onLoad(response[RESPONSE_KEYS.counterpartiesResult] as UNComponentsOnLoadResponse<[UNCounterparty]>);
       return;
     }
 
@@ -126,32 +133,32 @@ const UNPayeeManagementComponent = (props: UNPayeeManagementComponentProps) => {
 
   const handleMessage = (message: WebViewMessage) => {
     switch (message.type) {
-      case UnitMessage.UNIT_REQUEST_RENDERING: {
+      case UnitComponentsMessage.UNIT_REQUEST_RENDERING: {
         const requestRenderingEvent = message.details as RequestRenderingEvent;
         handleRequestRendering(requestRenderingEvent);
         break;
       }
-      case UnitMessage.UNIT_ON_LOAD: {
+      case UnitComponentsMessage.UNIT_ON_LOAD: {
         handleUnitOnLoad(message.details as UnitOnLoadResponseEvent);
         break;
       }
       case PayeeManagementMessage.UNIT_CONNECTED_ACCOUNT_CREATED: {
-        const account: UNPayeeConnectedAccount = (message.details as PayeeConnectedAccountEvent).account;
+        const account: UNConnectedAccount = (message.details as PayeeConnectedAccountEvent).account;
         props.onConnectedAccountCreated && props.onConnectedAccountCreated(account);
         break;
       }
       case PayeeManagementMessage.UNIT_COUNTERPARTY_CREATED: {
-        const counterparty: UNPayeeCounterparty = (message.details as PayeeCounterpartyEvent).counterparty;
+        const counterparty: UNCounterparty = (message.details as PayeeCounterpartyEvent).counterparty;
         props.onCounterpartyCreated &&  props.onCounterpartyCreated(counterparty);
         break;
       }
       case PayeeManagementMessage.UNIT_MICRO_DEPOSIT_CONNECTION_CREATED: {
-        const counterparty: UNPayeeCounterparty = (message.details as PayeeMicroDepositeConnectionEvent).account;
+        const counterparty: UNCounterparty = (message.details as PayeeMicroDepositeConnectionEvent).account;
         props.onMicroDepositConnectionCreated && props.onMicroDepositConnectionCreated(counterparty);
         break;
       }
       case PayeeManagementMessage.UNIT_MICRO_DEPOSIT_CONNECTION_REJECTED: {
-        const account: UNPayeeConnectedAccount = (message.details as PayeeConnectedAccountEvent).account;
+        const account: UNConnectedAccount = (message.details as PayeeConnectedAccountEvent).account;
         props.onMicroDepositConnectionRejected && props.onMicroDepositConnectionRejected(account);
         break;
       }
@@ -159,7 +166,7 @@ const UNPayeeManagementComponent = (props: UNPayeeManagementComponentProps) => {
   };
 
   return (
-    <UNBaseView style={{ height: '100%' }}>
+    <UNBaseView style={{ height: '100%' }} fallback={<></>}>
       <WebComponent
         ref={webRef}
         type={WebComponentType.payeeManagement}

package/src/components/UNPayeeManagementComponent/UNPayeeManagementComponent.utils.ts

@@ -1,4 +1,4 @@
-import { RequestRefreshEvent } from '../../messages/webMessages/unitMessages';
+import { RequestRefreshEvent } from '../../messages/webMessages/unitComponentsMessages';
 import type WebView from 'react-native-webview';
 import type { UNAccountMenuAction } from '../../types/shared';
 import { WebComponentType } from '../../types/internal/webComponent.types';
@@ -22,7 +22,6 @@ export const getPayeeParams = (props: UNPayeeManagementComponentProps) => {
   const payeeCreationPlaceholderParam = props.payeeCreationPlaceholder ? `payee-creation-placeholder="${props.payeeCreationPlaceholder}"` : '';
   const microDepositConnectionPlaceholderParam = props.microDepositConnectionPlaceholder ? `micro-deposit-connection-placeholder="${props.microDepositConnectionPlaceholder}"` : '';
   return `
-    customer-token="${props.customerToken}"
     ${menuItemsParam}
     ${queryFilterParam}
     ${paginationTypeParam}

package/src/components/UNProgramDetailsComponent/UNProgramDetailsComponent.tsx

@@ -1,18 +1,17 @@
 import React, { useState } from 'react';
 import { WebComponent } from '../../webComponent/WebComponent';
-import { UNAccountData, UNError, UNOnLoadResponse, UNOnLoadResponseData } from '../../types/shared';
+import { UNAccount, UNComponentsError, UNComponentsOnLoadResponse, UNComponentsOnLoadResponseData } from '../../types/shared';
 import { PresentationMode, WebComponentType } from '../../types/internal/webComponent.types';
 import { WebViewMessage } from '../../messages/webMessages';
 import { getProgramDetailsParams } from './UNProgramDetailsComponent.utils';
 import { withReduxStore } from '../../helpers/store/helpers';
 import { RESPONSE_KEYS, UnitOnLoadResponseEvent } from '../../messages/webMessages/onLoadMessage';
-import { UnitMessage } from '../../messages/webMessages/unitMessages';
+import { UnitComponentsMessage } from '../../messages/webMessages/unitComponentsMessages';
 import { HeightEvent, PageMessage } from '../../messages/webMessages/pageMessage';
 import { UNBaseView } from '../../nativeComponents/UNBaseView';
 
 export interface UNProgramDetailsComponentProps {
   // inputs
-  customerToken: string;
   accountId: string;
 
   // ui
@@ -21,7 +20,7 @@ export interface UNProgramDetailsComponentProps {
   hideTitle?: boolean;
 
   // events
-  onLoad?: (response: UNOnLoadResponse<[UNAccountData]>) => void;
+  onLoad?: (response: UNComponentsOnLoadResponse<[UNAccount]>) => void;
 }
 
 const UNProgramDetailsComponent =  (props: UNProgramDetailsComponentProps) => {
@@ -35,12 +34,12 @@ const UNProgramDetailsComponent =  (props: UNProgramDetailsComponentProps) => {
     }
 
     if (RESPONSE_KEYS.errors in response) {
-      props.onLoad(response as UNError);
+      props.onLoad(response as UNComponentsError);
       return;
     }
 
     if (RESPONSE_KEYS.account in response) {
-      props.onLoad(response[RESPONSE_KEYS.account] as UNOnLoadResponseData<[UNAccountData]>);
+      props.onLoad(response[RESPONSE_KEYS.account] as UNComponentsOnLoadResponseData<[UNAccount]>);
       return;
     }
 
@@ -50,7 +49,7 @@ const UNProgramDetailsComponent =  (props: UNProgramDetailsComponentProps) => {
 
   const handleMessage = (message: WebViewMessage) => {
     switch (message.type) {
-      case UnitMessage.UNIT_ON_LOAD:
+      case UnitComponentsMessage.UNIT_ON_LOAD:
         handleUnitOnLoad(message.details as UnitOnLoadResponseEvent);
         break;
 
@@ -61,7 +60,7 @@ const UNProgramDetailsComponent =  (props: UNProgramDetailsComponentProps) => {
   };
 
   return (
-    <UNBaseView style={{ height, width: '100%' }} onLoadError={ handleUnitOnLoad }>
+    <UNBaseView style={{ height, width: '100%' }} onLoadError={ handleUnitOnLoad } fallback={<></>}>
       <WebComponent
         type={WebComponentType.programDetails}
         presentationMode={PresentationMode.Default}

package/src/components/UNProgramDetailsComponent/UNProgramDetailsComponent.utils.ts

@@ -2,7 +2,6 @@ import { UNProgramDetailsComponentProps } from './UNProgramDetailsComponent';
 
 export const getProgramDetailsParams = (props: UNProgramDetailsComponentProps) => {
   return `
-    customer-token="${props.customerToken}"
     account-id="${props.accountId}"
     hide-title="${props.hideTitle || false}"
     `;

package/src/components/UNWhiteLabelAppComponent/UNWhiteLabelAppComponent.tsx

@@ -2,7 +2,7 @@ import React, { useRef } from 'react';
 import { WebComponent } from '../../webComponent/WebComponent';
 import { withReduxStore } from '../../helpers/store/helpers';
 import { PresentationMode, WebComponentType } from '../../types/internal/webComponent.types';
-import { RequestRefreshEvent, RequestRenderingEvent, UnitMessage, UnitWhiteLabelAppEvent } from '../../messages/webMessages/unitMessages';
+import { RequestRefreshEvent, RequestRenderingEvent, UnitComponentsMessage, UnitWhiteLabelAppEvent } from '../../messages/webMessages/unitComponentsMessages';
 import type { WebViewMessage } from '../../messages/webMessages';
 import {
   BottomSheetRenderingType,
@@ -21,10 +21,11 @@ import {
 } from './UNWhiteLabelAppComponent.utils';
 import { UserDataKeys } from '../../types/internal/unitStore.types';
 import { PageMessage } from '../../messages/webMessages/pageMessage';
-import UNStoreManagerHelper from '../../nativeModulesHelpers/UNStoreManagerHelper/UNStoreManagerHelper';
+import UNStoreManagerHelper from '../../nativeModulesHelpers/UNStoreModuleHelper/UNStoreModuleHelper';
 import { ActivityMessage } from '../../messages/webMessages/activityMessage';
 import { setItemInWindowUnitStore } from '../../utils/windowUnitStore';
 import { UNBaseView } from '../../nativeComponents/UNBaseView';
+import { UnitComponentsSDK } from '../../unitComponentsSdkManager/UnitComponentsSdkManager';
 
 export interface UNWhiteLabelAppComponentProps {
   // inputs
@@ -43,7 +44,7 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
 
   const handleWebViewMessage = (message: WebViewMessage) => {
     switch (message.type) {
-      case UnitMessage.UNIT_REQUEST_RENDERING: {
+      case UnitComponentsMessage.UNIT_REQUEST_RENDERING: {
 
         const slotData: BottomSheetSlotData = {
           componentName: WebComponentType.whiteLabelApp,
@@ -58,9 +59,10 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
         dispatch(setEvent({ key: BottomSheetNativeMessage.REQUEST_RENDERING, data }));
         break;
       }
-      case UnitMessage.UNIT_WHITE_LABEL_APP_ON_LOAD: {
+      case UnitComponentsMessage.UNIT_WHITE_LABEL_APP_ON_LOAD: {
         const data = message.details as UnitWhiteLabelAppEvent;
         if (data.attributes.customerToken) {
+          UnitComponentsSDK.setCustomerToken(data.attributes.customerToken);
           UNStoreManagerHelper.saveValue(UserDataKeys.unitCustomerToken, data.attributes.customerToken);
           // Upon receiving a new token, the web interface updates the window. Therefore, we (only) store it for subsequent windows.
           // updateWindowUnitStore();
@@ -95,7 +97,7 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
     webRef.current?.injectJavaScript(`dispatchActivityFilterChangedEvent('${query}')`);
   };
 
-  useListenerToEvent({ busEventKey: UnitMessage.UNIT_REQUEST_REFRESH, action: requestRefresh });
+  useListenerToEvent({ busEventKey: UnitComponentsMessage.UNIT_REQUEST_REFRESH, action: requestRefresh });
   useListenerToEvent({
     busEventKey: ActivityMessage.UNIT_ACTIVITY_FILTERS_CHANGED,
     action: dispatchActivityFiltersChanged,
@@ -103,7 +105,7 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
 
   const renderWebView = () => {
     return (
-      <UNBaseView style={{ flex: 1 }}>
+      <UNBaseView style={{ flex: 1 }} >
         <WebComponent
           ref={webRef}
           type={WebComponentType.whiteLabelApp}

package/src/components/UNWhiteLabelAppComponent/UNWhiteLabelAppComponent.utils.ts

@@ -1,5 +1,5 @@
 import WebView from 'react-native-webview';
-import { RequestRefreshEvent } from '../../messages/webMessages/unitMessages';
+import { RequestRefreshEvent } from '../../messages/webMessages/unitComponentsMessages';
 import { UNWhiteLabelAppComponentProps } from './UNWhiteLabelAppComponent';
 import { DISPATCH_REQUEST_REFRESH, LISTENERS } from '../../scripts/html/bodyScript';
 
@@ -32,4 +32,4 @@ export const getWhiteLabelAppScript = () => {
 
     ${LISTENERS.unitWhiteLabelAppOnLoad}
   `;
-};
+};

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';

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',