@tap-payments/auth-jsconnect 2.1.38-test → 2.1.40-test

package/build/features/app/individual/individualStore.js

@@ -285,10 +285,10 @@ export var updateIndividualInfo = createAsyncThunk('updateIndividualInfo', funct
                 civilID = params.civilID, signatureFileId = params.signatureFileId;
                 businessCountry = settings.data.businessCountry;
                 documentsList = [];
-                if (!!civilID)
-                    documentsList.push({ type: 'Civil ID File', images: [civilID] });
-                if (!!signatureFileId)
-                    documentsList.push({ type: 'Signature File', images: [signatureFileId] });
+                if ((civilID || []).length > 0)
+                    documentsList.push({ type: 'Civil ID File', images: civilID });
+                if ((signatureFileId || []).length > 0)
+                    documentsList.push({ type: 'Signature File', images: signatureFileId });
                 requestBody = {
                     id: id,
                     type: type,
@@ -321,56 +321,6 @@ export var updateIndividualInfo = createAsyncThunk('updateIndividualInfo', funct
         }
     });
 }); });
-export var uploadCivilIdFile = createAsyncThunk('uploadCivilIdFile', function (_a) {
-    var file = _a.file, onProgress = _a.onProgress, title = _a.title;
-    return __awaiter(void 0, void 0, void 0, function () {
-        var uploadPayload, onUploadProgress, data;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0:
-                    uploadPayload = {
-                        file_link_create: false,
-                        title: title,
-                        purpose: 'identity_document',
-                        file: file
-                    };
-                    onUploadProgress = function (progressEvent) {
-                        var progress = ((progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.loaded) / (progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.total)) * 100;
-                        onProgress === null || onProgress === void 0 ? void 0 : onProgress(Math.floor(progress));
-                    };
-                    return [4, API.entityService.uploadFileInfo(uploadPayload, { onUploadProgress: onUploadProgress })];
-                case 1:
-                    data = _b.sent();
-                    return [2, { data: data, file: file }];
-            }
-        });
-    });
-});
-export var uploadSignatureFile = createAsyncThunk('uploadSignatureFile', function (_a) {
-    var file = _a.file, onProgress = _a.onProgress;
-    return __awaiter(void 0, void 0, void 0, function () {
-        var uploadPayload, onUploadProgress, data;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0:
-                    uploadPayload = {
-                        file_link_create: false,
-                        title: 'Merchant Signature',
-                        purpose: 'customer_signature',
-                        file: file
-                    };
-                    onUploadProgress = function (progressEvent) {
-                        var progress = ((progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.loaded) / (progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.total)) * 100;
-                        onProgress === null || onProgress === void 0 ? void 0 : onProgress(Math.floor(progress));
-                    };
-                    return [4, API.entityService.uploadFileInfo(uploadPayload, { onUploadProgress: onUploadProgress })];
-                case 1:
-                    data = _b.sent();
-                    return [2, { data: data, file: file }];
-            }
-        });
-    });
-});
 export var updateBoardSuccess = createAsyncThunk('individualUpdateBoardSuccess', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
     var _a, settings, individual, _b, id, infoId, payload, data, boardInfoStatus;
     var _c, _d, _e, _f;
@@ -421,10 +371,6 @@ var initialState = {
             employerLocation: undefined,
             isPEP: null,
             isInfluencer: null
-        },
-        attachmentsData: {
-            civilIDUploading: false,
-            signatureFileUploading: false
         }
     }
 };
@@ -440,6 +386,12 @@ export var individualSlice = createSlice({
         },
         resetOTPScreen: function (state) {
             state.data.otpData.otp = '';
+        },
+        civilIDUploadingStatus: function (state, action) {
+            state.data.individualData.civilIDUploading = action.payload;
+        },
+        signatureFileUploadingStatus: function (state, action) {
+            state.data.individualData.signatureFileUploading = action.payload;
         }
     },
     extraReducers: function (builder) {
@@ -590,36 +542,6 @@ export var individualSlice = createSlice({
             .addCase(retrieveBoardDetails.rejected, function (state, action) {
             state.error = action.error.message;
             state.loading = false;
-        })
-            .addCase(uploadCivilIdFile.pending, function (state) {
-            state.error = null;
-            state.data.attachmentsData.civilIDUploading = true;
-        })
-            .addCase(uploadCivilIdFile.fulfilled, function (state, action) {
-            state.error = null;
-            state.data.attachmentsData.civilIDUploading = false;
-            var _a = action.payload, data = _a.data, file = _a.file;
-            state.data.attachmentsData.civilID = data === null || data === void 0 ? void 0 : data.id;
-            state.data.attachmentsData.civilIDFile = file;
-        })
-            .addCase(uploadCivilIdFile.rejected, function (state) {
-            state.data.attachmentsData.civilIDUploading = false;
-            state.error = 'file_upload_error';
-        })
-            .addCase(uploadSignatureFile.pending, function (state) {
-            state.error = null;
-            state.data.attachmentsData.signatureFileUploading = true;
-        })
-            .addCase(uploadSignatureFile.fulfilled, function (state, action) {
-            state.error = null;
-            state.data.attachmentsData.signatureFileUploading = false;
-            var _a = action.payload, data = _a.data, file = _a.file;
-            state.data.attachmentsData.signatureFileId = data === null || data === void 0 ? void 0 : data.id;
-            state.data.attachmentsData.signatureFile = file;
-        })
-            .addCase(uploadSignatureFile.rejected, function (state) {
-            state.data.attachmentsData.signatureFileUploading = false;
-            state.error = 'file_upload_error';
         })
             .addCase(updateBoardSuccess.fulfilled, function (state, action) {
             var _a;
@@ -644,6 +566,6 @@ export var individualSlice = createSlice({
         });
     }
 });
-export var clearError = (_a = individualSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen;
+export var clearError = (_a = individualSlice.actions, _a.clearError), stopLoader = _a.stopLoader, resetOTPScreen = _a.resetOTPScreen, civilIDUploadingStatus = _a.civilIDUploadingStatus, signatureFileUploadingStatus = _a.signatureFileUploadingStatus;
 export default individualSlice.reducer;
 export var individualSelector = function (state) { return state.individual; };

package/build/features/business/screens/BusinessType/Article.js

@@ -28,17 +28,16 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var Article = function (_a) {
-    var _b, _c;
     var show = _a.show;
-    var _d = React.useState(0), progress = _d[0], setProgress = _d[1];
+    var _b = React.useState(), error = _b[0], setError = _b[1];
+    var _c = React.useState(0), progress = _c[0], setProgress = _c[1];
     var t = useTranslation().t;
-    var _e = useFormContext(), control = _e.control, setError = _e.setError, clearErrors = _e.clearErrors, setValue = _e.setValue;
+    var _d = useFormContext(), control = _d.control, setValue = _d.setValue;
     var articleFileControl = useController({ name: 'articleFile', control: control });
     var articleIdControl = useController({ name: 'articleId', control: control });
-    var _f = useAppSelector(businessSelector), loading = _f.loading, uploadingArticle = _f.uploadingArticle, sysError = _f.error, data = _f.data;
+    var _e = useAppSelector(businessSelector), loading = _e.loading, uploadingArticle = _e.uploadingArticle, sysError = _e.uploadingArticleError, data = _e.data;
     var dispatch = useAppDispatch();
     var articleValue = articleFileControl.field.value;
-    var error = ((_b = articleFileControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message) || ((_c = articleIdControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message);
     var businessTypeData = data.businessTypeData;
     var articleFile = businessTypeData.articleFile, articleId = businessTypeData.articleId;
     React.useEffect(function () {
@@ -48,15 +47,16 @@ var Article = function (_a) {
         }
     }, [articleFile, articleId]);
     var handleArticleChange = function (files) {
+        setError('');
         var file = files === null || files === void 0 ? void 0 : files[0];
         if (!file)
             return;
         if (!VALID_FILE_FORMATS.includes(file === null || file === void 0 ? void 0 : file.type)) {
-            setError('articleFile', { message: 'file_not_supported_alert' });
+            setError('file_not_supported_alert');
             return;
         }
         if ((file === null || file === void 0 ? void 0 : file.size) > MAX_FILE_SIZE) {
-            setError('articleFile', { message: 'file_size_alert' });
+            setError('file_size_alert');
             return;
         }
         articleFileControl.field.onChange(file);
@@ -75,16 +75,13 @@ var Article = function (_a) {
     };
     React.useEffect(function () {
         if (sysError === 'file_upload_error') {
-            setError('articleId', { message: sysError });
+            setError(sysError);
             articleFileControl.field.onChange(undefined);
             setProgress(0);
         }
     }, [sysError]);
-    React.useEffect(function () {
-        if ((articleFileControl.formState.isValid || !!articleValue) && error != 'file_upload_error')
-            clearErrors();
-    }, [articleFileControl.formState.isValid, articleValue]);
     var fileName = articleValue ? maskFileName(articleValue === null || articleValue === void 0 ? void 0 : articleValue.name) : '';
-    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_article'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('article_of_association'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleArticleChange, isFileUploaded: !uploadingArticle && !!articleValue, isSubmitting: loading, isUploading: uploadingArticle, progress: progress, onReset: handleReset, error: error && t(error), initialFileName: fileName }) }) })));
+    var errorValue = error || sysError || '';
+    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_article'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('article_of_association'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleArticleChange, isFileUploaded: !uploadingArticle && !!articleValue, isSubmitting: loading, isUploading: uploadingArticle, progress: progress, onReset: handleReset, error: errorValue && t(errorValue), initialFileName: fileName }) }) })));
 };
 export default Article;

package/build/features/business/screens/BusinessType/BusinessType.js

@@ -28,7 +28,7 @@ import LicenseList from './LicenseList';
 var BusinessType = function (_a) {
     var _b = useAppSelector(businessSelector), data = _b.data, loading = _b.loading, error = _b.error, uploading = _b.uploading, uploadingArticle = _b.uploadingArticle;
     var settingsData = useAppSelector(settingsSelector).data;
-    var _c = data.businessTypeData, selectedLicense = _c.selectedLicense, licenseNumber = _c.licenseNumber, entityLegalName = _c.entityLegalName, certificateId = _c.certificateId, certificateFile = _c.certificateFile, articleId = _c.articleId, articleFile = _c.articleFile;
+    var _c = data.businessTypeData, selectedLicense = _c.selectedLicense, licenseNumber = _c.licenseNumber, entityLegalName = _c.entityLegalName, certificateId = _c.certificateId, articleId = _c.articleId, articleFile = _c.articleFile;
     var t = useTranslation().t;
     var isAr = useLanguage().isAr;
     var dispatch = useAppDispatch();
@@ -41,7 +41,6 @@ var BusinessType = function (_a) {
             licenseNumber: licenseNumber,
             entityLegalName: entityLegalName,
             certificateId: certificateId,
-            certificateFile: certificateFile,
             articleId: articleId,
             articleFile: articleFile
         },
@@ -57,8 +56,7 @@ var BusinessType = function (_a) {
             selectedLicense: data.selectedLicense,
             licenseNumber: data.licenseNumber,
             entityLegalName: data.entityLegalName,
-            certificateId: data.certificateId,
-            certificateFile: data.certificateFile
+            certificateId: data.certificateId
         };
         dispatch(updateLeadBusinessType(dataValues));
     };

package/build/features/business/screens/BusinessType/LicenseCertificate.js

@@ -10,16 +10,14 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { styled } from '@mui/material/styles';
-import { ScreenContainer } from '../../../shared/Containers';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { businessSelector, clearCertificateId, uploadLicenseCertificate } from '../../../app/business/businessStore';
-import UploadFile from '../../../shared/UploadFile';
-import { MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
+import { styled } from '@mui/material/styles';
 import Collapse from '../../../../components/Collapse';
+import { ScreenContainer } from '../../../shared/Containers';
+import { businessSelector, uploadingStatus } from '../../../app/business/businessStore';
+import UploadMultipleFile from '../../../shared/UploadMultipleFile';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -27,54 +25,18 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var LicenseCertificate = function (_a) {
-    var _b, _c;
     var show = _a.show;
-    var _d = React.useState(0), progress = _d[0], setProgress = _d[1];
     var t = useTranslation().t;
-    var _e = useFormContext(), control = _e.control, setError = _e.setError, clearErrors = _e.clearErrors;
-    var certificateFileControl = useController({ name: 'certificateFile', control: control });
-    var certificateIdControl = useController({ name: 'certificateId', control: control });
-    var _f = useAppSelector(businessSelector), loading = _f.loading, uploading = _f.uploading, sysError = _f.error;
+    var control = useFormContext().control;
     var dispatch = useAppDispatch();
-    var certificateValue = certificateFileControl.field.value;
-    var error = ((_b = certificateFileControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message) || ((_c = certificateIdControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message);
-    var handleLicenseCertificateChange = function (files) {
-        var file = (files || [])[0];
-        if (!file)
-            return;
-        if (!VALID_FILE_FORMATS.includes(file.type)) {
-            setError('certificateFile', { message: 'file_not_supported_alert' });
-            return;
-        }
-        if (file.size > MAX_FILE_SIZE) {
-            setError('certificateFile', { message: 'file_size_alert' });
-            return;
-        }
-        certificateFileControl.field.onChange(file);
-        dispatch(uploadLicenseCertificate({
-            file: file,
-            onProgress: function (value) {
-                setProgress(value);
-            }
-        }));
+    var certificateIdControl = useController({ name: 'certificateId', control: control });
+    var loading = useAppSelector(businessSelector).loading;
+    var handleLicenseCertificateChange = function (ids) {
+        certificateIdControl.field.onChange(ids);
     };
-    var handleReset = function () {
-        certificateFileControl.field.onChange(undefined);
-        certificateIdControl.field.onChange('');
-        dispatch(clearCertificateId());
-        setProgress(0);
+    var handleReset = function (ids) {
+        certificateIdControl.field.onChange(ids);
     };
-    React.useEffect(function () {
-        if (sysError === 'file_upload_error') {
-            setError('certificateId', { message: sysError });
-            certificateFileControl.field.onChange(undefined);
-            setProgress(0);
-        }
-    }, [sysError]);
-    React.useEffect(function () {
-        if ((certificateFileControl.formState.isValid || !!certificateValue) && error != 'file_upload_error')
-            clearErrors();
-    }, [certificateFileControl.formState.isValid, certificateValue]);
-    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_license_certificate'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_certificate'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleLicenseCertificateChange, isFileUploaded: !uploading && !!certificateValue, isSubmitting: loading, isUploading: uploading, progress: progress, onReset: handleReset, error: error && t(error) }) }) })));
+    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_license_certificate'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_certificate'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleLicenseCertificateChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, purpose: 'commercial_registration', fileUploadingStatus: function (uploading) { return dispatch(uploadingStatus(uploading)); } }) }) })));
 };
 export default LicenseCertificate;

package/build/features/business/screens/BusinessType/validation.d.ts

@@ -13,24 +13,21 @@ export declare const KWLicenseValidationSchema: yup.ObjectSchema<import("yup/lib
     selectedLicense: any;
     licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     entityLegalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    certificateId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
-    certificateFile: any;
+    certificateId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
     articleId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     articleFile: any;
 }>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     selectedLicense: any;
     licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     entityLegalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    certificateId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
-    certificateFile: any;
+    certificateId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
     articleId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     articleFile: any;
 }>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
     selectedLicense: any;
     licenseNumber: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
     entityLegalName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
-    certificateId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
-    certificateFile: any;
+    certificateId: yup.ArraySchema<yup.AnySchema<any, any, any>, import("yup/lib/types").AnyObject, any[] | undefined, any[] | undefined>;
     articleId: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
     articleFile: any;
 }>>>;

package/build/features/business/screens/BusinessType/validation.js

@@ -74,17 +74,7 @@ export var KWLicenseValidationSchema = yup.object().shape({
         });
     })
         .required(''),
-    certificateId: yup.string().optional(),
-    certificateFile: yup
-        .mixed()
-        .test({
-        test: function (value) {
-            if (!!value)
-                return VALID_FILE_FORMATS.includes(value === null || value === void 0 ? void 0 : value.type) && (value === null || value === void 0 ? void 0 : value.size) < MAX_FILE_SIZE ? true : this.createError({ message: 'alert_file_upload' });
-            return true;
-        }
-    })
-        .optional(),
+    certificateId: yup.array().optional(),
     articleId: yup.string().optional(),
     articleFile: yup
         .mixed()

package/build/features/individual/screens/AdditionalIndividualInfo/AdditionalIndividualInfo.js

@@ -48,14 +48,27 @@ var AdditionalIndividualInfo = function (_a) {
     var settingsData = useAppSelector(settingsSelector).data;
     var countries = settingsData.countries;
     var user = (data.verify.responseBody || {}).user;
+    var _c = data.individualData, occupation = _c.occupation, sourceIncome = _c.sourceIncome, monthlyIncome = _c.monthlyIncome, employerName = _c.employerName, employerLocation = _c.employerLocation, isPEP = _c.isPEP, isInfluencer = _c.isInfluencer, civilID = _c.civilID, signatureFileId = _c.signatureFileId, civilIDUploading = _c.civilIDUploading, signatureFileUploading = _c.signatureFileUploading;
     var methods = useForm({
         resolver: yupResolver(IndividualInfoValidationSchema),
-        defaultValues: data.individualData,
+        defaultValues: {
+            occupation: occupation,
+            sourceIncome: sourceIncome,
+            monthlyIncome: monthlyIncome,
+            employerName: employerName,
+            employerLocation: employerLocation,
+            isPEP: isPEP,
+            isInfluencer: isInfluencer,
+            civilID: civilID,
+            signatureFileId: signatureFileId,
+            civilIDUploading: civilIDUploading,
+            signatureFileUploading: signatureFileUploading
+        },
         mode: 'onChange'
     });
     useSetFromDefaultValues(methods, data.individualData, true);
-    var _c = React.useState(), listActive = _c[0], setListActive = _c[1];
-    var _d = React.useState(false), employerFieldsActive = _d[0], setEmployerFieldsActive = _d[1];
+    var _d = React.useState(), listActive = _d[0], setListActive = _d[1];
+    var _e = React.useState(false), employerFieldsActive = _e[0], setEmployerFieldsActive = _e[1];
     React.useEffect(function () {
         var _a, _b;
         if (((_b = (_a = methods.getValues('sourceIncome')) === null || _a === void 0 ? void 0 : _a.name.en) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'salary')
@@ -76,7 +89,8 @@ var AdditionalIndividualInfo = function (_a) {
     var isEmployerLocationListActive = listActive === ListType.EmployerLocationList;
     var isMonthlyIncomeListActive = listActive === ListType.MonthlyIncomeList;
     var isOccupationListActive = listActive === ListType.OccupationList;
-    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive && !isOccupationListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, {}), _jsx(SignatureFile, { show: user === null || user === void 0 ? void 0 : user.is_authorized })] })), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: !methods.formState.isValid, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
+    var disabled = !methods.formState.isValid || civilIDUploading || signatureFileUploading;
+    return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsxs(Box, { children: [_jsx(Occupation, { onListOpen: function () { return handleMenuClick(ListType.OccupationList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isSourceOfIncomeListActive }), _jsx(SourceOfIncome, { onListOpen: function () { return handleMenuClick(ListType.SourceOfIncomeList); }, onListClose: function () { return handleMenuClick(); }, show: !isEmployerLocationListActive && !isMonthlyIncomeListActive && !isOccupationListActive }), _jsx(MonthlyIncome, { show: !isEmployerLocationListActive && !isSourceOfIncomeListActive && !isOccupationListActive, onListOpen: function () { return handleMenuClick(ListType.MonthlyIncomeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(EmployerName, { show: false }), _jsx(EmployerLocation, { show: !isSourceOfIncomeListActive && employerFieldsActive && !isMonthlyIncomeListActive && !isOccupationListActive, countries: countries, onListOpen: function () { return handleMenuClick(ListType.EmployerLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsxs(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: [_jsx(CivilIDFile, {}), _jsx(SignatureFile, { show: user === null || user === void 0 ? void 0 : user.is_authorized })] })), _jsx(PEPSwitch, { show: !listActive }), _jsx(InfluencerSwitch, { show: !listActive })] }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, isAr: isAr, disableBack: true, disabled: disabled, loading: loading, error: t(error || '') }, { children: t('next') })) }))] })) })) }));
 };
 export default React.memo(AdditionalIndividualInfo);
 AdditionalIndividualInfo.defaultProps = {};

package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js

@@ -1,14 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
 import { ScreenContainer } from '../../../../features/shared/Containers';
 import { styled } from '@mui/material/styles';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { individualSelector, uploadCivilIdFile } from '../../../../features/app/individual/individualStore';
-import { MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
-import UploadFile from '../../../../features/shared/UploadFile';
-import { maskFileName } from '../../../../utils';
+import { civilIDUploadingStatus, individualSelector } from '../../../app/individual/individualStore';
+import UploadMultipleFile from '../../../shared/UploadMultipleFile';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -16,66 +13,18 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var CivilIDFile = function () {
-    var _a, _b;
-    var _c = React.useState(0), progress = _c[0], setProgress = _c[1];
+    var _a;
     var t = useTranslation().t;
-    var _d = useFormContext(), control = _d.control, setError = _d.setError, clearErrors = _d.clearErrors, setValue = _d.setValue;
-    var civilIDFileControl = useController({ name: 'civilIDFile', control: control });
-    var civilIDFileIdControl = useController({ name: 'civilID', control: control });
-    var _e = useAppSelector(individualSelector), data = _e.data, loading = _e.loading, sysError = _e.error;
-    var _f = data.attachmentsData, civilIDUploading = _f.civilIDUploading, civilIDFile = _f.civilIDFile, civilID = _f.civilID;
     var dispatch = useAppDispatch();
-    var civilIDValue = civilIDFileControl.field.value;
-    var error = ((_a = civilIDFileControl.fieldState.error) === null || _a === void 0 ? void 0 : _a.message) || ((_b = civilIDFileIdControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message);
-    var handleCivilIDChange = function (files) {
-        var _a;
-        var file = files === null || files === void 0 ? void 0 : files[0];
-        if (!VALID_FILE_FORMATS.includes(file === null || file === void 0 ? void 0 : file.type)) {
-            setError('civilIDFile', { message: 'file_not_supported_alert' });
-        }
-        else if ((file === null || file === void 0 ? void 0 : file.size) > MAX_FILE_SIZE) {
-            setError('civilIDFile', { message: 'file_size_alert' });
-        }
-        else {
-            civilIDFileControl.field.onChange(file);
-            dispatch(uploadCivilIdFile({
-                file: file,
-                onProgress: function (value) {
-                    setProgress(value);
-                },
-                title: (_a = data.verify.responseBody) === null || _a === void 0 ? void 0 : _a.merchant_id
-            }));
-        }
+    var control = useFormContext().control;
+    var civilIDFileIdControl = useController({ name: 'civilID', control: control });
+    var _b = useAppSelector(individualSelector), loading = _b.loading, data = _b.data;
+    var handleCivilIDChange = function (ids) {
+        civilIDFileIdControl.field.onChange(ids);
     };
-    var handleReset = function () {
-        civilIDFileControl.field.onChange(null);
-        civilIDFileIdControl.field.onChange('');
-        setProgress(0);
+    var handleReset = function (ids) {
+        civilIDFileIdControl.field.onChange(ids);
     };
-    React.useEffect(function () {
-        if (!!civilIDFile) {
-            setValue('civilIDFile', civilIDFile);
-            setValue('civilID', civilID);
-        }
-    }, [civilIDFile, civilID]);
-    React.useEffect(function () {
-        if (sysError === 'file_upload_error') {
-            setError('civilIDFileId', { message: sysError });
-            civilIDFileControl.field.onChange(null);
-            setProgress(0);
-        }
-    }, [sysError]);
-    React.useEffect(function () {
-        if ((civilIDFileControl.formState.isValid || !!civilIDValue) && error != 'file_upload_error')
-            clearErrors();
-    }, [civilIDFileControl.formState.isValid, civilIDValue]);
-    React.useEffect(function () {
-        if (!!civilIDFile) {
-            civilIDFileControl.field.onChange(civilIDFile);
-            civilIDFileIdControl.field.onChange(civilID);
-        }
-    }, []);
-    var fileName = civilIDValue ? maskFileName(civilIDValue === null || civilIDValue === void 0 ? void 0 : civilIDValue.name) : '';
-    return (_jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_civil_id'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_civilID'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_civil_id'), onFileUploaded: handleCivilIDChange, isFileUploaded: !civilIDUploading && !!civilIDValue, isSubmitting: loading, isUploading: civilIDUploading, progress: progress, onReset: handleReset, initialFileName: fileName, error: error && t(error) }) }));
+    return (_jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_civil_id'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_civilID'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_civil_id'), onFileUploaded: handleCivilIDChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, fileTitle: (_a = data.verify.responseBody) === null || _a === void 0 ? void 0 : _a.merchant_id, purpose: 'identity_document', fileUploadingStatus: function (uploading) { return dispatch(civilIDUploadingStatus(uploading)); } }) }));
 };
 export default CivilIDFile;

package/build/features/individual/screens/AdditionalIndividualInfo/SignatureFile.js

@@ -10,17 +10,14 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import { ScreenContainer } from '../../../../features/shared/Containers';
-import { styled } from '@mui/material/styles';
 import { useTranslation } from 'react-i18next';
 import { useController, useFormContext } from 'react-hook-form';
+import { styled } from '@mui/material/styles';
 import { useAppDispatch, useAppSelector } from '../../../../hooks';
-import { individualSelector, uploadSignatureFile } from '../../../../features/app/individual/individualStore';
-import { MAX_FILE_SIZE, VALID_FILE_FORMATS } from '../../../../constants';
-import UploadFile from '../../../../features/shared/UploadFile';
+import UploadMultipleFile from '../../../shared/UploadMultipleFile';
+import { ScreenContainer } from '../../../shared/Containers';
+import { individualSelector, signatureFileUploadingStatus } from '../../../app/individual/individualStore';
 import Collapse from '../../../../components/Collapse';
-import { maskFileName } from '../../../../utils';
 var FeatureStyled = styled(ScreenContainer)(function (_a) {
     var theme = _a.theme;
     return ({
@@ -28,63 +25,18 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
     });
 });
 var SignatureFile = function (_a) {
-    var _b, _c;
     var show = _a.show;
-    var _d = React.useState(0), progress = _d[0], setProgress = _d[1];
     var t = useTranslation().t;
-    var _e = useFormContext(), control = _e.control, setError = _e.setError, clearErrors = _e.clearErrors, setValue = _e.setValue;
-    var signatureFileControl = useController({ name: 'signatureFile', control: control });
+    var control = useFormContext().control;
     var signatureFileIdControl = useController({ name: 'signatureFileId', control: control });
-    var _f = useAppSelector(individualSelector), data = _f.data, loading = _f.loading, sysError = _f.error;
-    var _g = data.attachmentsData, signatureFileUploading = _g.signatureFileUploading, signatureFile = _g.signatureFile, signatureFileId = _g.signatureFileId;
+    var loading = useAppSelector(individualSelector).loading;
     var dispatch = useAppDispatch();
-    var signatureValue = signatureFileControl.field.value;
-    var error = ((_b = signatureFileControl.fieldState.error) === null || _b === void 0 ? void 0 : _b.message) || ((_c = signatureFileIdControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message);
-    var handleSignatureChange = function (files) {
-        var file = files === null || files === void 0 ? void 0 : files[0];
-        if (!VALID_FILE_FORMATS.includes(file === null || file === void 0 ? void 0 : file.type)) {
-            setError('signatureFile', { message: 'file_not_supported_alert' });
-        }
-        else if ((file === null || file === void 0 ? void 0 : file.size) > MAX_FILE_SIZE) {
-            setError('signatureFile', { message: 'file_size_alert' });
-        }
-        else {
-            signatureFileControl.field.onChange(file);
-            dispatch(uploadSignatureFile({
-                file: file,
-                onProgress: function (value) {
-                    setProgress(value);
-                }
-            }));
-        }
+    var handleSignatureChange = function (ids) {
+        signatureFileIdControl.field.onChange(ids);
     };
-    var handleReset = function () {
-        signatureFileControl.field.onChange(null);
-        signatureFileIdControl.field.onChange('');
-        setProgress(0);
+    var handleReset = function (ids) {
+        signatureFileIdControl.field.onChange(ids);
     };
-    React.useEffect(function () {
-        if (sysError === 'file_upload_error') {
-            setError('signatureFileId', { message: sysError });
-            signatureFileControl.field.onChange(null);
-            setProgress(0);
-        }
-    }, [sysError]);
-    React.useEffect(function () {
-        if ((signatureFileControl.formState.isValid || !!signatureValue) && error != 'file_upload_error')
-            clearErrors();
-    }, [signatureFileControl.formState.isValid, signatureValue]);
-    React.useEffect(function () {
-        if (!!signatureFile) {
-            setValue('signatureFile', signatureFile);
-            setValue('signatureFileId', signatureFileId);
-        }
-    }, [signatureFile, signatureFileId]);
-    React.useEffect(function () {
-        if (!!signatureValue)
-            signatureFileControl.field.onChange(signatureFile);
-    }, []);
-    var fileName = signatureValue ? maskFileName(signatureValue === null || signatureValue === void 0 ? void 0 : signatureValue.name) : '';
-    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadFile, { label: t('title_signature_file'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_signature'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_signature_file'), onFileUploaded: handleSignatureChange, isFileUploaded: !signatureFileUploading && !!signatureValue, isSubmitting: loading, initialFileName: fileName, isUploading: signatureFileUploading, progress: progress, onReset: handleReset, error: error && t(error) }) }) })));
+    return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(FeatureStyled, { children: _jsx(UploadMultipleFile, { label: t('title_signature_file'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('desc_drag_and_drop_signature'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_signature_file'), onFileUploaded: handleSignatureChange, isSubmitting: loading, onDeleteFile: handleReset, maxLimit: 4, purpose: 'customer_signature', fileTitle: 'Merchant Signature', fileUploadingStatus: function (uploading) { return dispatch(signatureFileUploadingStatus(uploading)); } }) }) })));
 };
 export default SignatureFile;