react-native-unit-components 1.10.0 → 1.11.0

package/src/scripts/html/bodyScript.ts

@@ -36,6 +36,7 @@ export const LISTENERS = {
   `,
   requestRefresh: `
     window.addEventListener("${UnitMessage.UNIT_REQUEST_REFRESH}", (e) => {
+      if (e.detail.fromSDK) { return }
       postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_REFRESH}", details:  e.detail  })
     });
   `,
@@ -47,7 +48,11 @@ export const LISTENERS = {
   `,
   requestCloseFlow: `
     window.addEventListener("${UnitMessage.UNIT_REQUEST_CLOSE_FLOW}", (e) => {
-      postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_CLOSE_FLOW}" })
+    // Add a delay of 200 milliseconds to allow the SDK to finish processing prior events that require a Promise before closing the flow
+    setTimeout(() => {
+        postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_CLOSE_FLOW}" });
+    }, 200);
+
     });
   `,
   requestOpenLink: `
@@ -85,6 +90,12 @@ export const LISTENERS = {
     postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_EXTERNAL_SDK}", details: e.detail })
   });
   `,
+
+  unitRequestLeftToSpendDetails: `
+  window.addEventListener("${UnitMessage.UNIT_REQUEST_LEFT_TO_SPEND_DETAILS}", (e) => {
+    postMessageToSDK({ type: "${UnitMessage.UNIT_REQUEST_LEFT_TO_SPEND_DETAILS}", details: e.detail })
+  });
+  `,
   unitPaymentCreated: `
   window.addEventListener("${PaymentMessage.PAYMENT_CREATED}", (e) => {
     const response = e.detail
@@ -95,6 +106,17 @@ export const LISTENERS = {
       })
   });
   `,
+  unitPaymentInitialStageBackButtonClicked: `
+  window.addEventListener("unitPaymentInitialStageBackButtonClicked", (e) => {
+    postMessageToSDK({ type: "${PaymentMessage.INITIAL_STAGE_BACK_BUTTON_CLICKED}", details: { data: e.detail }})
+  });
+  `,
+
+  unitPaymentFinalStageDoneButtonClicked: `
+   window.addEventListener("unitPaymentFinalStageDoneButtonClicked", (e) => {
+    postMessageToSDK({ type: "${PaymentMessage.FINAL_STAGE_DONE_BUTTON_CLICKED}", details: { data: e.detail }})
+   });
+  `,
   unitPlaidTokenCreated: `
   window.addEventListener("${UnitMessage.UNIT_PLAID_TOKEN_CREATED}", (e) => {
     const response = e.detail
@@ -130,17 +152,23 @@ export const DISPATCH_RENDERING_EVENT = `
 `;
 
 export const DISPATCH_REQUEST_REFRESH = `
-    const dispatchRefreshEvent = (details) => {
-    const event = new CustomEvent("${UnitMessage.UNIT_REQUEST_REFRESH}",{ detail: JSON.parse(details) })
-    window.dispatchEvent(event)
+  const dispatchRefreshEvent = (details) => {
+    let event;
+    // we are adding "fromSDK" param to avoid infinite loop
+    if (details) {
+        event = new CustomEvent("${UnitMessage.UNIT_REQUEST_REFRESH}",{ detail: {...JSON.parse(details), fromSDK: true} });
+    } else {
+        event = new CustomEvent("${UnitMessage.UNIT_REQUEST_REFRESH}", { detail: { fromSDK: true }});
     }
+    window.dispatchEvent(event)
+  }
 `;
 
 export const DISPATCH_ACTIVITY_FILTER_CHANGED_EVENT = `
-    const dispatchActivityFilterChangedEvent = (details) => {
-      const event = new CustomEvent("${ActivityMessage.UNIT_ACTIVITY_FILTERS_CHANGED}",{ detail: details });
-      window.dispatchEvent(event);
-    }
+  const dispatchActivityFilterChangedEvent = (details) => {
+    const event = new CustomEvent("unitActivityFiltersChanged",{ detail: details});
+    window.dispatchEvent(event);
+  }
 `;
 
 export const DISPATCH_PLAID_RESPONSE = `

package/src/slices/BottomSheetSlice.ts

@@ -0,0 +1,72 @@
+import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+import type { RootState } from '../store';
+import { BottomSheetNativePlaceType, ScrollState } from '../types/internal/bottomSheet.types';
+
+export interface BottomSheetState {
+  isBottomSheetActive: boolean;
+  isComponentLoading?: boolean;
+  shouldShowBottomSheet?: boolean;
+  nativePlace?: BottomSheetNativePlaceType;
+  componentHeight?: number;
+  shouldEnableBottomSheetScroll: boolean;
+  scrollState?: ScrollState;
+}
+
+const initialState: BottomSheetState = {
+  isBottomSheetActive: false,
+  isComponentLoading: false,
+  shouldShowBottomSheet: false,
+  shouldEnableBottomSheetScroll: true,
+  nativePlace: BottomSheetNativePlaceType.overFullScreen,
+  componentHeight: 0,
+};
+
+const BottomSheetSlice = createSlice({
+  name: 'BottomSheet',
+  initialState: initialState,
+  reducers: {
+    setIsBottomSheetActive(state, action: PayloadAction<boolean>) {
+      state.isBottomSheetActive = action.payload;
+    },
+    setIsComponentLoading(state, action: PayloadAction<boolean>) {
+      state.isComponentLoading = action.payload;
+    },
+    setShouldShowBottomSheet(state, action: PayloadAction<boolean>) {
+      state.shouldShowBottomSheet = action.payload;
+    },
+
+    setNativePlace(state, action: PayloadAction<BottomSheetNativePlaceType>) {
+      state.nativePlace = action.payload;
+    },
+    setComponentHeight(state, action: PayloadAction<number>) {
+      state.componentHeight = action.payload;
+    },
+    setShouldEnableBottomSheetScroll(state, action: PayloadAction<boolean>) {
+      state.shouldEnableBottomSheetScroll = action.payload;
+    },
+
+    setScrollState(state, action: PayloadAction<ScrollState>) {
+      state.scrollState = action.payload;
+    },
+
+    resetBottomSheetSlice(state) {
+      //resets all besides is active to avoid loops in useEffects invoked by closing the flow
+      state.isComponentLoading = initialState.isComponentLoading;
+      state.shouldShowBottomSheet = initialState.shouldShowBottomSheet;
+      state.nativePlace = initialState.nativePlace;
+      state.componentHeight = initialState.componentHeight;
+      state.shouldEnableBottomSheetScroll = initialState.shouldEnableBottomSheetScroll;
+      state.scrollState = initialState.scrollState;
+    },
+  },
+
+});
+
+export const {
+  setIsBottomSheetActive, setIsComponentLoading,
+  setShouldShowBottomSheet, setNativePlace,
+  setComponentHeight,
+  setShouldEnableBottomSheetScroll, setScrollState, resetBottomSheetSlice,
+} = BottomSheetSlice.actions;
+export const selectConfiguration = (state: RootState) => state.bottomSheet;
+export default BottomSheetSlice.reducer;

package/src/slices/SharedEventsSlice.ts

@@ -2,7 +2,6 @@
 
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import type { RootState } from '../store';
-import type { SlotRendering, WebComponentRendering } from '../types/internal/bottomSheet.types';
 import type { UNAccountData, UNCardData } from '../types/shared';
 import type { ActivityFiltersChangedEvent } from '../messages/webMessages/activityMessage';
 import type { RequestRefreshEvent } from '../messages/webMessages/unitMessages';
@@ -12,13 +11,10 @@ import type { AccountMessage } from '../messages/webMessages/accountMessage';
 import type { ActivityMessage } from '../messages/webMessages/activityMessage';
 import type { UnitMessage } from '../messages/webMessages/unitMessages';
 import type { MultipleCardsMessage } from '../messages/webMessages/multipleCardsMessage';
+import { BottomSheetRenderingMessage } from '../messages/nativeMessages/bottomSheetMessage';
 
 type EmptyObj = Record<PropertyKey, never>;
 
-type SlotRenderingEventState = {
-  key: BottomSheetNativeMessage.START_FLOW,
-  data: SlotRendering
-}
 type MultipleCardsCardClickedEventState = {
   key: MultipleCardsMessage.UNIT_MULTIPLE_CARDS_CARD_CLICKED,
   data: UNCardData
@@ -44,14 +40,14 @@ type ActivityFiltersChangedEventState = {
   data: ActivityFiltersChangedEvent
 }
 
-type RequestCloseFlowEventState = {
+type RequestCloseBottomSheetFlowEventState = {
   key: UnitMessage.UNIT_REQUEST_CLOSE_FLOW,
   data: EmptyObj
 }
 
-type WebComponentRenderingEventState = {
-  key: BottomSheetNativeMessage.START_FLOW,
-  data: WebComponentRendering
+type RequestRenderingBottomSheetEventState = {
+  key: BottomSheetNativeMessage.REQUEST_RENDERING,
+  data: BottomSheetRenderingMessage
 }
 
 type RequestRefreshEventState = {
@@ -61,14 +57,13 @@ type RequestRefreshEventState = {
 
 //currently left state suffixes to avoid the duplication of the event names
 type SharedEvent =
-  SlotRenderingEventState
   | CardStatusChangedEventState
   | CardActivatedEventState
   | MultipleCardsCardClickedEventState
   | AccountChangedEventState
   | ActivityFiltersChangedEventState
-  | RequestCloseFlowEventState
-  | WebComponentRenderingEventState
+  | RequestCloseBottomSheetFlowEventState
+  | RequestRenderingBottomSheetEventState
   | RequestRefreshEventState
 
 type SharedEventsState = {

package/src/store/store.ts

@@ -2,12 +2,14 @@ import { configureStore } from '@reduxjs/toolkit';
 import wallet from '../slices/pushProvisioningSlice';
 import configuration from '../slices/ConfigurationSlice';
 import sharedEvents from '../slices/SharedEventsSlice';
+import bottomSheet from '../slices/BottomSheetSlice';
 
 export const store = configureStore({
   reducer: {
     wallet,
     configuration,
     sharedEvents,
+    bottomSheet,
   },
 });
 

package/src/styles/variables.ts

@@ -4,6 +4,9 @@ export const VARIABLES = {
     BLACK: '#000000',
     BLUE: '#005fF0',
     GREY: '#bbbbbb',
-    SILVER_FLAKE: '#D5DDE0'
-  }
+    SILVER_FLAKE: '#D5DDE0',
+    PINK: '#FF00FF',
+    PURPLE: '#800080',
+    GREEN: '#008000',
+  },
 };

package/src/types/internal/bottomSheet.types.ts

@@ -1,12 +1,54 @@
 import type { RequestRenderingEvent } from '../../messages/webMessages/unitMessages';
 import type { PresentationMode, WebComponentType } from './webComponent.types';
+import {
+  UNAddToWalletComponentProps,
+} from '../../nativeComponents/UNAddToWallet/UNAddToWalletComponent/UNAddToWalletComponent';
+
+export enum BottomSheetNativePlaceType {
+  overFullScreen = 'overFullScreen',
+  modal = 'modal',
+  menu = 'menu',
+}
+
+export enum ScrollState {
+  /*
+    Web View ScrollState -
+      - Initialization:
+      'onTop': for a scrollable webView.
+        (onTop means that the webview is onTop of the BottomSheet and we need to recognize the scroll direction).
+        Then, it recognize the scroll direction and update the scroll state as needed.
+
+      -'unScrollable': for an unscrollable webView
+  */
+  onTop = 'onTop',
+  unScrollable = 'unScrollable',
+
+  /*
+    These are only for maintain the bottom sheet scrollState (not an initialize scroll state).
+    It relates to the current scroll state.
+    onlyWebView means that now the scroll is on webview (only).
+    onlyBottomSheet means that now the scroll is on bottomSheet (only).
+   */
+  onlyWebView = 'webViewScroll',
+  onlyBottomSheet = 'onlyBottomSheet',
+}
 
 export enum BottomSheetRenderingType {
   Slot,
-  WebComponent,
   NativeComponent
 }
 
+export enum BottomSheetNativeComponentType {
+  AddToWalletComponent = 'UNAddToWalletComponent',
+}
+
+export type BottomSheetNativeAddToWalletComponentType = {
+  type: BottomSheetNativeComponentType.AddToWalletComponent,
+  props: UNAddToWalletComponentProps
+}
+
+export type BottomSheetNativeComponent = BottomSheetNativeAddToWalletComponentType
+
 export type BottomSheetSlotData = {
   // The data that rendered by the web view
   componentName?: WebComponentType,
@@ -14,6 +56,11 @@ export type BottomSheetSlotData = {
   requestRenderingEvent: RequestRenderingEvent
 }
 
+export type BottomSheetComponentData = {
+  componentName?: WebComponentType,
+  componentResourceId?: string,
+}
+
 export type WebComponentData = {
   type: WebComponentType;
   presentationMode?: PresentationMode,
@@ -24,7 +71,9 @@ export type WebComponentData = {
 }
 
 export type NativeComponentData = {
-  component: React.ReactNode,
+  component: BottomSheetNativeComponent,
+  scrollState?: ScrollState,
+  nativePlace?: BottomSheetNativePlaceType,
 }
 
 export interface SlotRendering {
@@ -32,11 +81,6 @@ export interface SlotRendering {
   data: BottomSheetSlotData
 }
 
-export interface WebComponentRendering {
-  type: BottomSheetRenderingType.WebComponent,
-  data: WebComponentData
-}
-
 export interface NativeComponentRendering {
   type: BottomSheetRenderingType.NativeComponent,
   data: NativeComponentData

package/src/types/internal/webComponent.types.ts

@@ -9,6 +9,8 @@ export enum WebComponentType {
   achDebitPayment = 'unit-elements-ach-debit-payment',
   achCreditPayment = 'unit-elements-ach-credit-payment',
   cardAction = 'unit-elements-card-action',
+  programDetails = 'unit-elements-program-details',
+  nextRepayment = 'unit-elements-next-repayment',
 }
 
 export enum PresentationMode {

package/src/types/shared/account.types.ts

@@ -129,3 +129,9 @@ export enum UNAccountMenuAction {
   OpenAccountStatements = 'OpenAccountStatements',
   DownloadBankVerificationLetter = 'DownloadBankVerificationLetter',
 }
+
+export enum UNAccountMenuItem {
+  details = 'details',
+  statements = 'statements',
+  bankVerification = 'bankVerification',
+}

package/src/types/shared/activity.types.ts

@@ -2,12 +2,12 @@ import type { RESPONSE_KEYS } from '../../messages/webMessages/onLoadMessage';
 import type { UNAuthorizationData } from './authorization.types';
 import type { UNTransactionData } from './transactions.types';
 
-export const enum UNActivityComponentPaginationType {
+export enum UNActivityComponentPaginationType {
   infiniteScroll = 'infiniteScroll',
   pagination = 'pagination'
 }
 
 export type UNActivityOnLoadData = {
-  [RESPONSE_KEYS.authorizations]: UNAuthorizationData,
-  [RESPONSE_KEYS.transactions]: UNTransactionData,
+  [RESPONSE_KEYS.authorizations]: [UNAuthorizationData],
+  [RESPONSE_KEYS.transactions]: [UNTransactionData],
 }

package/src/types/shared/card.types.ts

@@ -2,7 +2,7 @@ import type { UNAddress, UNFullName, UNLimits, UNRelationship, UNTags } from './
 
 export type UNCardData = UNIndividualDebitCard | UNBusinessDebitCard
 
-type UNCardStatus =  'Active' | 'Inactive' | 'Stolen' | 'Lost' | 'Frozen' | 'ClosedByCustomer' | 'SuspectedFraud'
+type UNCardStatus = 'Active' | 'Inactive' | 'Stolen' | 'Lost' | 'Frozen' | 'ClosedByCustomer' | 'SuspectedFraud'
 
 export type UNIndividualDebitCard = {
   id: string,
@@ -70,3 +70,12 @@ export enum UNCardMenuAction {
   SetPin = 'SetPin',
   AddToWallet = 'AddToWallet'
 }
+
+export enum UNCardMenuItem {
+  freeze = 'freeze',
+  addToWallet = 'addToWallet',
+  managePin = 'managePin',
+  replace = 'replace',
+  report = 'report',
+  close = 'close',
+}

package/src/types/shared/multipleCards.types.ts

@@ -1,6 +1,6 @@
 import type { UNCardData } from './card.types';
 
-export const enum UNMultipleCardsComponentPaginationType {
+export enum UNMultipleCardsComponentPaginationType {
   infiniteScroll = 'infiniteScroll',
   pagination = 'pagination'
 }

package/src/types/shared/payments.types.ts

@@ -1,14 +1,19 @@
 export type UNPaymentStatus = 'Sent' | 'Rejected'
 
 export type UNAchCounterparty = {
-	name: string
-	accountNumber: string
-	routingNumber: string
-	accountType: UNAccountType
+  name: string
+  accountNumber: string
+  routingNumber: string
+  accountType: UNAccountType
 }
 
 type UNAccountType = 'Savings' | 'Checking'
 
+export enum UNPlaidAccountFilter {
+  checking = 'checking',
+  savings = 'savings',
+}
+
 export enum UNCounterpartyVerificationMethod {
-	Plaid = 'Plaid',
+  Plaid = 'Plaid',
 }

package/src/types/shared/repayment.types.ts

@@ -0,0 +1,12 @@
+export type UNRepaymentData = UNCreditAccountRepaymentData
+
+export type UNCreditAccountRepaymentData = {
+	type: 'creditAccountRepaymentInformation'
+	attributes: {
+		remainingAmountDue: number // Cents
+		remainingAmountOverdue: number // Cents
+		statementPeriodStart: string // "2023-07-01",
+		statementPeriodEnd: string // "2023-07-31",
+		nextRepaymentDueDate: string // "2023-08-13"
+	}
+}

package/src/types/shared/versioning.types.ts

@@ -1,9 +1,14 @@
 export enum UNVersioningStrategyType {
+  latest = 'latest',
   exact = 'exact',
   upToNextMinor = 'upToNextMinor',
   upToNextMajor = 'upToNextMajor'
 }
 
+type UNLatestWebVersioningStrategy = {
+  type: UNVersioningStrategyType.latest;
+}
+
 type UNExactWebVersioningStrategy = {
   type: UNVersioningStrategyType.exact;
   major: number;
@@ -23,6 +28,7 @@ type UNUpToNextMajorWebVersioningStrategy = {
 }
 
 export type UNWebVersioningStrategy =
-  UNExactWebVersioningStrategy
+  UNLatestWebVersioningStrategy
+  | UNExactWebVersioningStrategy
   | UNUpToNextMinorWebVersioningStrategy
   | UNUpToNextMajorWebVersioningStrategy;

package/src/unitSdkManager/UnitSdk.constants.ts

@@ -3,7 +3,7 @@ import { UNVersioningStrategyType, UNWebVersioningStrategy } from '../types/shar
 const WEB_SDK_RECOMMENDED_STRATEGY: UNWebVersioningStrategy = {
   type: UNVersioningStrategyType.upToNextMinor,
   major: 1,
-  minor: 3,
+  minor: 6,
 };
 
 export const UNSDKConstants = {

package/src/utils/webVersioningStrategy.utils.ts

@@ -3,6 +3,8 @@ import { UNSDKConstants } from '../unitSdkManager/UnitSdk.constants';
 
 export const getWebSdkVersionString = (webVersioningStrategy: UNWebVersioningStrategy) => {
   switch (webVersioningStrategy.type) {
+    case UNVersioningStrategyType.latest:
+      return 'latest';
     case UNVersioningStrategyType.exact:
       return `${webVersioningStrategy.major}.${webVersioningStrategy.minor}.${webVersioningStrategy.patch}`;
     case UNVersioningStrategyType.upToNextMinor:
@@ -14,6 +16,8 @@ export const getWebSdkVersionString = (webVersioningStrategy: UNWebVersioningStr
 
 export const getVersionArray = (webVersioningStrategy: UNWebVersioningStrategy) => {
   switch (webVersioningStrategy.type) {
+    case UNVersioningStrategyType.latest:
+      return [null, null, null];
     case UNVersioningStrategyType.exact:
       return [webVersioningStrategy.major, webVersioningStrategy.minor, webVersioningStrategy.patch];
     case UNVersioningStrategyType.upToNextMinor:
@@ -43,6 +47,9 @@ export const isBehindRecommendedStrategy = (currentWebVersioningStrategy: UNWebV
 };
 
 export const warnClientIfNeeded = (currentWebVersioningStrategy: UNWebVersioningStrategy) => {
+  if (currentWebVersioningStrategy.type === UNVersioningStrategyType.latest) {
+    return;
+  }
   if (currentWebVersioningStrategy.major > UNSDKConstants.webSDKRecommendedStrategy.major) {
     console.log(`The current web sdk version is ${getWebSdkVersionString(currentWebVersioningStrategy)} which is higher than the latest supported version ${getWebSdkVersionString(UNSDKConstants.webSDKRecommendedStrategy)}. Please update the latest version of the web sdk.`);
   }

package/src/webComponent/WebComponent.tsx

@@ -1,10 +1,15 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import React, { useEffect, useState } from 'react';
-import { Platform } from 'react-native';
+import { Linking, Platform } from 'react-native';
 import { useDispatch, useSelector } from 'react-redux';
 import { WebView, WebViewMessageEvent } from 'react-native-webview';
 import html, { HTML_PLACEHOLDER } from './html';
-import { RequestRefreshEvent, UnitMessage, RequestDownloadEvent } from '../messages/webMessages/unitMessages';
+import {
+  RequestRefreshEvent,
+  UnitMessage,
+  RequestDownloadEvent,
+  RequestOpenLinkEvent,
+} from '../messages/webMessages/unitMessages';
 import { getHtmlBody } from '../scripts/html/bodyHtml';
 import { fetchUnitScript } from '../unitSdkManager/UnitSdk.api';
 import { UnitSDK } from '../unitSdkManager/UnitSdkManager';
@@ -96,17 +101,24 @@ export const WebComponent = React.forwardRef<WebView, WebComponentProps>(functio
     switch (message.type) {
       case UnitMessage.UNIT_REQUEST_REFRESH:
         message.details &&
-          dispatch(setEvent({
-            key: UnitMessage.UNIT_REQUEST_REFRESH,
-            data: message.details as RequestRefreshEvent,
-          }));
+        dispatch(setEvent({
+          key: UnitMessage.UNIT_REQUEST_REFRESH,
+          data: message.details as RequestRefreshEvent,
+        }));
         break;
+      case UnitMessage.UNIT_REQUEST_OPEN_LINK:
+        // eslint-disable-next-line no-case-declarations
+        const { href } = (message.details as RequestOpenLinkEvent);
+        Linking.openURL(href);
+        break;
+
       case UnitMessage.UNIT_REQUEST_DOWNLOAD:
         message.details &&
-          handleRequestDownload(message.details as RequestDownloadEvent, () => {
-            dispatch(setEvent({ key: UnitMessage.UNIT_REQUEST_CLOSE_FLOW, data: {} }));
-          });
+        handleRequestDownload(message.details as RequestDownloadEvent, () => {
+          dispatch(setEvent({ key: UnitMessage.UNIT_REQUEST_CLOSE_FLOW, data: {} }));
+        });
         break;
+
       default:
         props.onMessage && props.onMessage(message);
     }

package/lib/commonjs/components/UNBottomSheetComponent/components/UNAddToWalletBottomSheetItem/UNAddToWalletBottomSheetItem.js

@@ -1,91 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.UNAddToWalletBottomSheetItem = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _WebComponent = require("../../../../webComponent/WebComponent");
-var _UNBottomSheetComponent = require("../../UNBottomSheetComponent.utils");
-var _UNAddToWalletBottomSheetItem = require("./UNAddToWalletBottomSheetItem.styles");
-var _reactNative = require("react-native");
-var _unitMessages = require("../../../../messages/webMessages/unitMessages");
-var _UnitAddToWalletButton = _interopRequireDefault(require("../../../../nativeComponent/UnitAddToWalletButton"));
-var _wallet = require("../../../../types/shared/wallet.types");
-var _bottomSheet = require("../../../../types/internal/bottomSheet.types");
-var _webComponent = require("../../../../types/internal/webComponent.types");
-var _useCardWallet = require("../../../../helpers/pushProvisioningService/hooks/useCardWallet");
-var _startProvisioning = require("../../../../helpers/pushProvisioningService/startProvisioning");
-var _reactRedux = require("react-redux");
-var _SharedEventsSlice = require("../../../../slices/SharedEventsSlice");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const UNAddToWalletBottomSheetItem = props => {
-  const dispatch = (0, _reactRedux.useDispatch)();
-  const styles = (0, _UNAddToWalletBottomSheetItem.getStylesObject)();
-  const webRef = (0, _react.useRef)(null);
-  const {
-    renderingType,
-    renderingRequest,
-    webComponentData,
-    cardId
-  } = props;
-  const {
-    currentUNWallet
-  } = (0, _useCardWallet.useCardWallet)(cardId);
-  (0, _react.useEffect)(() => {
-    if (!webRef.current) return;
-    const currentWalletStatus = (currentUNWallet === null || currentUNWallet === void 0 ? void 0 : currentUNWallet.status) ?? _wallet.UNCardAddToWalletStatus.pending;
-    if (currentWalletStatus === _wallet.UNCardAddToWalletStatus.pending) return;
-    if (renderingType === _bottomSheet.BottomSheetRenderingType.Slot && renderingRequest) {
-      const isCardInWallet = currentWalletStatus === _wallet.UNCardAddToWalletStatus.addedToWallet;
-      webRef.current.injectJavaScript(`window.UnitMobileSDKConfig["isCardInWallet"] = ${isCardInWallet}`);
-      (0, _UNBottomSheetComponent.renderingBottomSheetRequest)(webRef.current, renderingRequest);
-    }
-  }, [webRef.current, renderingRequest, currentUNWallet]);
-  const handleAddToWalletClicked = () => {
-    if (!currentUNWallet) return;
-    (0, _startProvisioning.launchStartCardProvisioning)(currentUNWallet);
-  };
-  const handleWebComponentMessage = message => {
-    if (!message || !message.type) return;
-    switch (message.type) {
-      case _unitMessages.UnitMessage.UNIT_ON_LOAD:
-        (0, _UNBottomSheetComponent.injectHtmlFullScreenHeight)(webRef.current, props.fullScreenHeight);
-        break;
-      case _unitMessages.UnitMessage.UNIT_REQUEST_CLOSE_FLOW:
-        dispatch((0, _SharedEventsSlice.setEvent)({
-          key: _unitMessages.UnitMessage.UNIT_REQUEST_CLOSE_FLOW,
-          data: {}
-        }));
-        break;
-      default:
-        break;
-    }
-  };
-  const shouldShowWebComponent = () => {
-    // Show .Slot, since it need to be loaded when we inject the requestRendering
-    // Otherwise show web component only if the card is in wallet or ready to be provisioned.
-
-    const isSlot = renderingType === _bottomSheet.BottomSheetRenderingType.Slot;
-    const gotWalletStatus = currentUNWallet && (currentUNWallet.status === _wallet.UNCardAddToWalletStatus.readyToProvisioning || currentUNWallet.status === _wallet.UNCardAddToWalletStatus.addedToWallet);
-    return isSlot || gotWalletStatus;
-  };
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, shouldShowWebComponent() && /*#__PURE__*/_react.default.createElement(_WebComponent.WebComponent, {
-    ref: webRef,
-    type: renderingType === _bottomSheet.BottomSheetRenderingType.WebComponent ? _webComponent.WebComponentType.cardAction : _webComponent.WebComponentType.slot,
-    presentationMode: _webComponent.PresentationMode.CoverInjectedHeight,
-    params: webComponentData === null || webComponentData === void 0 ? void 0 : webComponentData.params,
-    isScrollable: false,
-    onMessage: handleWebComponentMessage,
-    windowParams: renderingType === _bottomSheet.BottomSheetRenderingType.WebComponent ? `window.UnitMobileSDKConfig["isCardInWallet"] = ${(currentUNWallet === null || currentUNWallet === void 0 ? void 0 : currentUNWallet.status) === _wallet.UNCardAddToWalletStatus.addedToWallet}` : ''
-  }), (currentUNWallet == undefined || (currentUNWallet === null || currentUNWallet === void 0 ? void 0 : currentUNWallet.status) === _wallet.UNCardAddToWalletStatus.pending) && /*#__PURE__*/_react.default.createElement(_reactNative.ActivityIndicator, {
-    style: styles.loader
-  }), (currentUNWallet === null || currentUNWallet === void 0 ? void 0 : currentUNWallet.status) === _wallet.UNCardAddToWalletStatus.readyToProvisioning && /*#__PURE__*/_react.default.createElement(_UnitAddToWalletButton.default, {
-    style: styles.addToWalletButton,
-    onAddToWalletClicked: handleAddToWalletClicked
-  }));
-};
-exports.UNAddToWalletBottomSheetItem = UNAddToWalletBottomSheetItem;
-//# sourceMappingURL=UNAddToWalletBottomSheetItem.js.map