@os1-platform/dispatch-mobile 2.1.21 → 2.1.23

package/src/components/executiontasks/ExecutionTasksIndex.ts

@@ -66,11 +66,16 @@ import SLDropCash from './dropCash/SLDropCash';
 import HttpRequestET from './httpRequest/HttpRequestET';
 import ScanET from './scan/ScanET';
 import ValidateOTPET from './validateOTP/ValidateOTPET';
+import CollectPaymentET from './collectPayment/CollectPayment';
 import type { ScannerInput, ScannerOutput } from './scan/ScanSchema';
 import type {
   ValidateOTPInput,
   ValidateOTPOutput,
 } from './validateOTP/ValidateOTPSchema';
+import type {
+  CollectPaymentInput,
+  CollectPaymentOutput,
+} from './collectPayment/CollectPaymentSchema';
 
 export type {
   CancellationInput,
@@ -110,6 +115,8 @@ export type {
   ScannerOutput,
   ValidateOTPInput,
   ValidateOTPOutput,
+  CollectPaymentInput,
+  CollectPaymentOutput,
 };
 
 export {
@@ -134,4 +141,5 @@ export {
   HttpRequestET,
   ScanET,
   ValidateOTPET,
+  CollectPaymentET,
 };

package/src/components/executiontasks/collectPayment/CollectPayment.tsx

@@ -0,0 +1,60 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import React, { useState } from 'react';
+import { View } from 'react-native';
+import {
+  CollectPaymentInput,
+  CollectPaymentOutput,
+  PAYMENT_SCREEN,
+} from './CollectPaymentSchema';
+import InitPayment from './components/InitPayment';
+import { Provider } from 'react-native-paper';
+import ProcessPayment from './components/ProcessPayment';
+import CompletePayment from './components/CompletePayment';
+import PaymentContactDetails from './components/PaymentContactDetails';
+
+const CollectPaymentET = (props: CollectPaymentInput) => {
+  const [moveToNextData, setMoveToNextData] = useState<
+    CollectPaymentOutput & {
+      screen: PAYMENT_SCREEN;
+      sourceScreen: PAYMENT_SCREEN;
+    }
+  >();
+
+  return (
+    <Provider>
+      <View style={{ flex: 1 }}>
+        {!moveToNextData || moveToNextData.screen === PAYMENT_SCREEN.INIT ? (
+          <InitPayment
+            {...props}
+            {...moveToNextData}
+            onSubmitET={async (etOutput) => props.onSubmitET(etOutput)}
+            next={(etOutput) => setMoveToNextData(etOutput)}
+          />
+        ) : moveToNextData.screen === PAYMENT_SCREEN.CONTACTS ? (
+          <PaymentContactDetails
+            {...props}
+            {...moveToNextData}
+            onSubmitET={async (etOutput) => props.onSubmitET(etOutput)}
+            next={(etOutput) => setMoveToNextData(etOutput)}
+          />
+        ) : moveToNextData.screen === PAYMENT_SCREEN.PROCESS ? (
+          <ProcessPayment
+            {...props}
+            {...moveToNextData}
+            onSubmitET={async (etOutput) => props.onSubmitET(etOutput)}
+            next={(etOutput) => setMoveToNextData(etOutput)}
+          />
+        ) : moveToNextData.screen === PAYMENT_SCREEN.COMPLETE ? (
+          <CompletePayment
+            {...props}
+            {...moveToNextData}
+            onSubmitET={async (etOutput) => props.onSubmitET(etOutput)}
+            next={(etOutput) => setMoveToNextData(etOutput)}
+          />
+        ) : null}
+      </View>
+    </Provider>
+  );
+};
+
+export default CollectPaymentET;

package/src/components/executiontasks/collectPayment/CollectPaymentSchema.ts

@@ -0,0 +1,182 @@
+import {
+  BaseETRequest,
+  BaseETResponse,
+} from '../../../models/execTasks/ETBaseModels';
+import {
+  HTTPMethod,
+  HTTPRequestBody,
+} from '../httpRequest/HttpRequestETSchema';
+import { Headers, PathParams, QueryParams } from '../../../utils/ApiUtils';
+
+export type AllowedModes = 'CASH' | 'QR_CODE' | 'PAYMENT_LINK' | 'ONLINE';
+export type OnsiteLink = 'Phone Number' | 'Email';
+
+export interface ETAmount {
+  value: number;
+  currencyCode: string;
+  // minorUnit?: number;
+}
+
+export interface API {
+  uri: string;
+  timeout?: number;
+  httpMethod: HTTPMethod;
+  headers?: Headers[];
+  requestBody?: HTTPRequestBody;
+  queryParams?: QueryParams[];
+  pathParams?: PathParams[];
+  responseJsonLogic: object;
+  errorJsonLogic: object;
+}
+
+export type CollectPaymentInput = BaseETRequest & {
+  // amount: ETAmount;
+  allowedModes: AllowedModes[];
+  plModes?: string[];
+  expectedAmount: number;
+  onsiteLinkSharing?: OnsiteLink[];
+  onSubmitET: (output: CollectPaymentOutput) => void;
+  next: (
+    output: CollectPaymentOutput & {
+      screen: PAYMENT_SCREEN;
+      contactDetails?: string;
+      sourceScreen: PAYMENT_SCREEN;
+    }
+  ) => void;
+  screen: PAYMENT_SCREEN;
+  sourceScreen: PAYMENT_SCREEN;
+};
+
+export interface ProcessPaymentInput {
+  paymentMode: AllowedModes;
+  contactDetails?: string;
+}
+
+export interface CompletePaymentInput {
+  paymentMode: AllowedModes;
+}
+
+export type CollectPaymentOutput = BaseETResponse & {
+  refId: string;
+  collectedAmount: ETAmount;
+  paymentMeta?: {};
+  paymentMode: AllowedModes;
+};
+
+export interface QrResponse {
+  data: {
+    qrCode?: string;
+    txnId?: string;
+    paymentCompleted?: boolean;
+    status?: STATUS;
+  };
+}
+
+export interface QR_REQUEST_BODY {
+  refId: string;
+  appAbbr: string;
+  money: {
+    amount: number;
+    currency: string;
+  };
+  userInfo?: {
+    phone?: {
+      countryCode: string;
+      mobileNumber: string;
+    };
+  };
+  pgConfigId?: string;
+  description?: string;
+  meta?: { [key: string]: any };
+}
+
+export interface PaymentStatusResponse {
+  data: {
+    meta?: { totalCount?: number };
+    transactions?: {
+      refId: string;
+      status: STATUS;
+      subStatus: SUB_STATUS;
+      money: {
+        amount: number;
+        currency: string;
+      };
+      txnId: string;
+      txnType: TRANSACTION_TYPE;
+      appAbbr: string;
+    }[];
+  };
+}
+
+export interface PaymentLinkResponse {
+  txnId: string;
+  refId: string;
+  status?: STATUS;
+}
+
+export interface notificationPaymentStatus {
+  refId: string;
+  status: STATUS;
+}
+
+export enum STATUS {
+  INITIATED = 'INITIATED',
+  FAILED = 'FAILED',
+  SUCCESS = 'SUCCESS',
+}
+
+export enum SUB_STATUS {
+  completed = 'completed',
+  expired = 'expired',
+  created = 'created',
+  plFailed = 'plFailed',
+  qrFailed = 'qrFailed',
+  paymentFailed = 'paymentFailed',
+  closed = 'closed',
+}
+
+export enum PAYMENT_SCREEN {
+  INIT = 'INIT',
+  CONTACTS = 'CONTACTS',
+  PROCESS = 'PROCESS',
+  COMPLETE = 'COMPLETE',
+}
+
+export interface sharedPrefPaymentDataInterface {
+  paymentMode: AllowedModes;
+  amount: ETAmount;
+  // refId: string;
+  moIds: string[];
+  previousSelection?: AllowedModes[];
+}
+
+export interface PaymentEventDataInterface {
+  refId: string;
+  money: {
+    amount: number;
+    currency: string;
+  };
+  contactDetails?: string;
+  paymentLink?: string;
+}
+
+export interface PaymentConfigResponse {
+  data: {
+    configDetails: {
+      tenantId: string;
+      paymentMethods: PaymentMethods;
+      modesMapping: object;
+    }[];
+  };
+}
+
+export interface PaymentMethods {
+  QR: boolean;
+  paymentLink: boolean;
+  modes?: object;
+}
+
+export enum TRANSACTION_TYPE {
+  LINK = 'link',
+  QRCODE = 'qrCode',
+}

package/src/components/executiontasks/collectPayment/PaymentStyles.ts

@@ -0,0 +1,102 @@
+import { StyleSheet, Platform } from 'react-native';
+import { Fonts } from '../../../styles/executionTasks/CommonStyles';
+
+export const PaymentStyles = StyleSheet.create({
+  amountStyle: {
+    fontSize: 18,
+    fontWeight: '600',
+    fontStyle: 'normal',
+    // backgroundColor: 'white',
+    textAlign: 'center',
+    alignItems: 'center',
+    paddingTop: 25,
+    paddingBottom: 25,
+    fontFamily: Platform.OS === 'android'
+    ? Fonts.IBMPlexSans_600SemiBold
+    : 'IBMPlexSans-SemiBold',
+  },
+  messageStyle: {
+    fontFamily: Platform.OS === 'android'
+    ? Fonts.IBMPlexSans_400Regular
+    : 'IBMPlexSans-Regular',
+    backgroundColor: '#FFFFFF',
+    color: '#111111',
+    padding: 20,
+    fontStyle: 'normal',
+    fontWeight: 'normal',
+    fontSize: 14,
+  },
+  textStyle1: {
+    fontFamily: Platform.OS === 'android'
+    ? Fonts.IBMPlexSans_400Regular
+    : 'IBMPlexSans-Regular',
+    marginTop: 20,
+    marginStart: 20,
+    marginEnd: 20,
+    color: '#9D9D9D',
+    fontStyle: 'normal',
+    fontWeight: 'normal',
+    fontSize: 14,
+  },
+  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',
+    paddingTop: 5,
+  },
+
+  reasonItemStyle: {
+    flexDirection: 'row',
+    paddingTop: 10,
+    paddingStart: 20,
+    paddingEnd: 20,
+    backgroundColor: 'white',
+  },
+  heading: {
+    marginTop: 30,
+    marginStart: 25,
+    fontSize: 14,
+    lineHeight: 21,
+    letterSpacing: 0.25,
+    fontFamily: 'IBMPlexSans_400Regular',
+    color: '#9D9D9D',
+  },
+  item: {
+    margin: 10,
+    padding: 15,
+    borderWidth: 0.2,
+  },
+  btn: {
+    width: 240,
+    borderRadius: 4,
+    backgroundColor: '#62d1bc',
+    paddingHorizontal: 24,
+    paddingVertical: 12,
+    marginVertical: 8,
+  },
+
+  loader: { flex: 1, justifyContent: 'center', alignItems: 'center' },
+  flexCenter: {
+    width: 300,
+    height: 200,
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  paymentWaitIcon: {
+    backgroundColor: '#ECF0FF',
+    width: 113,
+    height: 113,
+    borderRadius: 60,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+});

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

@@ -0,0 +1,200 @@
+import Logger, { LOG_TYPE } from '../../../utils/Logger';
+import { APIData, getApiResponse } from '../../../utils/ApiUtils';
+import * as jsonLogic from 'json-logic-js';
+import {
+  API,
+  AllowedModes,
+  TRANSACTION_TYPE,
+  sharedPrefPaymentDataInterface,
+} from './CollectPaymentSchema';
+import Storage from '../../../utils/storage';
+import { ENV } from '../../../models/sdk';
+
+export const PAYMENT_SHARED_PREF_KEY = '@Payment_';
+export const PAYMENT_SELECTION_SHARED_PREF_KEY = '@Payment_Selection_';
+
+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);
+}
+
+export function getPaymentType(txnType: TRANSACTION_TYPE): AllowedModes | null {
+  if (txnType === TRANSACTION_TYPE.LINK) {
+    return 'PAYMENT_LINK';
+  } else if (txnType === TRANSACTION_TYPE.QRCODE) {
+    return 'QR_CODE';
+  } else return null;
+}
+
+export function getPaymentLink(
+  env: ENV,
+  tenant: string,
+  appAbbr: string,
+  refId: string
+) {
+  let baseDomain = 'dev.os1.delhivery.com';
+  switch (env) {
+    case 'SHARED_P1':
+    case 'DLV_INDIA_P2':
+      baseDomain = 'os1.app';
+      break;
+    case 'SANDBOX':
+      baseDomain = 'sandbox.os1.app';
+      break;
+    case 'DEV':
+    default:
+      baseDomain = 'dev.os1.delhivery.com';
+      break;
+  }
+  return `https://${tenant}.${baseDomain}/pay/${appAbbr}/${refId}`;
+}
+
+export const apiExecution = async (api: API) => {
+  try {
+    const apiData: APIData = {
+      errorJsonPath: '',
+      responseJsonPath: '',
+      uri: api.uri,
+      httpMethod: api.httpMethod,
+      timeout: api.timeout,
+    };
+    if (api.headers) {
+      apiData.headers = api.headers;
+    }
+    if (api.requestBody) {
+      apiData.requestBody = api.requestBody;
+    }
+    if (api.pathParams) {
+      apiData.pathParams = api.pathParams;
+    }
+    if (api.queryParams) {
+      apiData.queryParams = api.queryParams;
+    }
+
+    const apiResponse = await getApiResponse(apiData);
+    console.log('apiResponse: ', JSON.stringify(apiResponse.data));
+
+    return jsonLogic.apply(
+      <jsonLogic.RulesLogic>api.responseJsonLogic,
+      apiResponse.data
+    );
+  } catch (error: any) {
+    console.log('error: ', error);
+    console.log('error: ', JSON.stringify(error));
+
+    Logger.getInstance().logEvent(
+      '~ api triggered ',
+      error.message,
+      LOG_TYPE.SDK_ERROR
+    );
+    // return false;
+  }
+};
+
+export async function getPaymentDataMO(
+  mergedObjectiveIds: string[],
+  refId: string,
+  storage: Storage
+) {
+  /**
+   * Can use bulk get here, but probability of getting the item on first render is more compared to
+   * fetching all the data and finding a single moId
+   */
+  /* for await (const moId of mergedObjectiveId) {
+    const moIdPaymentData = await storage.getSharedItem(
+      PAYMENT_SHARED_PREF_KEY + moId
+    );
+    if (moIdPaymentData) {
+      const parsedPaymentData: sharedPrefPaymentDataInterface =
+        JSON.parse(moIdPaymentData);
+      if (parsedPaymentData.refId === refId) {
+        return parsedPaymentData;
+      }
+    }
+  } */
+
+  const moIdPaymentData = await storage.getSharedItem(
+    PAYMENT_SHARED_PREF_KEY + refId
+  );
+  if (moIdPaymentData) {
+    const parsedPaymentData: sharedPrefPaymentDataInterface =
+      JSON.parse(moIdPaymentData);
+    if (
+      parsedPaymentData.moIds.some((value) =>
+        mergedObjectiveIds.includes(value)
+      )
+    ) {
+      return parsedPaymentData;
+    }
+  }
+  return null;
+}
+
+export async function setSharedPrefPaymentData(
+  refId: string,
+  // moIds: string[],
+  payload: sharedPrefPaymentDataInterface,
+  storage: Storage
+) {
+  await storage.setSharedItem(
+    PAYMENT_SHARED_PREF_KEY + refId,
+    JSON.stringify(payload)
+  );
+  /* let finalPayload: { key: string; value: string }[] = [];
+  for (const moId of moIds) {
+    finalPayload.push({
+      key: PAYMENT_SHARED_PREF_KEY + moId,
+      value: JSON.stringify(payload),
+    });
+  }
+  await storage.setSharedItems(finalPayload); */
+}
+
+export async function getSharedPrefPaymentSelection(
+  refId: string,
+  storage: Storage
+): Promise<AllowedModes[] | null> {
+  let prevSelection = await storage.getSharedItem(
+    PAYMENT_SELECTION_SHARED_PREF_KEY + refId
+  );
+  if (prevSelection) {
+    return JSON.parse(prevSelection);
+  }
+
+  return null;
+}
+
+export async function setSharedPrefPaymentSelection(
+  refId: string,
+  mode: AllowedModes,
+  storage: Storage
+) {
+  let updatedPayload = [mode];
+  let prevSelection = await getSharedPrefPaymentSelection(refId, storage);
+  if (prevSelection) {
+    updatedPayload = [...new Set([...prevSelection, mode])];
+  }
+
+  await storage.setSharedItem(
+    PAYMENT_SELECTION_SHARED_PREF_KEY + refId,
+    JSON.stringify(updatedPayload)
+  );
+}
+
+export async function removeSharedPrefPaymentData(
+  refId: string,
+  storage: Storage
+) {
+  await storage.removeSharedItem(PAYMENT_SHARED_PREF_KEY + refId);
+}
+
+export const formatTime = (time: number) => {
+  const minutes = Math.floor(time / 60);
+  const remainingSeconds = time % 60;
+  return `${
+    minutes > 0 ? String(minutes).padStart(2, '') + ' min' : ''
+  } ${String(remainingSeconds).padStart(2, '')} sec`;
+};