@tap-payments/auth-jsconnect 1.0.100-test → 1.1.0-test

package/build/@types/form.d.ts

@@ -49,6 +49,8 @@ export declare type BankFormValues = {
     iban: string;
     beneficiaryName: string;
     bankName: string;
+    bankStatementId: string;
+    uploading?: boolean;
     confirmPolicy: boolean;
 };
 export declare type TaxFormValues = {

package/build/api/entity.d.ts

@@ -37,11 +37,18 @@ export declare type EntityBankUpdateBody = {
     step_name: string;
     encryption_contract?: Array<string>;
 };
+export declare type UploadFileBody = {
+    file_link_create: boolean;
+    file: File | null;
+    title: string | undefined;
+    purpose: string;
+};
 declare const entityService: {
     createEntityInfo: ({ id, ...data }: EntityInfoBody, config?: AxiosRequestConfig) => Promise<import("axios").AxiosResponse<any, any>>;
     updateEntityInfo: ({ id, ...data }: EntityInfoBody, config?: AxiosRequestConfig) => Promise<import("axios").AxiosResponse<any, any>>;
     createBankAccount: (data: EntityBankUpdateBody, config?: AxiosRequestConfig) => Promise<import("axios").AxiosResponse<any, any>>;
     retrieveEntityInfo: (entity_id: string, config?: AxiosRequestConfig) => Promise<import("axios").AxiosResponse<any, any>>;
     updateIndividualInfo: ({ id, ...data }: EntityInfoBody) => Promise<any>;
+    uploadFileInfo: (data: UploadFileBody) => Promise<any>;
 };
 export { entityService };

package/build/api/entity.js

@@ -25,6 +25,14 @@ var updateEntityInfo = function (_a, config) {
 var createBankAccount = function (data, config) {
     return instance.post("".concat(ENDPOINT_PATHS.BANK), data, config);
 };
+var uploadFileInfo = function (data) {
+    return httpClient({
+        method: 'post',
+        url: "".concat(ENDPOINT_PATHS.FILES_PATH),
+        data: data,
+        headers: { 'Content-Type': 'multipart/form-data' }
+    });
+};
 var updateIndividualInfo = function (_a) {
     var id = _a.id, data = __rest(_a, ["id"]);
     return httpClient({
@@ -38,6 +46,7 @@ var entityService = {
     updateEntityInfo: updateEntityInfo,
     createBankAccount: createBankAccount,
     retrieveEntityInfo: retrieveEntityInfo,
-    updateIndividualInfo: updateIndividualInfo
+    updateIndividualInfo: updateIndividualInfo,
+    uploadFileInfo: uploadFileInfo
 };
 export { entityService };

package/build/api/index.d.ts

@@ -36,6 +36,7 @@ declare const API: {
         createBankAccount: (data: EntityBankUpdateBody, config?: import("axios").AxiosRequestConfig<any> | undefined) => Promise<import("axios").AxiosResponse<any, any>>;
         retrieveEntityInfo: (entity_id: string, config?: import("axios").AxiosRequestConfig<any> | undefined) => Promise<import("axios").AxiosResponse<any, any>>;
         updateIndividualInfo: ({ id, ...data }: EntityInfoBody) => Promise<any>;
+        uploadFileInfo: (data: import("./entity").UploadFileBody) => Promise<any>;
     };
     availabilityServices: {
         checkEmail: (data: CheckEmailBody, config?: import("axios").AxiosRequestConfig<any> | undefined) => Promise<import("axios").AxiosResponse<any, any>>;

package/build/components/FileInput/DragAndDrop.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface DragAndDropProps {
+    title: string;
+    onSuccess?: (files: File) => void;
+}
+declare const DragAndDrop: ({ title, onSuccess }: DragAndDropProps) => JSX.Element;
+export default DragAndDrop;

package/build/components/FileInput/DragAndDrop.js

@@ -0,0 +1,39 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Box from '@mui/material/Box';
+import { alpha, styled } from '@mui/material/styles';
+import Input from '../Input';
+import Text from '../Text';
+import { useDropzone } from 'react-dropzone';
+var BoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: alpha(theme.palette.text.primary, 0.6), fontWeight: theme.typography.fontWeightRegular, background: theme.palette.background.default, padding: theme.spacing(1.5, 2.5, 1.5), border: "1px dashed ".concat(alpha(theme.palette.divider, 0.8)), width: '50%', cursor: 'pointer' }));
+});
+var UploadInputStyled = styled(Input)(function () { return ({
+    display: 'none'
+}); });
+var DragAndDrop = function (_a) {
+    var title = _a.title, onSuccess = _a.onSuccess;
+    var _b = useDropzone({
+        maxFiles: 1,
+        noKeyboard: true,
+        noClick: true,
+        multiple: false,
+        accept: { 'image/jpeg': ['.jpeg'], 'image/png': ['.png'], 'image/jpg': ['.jpg'], 'application/pdf': ['.pdf'] },
+        onDrop: function (files) {
+            onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(files === null || files === void 0 ? void 0 : files[0]);
+        }
+    }), getRootProps = _b.getRootProps, getInputProps = _b.getInputProps;
+    return (_jsxs(BoxStyled, __assign({}, getRootProps({ className: 'dropzone' }), { children: [_jsx(Text, __assign({ sx: { fontSize: '12px' } }, { children: title })), _jsx(UploadInputStyled, { inputProps: __assign({}, getInputProps()) })] })));
+};
+export default DragAndDrop;

package/build/components/FileInput/UploadInput.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface UploadInputProps {
+    title: string;
+    onChange: (file: File) => void;
+}
+declare const UploadInput: ({ title, onChange }: UploadInputProps) => JSX.Element;
+export default UploadInput;

package/build/components/FileInput/UploadInput.js

@@ -0,0 +1,38 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { styled } from '@mui/material/styles';
+import React from 'react';
+import Box from '@mui/material/Box';
+import Input from '../../components/Input';
+import Text from '../Text';
+var UploadInputStyled = styled(Input)(function () { return ({
+    display: 'none'
+}); });
+var UploadBoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({}, theme.typography.caption), { background: theme.palette.primary.main, color: theme.palette.common.white, fontWeight: theme.typography.fontWeightRegular, padding: theme.spacing(1.5, 2.5, 1.5), cursor: 'pointer', width: '50%' }));
+});
+var UploadInput = function (_a) {
+    var title = _a.title, onChange = _a.onChange;
+    var fileRef = React.useRef(null);
+    var openDeviceMedia = function () {
+        var _a;
+        (_a = fileRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    var onFileChange = function (event) {
+        if (event.target.files)
+            onChange === null || onChange === void 0 ? void 0 : onChange(event.target.files[0]);
+    };
+    return (_jsxs(UploadBoxStyled, __assign({ onClick: openDeviceMedia }, { children: [_jsx(Text, __assign({ sx: { fontSize: '12px' } }, { children: title })), _jsx(UploadInputStyled, { onChange: onFileChange, id: 'upload-file-input', inputRef: fileRef, type: 'file', inputProps: { accept: '.png,.jpg,.pdf,.jpeg' }, required: true })] })));
+};
+export default UploadInput;

package/build/components/FileInput/index.d.ts

@@ -0,0 +1,3 @@
+import UploadInput from './UploadInput';
+import DragAndDrop from './DragAndDrop';
+export { DragAndDrop, UploadInput };

package/build/components/FileInput/index.js

@@ -0,0 +1,3 @@
+import UploadInput from './UploadInput';
+import DragAndDrop from './DragAndDrop';
+export { DragAndDrop, UploadInput };

package/build/constants/api.d.ts

@@ -27,4 +27,5 @@ export declare const ENDPOINT_PATHS: {
     BRAND_LIST: string;
     OCCUPATION: string;
     INDIVIDUAL: string;
+    FILES_PATH: string;
 };

package/build/constants/api.js

@@ -26,6 +26,7 @@ var MONTHLY_INCOME_PATH = '/v2/monthlyIncome';
 var OCCUPATION_PATH = '/v2/occupation';
 var BRAND_LIST_PATH = '/brand/list';
 var FIREBASE_URL = 'https://goconnect-195cd-default-rtdb.asia-southeast1.firebasedatabase.app/locale.json';
+var FILES = '/files';
 export var ENDPOINT_PATHS = {
     SANDBOX_BASE_URL: SANDBOX_BASE_URL,
     PRODUCTION_BASE_URL: PRODUCTION_BASE_URL,
@@ -54,5 +55,6 @@ export var ENDPOINT_PATHS = {
     IBAN_BANK: IBAN_PATH,
     BRAND_LIST: BRAND_LIST_PATH,
     OCCUPATION: OCCUPATION_PATH,
-    INDIVIDUAL: INDIVIDUAL_PATH
+    INDIVIDUAL: INDIVIDUAL_PATH,
+    FILES_PATH: FILES
 };

package/build/constants/assets.d.ts

@@ -41,6 +41,7 @@ export declare const ICONS_NAMES: {
     MOBILE_ICON: string;
     SEARCH_ICON: string;
     SUCCESS_GIF: string;
+    DELETE_ICON: string;
     GMAIL_Filled_ICON: string;
     GMAIL_White_ICON: string;
     outlook_Filled_ICON: string;

package/build/constants/assets.js

@@ -41,6 +41,7 @@ export var ICONS_NAMES = {
     MOBILE_ICON: 'https://dash.b-cdn.net/icons/menu/mobile.svg',
     SEARCH_ICON: 'https://dash.b-cdn.net/icons/menu/search-icon.svg',
     SUCCESS_GIF: 'https://dash.b-cdn.net/icons/menu/success_icon.gif',
+    DELETE_ICON: 'https://dash.b-cdn.net/icons/menu/delete-icon.png',
     GMAIL_Filled_ICON: 'https://dash.b-cdn.net/icons/menu/Gmail-filled.svg',
     GMAIL_White_ICON: 'https://dash.b-cdn.net/icons/menu/Gmail-white.svg',
     outlook_Filled_ICON: 'https://dash.b-cdn.net/icons/menu/Outlook-filled.svg',

package/build/constants/validation.d.ts

@@ -5,6 +5,7 @@ export declare const MAX_IBAN_VALUE = 34;
 export declare const FL_NUMBER_LENGTH = 8;
 export declare const CR_NUMBER_LENGTH = 10;
 export declare const SAUDI_NUMBER_LENGTH = 9;
+export declare const MAX_FILE_SIZE = 1000000;
 export declare const REGEX_FULL_NAME: RegExp;
 export declare const REGEX_WEBSITE: RegExp;
 export declare const REGEX_BENEFICIARY_NAME: RegExp;

package/build/constants/validation.js

@@ -5,6 +5,7 @@ export var MAX_IBAN_VALUE = 34;
 export var FL_NUMBER_LENGTH = 8;
 export var CR_NUMBER_LENGTH = 10;
 export var SAUDI_NUMBER_LENGTH = 9;
+export var MAX_FILE_SIZE = 1000000;
 export var REGEX_FULL_NAME = /^([a-zA-Z]{2,}\s{1}[a-zA-Z]{1,}|[a-zA-Z]+\s{1}[a-zA-Z.-]{1,}\s{1}[a-zA-Z.-]{1,}\s{1}[a-zA-Z]{1,}|[a-zA-Z]+\s{1}[a-zA-Z.-]{1,}\s{1}[a-zA-Z]{1,})$/g;
 export var REGEX_WEBSITE = /^[a-zA-Z0-9]+([\-\.]{1}[a-zA-Z0-9]+)*\.[a-zA-Z]{2,63}(:[0-9]{1,5})?(\/.*)?$/;
 export var REGEX_BENEFICIARY_NAME = /^([\u0600-\u065F\u066A-\u06EF\u06FA-\u06FFa-zA-Z\s])*$/g;

package/build/features/app/bank/bankStore.d.ts

@@ -20,6 +20,7 @@ export declare const createBankAccount: import("@reduxjs/toolkit").AsyncThunk<{
     data: any;
     formData: BankFormValues;
 }, BankFormValues, {}>;
+export declare const uploadBankStatement: import("@reduxjs/toolkit").AsyncThunk<any, File, {}>;
 export declare const checkIbanBank: import("@reduxjs/toolkit").AsyncThunk<{
     data: any;
 }, {

package/build/features/app/bank/bankStore.js

@@ -169,7 +169,8 @@ export var createBankAccount = createAsyncThunk('createBankAccount', function (p
                     bank_account: {
                         iban: iban,
                         beneficiary_name: beneficiaryName,
-                        bank_name: bank_name
+                        bank_name: bank_name,
+                        bank_statement_file_id: params.bankStatementId
                     },
                     step_name: BANK_STEP_NAMES.BANK_INFO,
                     encryption_contract: ['bank_account.iban', 'bank_account.beneficiary_name', 'bank_account.bank_name']
@@ -185,6 +186,24 @@ export var createBankAccount = createAsyncThunk('createBankAccount', function (p
         }
     });
 }); });
+export var uploadBankStatement = createAsyncThunk('uploadBankStatement', function (file, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
+    var requestBody, data;
+    return __generator(this, function (_a) {
+        switch (_a.label) {
+            case 0:
+                requestBody = {
+                    file_link_create: true,
+                    title: file === null || file === void 0 ? void 0 : file.name,
+                    purpose: 'identity_document',
+                    file: file
+                };
+                return [4, API.entityService.uploadFileInfo(requestBody)];
+            case 1:
+                data = _a.sent();
+                return [2, data];
+        }
+    });
+}); });
 export var checkIbanBank = createAsyncThunk('checkIbanBank', function (_a) {
     var iban = _a.iban, cancelToken = _a.cancelToken, onSuccess = _a.onSuccess;
     return __awaiter(void 0, void 0, void 0, function () {
@@ -252,7 +271,9 @@ var initialState = {
             iban: '',
             beneficiaryName: '',
             bankName: '',
-            confirmPolicy: false
+            bankStatementId: '',
+            confirmPolicy: false,
+            uploading: false
         }
     }
 };
@@ -404,6 +425,20 @@ export var bankSlice = createSlice({
             if (action.error.message === 'Aborted')
                 return;
             state.error = action.error.message;
+        })
+            .addCase(uploadBankStatement.pending, function (state) {
+            state.data.bankData.uploading = true;
+            state.error = null;
+        })
+            .addCase(uploadBankStatement.fulfilled, function (state, action) {
+            state.data.bankData.uploading = false;
+            state.error = null;
+            var id = action.payload.id;
+            state.data.bankData.responseBody = { fileId: id };
+        })
+            .addCase(uploadBankStatement.rejected, function (state, action) {
+            state.data.bankData.uploading = false;
+            state.error = action.error.message;
         });
     }
 });

package/build/features/app/password/passwordStore.d.ts

@@ -47,7 +47,10 @@ export declare const resetPassword: import("@reduxjs/toolkit").AsyncThunk<{
         otp: string;
     };
 }, OTPFormValues, {}>;
-export declare const retrieveLead: import("@reduxjs/toolkit").AsyncThunk<any, void, {}>;
+export declare const retrieveLeadPassword: import("@reduxjs/toolkit").AsyncThunk<{
+    lead: any;
+    entity: any;
+}, void, {}>;
 declare type VerifyData = {
     token: string;
     operationType?: string;

package/build/features/app/password/passwordStore.js

@@ -277,23 +277,26 @@ export var resetPassword = createAsyncThunk('resetPassword', function (params, t
         }
     });
 }); });
-export var retrieveLead = createAsyncThunk('retrieveLeadPassword', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
-    var _a, password, settings, id, data;
-    var _b, _c, _d, _e;
-    return __generator(this, function (_f) {
-        switch (_f.label) {
+export var retrieveLeadPassword = createAsyncThunk('retrieveLeadPassword', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
+    var _a, password, settings, id, data, entityData;
+    var _b, _c, _d, _e, _f;
+    return __generator(this, function (_g) {
+        switch (_g.label) {
             case 0:
                 _a = thunkApi.getState(), password = _a.password, settings = _a.settings;
                 id = (password.data.verify.responseBody || { id: '' }).id;
                 return [4, API.leadService.retrieveLead(id)];
             case 1:
-                data = (_f.sent()).data;
-                if (!(data === null || data === void 0 ? void 0 : data.errors)) {
+                data = (_g.sent()).data;
+                return [4, API.entityService.retrieveEntityInfo((_b = data === null || data === void 0 ? void 0 : data.entity) === null || _b === void 0 ? void 0 : _b.id)];
+            case 2:
+                entityData = (_g.sent()).data;
+                if (!(data === null || data === void 0 ? void 0 : data.errors) || !(entityData === null || entityData === void 0 ? void 0 : entityData.errors)) {
                     thunkApi.dispatch(handleNextScreenStep());
-                    (_c = (_b = settings.data.appConfig).onStepCompleted) === null || _c === void 0 ? void 0 : _c.call(_b, settings.data.activeScreen.name, { id: id });
-                    (_e = (_d = settings.data.appConfig).onFlowCompleted) === null || _e === void 0 ? void 0 : _e.call(_d, { data: data });
+                    (_d = (_c = settings.data.appConfig).onStepCompleted) === null || _d === void 0 ? void 0 : _d.call(_c, settings.data.activeScreen.name, { id: id });
+                    (_f = (_e = settings.data.appConfig).onFlowCompleted) === null || _f === void 0 ? void 0 : _f.call(_e, { data: data });
                 }
-                return [2, data];
+                return [2, { lead: data, entity: entityData }];
         }
     });
 }); });
@@ -516,23 +519,23 @@ export var passwordSlice = createSlice({
             state.error = action.error.message;
             state.loading = false;
         })
-            .addCase(retrieveLead.fulfilled, function (state, action) {
-            var _a;
+            .addCase(retrieveLeadPassword.fulfilled, function (state, action) {
+            var _a, _b;
             state.loading = false;
             state.error = null;
-            var data = action.payload;
-            var description = (((_a = data === null || data === void 0 ? void 0 : data.errors) === null || _a === void 0 ? void 0 : _a[0]) || {}).description;
+            var _c = action.payload, lead = _c.lead, entity = _c.entity;
+            var description = (((_a = lead === null || lead === void 0 ? void 0 : lead.errors) === null || _a === void 0 ? void 0 : _a[0]) || ((_b = entity === null || entity === void 0 ? void 0 : entity.errors) === null || _b === void 0 ? void 0 : _b[0]) || {}).description;
             if (description) {
                 state.error = description;
                 return;
             }
-            state.data.verify.responseBody = __assign(__assign({}, state.data.verify.responseBody), data);
+            state.data.verify.responseBody = __assign(__assign(__assign({}, state.data.verify.responseBody), lead), entity);
         })
-            .addCase(retrieveLead.pending, function (state) {
+            .addCase(retrieveLeadPassword.pending, function (state) {
             state.loading = true;
             state.error = null;
         })
-            .addCase(retrieveLead.rejected, function (state, action) {
+            .addCase(retrieveLeadPassword.rejected, function (state, action) {
             state.loading = false;
             state.error = action.error.message;
         });

package/build/features/bank/screens/BankDetails/BankDetails.js

@@ -27,6 +27,7 @@ import { bankSelector, createBankAccount } from '../../../app/bank/bankStore';
 import Form from '../../../../components/Form';
 import { handleCurrentActiveScreen } from '../../../../app/settings';
 import ConfirmPolicy from './ConfirmPolicy';
+import BankStatement from './BankStatement';
 var FormStyled = styled(Form)(function () { return ({
     display: 'flex',
     flexDirection: 'column',
@@ -56,6 +57,6 @@ var BankDetails = function () {
         dispatch(handleCurrentActiveScreen('BANK_SUCCESS_FOUR_FLOWS_BUTTONS_STEP'));
     };
     var disabled = ibanChecking || !methods.formState.isValid;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, {}), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking }), _jsx(BankName, {}), _jsx(ConfirmPolicy, {}), _jsx(ButtonStyled, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(Beneficiary, {}), _jsx(IBAN, { fetchingIban: function (value) { return setIbanChecking(value); }, ibanChecking: ibanChecking }), _jsx(BankName, {}), _jsx(BankStatement, {}), _jsx(ConfirmPolicy, {}), _jsx(ButtonStyled, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, loading: loading, error: t(error || '') }, { children: t('confirm') }))] })) })) }));
 };
 export default BankDetails;

package/build/features/bank/screens/BankDetails/BankStatement.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const BankStatement: () => JSX.Element;
+export default BankStatement;

package/build/features/bank/screens/BankDetails/BankStatement.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { styled } from '@mui/material/styles';
+import { ScreenContainer } from '../../../../features/shared/Containers';
+import { useTranslation } from 'react-i18next';
+import { useController, useFormContext } from 'react-hook-form';
+import UploadFile from '../../../../features/shared/UploadFile';
+import { useAppDispatch, useAppSelector } from '../../../../hooks';
+import { bankSelector, uploadBankStatement } from '../../../../features/app/bank/bankStore';
+var FeatureStyled = styled(ScreenContainer)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        marginBlockStart: theme.spacing(3)
+    });
+});
+var BankStatement = function () {
+    var _a, _b;
+    var dispatch = useAppDispatch();
+    var data = useAppSelector(bankSelector).data;
+    var t = useTranslation().t;
+    var control = useFormContext().control;
+    var bankStatementControl = useController({ name: 'bankStatementId', control: control });
+    var error = (_a = bankStatementControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message;
+    var uploading = data.bankData.uploading;
+    var handleBankStatementChange = function (file) {
+        dispatch(uploadBankStatement(file));
+    };
+    var handleReset = function () {
+        bankStatementControl.field.onChange('');
+    };
+    React.useEffect(function () {
+        var _a, _b;
+        if ((_a = data.bankData.responseBody) === null || _a === void 0 ? void 0 : _a.fileId)
+            bankStatementControl.field.onChange((_b = data.bankData.responseBody) === null || _b === void 0 ? void 0 : _b.fileId);
+    }, [(_b = data.bankData.responseBody) === null || _b === void 0 ? void 0 : _b.fileId]);
+    return (_jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_bank_statement'), dragTitle: t('drag_and_drop'), uploadTitle: t('title_upload_file'), onFileUploaded: handleBankStatementChange, loading: uploading, onReset: handleReset, error: error && t(error) }) }));
+};
+export default BankStatement;

package/build/features/bank/screens/BankDetails/validation.d.ts

@@ -3,15 +3,18 @@ export declare const BankValidation: yup.ObjectSchema<import("yup/lib/object").A
     iban: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     beneficiaryName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    bankStatementId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
 }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     iban: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     beneficiaryName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    bankStatementId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
 }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     iban: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     bankName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     beneficiaryName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
+    bankStatementId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     confirmPolicy: yup.BooleanSchema<boolean | undefined, import("yup/lib/types").AnyObject, true>;
 }>>>;

package/build/features/bank/screens/BankDetails/validation.js

@@ -12,5 +12,6 @@ export var BankValidation = yup.object().shape({
         .string()
         .matches(REGEX_BENEFICIARY_NAME, 'beneficiary_name_invalid')
         .required('beneficiary_name_required'),
+    bankStatementId: yup.string().optional(),
     confirmPolicy: yup.boolean().required('alert_bank_confirm').isTrue('alert_bank_confirm')
 });

package/build/features/password/screens/Success/Success.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { updateLeadSuccess, passwordSelector, retrieveLead } from '../../../app/password/passwordStore';
+import { updateLeadSuccess, passwordSelector, retrieveLeadPassword } from '../../../app/password/passwordStore';
 import SuccessScreen from '../../../shared/SuccessScreen';
 import { PASSWORD_OPERATION_TYPE } from '../../../../constants';
 var Success = function (_a) {
@@ -12,7 +12,7 @@ var Success = function (_a) {
     var operationType = data.verify.operationType;
     var onSuccess = function () {
         if (operationType === PASSWORD_OPERATION_TYPE.RESET_PASSWORD) {
-            dispatch(retrieveLead());
+            dispatch(retrieveLeadPassword());
             return;
         }
         dispatch(updateLeadSuccess());

package/build/features/shared/UploadFile/UploadFile.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+export declare const InputContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material/styles").Theme> & {
+    children?: React.ReactNode;
+    component?: React.ElementType<any> | undefined;
+    ref?: React.Ref<unknown> | undefined;
+    sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
+} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | ("border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "top" | "right" | "bottom" | "left" | "boxShadow" | "width" | "maxWidth" | "minWidth" | "height" | "maxHeight" | "minHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "textTransform") | "ref" | "children" | "component" | "sx"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+interface UploadFileProps {
+    label: string;
+    required?: boolean;
+    dragTitle: string;
+    uploadTitle: string;
+    error?: string;
+    loading?: boolean;
+    onFileUploaded: (file: File) => void;
+    onReset: () => void;
+}
+declare const UploadFile: ({ label, required, dragTitle, uploadTitle, loading, error, onFileUploaded, onReset }: UploadFileProps) => JSX.Element;
+export default UploadFile;

package/build/features/shared/UploadFile/UploadFile.js

@@ -0,0 +1,77 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { styled } from '@mui/material/styles';
+import { ScreenContainer } from '../../shared/Containers';
+import Box from '@mui/material/Box';
+import { InputLabelStyled } from '../../shared/Input/Input';
+import Mandatory from '../../shared/Mandatory';
+import { DragAndDrop, UploadInput } from '../../../components/FileInput';
+import Collapse from '../../../components/Collapse';
+import Warning from '../../../components/Warning';
+import Icon from '../../../components/Icon';
+import { ICONS_NAMES } from '../../../constants';
+import { useTranslation } from 'react-i18next';
+import Loader from '../../../components/Loader';
+var FeatureStyled = styled(ScreenContainer)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        marginBlockStart: theme.spacing(0)
+    });
+});
+var LabelContainerStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        justifyContent: 'flex-start',
+        padding: theme.spacing(0, 2.5, 1.25, 2.5)
+    });
+});
+var BoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({ direction: theme.direction }, theme.typography.subtitle2), { color: theme.palette.primary.main, fontWeight: theme.typography.fontWeightBold, background: theme.palette.background.default, padding: theme.spacing(1.5, 2.5, 1.5), width: '85%' }));
+});
+var UploadBoxStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return (__assign(__assign({}, theme.typography.caption), { background: theme.palette.primary.main, color: theme.palette.common.white, fontWeight: theme.typography.fontWeightRegular, padding: theme.spacing(0.75, 1.75, 0), cursor: 'pointer', width: '15%', display: 'flex', justifyContent: 'center' }));
+});
+var IconStyled = styled(Icon)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        marginBlockStart: theme.spacing(0),
+        width: theme.spacing(3.5),
+        height: theme.spacing(3.5)
+    });
+});
+export var InputContainerStyled = styled(Box)(function (_a) {
+    var theme = _a.theme;
+    return ({
+        display: 'flex',
+        width: '100%'
+    });
+});
+var UploadFile = function (_a) {
+    var label = _a.label, required = _a.required, dragTitle = _a.dragTitle, uploadTitle = _a.uploadTitle, loading = _a.loading, error = _a.error, onFileUploaded = _a.onFileUploaded, onReset = _a.onReset;
+    var _b = React.useState(''), fileName = _b[0], setFileName = _b[1];
+    var t = useTranslation().t;
+    var handleFileChange = function (file) {
+        setFileName(file === null || file === void 0 ? void 0 : file.name);
+        onFileUploaded === null || onFileUploaded === void 0 ? void 0 : onFileUploaded(file);
+    };
+    var handleReset = function () {
+        setFileName('');
+        onReset === null || onReset === void 0 ? void 0 : onReset();
+    };
+    return (_jsxs(FeatureStyled, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: label }), required && _jsx(Mandatory, {})] }), _jsx(Collapse, __assign({ in: !fileName }, { children: _jsxs(InputContainerStyled, { children: [_jsx(DragAndDrop, { title: dragTitle, onSuccess: handleFileChange }), _jsx(UploadInput, { title: uploadTitle, onChange: handleFileChange })] }) })), _jsx(Collapse, __assign({ in: !!fileName }, { children: _jsxs(InputContainerStyled, { children: [_jsx(BoxStyled, { children: loading ? t('loading_bank_statement') : fileName }), _jsxs(UploadBoxStyled, __assign({ onClick: handleReset }, { children: [_jsx(Collapse, __assign({ in: !loading }, { children: _jsx(IconStyled, { src: ICONS_NAMES.DELETE_ICON }) })), _jsx(Collapse, __assign({ in: loading }, { children: _jsx(Loader, { innerColor: 'white', outerColor: 'white', toggleAnimation: true, style: { width: 30, height: 30 }, svgStyle: { width: 30, height: 30 } }) }))] }))] }) })), _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsx(Warning, __assign({ warningType: 'alert' }, { children: error })) }))] }));
+};
+export default UploadFile;

package/build/features/shared/UploadFile/index.d.ts

@@ -0,0 +1,2 @@
+import UploadFile from './UploadFile';
+export default UploadFile;

package/build/features/shared/UploadFile/index.js

@@ -0,0 +1,2 @@
+import UploadFile from './UploadFile';
+export default UploadFile;

package/package.json

@@ -1,127 +1,128 @@
-{
-	"name": "@tap-payments/auth-jsconnect",
-	"version": "1.0.100-test",
-	"description": "connect library, auth",
-	"private": false,
-	"main": "build/index.js",
-	"module": "build/index.js",
-	"types": "build/index.d.ts",
-	"files": [
-		"build",
-		"README.md"
-	],
-	"scripts": {
-		"husky:setup": "npx husky install",
-		"prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\" *.json *.js",
-		"prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"  *.json *.js",
-		"lint": "eslint src --color --ext .js,.jsx,.ts,.tsx,.json",
-		"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
-		"start": "cross-env NODE_ENV=development webpack serve",
-		"build": "rm -rf build && cross-env NODE_ENV=production webpack",
-		"copy:files": "copyfiles -u 1 src/**/*.css build/",
-		"tsc:alias": "tsc-alias -p tsconfig.json",
-		"ts:build": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
-		"push": "npm publish --access public"
-	},
-	"keywords": [],
-	"author": {
-		"name": "Ahmed Elsharkawy",
-		"email": "a.elsharkawy@tap.company"
-	},
-	"license": "ISC",
-	"devDependencies": {
-		"@babel/core": "^7.18.6",
-		"@babel/preset-env": "^7.18.6",
-		"@babel/preset-react": "^7.18.6",
-		"@babel/preset-typescript": "^7.18.6",
-		"@types/lodash-es": "^4.17.6",
-		"@types/moment-hijri": "^2.1.0",
-		"@types/react": "^18.0.15",
-		"@types/react-calendar": "~3.5.1",
-		"@types/react-dom": "^18.0.6",
-		"@typescript-eslint/eslint-plugin": "^5.30.5",
-		"@typescript-eslint/parser": "^5.30.5",
-		"babel-loader": "^8.2.5",
-		"copyfiles": "^2.4.1",
-		"cross-env": "^7.0.3",
-		"css-loader": "^6.7.1",
-		"css-minimizer-webpack-plugin": "^4.0.0",
-		"eslint": "^8.19.0",
-		"eslint-config-airbnb": "^19.0.4",
-		"eslint-config-prettier": "^8.5.0",
-		"eslint-plugin-import": "^2.26.0",
-		"eslint-plugin-jsx-a11y": "^6.6.0",
-		"eslint-plugin-node": "^11.1.0",
-		"eslint-plugin-prettier": "^4.2.1",
-		"eslint-plugin-react": "^7.30.1",
-		"eslint-plugin-react-hooks": "^4.6.0",
-		"file-loader": "^6.2.0",
-		"fork-ts-checker-webpack-plugin": "^7.2.12",
-		"html-loader": "^3.1.2",
-		"html-webpack-plugin": "^5.5.0",
-		"husky": "^8.0.1",
-		"lint-staged": "^13.0.3",
-		"mini-css-extract-plugin": "^2.6.1",
-		"prettier": "^2.7.1",
-		"sass": "^1.53.0",
-		"sass-loader": "^13.0.2",
-		"style-loader": "^3.3.1",
-		"terser-webpack-plugin": "^5.3.3",
-		"tsc-alias": "^1.6.11",
-		"typescript": "^4.7.4",
-		"webpack": "^5.73.0",
-		"webpack-cli": "^4.10.0",
-		"webpack-dev-server": "^4.9.3",
-		"webpack-merge": "^5.8.0"
-	},
-	"dependencies": {
-		"@emotion/react": "^11.9.3",
-		"@emotion/styled": "^11.9.3",
-		"@fingerprintjs/fingerprintjs": "~3.3.4",
-		"@hookform/resolvers": "^2.9.6",
-		"@mui/icons-material": "^5.8.4",
-		"@mui/material": "^5.8.7",
-		"@reduxjs/toolkit": "^1.8.3",
-		"axios": "^0.27.2",
-		"device-detector-js": "^3.0.3",
-		"i18next": "^21.8.14",
-		"i18next-browser-languagedetector": "^6.1.4",
-		"i18next-http-backend": "^1.4.1",
-		"jsencrypt": "^3.2.1",
-		"lodash-es": "^4.17.21",
-		"moment-hijri": "~2.1.2",
-		"react": "^18.2.0",
-		"react-calendar": "~3.7.0",
-		"react-device-detect": "^2.2.2",
-		"react-dom": "^18.2.0",
-		"react-hook-form": "^7.33.1",
-		"react-i18next": "^11.18.1",
-		"react-otp-input": "^2.4.0",
-		"react-redux": "^8.0.2",
-		"react-spring-bottom-sheet": "^3.4.1",
-		"yup": "^0.32.11"
-	},
-	"peerDependencies": {
-		"react": "^18.2.0",
-		"react-dom": "^18.2.0"
-	},
-	"lint-staged": {
-		"src/**/*.{ts,tsx,json,js,jsx}": [
-			"yarn run prettier:fix",
-			"yarn run lint",
-			"git add ."
-		]
-	},
-	"browserslist": {
-		"production": [
-			">0.2%",
-			"not dead",
-			"not op_mini all"
-		],
-		"development": [
-			"last 1 chrome version",
-			"last 1 firefox version",
-			"last 1 safari version"
-		]
-	}
-}
+{
+	"name": "@tap-payments/auth-jsconnect",
+	"version": "1.1.0-test",
+	"description": "connect library, auth",
+	"private": false,
+	"main": "build/index.js",
+	"module": "build/index.js",
+	"types": "build/index.d.ts",
+	"files": [
+		"build",
+		"README.md"
+	],
+	"scripts": {
+		"husky:setup": "npx husky install",
+		"prettier": "prettier --list-different \"src/**/*.{md,mdx,ts,js,tsx,jsx,json}\" *.json *.js",
+		"prettier:fix": "prettier --write \"src/**/*.{ts,tsx,js,jsx,json,md,css,json}\"  *.json *.js",
+		"lint": "eslint src --color --ext .js,.jsx,.ts,.tsx,.json",
+		"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
+		"start": "cross-env NODE_ENV=development webpack serve",
+		"build": "rm -rf build && cross-env NODE_ENV=production webpack",
+		"copy:files": "copyfiles -u 1 src/**/*.css build/",
+		"tsc:alias": "tsc-alias -p tsconfig.json",
+		"ts:build": "rm -rf build && tsc -p tsconfig.json && tsc-alias -p tsconfig.json && yarn copy:files",
+		"push": "npm publish --access public"
+	},
+	"keywords": [],
+	"author": {
+		"name": "Ahmed Elsharkawy",
+		"email": "a.elsharkawy@tap.company"
+	},
+	"license": "ISC",
+	"devDependencies": {
+		"@babel/core": "^7.18.6",
+		"@babel/preset-env": "^7.18.6",
+		"@babel/preset-react": "^7.18.6",
+		"@babel/preset-typescript": "^7.18.6",
+		"@types/lodash-es": "^4.17.6",
+		"@types/moment-hijri": "^2.1.0",
+		"@types/react": "^18.0.15",
+		"@types/react-calendar": "~3.5.1",
+		"@types/react-dom": "^18.0.6",
+		"@typescript-eslint/eslint-plugin": "^5.30.5",
+		"@typescript-eslint/parser": "^5.30.5",
+		"babel-loader": "^8.2.5",
+		"copyfiles": "^2.4.1",
+		"cross-env": "^7.0.3",
+		"css-loader": "^6.7.1",
+		"css-minimizer-webpack-plugin": "^4.0.0",
+		"eslint": "^8.19.0",
+		"eslint-config-airbnb": "^19.0.4",
+		"eslint-config-prettier": "^8.5.0",
+		"eslint-plugin-import": "^2.26.0",
+		"eslint-plugin-jsx-a11y": "^6.6.0",
+		"eslint-plugin-node": "^11.1.0",
+		"eslint-plugin-prettier": "^4.2.1",
+		"eslint-plugin-react": "^7.30.1",
+		"eslint-plugin-react-hooks": "^4.6.0",
+		"file-loader": "^6.2.0",
+		"fork-ts-checker-webpack-plugin": "^7.2.12",
+		"html-loader": "^3.1.2",
+		"html-webpack-plugin": "^5.5.0",
+		"husky": "^8.0.1",
+		"lint-staged": "^13.0.3",
+		"mini-css-extract-plugin": "^2.6.1",
+		"prettier": "^2.7.1",
+		"sass": "^1.53.0",
+		"sass-loader": "^13.0.2",
+		"style-loader": "^3.3.1",
+		"terser-webpack-plugin": "^5.3.3",
+		"tsc-alias": "^1.6.11",
+		"typescript": "^4.7.4",
+		"webpack": "^5.73.0",
+		"webpack-cli": "^4.10.0",
+		"webpack-dev-server": "^4.9.3",
+		"webpack-merge": "^5.8.0"
+	},
+	"dependencies": {
+		"@emotion/react": "^11.9.3",
+		"@emotion/styled": "^11.9.3",
+		"@fingerprintjs/fingerprintjs": "~3.3.4",
+		"@hookform/resolvers": "^2.9.6",
+		"@mui/icons-material": "^5.8.4",
+		"@mui/material": "^5.8.7",
+		"@reduxjs/toolkit": "^1.8.3",
+		"axios": "^0.27.2",
+		"device-detector-js": "^3.0.3",
+		"i18next": "^21.8.14",
+		"i18next-browser-languagedetector": "^6.1.4",
+		"i18next-http-backend": "^1.4.1",
+		"jsencrypt": "^3.2.1",
+		"lodash-es": "^4.17.21",
+		"moment-hijri": "~2.1.2",
+		"react": "^18.2.0",
+		"react-calendar": "~3.7.0",
+		"react-device-detect": "^2.2.2",
+		"react-dom": "^18.2.0",
+		"react-dropzone": "^14.2.2",
+		"react-hook-form": "^7.33.1",
+		"react-i18next": "^11.18.1",
+		"react-otp-input": "^2.4.0",
+		"react-redux": "^8.0.2",
+		"react-spring-bottom-sheet": "^3.4.1",
+		"yup": "^0.32.11"
+	},
+	"peerDependencies": {
+		"react": "^18.2.0",
+		"react-dom": "^18.2.0"
+	},
+	"lint-staged": {
+		"src/**/*.{ts,tsx,json,js,jsx}": [
+			"yarn run prettier:fix",
+			"yarn run lint",
+			"git add ."
+		]
+	},
+	"browserslist": {
+		"production": [
+			">0.2%",
+			"not dead",
+			"not op_mini all"
+		],
+		"development": [
+			"last 1 chrome version",
+			"last 1 firefox version",
+			"last 1 safari version"
+		]
+	}
+}