react-native-unit-components 3.3.0-beta.3 → 3.4.0

package/src/components/UNBottomSheetComponent/components/UNBottomSheetSlotComponent/UNBottomSheetSlotComponent.tsx

@@ -35,6 +35,12 @@ import { useSafeAreaDimensions } from '../../../../hooks/useSafeAreaDimensions';
 import { BottomSheetNativeMessage } from '../../../../messages/nativeMessages/bottomSheetMessage';
 import { OpenPlaidEvent, PlaidMessage } from '../../../../messages/webMessages/plaidMessages';
 import { PayeeCounterpartyEvent, PayeeManagementMessage } from '../../../../messages/webMessages/payeeManagementMessage';
+import { BillPayMenuMessage, RequestEditBillEvent } from '../../../../messages/webMessages/billPayMenuMessage';
+import { BillActionsMessage } from '../../../../messages/webMessages/billActionsMessage';
+import { BillPayBillsMessage, BillsFiltersChangedEvent } from '../../../../messages/webMessages/billPayBillsMessage';
+import { BalanceSummaryMessage, RequestDateRangeMenuValueChangeEvent } from '../../../../messages/webMessages/balanceSummaryMessage';
+import { VendorFormMessage } from '../../../../messages/webMessages/vendorFormMessage';
+import { UnsavedChangesMessage, UnsavedChangesActionEvent } from '../../../../messages/webMessages/unsavedChangesMessage';
 import UNKeyboardAvoidingView from '../../../../helpers/UNKeyboardAvoidingView/UNKeyboardAvoidingView';
 import { MultipleCardsFiltersChangedEvent, MultipleCardsMessage } from '../../../../messages/webMessages/multipleCardsMessage';
 import { View } from 'react-native';
@@ -199,6 +205,18 @@ const UNBottomSheetSlotComponent = (props: UNBottomSheetSlotComponentProps) => {
           (message.details as MultipleCardsFiltersChangedEvent)
         );
         break;
+      case BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED:
+        eventBus.emit(
+          BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED,
+          (message.details as BillsFiltersChangedEvent)
+        );
+        break;
+      case BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE:
+        eventBus.emit(
+          BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE,
+          (message.details as RequestDateRangeMenuValueChangeEvent)
+        );
+        break;
       case PayeeManagementMessage.UNIT_COUNTERPARTY_DELETED: {
         eventBus.emit(
           PayeeManagementMessage.UNIT_COUNTERPARTY_DELETED,
@@ -206,6 +224,38 @@ const UNBottomSheetSlotComponent = (props: UNBottomSheetSlotComponentProps) => {
         );
         break;
       }
+      case BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL:
+        eventBus.emit(BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL, message.details as RequestEditBillEvent);
+        break;
+      case BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY:
+        eventBus.emit(BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY, {});
+        break;
+      case BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS:
+        eventBus.emit(BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS, {});
+        break;
+      case BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS:
+        eventBus.emit(BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS, {});
+        break;
+      case BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS:
+        eventBus.emit(BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS, {});
+        break;
+      case VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT:
+        eventBus.emit(VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT, {});
+        break;
+      case UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION:
+        eventBus.emit(
+          UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION,
+          message.details as UnsavedChangesActionEvent
+        );
+        break;
+      case BillActionsMessage.UNIT_BILL_ARCHIVED:
+      case BillActionsMessage.UNIT_BILL_MARK_AS_PAID:
+      case BillActionsMessage.UNIT_BILL_MARK_AS_UNPAID:
+      case BillActionsMessage.UNIT_BILL_RESCHEDULED:
+      case BillActionsMessage.UNIT_BILL_CHECK_CANCELLED:
+      case BillActionsMessage.UNIT_BILL_REFUNDED:
+        eventBus.emit(message.type, message.details as string);
+        break;
     }
   };
 

package/src/components/UNCheckDepositComponent/UNCheckDepositComponent.tsx

@@ -19,7 +19,7 @@ import type WebView from 'react-native-webview';
 import type { RootState } from '../../store';
 
 export interface UNCheckDepositComponentProps {
-  accountId: string;
+  accountId?: string;
   fee?: number;
   theme?: string;
   language?: string;
@@ -115,6 +115,7 @@ const UNCheckDepositComponent = (props: UNCheckDepositComponentProps) => {
         }
         configureAndShowVeryfiCamera(
           veryfiCredentials,
+          externalSdkEvent.bankName,
           (images) => {
             injectUnitVeryfiResponse(webRef.current, images);
           },

package/src/components/UNCheckDepositComponent/UNCheckDepositComponent.utils.ts

@@ -6,11 +6,12 @@ import type WebView from 'react-native-webview';
 import type { UNVeryfiCredentials } from '../../types/shared/veryfi.types';
 
 export const getCheckDepositParams = (props: UNCheckDepositComponentProps, veryfiCredentials?: UNVeryfiCredentials | null) => {
+  const accountIdParam = props.accountId ? `account-id="${props.accountId}"` : '';
   const feeParam = props.fee ? `fee="${props.fee}"` : '';
   const useVeryfi = veryfiCredentials && isVeryfiAvailable();
   const versionParam = useVeryfi ? 'version="veryfi"' : '';
   return `
-    account-id="${props.accountId}"
+    ${accountIdParam}
     ${feeParam}
     ${versionParam}
     initial-stage-back-button="${props.initialStageBackButton ?? false}"

package/src/components/UNWhiteLabelAppComponent/UNWhiteLabelAppComponent.tsx

@@ -19,7 +19,21 @@ import {
   injectAccountCreationActionsOpenPlaidForLinkExternalAccount,
   injectCardCreated,
   injectRefreshEventIfNeeded,
+  injectRequestEditBill,
+  injectRequestCreateManualBillPay,
+  injectRequestOpenArchivedBills,
+  injectRequestOpenVendors,
+  injectRequestOpenPaymentMethods,
+  injectVendorFormTrySubmit,
+  injectUnsavedChangesAction,
+  injectBillActionResult,
 } from './UNWhiteLabelAppComponent.utils';
+import { BillPayMenuMessage, RequestEditBillEvent } from '../../messages/webMessages/billPayMenuMessage';
+import { BillActionsMessage } from '../../messages/webMessages/billActionsMessage';
+import { BillPayBillsMessage } from '../../messages/webMessages/billPayBillsMessage';
+import { BalanceSummaryMessage } from '../../messages/webMessages/balanceSummaryMessage';
+import { VendorFormMessage } from '../../messages/webMessages/vendorFormMessage';
+import { UnsavedChangesMessage, UnsavedChangesActionEvent } from '../../messages/webMessages/unsavedChangesMessage';
 import { UserDataKeys } from '../../types/internal/unitStore.types';
 import { PageMessage } from '../../messages/webMessages/pageMessage';
 import UNStoreManagerHelper from '../../nativeModulesHelpers/UNStoreModuleHelper/UNStoreModuleHelper';
@@ -104,6 +118,14 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
     webRef.current?.injectJavaScript(`dispatchActivityFilterChangedEvent('${query}')`);
   };
 
+  const dispatchBillsFiltersChanged = (query: string) => {
+    webRef.current?.injectJavaScript(`dispatchBillsFilterChangedEvent('${query}')`);
+  };
+
+  const dispatchDateRangeMenuValueChange = (value: string) => {
+    webRef.current?.injectJavaScript(`dispatchDateRangeMenuValueChangeEvent('${value}')`);
+  };
+
   const openPlaid = (openPlaidData: OpenPlaidEvent) => {
     const linkToken = openPlaidData.plaidLinkToken.attributes.linkToken;
     createPlaidLink({ token: linkToken });
@@ -123,6 +145,14 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
     busEventKey: ActivityMessage.UNIT_ACTIVITY_FILTERS_CHANGED,
     action: dispatchActivityFiltersChanged,
   });
+  useEventListener({
+    busEventKey: BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED,
+    action: dispatchBillsFiltersChanged,
+  });
+  useEventListener({
+    busEventKey: BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE,
+    action: dispatchDateRangeMenuValueChange,
+  });
   useEventListener({
     busEventKey: PlaidMessage.UNIT_OPEN_PLAID,
     action: (details) => {
@@ -139,6 +169,58 @@ const UNWhiteLabelAppComponent = (props: UNWhiteLabelAppComponentProps) => {
   useEventListener({ busEventKey: CardMessage.CARD_CREATED, action: (card: CardCreatedEvent) => {
     injectCardCreated(webRef.current, card);
   } });
+  useEventListener({
+    busEventKey: BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL,
+    action: (detail: RequestEditBillEvent) => injectRequestEditBill(webRef.current, detail),
+  });
+  useEventListener({
+    busEventKey: BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY,
+    action: () => injectRequestCreateManualBillPay(webRef.current),
+  });
+  useEventListener({
+    busEventKey: BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS,
+    action: () => injectRequestOpenArchivedBills(webRef.current),
+  });
+  useEventListener({
+    busEventKey: BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS,
+    action: () => injectRequestOpenVendors(webRef.current),
+  });
+  useEventListener({
+    busEventKey: BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS,
+    action: () => injectRequestOpenPaymentMethods(webRef.current),
+  });
+  useEventListener({
+    busEventKey: VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT,
+    action: () => injectVendorFormTrySubmit(webRef.current),
+  });
+  useEventListener({
+    busEventKey: UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION,
+    action: (detail: UnsavedChangesActionEvent) => injectUnsavedChangesAction(webRef.current, detail),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_ARCHIVED,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_ARCHIVED, billId),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_MARK_AS_PAID,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_MARK_AS_PAID, billId),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_MARK_AS_UNPAID,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_MARK_AS_UNPAID, billId),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_RESCHEDULED,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_RESCHEDULED, billId),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_CHECK_CANCELLED,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_CHECK_CANCELLED, billId),
+  });
+  useEventListener({
+    busEventKey: BillActionsMessage.UNIT_BILL_REFUNDED,
+    action: (billId: string) => injectBillActionResult(webRef.current, BillActionsMessage.UNIT_BILL_REFUNDED, billId),
+  });
 
   const renderWebView = () => {
     return (

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

@@ -1,8 +1,26 @@
 import WebView from 'react-native-webview';
 import { RequestRefreshEvent } from '../../messages/webMessages/unitComponentsMessages';
 import { UNWhiteLabelAppComponentProps } from './UNWhiteLabelAppComponent';
-import { DISPATCH_ACCOUNT_CREATION_ACTIONS_OPEN_PLAID_FOR_LINK_EXTERNAL_ACCOUNT, DISPATCH_OPEN_PLAID, DISPATCH_PLAID_EXIT, DISPATCH_PLAID_RESPONSE, DISPATCH_REQUEST_REFRESH, LISTENERS } from '../../scripts/html/bodyScript';
+import {
+  DISPATCH_ACCOUNT_CREATION_ACTIONS_OPEN_PLAID_FOR_LINK_EXTERNAL_ACCOUNT,
+  DISPATCH_OPEN_PLAID,
+  DISPATCH_PLAID_EXIT,
+  DISPATCH_PLAID_RESPONSE,
+  DISPATCH_REQUEST_REFRESH,
+  DISPATCH_REQUEST_EDIT_BILL,
+  DISPATCH_REQUEST_CREATE_MANUAL_BILL_PAY,
+  DISPATCH_REQUEST_OPEN_ARCHIVED_BILLS,
+  DISPATCH_REQUEST_OPEN_VENDORS,
+  DISPATCH_REQUEST_OPEN_PAYMENT_METHODS,
+  DISPATCH_VENDOR_FORM_TRY_SUBMIT,
+  DISPATCH_UNSAVED_CHANGES_ACTION,
+  DISPATCH_BILL_ACTION_RESULT,
+  LISTENERS,
+} from '../../scripts/html/bodyScript';
 import { UNCard } from '../../types/shared';
+import { RequestEditBillEvent } from '../../messages/webMessages/billPayMenuMessage';
+import { BillActionsMessage } from '../../messages/webMessages/billActionsMessage';
+import { UnsavedChangesActionEvent } from '../../messages/webMessages/unsavedChangesMessage';
 
 export const getWhiteLabelAppParams = (props: UNWhiteLabelAppComponentProps) => {
   // customer token is the preferred way to authenticate
@@ -35,6 +53,38 @@ export const injectCardCreated = (currentWeb: WebView | null, card: UNCard) => {
   currentWeb?.injectJavaScript(`dispatchCardCreatedEvent(${JSON.stringify(card)})`);
 };
 
+export const injectRequestEditBill = (currentWeb: WebView | null, detail: RequestEditBillEvent) => {
+  currentWeb?.injectJavaScript(`dispatchRequestEditBill(${JSON.stringify(JSON.stringify(detail))})`);
+};
+
+export const injectRequestCreateManualBillPay = (currentWeb: WebView | null) => {
+  currentWeb?.injectJavaScript('dispatchRequestCreateManualBillPay()');
+};
+
+export const injectRequestOpenArchivedBills = (currentWeb: WebView | null) => {
+  currentWeb?.injectJavaScript('dispatchRequestOpenArchivedBills()');
+};
+
+export const injectRequestOpenVendors = (currentWeb: WebView | null) => {
+  currentWeb?.injectJavaScript('dispatchRequestOpenVendors()');
+};
+
+export const injectRequestOpenPaymentMethods = (currentWeb: WebView | null) => {
+  currentWeb?.injectJavaScript('dispatchRequestOpenPaymentMethods()');
+};
+
+export const injectVendorFormTrySubmit = (currentWeb: WebView | null) => {
+  currentWeb?.injectJavaScript('dispatchVendorFormTrySubmit()');
+};
+
+export const injectUnsavedChangesAction = (currentWeb: WebView | null, detail: UnsavedChangesActionEvent) => {
+  currentWeb?.injectJavaScript(`dispatchUnsavedChangesAction(${JSON.stringify(JSON.stringify(detail))})`);
+};
+
+export const injectBillActionResult = (currentWeb: WebView | null, eventName: BillActionsMessage, billId: string) => {
+  currentWeb?.injectJavaScript(`dispatchBillActionResult(${JSON.stringify(eventName)}, ${JSON.stringify(billId)})`);
+};
+
 export const getWhiteLabelAppScript = () => {
   return `
     ${DISPATCH_REQUEST_REFRESH}
@@ -42,6 +92,14 @@ export const getWhiteLabelAppScript = () => {
     ${DISPATCH_PLAID_RESPONSE}
     ${DISPATCH_PLAID_EXIT}
     ${DISPATCH_ACCOUNT_CREATION_ACTIONS_OPEN_PLAID_FOR_LINK_EXTERNAL_ACCOUNT}
+    ${DISPATCH_REQUEST_EDIT_BILL}
+    ${DISPATCH_REQUEST_CREATE_MANUAL_BILL_PAY}
+    ${DISPATCH_REQUEST_OPEN_ARCHIVED_BILLS}
+    ${DISPATCH_REQUEST_OPEN_VENDORS}
+    ${DISPATCH_REQUEST_OPEN_PAYMENT_METHODS}
+    ${DISPATCH_VENDOR_FORM_TRY_SUBMIT}
+    ${DISPATCH_UNSAVED_CHANGES_ACTION}
+    ${DISPATCH_BILL_ACTION_RESULT}
     ${LISTENERS.unitWhiteLabelAppOnLoad}
     ${LISTENERS.unitCounterpartyCreated}
   `;

package/src/messages/webMessages/balanceSummaryMessage.ts

@@ -0,0 +1,8 @@
+export enum BalanceSummaryMessage {
+  UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE = 'unitRequestDateRangeMenuValueChange'
+}
+
+export type RequestDateRangeMenuValueChangeEvent = string
+
+export type BalanceSummaryEvent =
+  | RequestDateRangeMenuValueChangeEvent

package/src/messages/webMessages/billActionsMessage.ts

@@ -0,0 +1,13 @@
+export enum BillActionsMessage {
+  UNIT_BILL_ARCHIVED = 'unitBillArchived',
+  UNIT_BILL_MARK_AS_PAID = 'unitBillMarkAsPaid',
+  UNIT_BILL_MARK_AS_UNPAID = 'unitBillMarkAsUnpaid',
+  UNIT_BILL_RESCHEDULED = 'unitBillRescheduled',
+  UNIT_BILL_CHECK_CANCELLED = 'unitBillCheckCancelled',
+  UNIT_BILL_REFUNDED = 'unitBillRefunded'
+}
+
+export const billActionResultMessages = Object.values(BillActionsMessage);
+
+// Each bill action result event carries the affected billId as its detail.
+export type BillActionResultEvent = string;

package/src/messages/webMessages/billPayBillsMessage.ts

@@ -0,0 +1,8 @@
+export enum BillPayBillsMessage {
+  UNIT_BILLS_FILTERS_CHANGED = 'unitBillsFiltersChanged'
+}
+
+export type BillsFiltersChangedEvent = string
+
+export type BillPayBillsEvent =
+  | BillsFiltersChangedEvent

package/src/messages/webMessages/billPayMenuMessage.ts

@@ -0,0 +1,16 @@
+export enum BillPayMenuMessage {
+  UNIT_REQUEST_EDIT_BILL = 'unitRequestEditBill',
+  UNIT_REQUEST_CREATE_MANUAL_BILL_PAY = 'unitRequestCreateManualBillPay',
+  UNIT_REQUEST_OPEN_ARCHIVED_BILLS = 'unitRequestOpenArchivedBills',
+  UNIT_REQUEST_OPEN_VENDORS = 'unitRequestOpenVendors',
+  UNIT_REQUEST_OPEN_PAYMENT_METHODS = 'unitRequestOpenPaymentMethods'
+}
+
+export interface RequestEditBillEvent {
+  billId: string;
+  [key: string]: unknown;
+}
+
+export type BillPayMenuEvent =
+  | RequestEditBillEvent
+  | null

package/src/messages/webMessages/index.ts

@@ -13,6 +13,12 @@ import { PlaidEvent, PlaidMessage } from './plaidMessages';
 import { PayeeManagementMessage, PayeeManagementEvent } from './payeeManagementMessage';
 import { MultiFactorAuthenticationMessage } from './multiFactorAuthenticationMessage';
 import { WirePaymentCreatedEvent } from './wirePaymentMessage';
+import { BillPayMenuMessage, BillPayMenuEvent } from './billPayMenuMessage';
+import { BillActionsMessage, BillActionResultEvent } from './billActionsMessage';
+import { BillPayBillsMessage, BillPayBillsEvent } from './billPayBillsMessage';
+import { BalanceSummaryMessage, BalanceSummaryEvent } from './balanceSummaryMessage';
+import { VendorFormMessage, VendorFormEvent } from './vendorFormMessage';
+import { UnsavedChangesMessage, UnsavedChangesEvent } from './unsavedChangesMessage';
 
 export type WebViewMessageType =
   | PageMessage
@@ -26,6 +32,12 @@ export type WebViewMessageType =
   | PlaidMessage
   | PayeeManagementMessage
   | MultiFactorAuthenticationMessage
+  | BillPayMenuMessage
+  | BillActionsMessage
+  | BillPayBillsMessage
+  | BalanceSummaryMessage
+  | VendorFormMessage
+  | UnsavedChangesMessage
 
 type WebViewEvent =
   | PageEvent
@@ -43,6 +55,12 @@ type WebViewEvent =
   | PayeeManagementEvent
   | WirePaymentCreatedEvent
   | MultiFactorAuthenticationFinishedEvent
+  | BillPayMenuEvent
+  | BillActionResultEvent
+  | BillPayBillsEvent
+  | BalanceSummaryEvent
+  | VendorFormEvent
+  | UnsavedChangesEvent
 
 export interface WebViewMessage {
   type: WebViewMessageType,

package/src/messages/webMessages/unitComponentsMessages.ts

@@ -91,6 +91,8 @@ export type UnitWhiteLabelAppEvent =
 
 export interface RequestExternalSdkEvent {
   type: string;
+  // White-label bank name forwarded from the web SDK, for the native Veryfi back-capture endorsement disclaimer
+  bankName?: string;
 }
 
 export type UnitEvent =

package/src/messages/webMessages/unsavedChangesMessage.ts

@@ -0,0 +1,10 @@
+export enum UnsavedChangesMessage {
+  UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION = 'unitBillPayUnsavedChangesAction'
+}
+
+export interface UnsavedChangesActionEvent {
+  action: 'save' | 'discard' | 'cancel';
+  [key: string]: unknown;
+}
+
+export type UnsavedChangesEvent = UnsavedChangesActionEvent

package/src/messages/webMessages/vendorFormMessage.ts

@@ -0,0 +1,5 @@
+export enum VendorFormMessage {
+  UNIT_VENDOR_FORM_TRY_SUBMIT = 'unitVendorFormTrySubmit'
+}
+
+export type VendorFormEvent = null

package/src/scripts/html/bodyScript.ts

@@ -10,6 +10,12 @@ import { MultipleCardsMessage } from '../../messages/webMessages/multipleCardsMe
 import { VeryfiMessage } from '../../messages/webMessages/veryfiMessages';
 import { WebComponentType } from '../../types/internal/webComponent.types';
 import { UserDataKeys } from '../../types/internal/unitStore.types';
+import { BillPayMenuMessage } from '../../messages/webMessages/billPayMenuMessage';
+import { billActionResultMessages } from '../../messages/webMessages/billActionsMessage';
+import { BillPayBillsMessage } from '../../messages/webMessages/billPayBillsMessage';
+import { BalanceSummaryMessage } from '../../messages/webMessages/balanceSummaryMessage';
+import { VendorFormMessage } from '../../messages/webMessages/vendorFormMessage';
+import { UnsavedChangesMessage } from '../../messages/webMessages/unsavedChangesMessage';
 
 export const POST_MESSAGE_TO_SDK = `
   const postMessageToSDK = (message) => {
@@ -175,6 +181,16 @@ export const LISTENERS = {
       postMessageToSDK({ type: "${MultipleCardsMessage.UNIT_MULTIPLE_CARDS_FILTERS_CHANGED}", details: e.detail })
     });
   `,
+  unitBillsFiltersChanged: `
+    window.addEventListener("${BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED}", (e) => {
+      postMessageToSDK({ type: "${BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED}", details: e.detail })
+    });
+  `,
+  unitRequestDateRangeMenuValueChange: `
+    window.addEventListener("${BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE}", (e) => {
+      postMessageToSDK({ type: "${BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE}", details: e.detail })
+    });
+  `,
   unitMultiFactorAuthFinished: `
     window.addEventListener("${UnitComponentsMessage.UNIT_MULTI_FACTOR_AUTH_FINISHED}", async (e) => {
       const response = await e.detail.response;
@@ -283,6 +299,55 @@ export const LISTENERS = {
       if (e.detail?.fromSDK) { return }
       postMessageToSDK({ type: "${AccountMessage.UNIT_ACCOUNT_CREATION_ACTIONS_OPEN_PLAID_FOR_LINK_EXTERNAL_ACCOUNT}" })
     });
+  `,
+  unitRequestEditBill: `
+    window.addEventListener("${BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL}", details: e.detail })
+    });
+  `,
+  unitRequestCreateManualBillPay: `
+    window.addEventListener("${BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY}" })
+    });
+  `,
+  unitRequestOpenArchivedBills: `
+    window.addEventListener("${BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS}" })
+    });
+  `,
+  unitRequestOpenVendors: `
+    window.addEventListener("${BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS}" })
+    });
+  `,
+  unitRequestOpenPaymentMethods: `
+    window.addEventListener("${BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS}" })
+    });
+  `,
+  unitVendorFormTrySubmit: `
+    window.addEventListener("${VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT}" })
+    });
+  `,
+  unitBillPayUnsavedChangesAction: `
+    window.addEventListener("${UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION}", (e) => {
+      if (e.detail?.fromSDK) { return }
+      postMessageToSDK({ type: "${UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION}", details: e.detail })
+    });
+  `,
+  unitBillActionResults: `
+    ${JSON.stringify(billActionResultMessages)}.forEach((eventName) => {
+      window.addEventListener(eventName, (e) => {
+        postMessageToSDK({ type: eventName, details: e.detail })
+      });
+    });
   `
 };
 
@@ -346,6 +411,20 @@ export const DISPATCH_MULTIPLE_CARDS_FILTER_CHANGED_EVENT = `
   }
 `;
 
+export const DISPATCH_BILLS_FILTER_CHANGED_EVENT = `
+  const dispatchBillsFilterChangedEvent = (details) => {
+    const event = new CustomEvent("${BillPayBillsMessage.UNIT_BILLS_FILTERS_CHANGED}",{ detail: details });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_DATE_RANGE_MENU_VALUE_CHANGE_EVENT = `
+  const dispatchDateRangeMenuValueChangeEvent = (details) => {
+    const event = new CustomEvent("${BalanceSummaryMessage.UNIT_REQUEST_DATE_RANGE_MENU_VALUE_CHANGE}", { detail: details });
+    window.dispatchEvent(event);
+  }
+`;
+
 export const DISPATCH_CARD_CREATED_EVENT = `
   const dispatchCardCreatedEvent = (details) => {
     // Add fromSDK to avoid infinite loop
@@ -435,3 +514,58 @@ export const DISPATCH_COUNTERPARTY_DELETED = `
     window.dispatchEvent(event);
   }
 `;
+
+export const DISPATCH_REQUEST_EDIT_BILL = `
+  const dispatchRequestEditBill = (details) => {
+    const event = new CustomEvent("${BillPayMenuMessage.UNIT_REQUEST_EDIT_BILL}", { detail: { ...JSON.parse(details), fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_REQUEST_CREATE_MANUAL_BILL_PAY = `
+  const dispatchRequestCreateManualBillPay = () => {
+    const event = new CustomEvent("${BillPayMenuMessage.UNIT_REQUEST_CREATE_MANUAL_BILL_PAY}", { detail: { fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_REQUEST_OPEN_ARCHIVED_BILLS = `
+  const dispatchRequestOpenArchivedBills = () => {
+    const event = new CustomEvent("${BillPayMenuMessage.UNIT_REQUEST_OPEN_ARCHIVED_BILLS}", { detail: { fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_REQUEST_OPEN_VENDORS = `
+  const dispatchRequestOpenVendors = () => {
+    const event = new CustomEvent("${BillPayMenuMessage.UNIT_REQUEST_OPEN_VENDORS}", { detail: { fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_REQUEST_OPEN_PAYMENT_METHODS = `
+  const dispatchRequestOpenPaymentMethods = () => {
+    const event = new CustomEvent("${BillPayMenuMessage.UNIT_REQUEST_OPEN_PAYMENT_METHODS}", { detail: { fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_VENDOR_FORM_TRY_SUBMIT = `
+  const dispatchVendorFormTrySubmit = () => {
+    const event = new CustomEvent("${VendorFormMessage.UNIT_VENDOR_FORM_TRY_SUBMIT}", { detail: { fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_UNSAVED_CHANGES_ACTION = `
+  const dispatchUnsavedChangesAction = (details) => {
+    const event = new CustomEvent("${UnsavedChangesMessage.UNIT_BILL_PAY_UNSAVED_CHANGES_ACTION}", { detail: { ...JSON.parse(details), fromSDK: true } });
+    window.dispatchEvent(event);
+  }
+`;
+
+export const DISPATCH_BILL_ACTION_RESULT = `
+  const dispatchBillActionResult = (eventName, billId) => {
+    window.dispatchEvent(new CustomEvent(eventName, { detail: billId }));
+  }
+`;

package/src/services/veryfiService.ts

@@ -29,8 +29,18 @@ const CHECK_SETTINGS = {
   originalImageMaxSizeInMB: 1.4,
 };
 
+// Veryfi's default English back-capture modal string; overridden to append the endorsement.
+const BACK_CAPTURE_MODAL_KEY = 'Capture the back side of the check?';
+
+const buildEndorsement = (bankName?: string): string => {
+  const bank = bankName?.trim();
+  // Bank-agnostic fallback when the bank name is absent, so the copy never reads "...deposit at ".
+  return `Please make sure to sign the back and write “For mobile deposit ${bank ? `at ${bank}` : 'only'}”`;
+};
+
 export const configureAndShowVeryfiCamera = (
   credentials: UNVeryfiCredentials,
+  bankName: string | undefined,
   onImages: (images: UNVeryfiImage[]) => void,
   onError: (error: string) => void
 ): void => {
@@ -117,7 +127,17 @@ export const configureAndShowVeryfiCamera = (
     url: credentials.url,
   };
 
-  VeryfiLens.configureWithCredentials(veryfiCredentials, CHECK_SETTINGS, () => {
+  const endorsement = buildEndorsement(bankName);
+  const settings = {
+    ...CHECK_SETTINGS,
+    customLensStrings: {
+      en: {
+        [BACK_CAPTURE_MODAL_KEY]: `${BACK_CAPTURE_MODAL_KEY}\n\n${endorsement}`,
+      },
+    },
+  };
+
+  VeryfiLens.configureWithCredentials(veryfiCredentials, settings, () => {
     VeryfiLens.showCamera();
   });
 };

package/src/unitComponentsSdkManager/UnitComponentsSdk.constants.ts

@@ -3,8 +3,8 @@ import { UNComponentsSecuritySettings, UNComponentsSnapshotProtectionStrategy }
 
 const WEB_SDK_RECOMMENDED_STRATEGY: UNComponentsWebVersioningStrategy = {
   type: UNVersioningStrategyType.upToNextMinor,
-  major: 3,
-  minor: 6,
+  major: 4,
+  minor: 0,
 };
 
 const DEFAULT_SECURITY_SETTINGS: UNComponentsSecuritySettings = {

package/src/unitComponentsSdkManager/UnitComponentsSdkManager.ts

@@ -27,7 +27,7 @@ export class UnitComponentsSDK {
   protected static fonts?: UNFonts;
   protected static signedNonce?: string;
   protected static pushProvisionModule?: typeof NativeModules;
-  protected static sdkVersion = '3.3.0-beta.3';
+  protected static sdkVersion = '3.4.0';
   static iosFontBase64Map: Record<string, string> = {};
 
   public static init = async (