@os1-platform/dispatch-mobile 2.1.21 → 2.1.23

package/src/components/executiontasks/deliver/SLDeliverET.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable react-native/no-inline-styles */
+/* eslint-disable @typescript-eslint/no-unused-vars */
 import type { DeliverETInput } from './DeliverETInput';
 import {
   BackHandler,
@@ -34,10 +36,14 @@ import { hasGoBackConnector } from '../../../components/utils';
 import { useFocusEffect } from '@react-navigation/native';
 import { getStr, getStrVal } from '../../../locale/util';
 import Str from '../../../locale/Str';
-import CircleMark from '../../../icons/circleMark.svg';
+import CircleMark from '../../../icons/CircleMark';
 import { TouchableOpacity } from 'react-native';
 import ModalWidget from '../../../components/widgets/ModalWidget';
-import { ScreenNameSdkConstants, SentryEventNameSdkConstants, SeverityLevelValue } from '../../../analytics/sentry/SentrySdkConstants';
+import {
+  ScreenNameSdkConstants,
+  SentryEventNameSdkConstants,
+  SeverityLevelValue,
+} from '../../../analytics/sentry/SentrySdkConstants';
 import { fireEventWithScreenName } from '../../../analytics/sentry/SentryAnalyticsUtils';
 
 const ListItem = ({ lineItem }: { lineItem: LineItem }) => (
@@ -58,9 +64,13 @@ const getMessage = (
   title: string | undefined
 ) => {
   try {
-    const isReturnOrder = title?.toString()?.toLowerCase()?.includes("return");    //message ||
+    const isReturnOrder = title?.toString()?.toLowerCase()?.includes('return'); //message ||
     //Str.DEFAULT_DELIVER_MESSAGE
-    const msg = getStrVal(isReturnOrder ? Str.DEFAULT_RETURN_MESSAGE : Str.DEFAULT_DELIVER_MESSAGE, Str.count, returnPackageCount && returnPackageCount >= 1 ? returnPackageCount : '');
+    const msg = getStrVal(
+      isReturnOrder ? Str.DEFAULT_RETURN_MESSAGE : Str.DEFAULT_DELIVER_MESSAGE,
+      Str.count,
+      returnPackageCount && returnPackageCount >= 1 ? returnPackageCount : ''
+    );
     return msg;
   } catch (error: any) {
     return message || '';
@@ -122,7 +132,12 @@ const DeliverET = (props: DeliverETInput) => {
                 props.navigation.goBack();
               }
               const cta = 'Back Arrow';
-              fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
+              fireEventWithScreenName({
+                severityLevel: SeverityLevelValue.LOG,
+                eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+                cta: cta,
+              });
             }}
             name="arrow-back"
             color={'black'}
@@ -197,8 +212,12 @@ const DeliverET = (props: DeliverETInput) => {
             }
             setShowBackModal(false);
             const cta = 'Exit';
-            fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
-
+            fireEventWithScreenName({
+              severityLevel: SeverityLevelValue.LOG,
+              eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+              screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+              cta: cta,
+            });
           },
           styles: styles.primaryButtonStyles,
         }}
@@ -208,8 +227,12 @@ const DeliverET = (props: DeliverETInput) => {
             setGoBack(false);
             setShowDeliverModal(true);
             const cta = 'Cancel';
-            fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
-
+            fireEventWithScreenName({
+              severityLevel: SeverityLevelValue.LOG,
+              eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+              screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+              cta: cta,
+            });
           },
           styles: styles.secondaryButtonStyles,
         }}
@@ -248,7 +271,15 @@ const DeliverET = (props: DeliverETInput) => {
                     </Text>
                   </View>
                   <View style={styles.returnView}>
-                    <Text style={styles.subTitle}>{getStr(props.returnPackageCount ? props.returnPackageCount > 1 ? Str.Expected_Shipments : Str.Expected_Shipment : Str.Expected_Shipments)}</Text>
+                    <Text style={styles.subTitle}>
+                      {getStr(
+                        props.returnPackageCount
+                          ? props.returnPackageCount > 1
+                            ? Str.Expected_Shipments
+                            : Str.Expected_Shipment
+                          : Str.Expected_Shipments
+                      )}
+                    </Text>
                     <Text style={styles.title}>{props.returnPackageCount}</Text>
                   </View>
                   {props.confirmShipments ? (
@@ -269,7 +300,11 @@ const DeliverET = (props: DeliverETInput) => {
                         }}
                         multiline={false}
                         autoComplete={'off'}
-                        label={getStr(Number(pkgCount) > 1 ? Str.Shipments_handed_over : Str.Shipment_handed_over)}
+                        label={getStr(
+                          Number(pkgCount) > 1
+                            ? Str.Shipments_handed_over
+                            : Str.Shipment_handed_over
+                        )}
                         value={pkgCount}
                         mode={'outlined'}
                         error={!isEmptyOrBlank(inputError)}
@@ -324,8 +359,12 @@ const DeliverET = (props: DeliverETInput) => {
                         });
                       } else setInputError('Please enter valid count.');
                       const cta = 'Confirm';
-                      fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
-
+                      fireEventWithScreenName({
+                        severityLevel: SeverityLevelValue.LOG,
+                        eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                        screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+                        cta: cta,
+                      });
                     }}
                   >
                     Confirm
@@ -362,29 +401,49 @@ const DeliverET = (props: DeliverETInput) => {
           >
             <View style={styles.modalView}>
               <View style={styles.modalStyle}>
-                <TouchableOpacity
-                  onPress={() => {
-                    setShowDeliverModal(false);
-                    setGoBack(true);
-                    const cta = 'Circle Icon';
-                    fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
+                {props.restrictCancel === true
+                  ? null
+                  : props.isSelfLoop === false && (
+                      <TouchableOpacity
+                        onPress={() => {
+                          setShowDeliverModal(false);
+                          setGoBack(true);
+                          const cta = 'Circle Icon';
+                          fireEventWithScreenName({
+                            severityLevel: SeverityLevelValue.LOG,
+                            eventName:
+                              SentryEventNameSdkConstants.BUTTON_CLICKED,
+                            screenName:
+                              ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+                            cta: cta,
+                          });
+                        }}
+                        style={styles.crossIcon}
+                        hitSlop={{ bottom: 10, top: 10, right: 10, left: 10 }}
+                      >
+                        <CircleMark />
+                      </TouchableOpacity>
+                    )}
 
-                  }}
-                  style={styles.crossIcon}
-                  hitSlop={{ bottom: 10, top: 10, right: 10, left: 10 }}
-                >
-                  <CircleMark />
-                </TouchableOpacity>
                 <View style={styles.modalBody}>
                   <Text style={DeliverPickupStyles.titleText}>
                     {props.title || DEFAULT_DELIVER_TITLE}
                   </Text>
                   <Text style={DeliverPickupStyles.messageText}>
-                    {getMessage(props.returnPackageCount, props.message, props.title)}
+                    {getMessage(
+                      props.returnPackageCount,
+                      props.message,
+                      props.title
+                    )}
                   </Text>
-                  {(props.title?.toString()?.toLowerCase()?.includes("return")) == false && <Text style={DeliverPickupStyles.messageText}>
-                    {props?.shipCount ? getStrVal(Str.shipments, Str.count, props.shipCount) : ''}
-                  </Text>}
+                  {props.title?.toString()?.toLowerCase()?.includes('return') ==
+                    false && (
+                    <Text style={DeliverPickupStyles.messageText}>
+                      {props?.shipCount
+                        ? getStrVal(Str.shipments, Str.count, props.shipCount)
+                        : ''}
+                    </Text>
+                  )}
 
                   {/* Removed showing the item when item.length === 1 */}
                   {/* {props.returnPackageCount === 1 && props.items.length ? (
@@ -420,41 +479,54 @@ const DeliverET = (props: DeliverETInput) => {
                         remark: '',
                       });
                       const cta = 'Confirm';
-                      fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
-
+                      fireEventWithScreenName({
+                        severityLevel: SeverityLevelValue.LOG,
+                        eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                        screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+                        cta: cta,
+                      });
                     }}
                   >
                     Confirm
                   </Button>
-                  {props.restrictCancel === true ? null : (
-                    (props.isSelfLoop == false) && <Button
-                      labelStyle={CommonStyles.cancelButtonLabel}
-                      style={[CommonStyles.cancelButton, { marginTop: 10 }]}
-                      mode={'outlined'}
-                      uppercase={false}
-                      onPress={async () => {
-                        setShowDeliverModal(false);
-                        props.onSubmitET({
-                          ...(await getBaseETResponse(
-                            EntityCode.DELIVER,
-                            false,
-                            getEventCodeByET(
-                              ExecutionTaskID.DELIVER,
-                              false,
-                              props.applicableReasons?.failure
-                            ),
-                            '',
-                            props.mergedObjectiveId,
-                            ExecutionTaskID.DELIVER
-                          )),
-                        });
-                        const cta = 'Cancel';
-                        fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN, cta: cta });
-                      }}
-                    >
-                      Cancel
-                    </Button>
-                  )}
+                  {props.restrictCancel === true
+                    ? null
+                    : props.isSelfLoop == false && (
+                        <Button
+                          labelStyle={CommonStyles.cancelButtonLabel}
+                          style={[CommonStyles.cancelButton, { marginTop: 10 }]}
+                          mode={'outlined'}
+                          uppercase={false}
+                          onPress={async () => {
+                            setShowDeliverModal(false);
+                            props.onSubmitET({
+                              ...(await getBaseETResponse(
+                                EntityCode.DELIVER,
+                                false,
+                                getEventCodeByET(
+                                  ExecutionTaskID.DELIVER,
+                                  false,
+                                  props.applicableReasons?.failure
+                                ),
+                                '',
+                                props.mergedObjectiveId,
+                                ExecutionTaskID.DELIVER
+                              )),
+                            });
+                            const cta = 'Cancel';
+                            fireEventWithScreenName({
+                              severityLevel: SeverityLevelValue.LOG,
+                              eventName:
+                                SentryEventNameSdkConstants.BUTTON_CLICKED,
+                              screenName:
+                                ScreenNameSdkConstants.SL_DELIVER_ET_SCREEN,
+                              cta: cta,
+                            });
+                          }}
+                        >
+                          Cancel
+                        </Button>
+                      )}
                 </View>
               </View>
             </View>

package/src/components/executiontasks/dropCash/SLDropCash.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* eslint-disable react-native/no-inline-styles */
 import { Button, Modal, Portal, Provider, TextInput } from 'react-native-paper';
 import { Platform, Text, View } from 'react-native';
 import {
@@ -21,7 +23,11 @@ import GoBackModal from '../../../components/widgets/GoBackModal';
 import { hasGoBackConnector } from '../../../components/utils';
 import { useFocusEffect } from '@react-navigation/native';
 import { BackHandler } from 'react-native';
-import { ScreenNameSdkConstants, SentryEventNameSdkConstants, SeverityLevelValue } from '../../../analytics/sentry/SentrySdkConstants';
+import {
+  ScreenNameSdkConstants,
+  SentryEventNameSdkConstants,
+  SeverityLevelValue,
+} from '../../../analytics/sentry/SentrySdkConstants';
 import { fireEventWithScreenName } from '../../../analytics/sentry/SentryAnalyticsUtils';
 
 const SLDropCash = (props: DropCashInput) => {
@@ -29,9 +35,9 @@ const SLDropCash = (props: DropCashInput) => {
     props.confirmAmount
       ? ''
       : `${getPaymentValue(
-        props.expectedAmount.value,
-        props.expectedAmount.minorUnit
-      )}`
+          props.expectedAmount.value,
+          props.expectedAmount.minorUnit
+        )}`
   );
   const [inputError, setInputError] = useState('');
 
@@ -83,8 +89,12 @@ const SLDropCash = (props: DropCashInput) => {
                 setShowBackModal(true);
               else props.navigation.goBack();
               const cta = 'Back Arrow';
-              fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN, cta: cta });    
-
+              fireEventWithScreenName({
+                severityLevel: SeverityLevelValue.LOG,
+                eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN,
+                cta: cta,
+              });
             }}
             name="arrow-back"
             color={'black'}
@@ -132,7 +142,12 @@ const SLDropCash = (props: DropCashInput) => {
             dismissable={false}
             contentContainerStyle={DeliverPickupStyles.modalContent}
           >
-            <View style={DeliverPickupStyles.modalView}>
+            <View
+              style={[
+                DeliverPickupStyles.modalView,
+                { padding: 15, paddingVertical: 15 },
+              ]}
+            >
               <Text style={DeliverPickupStyles.titleText}>{props.title}</Text>
               <View
                 style={{
@@ -252,13 +267,17 @@ const SLDropCash = (props: DropCashInput) => {
                     });
                   } else setInputError('Please enter valid amount.');
                   const cta = 'Confirm';
-                  fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN, cta: cta });    
-    
+                  fireEventWithScreenName({
+                    severityLevel: SeverityLevelValue.LOG,
+                    eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                    screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN,
+                    cta: cta,
+                  });
                 }}
               >
                 Confirm
               </Button>
-              {!props.confirmCustodyExchange && (props.isSelfLoop == false) && (
+              {!props.confirmCustodyExchange && props.isSelfLoop == false && (
                 <Button
                   labelStyle={CommonStyles.cancelButtonLabel}
                   style={[CommonStyles.cancelButton, { marginTop: 10 }]}
@@ -280,8 +299,12 @@ const SLDropCash = (props: DropCashInput) => {
                       )),
                     });
                     const cta = 'Cancel';
-                    fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN, cta: cta });    
-      
+                    fireEventWithScreenName({
+                      severityLevel: SeverityLevelValue.LOG,
+                      eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                      screenName: ScreenNameSdkConstants.SL_DROP_CASH_ET_SCREEN,
+                      cta: cta,
+                    });
                   }}
                 >
                   Cancel

package/src/components/executiontasks/payments/PaymentUtils.ts

@@ -2,6 +2,14 @@ export function getUniqueTransactionID(amt: number): string {
   return `TID${Date.now().toString() + amt.toString()}`;
 }
 export function getPaymentValue(amt: number, minorUnit?: number): number {
-  if (!minorUnit) return amt;
-  return amt / Math.pow(10, minorUnit);
+  let amtVal = 0
+  if (!minorUnit) {
+    amtVal = amt;
+  }else{
+    amtVal = amt / Math.pow(10, minorUnit);;
+  }
+  if(!Number.isInteger(amtVal)){
+    amtVal.toFixed(2);
+  }
+  return amtVal
 }

package/src/components/executiontasks/pickup/SLPickupET.tsx

@@ -26,7 +26,7 @@ import GoBackModal from '../../../components/widgets/GoBackModal';
 import { useFocusEffect } from '@react-navigation/native';
 import { getStrVal } from '../../../locale/util';
 import Str from '../../../locale/Str';
-import CircleMark from '../../../icons/circleMark.svg';
+import CircleMark from '../../../icons/CircleMark';
 import ModalWidget from '../../../components/widgets/ModalWidget';
 import { ScreenNameSdkConstants, SentryEventNameSdkConstants, SeverityLevelValue } from '../../../analytics/sentry/SentrySdkConstants';
 import { fireEventWithScreenName } from '../../../analytics/sentry/SentryAnalyticsUtils';
@@ -45,7 +45,8 @@ const getMessage = (
   message: string | undefined
 ) => {
   try {
-    const msg = message || getStrVal(Str.DEFAULT_PICKUP_MESSAGE, Str.count, pickupCount);
+    const msg =
+      message || getStrVal(Str.DEFAULT_PICKUP_MESSAGE, Str.count, pickupCount);
     return msg;
   } catch (error: any) {
     return message || '';
@@ -236,7 +237,9 @@ const SLPickupET = (props: PickupETInput) => {
                   {getMessage(props.pickupCount, props.message)}
                 </Text>
                 <Text style={DeliverPickupStyles.messageText}>
-                  {props?.shipCount ? getStrVal(Str.shipments, Str.count, props.shipCount) : ''}
+                  {props?.shipCount
+                    ? getStrVal(Str.shipments, Str.count, props.shipCount)
+                    : ''}
                 </Text>
                 {/* Removed showing the item when item.length === 1 */}
                 {/* {props.pickupCount === 1 && props.items.length ? (

package/src/components/executiontasks/scan/ScanET.tsx

@@ -356,7 +356,7 @@ const ScanET = (props: ScannerInput) => {
             'ON_SCAN',
             props.route,
             scannedData,
-            etOutput['default'].output
+            etOutput.default.output
           );
 
           // UPDATE PENDING IN SHARED PREFERENCE MERGED_SCAN_OUTPUT

package/src/components/executiontasks/scan/interfaces.ts

@@ -1,4 +1,4 @@
-import { SnackBarType } from 'src/components/widgets/SnackBarCustom';
+import { SnackBarType } from '../../../components/widgets/SnackBarCustom';
 import { ScannerOutput } from './ScanSchema';
 import { IDispatchExecutor } from '@os1-platform/platform-coreos-execution-engine-sdk';
 

package/src/components/executiontasks/scan/utils.ts

@@ -59,6 +59,7 @@ import { BaseETResponse } from '../ExecutionTasksIndex';
 import { eventType } from '../../../events/interface';
 import { getDefaultERCLabel } from './sub_components/DropDownUtils';
 import { SnackBarType } from '../../../components/widgets/SnackBarCustom';
+import { PAYMENT_SHARED_PREF_KEY } from '../collectPayment/PaymentUtils';
 
 export function getBarCodeTypes(input: ScannerInput): any[] {
   const barCodeType: any[] = [];
@@ -324,7 +325,7 @@ export async function getScanETOutput(
         mergedObjectiveId,
         ExecutionTaskID.SCAN
       );
-      mergeScannedOutput['default'] = {
+      mergeScannedOutput.default = {
         output,
         count,
       };
@@ -341,7 +342,7 @@ export async function getScanETOutput(
           ExecutionTaskID.SCAN
         );
 
-        mergeScannedOutput['default'] = { output, count };
+        mergeScannedOutput.default = { output, count };
         return mergeScannedOutput;
       } else {
         return mergeScannedOutput;
@@ -521,16 +522,16 @@ const fetchMergedObjectiveIdBasedOnStatus = async (
   switch (activeTab) {
     case SummaryPageTabs.ALL:
       return [
-        ...mergedObjectiveIds['pending'],
-        ...mergedObjectiveIds['success'],
-        ...mergedObjectiveIds['failure'],
+        ...mergedObjectiveIds.pending,
+        ...mergedObjectiveIds.success,
+        ...mergedObjectiveIds.failure,
       ];
     case SummaryPageTabs.PENDING:
-      return mergedObjectiveIds['pending'];
+      return mergedObjectiveIds.pending;
     case SummaryPageTabs.DELIVERED:
-      return mergedObjectiveIds['success'];
+      return mergedObjectiveIds.success;
     case SummaryPageTabs.UNDELIVERED:
-      return mergedObjectiveIds['failure'];
+      return mergedObjectiveIds.failure;
     default:
       return [];
   }
@@ -1109,3 +1110,10 @@ export async function resetObjective(scanProps: ScannerInput) {
   triggerScanEvent('ON_SCAN_REMOVE', scanProps.route, scannedData);
   return;
 }
+
+export async function clearPaymentSharedData(moIds: string[]) {
+  let storage = Storage.getInstance();
+  await storage.removeSharedItems(
+    moIds.map((_id) => PAYMENT_SHARED_PREF_KEY + _id)
+  );
+}

package/src/components/widgets/ModalWidget.tsx

@@ -1,9 +1,21 @@
-import { View, Text, StyleSheet, ViewStyle, TextStyle, Platform } from 'react-native';
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import {
+  View,
+  Text,
+  StyleSheet,
+  ViewStyle,
+  TextStyle,
+  Platform,
+} from 'react-native';
 import React from 'react';
 import { Portal, Modal } from 'react-native-paper';
 import { CommonStyles, Fonts } from '../../styles/executionTasks/CommonStyles';
 import { TouchableOpacity } from 'react-native';
-import { ScreenNameSdkConstants, SentryEventNameSdkConstants, SeverityLevelValue } from '../../analytics/sentry/SentrySdkConstants';
+import {
+  ScreenNameSdkConstants,
+  SentryEventNameSdkConstants,
+  SeverityLevelValue,
+} from '../../analytics/sentry/SentrySdkConstants';
 import { fireEventWithScreenName } from '../../analytics/sentry/SentryAnalyticsUtils';
 
 interface ButtonProps {
@@ -82,9 +94,12 @@ const ModalWidget = (props: ModalProps) => {
               onPress={() => {
                 props.primaryButton.onPress();
                 const cta = props.primaryButton.label;
-                fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.MODEL_WIDGET_SCREEN, cta: cta });
-            
-
+                fireEventWithScreenName({
+                  severityLevel: SeverityLevelValue.LOG,
+                  eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                  screenName: ScreenNameSdkConstants.MODEL_WIDGET_SCREEN,
+                  cta: cta,
+                });
               }}
               disabled={primaryButtonDisabled}
             >
@@ -99,9 +114,12 @@ const ModalWidget = (props: ModalProps) => {
               onPress={() => {
                 props.secondaryButton.onPress();
                 const cta = props.secondaryButton.label;
-                fireEventWithScreenName({ severityLevel: SeverityLevelValue.LOG, eventName: SentryEventNameSdkConstants.BUTTON_CLICKED, screenName: ScreenNameSdkConstants.MODEL_WIDGET_SCREEN, cta: cta });
-            
-
+                fireEventWithScreenName({
+                  severityLevel: SeverityLevelValue.LOG,
+                  eventName: SentryEventNameSdkConstants.BUTTON_CLICKED,
+                  screenName: ScreenNameSdkConstants.MODEL_WIDGET_SCREEN,
+                  cta: cta,
+                });
               }}
               disabled={secondaryButtonDisabled}
             >

package/src/components/widgets/ProgressDialog.tsx

@@ -1,5 +1,14 @@
 import React from 'react';
-import { ActivityIndicator, Modal, Platform, StyleSheet, Text, View } from 'react-native';
+import {
+  ActivityIndicator,
+  Modal,
+  Platform,
+  StyleProp,
+  StyleSheet,
+  Text,
+  TextStyle,
+  View,
+} from 'react-native';
 import { Fonts } from '../../styles/executionTasks/CommonStyles';
 
 const ProgressDialog = (props: ProgressDialogProps) => {
@@ -11,9 +20,18 @@ const ProgressDialog = (props: ProgressDialogProps) => {
       onRequestClose={() => {}}
     >
       <View style={styles.wrapper}>
-        <View style={styles.content}>
+        <View
+          style={[
+            styles.content,
+            props?.customModalContentStyle && props?.customModalContentStyle,
+          ]}
+        >
           <ActivityIndicator size="large" color="rgba(107, 142, 255, 1)" />
-          <Text style={[styles.label]}>{props.label}</Text>
+          <Text
+            style={[styles.label, props.labelStyle ? props.labelStyle : {}]}
+          >
+            {props.label}
+          </Text>
         </View>
       </View>
     </Modal>
@@ -51,4 +69,6 @@ export default ProgressDialog;
 export interface ProgressDialogProps {
   visible: boolean;
   label: string;
+  labelStyle?: StyleProp<TextStyle>;
+  customModalContentStyle?: StyleProp<TextStyle>;
 }

package/src/components/widgets/SnackBarCustom.tsx

@@ -29,6 +29,7 @@ export interface SnackbarProps {
   type?: SnackBarType;
   theme: ReactNativePaper.Theme;
   customBottom?: number;
+  customTop?: number;
 }
 const DURATION_MEDIUM = 3000;
 
@@ -46,6 +47,7 @@ const SnackbarCustom = ({
   theme,
   type,
   customBottom = 110,
+  customTop,
 }: SnackbarProps) => {
   const { current: opacity } = React.useRef<Animated.Value>(
     new Animated.Value(0.0)
@@ -107,7 +109,11 @@ const SnackbarCustom = ({
   return (
     <SafeAreaView
       pointerEvents="box-none"
-      style={[styles.wrapper, { bottom: customBottom }]}
+      style={[
+        styles.wrapper,
+        { bottom: customBottom },
+        customTop !== undefined ? { top: customTop } : {},
+      ]}
     >
       <Surface
         pointerEvents="box-none"
@@ -185,6 +191,7 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     backgroundColor: '#059669',
     flex: 1,
+    borderRadius: 4,
   },
   fail: {
     padding: 16,

package/src/components/widgets/SplitTextInput.tsx

@@ -53,7 +53,7 @@ const SplitTextInput = ({
 
     const isValueFocused = isCurrentValue || (isLastValue && isCodeComplete);
 
-    const splitBoxesStyle = Boolean(hasError)
+    const splitBoxesStyle = hasError
       ? widgetStyles.errorSplitBoxes
       : (isInputBoxFocused && isValueFocused) || value[index]
       ? widgetStyles.focusedSplitBoxes