@os1-platform/dispatch-mobile 2.1.2 → 2.1.4

package/src/components/executiontasks/CompletedWFSchema.ts

@@ -0,0 +1,24 @@
+import type { BaseETResponse } from '../../models/execTasks/ETBaseModels';
+
+export type CompletedWFResponse = BaseETResponse & {
+  /**
+   * Last Event code
+   */
+  lastEventCode?: string;
+  /**
+   * Last Reason code
+   */
+  lastReasonCode?: string;
+  /**
+   * Meta data related to execution of task
+   */
+};
+
+/**
+ * Can go back
+ */
+export type CanGoBack = boolean;
+
+export interface CompletedWFRequest {
+  canGoBack?: CanGoBack;
+}

package/src/components/executiontasks/ExecutionTasksIndex.ts

@@ -0,0 +1,137 @@
+import FormGenerator from './forms/FormGenerator';
+import type { CaptureInput, CaptureOutput } from './imageCapture/CaptureSchema';
+import ImageCapture from './imageCapture/ImageCapture';
+
+import SignatureET from './doodle/SignatureET';
+import CancelET from './cancellation/CancelET';
+import type {
+  CancellationInput,
+  CancellationOutput,
+} from './cancellation/CancellationSchema';
+import type { SignatureInput, SignatureOutput } from './doodle/SignatureSchema';
+import DeliverET from './deliver/DeliverET';
+import type {
+  DeliverETInput,
+  DeliverOutput,
+  DeliverRemarks,
+  LineItem,
+} from './deliver/DeliverETInput';
+import type { BaseETResponse } from '../../models/execTasks/ETBaseModels';
+import { verifyLocation } from './verifyLocation/GeofenceUtils';
+import type {
+  VerifyLocationInput,
+  VerifyLocationOutput,
+} from './verifyLocation/VerifyLocSchema';
+import PickupET from './pickup/PickupET';
+import type { PickupETInput, PickupETOutput } from './pickup/PickpSchema';
+import type { DisplayETInput, DisplayETOutput } from './display/DisplaySchema';
+import DisplayModalET from './display/DisplayModalET';
+import type { FormInputSchema, FormOutputSchema } from './forms/FormSchema';
+import type {
+  CompletePaymentInput,
+  CompletePaymentOutput,
+} from './payments/completePayment/CompletePaymentSchema';
+import type {
+  InitPaymentInput,
+  InitPaymentOutput,
+} from './payments/init/InitPaymentSchema';
+import type {
+  ProcessPaymentInput,
+  ProcessPaymentOutput,
+} from './payments/processPayment/ProcessPaymentSchema';
+import type {
+  OtpInputSchema,
+  OtpOutputSchema,
+} from './verifyOtp/VerifyOtpSchema';
+
+import VerifyOtpET from './verifyOtp/VerifyOtpET';
+import VerifyLocationET from './verifyLocation/VerifyLocationET';
+import CaptureText from './captureInput/CaptureText';
+import type {
+  CaptureTextInput,
+  CaptureTextOutput,
+} from './captureInput/CaptureInputSchema';
+import type {
+  VerifyInput,
+  VerifyInputResponse,
+} from './verifyInput/VerifyInputSchema';
+import InitPaymentET from './payments/init/InitPaymentET';
+import ProcessPaymentET from './payments/processPayment/ProcessPaymentET';
+import DropCashET from './dropCash/DropCashET';
+import type { DropCashInput, DropCashOutput } from './dropCash/DropCashSchema';
+import CompletePaymentET from './payments/completePayment/CompletePaymentET';
+import SLDeliverET from './deliver/SLDeliverET';
+import SLPickupET from './pickup/SLPickupET';
+import SLDropCash from './dropCash/SLDropCash';
+import HttpRequestET from './httpRequest/HttpRequestET';
+import ScanET from './scan/ScanET';
+import ValidateOTPET from './validateOTP/ValidateOTPET';
+import type { ScannerInput, ScannerOutput } from './scan/ScanSchema';
+import type {
+  ValidateOTPInput,
+  ValidateOTPOutput,
+} from './validateOTP/ValidateOTPSchema';
+
+export type {
+  CancellationInput,
+  CancellationOutput,
+  DeliverETInput,
+  DeliverOutput,
+  LineItem,
+  DeliverRemarks,
+  DisplayETInput,
+  DisplayETOutput,
+  SignatureInput,
+  SignatureOutput,
+  FormInputSchema,
+  FormOutputSchema,
+  CaptureOutput,
+  CaptureInput,
+  VerifyLocationOutput,
+  VerifyLocationInput,
+  CompletePaymentInput,
+  CompletePaymentOutput,
+  InitPaymentInput,
+  InitPaymentOutput,
+  ProcessPaymentInput,
+  ProcessPaymentOutput,
+  PickupETInput,
+  PickupETOutput,
+  BaseETResponse,
+  OtpInputSchema,
+  OtpOutputSchema,
+  CaptureTextInput,
+  CaptureTextOutput,
+  VerifyInput,
+  VerifyInputResponse,
+  DropCashInput,
+  DropCashOutput,
+  ScannerInput,
+  ScannerOutput,
+  ValidateOTPInput,
+  ValidateOTPOutput,
+};
+
+export {
+  CancelET,
+  DeliverET,
+  DisplayModalET,
+  SignatureET,
+  FormGenerator,
+  ImageCapture,
+  VerifyLocationET,
+  verifyLocation,
+  PickupET,
+  VerifyOtpET,
+  CaptureText,
+  InitPaymentET,
+  ProcessPaymentET,
+  DropCashET,
+  CompletePaymentET,
+  SLDeliverET,
+  SLPickupET,
+  SLDropCash,
+  HttpRequestET,
+  ScanET,
+  ValidateOTPET,
+};

package/src/components/executiontasks/cancellation/CancelET.tsx

@@ -0,0 +1,281 @@
+import {
+  Alert,
+  FlatList,
+  Platform,
+  StyleSheet,
+  Text,
+  ToastAndroid,
+  TouchableOpacity,
+  View,
+} from 'react-native';
+import React, { useEffect, useState } from 'react';
+import { Button, Paragraph, RadioButton } from 'react-native-paper';
+import type { CancellationInput } from './CancellationSchema';
+import { isEmptyOrBlank } from '../../../utils/utils';
+import {
+  CommonStyles,
+  DeliverPickupStyles,
+  Fonts,
+} from '../../../styles/executionTasks/CommonStyles';
+import ReasonCodeContainer from '../../../manager/dispatchCodes/ReasonCodeContainer';
+import type { ReasonsRow } from '../../../manager/syncmanager/DBConfig';
+import EventCodeContainer from '../../../manager/dispatchCodes/EventCodeContainer';
+import IconButton from '../../widgets/IconButton';
+import { AntDesign } from '@expo/vector-icons';
+
+const ICON_SIZE = 12;
+
+const CancelET = (props: CancellationInput) => {
+  const reasonsContainer = ReasonCodeContainer.getInstance();
+  const [reasonList, setReasonList] = useState(
+    props?.cancellationReasons || []
+  );
+  const [reasonsRow, setReasonsRow] = useState<ReasonsRow[]>([]);
+  const [cancelEvent, setCancelEvent] = useState(props.cancelEvent);
+  const [cancelEventCode, setCancelEventCode] = useState(props.cancelEvent);
+  const [cancelReason, setCancelReason] = useState('');
+  const [btnDisabled, setBtnDisabled] = useState(false);
+
+  const [showEventCode, setShowEventCode] = useState(
+    props?.cancellationEvents?.length ? true : false
+  );
+  const [showReasonCode, setShowReasonCode] = useState(
+    reasonList?.length > 0 ? true : false
+  );
+
+  const eventCodeIconName = showEventCode ? 'up' : 'down';
+  const reasonCodeIconName = showReasonCode ? 'up' : 'down';
+
+  const renderItem = ({ item }: { item: string }) => {
+    return (
+      <View style={{ backgroundColor: '#FFFFFF' }}>
+        <View style={[styles.reasonItemStyle, { paddingBottom: 0 }]}>
+          <RadioButton
+            color={'#5B80F7'}
+            value={item}
+            status={cancelReason === item ? 'checked' : 'unchecked'}
+            onPress={() => {
+              setCancelReason(item);
+            }}
+          />
+          <Text
+            style={styles.reasonTextStyle}
+            onPress={() => {
+              setCancelReason(item);
+            }}
+          >
+            {item}
+          </Text>
+        </View>
+      </View>
+    );
+  };
+
+  const renderEventsItem = ({ item }: { item: string }) => {
+    return (
+      <View style={{ backgroundColor: '#FFFFFF' }}>
+        <View style={styles.reasonItemStyle}>
+          <RadioButton
+            color={'#5B80F7'}
+            value={item}
+            status={cancelEvent === item ? 'checked' : 'unchecked'}
+            onPress={() => {
+              setCancelEvent(item);
+            }}
+          />
+          <Text
+            style={styles.reasonTextStyle}
+            onPress={() => {
+              setCancelEvent(item);
+            }}
+          >
+            {item}
+          </Text>
+        </View>
+      </View>
+    );
+  };
+
+  useEffect(() => {
+    (async () => {
+      if (props.eventRows) {
+        const eventCode = EventCodeContainer.getEventCodeFromText(
+          cancelEvent,
+          props.eventRows
+        );
+        setCancelEventCode(eventCode);
+        const reasonCodes = await reasonsContainer.getReasonCodes(
+          props.applicableCodes || {},
+          eventCode
+        );
+        setReasonsRow(reasonCodes);
+
+        if (reasonCodes) {
+          const values: string[] = [];
+          for (let reasonCode of reasonCodes) {
+            values.push(reasonCode.description);
+          }
+          setReasonList(values);
+        }
+      }
+    })();
+  }, [cancelEvent]);
+
+  useEffect(() => {
+    if (reasonList.length) {
+      setShowEventCode(false);
+      if (!showReasonCode) setShowReasonCode(true);
+    }
+  }, [reasonList]);
+
+  return (
+    <View style={CommonStyles.mainContainer}>
+      <View style={{ flex: 1 }}>
+        {props?.cancellationEvents?.length ? (
+          <View style={showEventCode ? { flex: 1 } : {}}>
+            <TouchableOpacity
+              style={styles.codeHeaderStyle}
+              onPress={() => {
+                setShowEventCode(!showEventCode);
+              }}
+            >
+              <Text style={styles.codesHeaderTextStyle}>
+                {`${'Select Event'.toUpperCase()}`}
+              </Text>
+              <AntDesign
+                style={{ marginEnd: 10 }}
+                name={`${eventCodeIconName}`}
+                size={ICON_SIZE}
+                color="#3D445C"
+              />
+            </TouchableOpacity>
+            {showEventCode ? (
+              <FlatList
+                style={{
+                  flexGrow: 0,
+                }}
+                data={props.cancellationEvents}
+                renderItem={renderEventsItem}
+                keyExtractor={(item) => item}
+              />
+            ) : null}
+          </View>
+        ) : null}
+        {reasonList?.length > 0 ? (
+          <View style={showReasonCode ? { flex: 1 } : {}}>
+            <TouchableOpacity
+              style={styles.codeHeaderStyle}
+              onPress={() => {
+                setShowReasonCode(!showReasonCode);
+              }}
+            >
+              <Text style={styles.codesHeaderTextStyle}>
+                {`${'Select Reason'.toUpperCase()}`}
+              </Text>
+              <AntDesign
+                name={`${reasonCodeIconName}`}
+                size={ICON_SIZE}
+                color="#3D445C"
+                style={{ marginEnd: 10 }}
+              />
+            </TouchableOpacity>
+            {showReasonCode ? (
+              <FlatList
+                style={{
+                  flexGrow: 0,
+                }}
+                data={reasonList}
+                renderItem={renderItem}
+                keyExtractor={(item) => item}
+              />
+            ) : null}
+          </View>
+        ) : null}
+      </View>
+      <View style={{ justifyContent: 'flex-end', paddingBottom: 16 }}>
+        <Button
+          disabled={btnDisabled}
+          style={[
+            CommonStyles.nextButton,
+            { marginStart: 10, marginEnd: 10, marginBottom: 10, marginTop: 10 },
+          ]}
+          labelStyle={CommonStyles.nextButtonLabel}
+          mode={'contained'}
+          onPress={() => {
+            if (
+              (!props.cancellationEvents ||
+                props.cancellationEvents.length === 1 ||
+                !isEmptyOrBlank(cancelEvent)) &&
+              (!reasonList.length || !isEmptyOrBlank(cancelReason))
+            ) {
+              setBtnDisabled(true);
+              props.onSubmitET(cancelReason, cancelEventCode, reasonsRow);
+            } else {
+              if (Platform.OS === 'android') {
+                ToastAndroid.show('No reason selected', ToastAndroid.SHORT);
+              } else {
+                Alert.alert('No reason selected');
+              }
+            }
+          }}
+        >
+          Proceed
+        </Button>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  codeHeaderStyle: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    padding: 8,
+    paddingVertical: 12,
+  },
+  codesHeaderTextStyle: {
+    fontFamily:
+    Platform.OS === 'android'
+        ? Fonts.IBMPlexSans_400Regular
+        : 'IBMPlexSans-Regular',
+    fontSize: 14,
+    color: '#9D9D9D',
+    marginStart: 10,
+  },
+  reasonTextStyle: {
+    flex: 1,
+    flexWrap: 'wrap',
+    fontFamily:
+    Platform.OS === 'android'
+        ? Fonts.IBMPlexSans_400Regular
+        : 'IBMPlexSans-Regular',
+    fontStyle: 'normal',
+    fontSize: 14,
+    lineHeight: 21,
+    letterSpacing: 0.25,
+    textAlign: 'justify',
+    color: '#111111',
+  },
+  reasonItemStyle: {
+    flexDirection: 'row',
+    marginStart: 12,
+    marginEnd: 12,
+    paddingTop: 8,
+    paddingBottom: 8,
+    alignItems: 'center',
+  },
+  heading: {
+    marginTop: 30,
+    marginStart: 25,
+    fontSize: 14,
+    lineHeight: 21,
+    letterSpacing: 0.25,
+    fontFamily:
+    Platform.OS === 'android'
+        ? Fonts.IBMPlexSans_400Regular
+        : 'IBMPlexSans-Regular',
+    color: '#9D9D9D',
+  },
+});
+export default CancelET;

package/src/components/executiontasks/cancellation/CancellationSchema.ts

@@ -0,0 +1,30 @@
+/**
+ * List of reasons for cancellation
+ */
+import type {
+  EventsRow,
+  ReasonsRow,
+} from '../../../manager/syncmanager/DBConfig';
+import type {
+  ApplicableReasons,
+  BaseETResponse,
+} from '../../../models/execTasks/ETBaseModels';
+
+export type CancellationReasons = string[];
+
+export interface CancellationInput {
+  cancelEvent: string;
+  cancellationEvents?: CancellationReasons;
+  cancellationReasons?: CancellationReasons;
+  applicableCodes?: ApplicableReasons;
+  eventRows?: EventsRow[];
+  onSubmitET: (
+    reason: string,
+    event?: string,
+    reasonsRow?: ReasonsRow[]
+  ) => void;
+}
+
+export type CancellationOutput = BaseETResponse & {
+  remark: string;
+};

package/src/components/executiontasks/captureInput/CaptureInputSchema.ts

@@ -0,0 +1,52 @@
+/**
+ * Input data type
+ */
+import type {
+  BaseETRequest,
+  BaseETResponse,
+} from '../../../models/execTasks/ETBaseModels';
+
+export type CaptureTextOutput = BaseETResponse & {
+  /**
+   * Value entered by user
+   */
+  value?: string | number;
+  /**
+   * Boolean to denote if value was validate successfully
+   */
+  validated?: boolean;
+  /**
+   * Number of attempts for this ET
+   */
+  attemptCount?: number;
+  /**
+   * Meta data related to execution of task
+   */
+};
+
+/**
+ * Input data type
+ */
+export type InputDataType = 'string' | 'number';
+/**
+ * Regex to validate input strings
+ */
+export type ValidationRegex = string;
+/**
+ * Title of instruction
+ */
+export type Title = string;
+/**
+ * Message of instruction
+ */
+export type Message = string;
+/**
+ * Can go back
+ */
+export type CanGoBack = boolean;
+
+export type CaptureTextInput = BaseETRequest & {
+  inputType: InputDataType;
+  validationRegex: ValidationRegex;
+  onSubmitET: (value: CaptureTextOutput) => void;
+};

package/src/components/executiontasks/captureInput/CaptureText.tsx

@@ -0,0 +1,172 @@
+import type { CaptureTextInput } from './CaptureInputSchema';
+import { View, Text } from 'react-native';
+import { Button, TextInput, Modal, Portal, Provider } from 'react-native-paper';
+import {
+  CommonStyles,
+  deliverETStyles,
+} from '../../../styles/executionTasks/CommonStyles';
+import React, { useState, useLayoutEffect } from 'react';
+import { getBaseETResponse } from '../../../utils/ExecTaskUtils';
+import { getEventCodeByET } from '../../../manager/dispatchCodes/EventCodeContainer';
+import {
+  EntityCode,
+  ExecutionTaskID,
+} from '../../../models/execTasks/ETConfig';
+import { checkForValidation } from './utils';
+import Icon from 'react-native-vector-icons/MaterialIcons';
+import { GO_BACK_EVENT_CODE } from '../../../constants/constants';
+import { hasGoBackConnector } from '../../../components/utils';
+import GoBackModal from '../../../components/widgets/GoBackModal';
+import { useFocusEffect } from '@react-navigation/native';
+import { BackHandler } from 'react-native';
+
+const CaptureText = (props: CaptureTextInput) => {
+  const [showBackModal, setShowBackModal] = useState(false);
+
+  useLayoutEffect(() => {
+    props.navigation.setOptions({
+      title: props.title,
+      headerLeft: () => {
+        return (
+          <Icon
+            onPress={() => {
+              if (
+                props.taskMeta?.enableGoBack &&
+                hasGoBackConnector(props.applicableReasons)
+              )
+                setShowBackModal(true);
+              else props.navigation.goBack();
+            }}
+            name="arrow-back"
+            color={'black'}
+            size={25}
+            style={{
+              paddingRight: 15,
+              paddingTop: 5,
+            }}
+          />
+        );
+      },
+    });
+  }, [props.navigation, props.title]);
+
+  // Handle back-button click when scanList was being viewed
+  useFocusEffect(
+    React.useCallback(() => {
+      const onBackPress = () => {
+        if (
+          props.taskMeta?.enableGoBack &&
+          hasGoBackConnector(props.applicableReasons)
+        ) {
+          setShowBackModal(true);
+          return true;
+        } else {
+          props.navigation.goBack();
+          return true;
+        }
+      };
+      BackHandler.addEventListener('hardwareBackPress', onBackPress);
+      return () =>
+        BackHandler.removeEventListener('hardwareBackPress', onBackPress);
+    }, [])
+  );
+
+  const [input, setInput] = useState('');
+  const [disableNext, setDisableNext] = useState(false);
+
+  const renderModal = () => {
+    return (
+      <GoBackModal
+        showModal={showBackModal}
+        setShowModal={setShowBackModal}
+        onSuccess={async () => {
+          props.onSubmitET({
+            ...(await getBaseETResponse(
+              EntityCode.CAPTURE_INPUT,
+              false,
+              GO_BACK_EVENT_CODE,
+              '',
+              props.mergedObjectiveId,
+              ExecutionTaskID.CAPTURE_INPUT
+            )),
+          });
+          setShowBackModal(false);
+        }}
+        onFailure={() => setShowBackModal(false)}
+      />
+    );
+  };
+
+  return (
+    <Provider>
+      {renderModal()}
+      <View style={CommonStyles.mainContainer}>
+        <TextInput
+          multiline={false}
+          autoComplete={'off'}
+          style={deliverETStyles.input}
+          label="Enter input"
+          value={input}
+          mode={'outlined'}
+          onChangeText={(text) => setInput(text)}
+        />
+        <View style={deliverETStyles.footerButtonStyles}>
+          <Button
+            labelStyle={CommonStyles.cancelButtonLabel}
+            style={CommonStyles.cancelButton}
+            mode={'outlined'}
+            onPress={async () => {
+              props.onSubmitET({
+                ...(await getBaseETResponse(
+                  EntityCode.CAPTURE_INPUT,
+                  false,
+                  getEventCodeByET(
+                    ExecutionTaskID.CAPTURE_INPUT,
+                    false,
+                    props.applicableReasons?.failure
+                  ),
+                  '',
+                  props.mergedObjectiveId,
+                  ExecutionTaskID.CAPTURE_INPUT
+                )),
+              });
+            }}
+          >
+            Cancel
+          </Button>
+          <Button
+            disabled={disableNext}
+            style={CommonStyles.nextButton}
+            labelStyle={CommonStyles.nextButtonLabel}
+            mode={'contained'}
+            onPress={async () => {
+              setDisableNext(true);
+              props.onSubmitET({
+                ...(await getBaseETResponse(
+                  EntityCode.CAPTURE_INPUT,
+                  true,
+                  getEventCodeByET(
+                    ExecutionTaskID.CAPTURE_INPUT,
+                    true,
+                    props.applicableReasons?.success
+                  ),
+                  '',
+                  props.mergedObjectiveId,
+                  ExecutionTaskID.CAPTURE_INPUT
+                )),
+                value: input,
+                validated:
+                  (await checkForValidation(input, props.validationRegex)) ??
+                  false,
+                attemptCount: 0,
+              });
+            }}
+          >
+            Next
+          </Button>
+        </View>
+      </View>
+    </Provider>
+  );
+};
+export default CaptureText;

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

@@ -0,0 +1,9 @@
+export async function checkForValidation(
+  data: string,
+  regexRule: string | undefined
+) {
+  if (regexRule && typeof regexRule === 'string') {
+    const regex = new RegExp(regexRule);
+    return regex.test(data);
+  } else return false;
+}