@tap-payments/auth-jsconnect 2.3.6-test → 2.3.8-test
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/@types/form.d.ts +0 -1
- package/build/components/DatePicker/DatePicker.js +5 -3
- package/build/constants/app.d.ts +27 -0
- package/build/constants/app.js +21 -0
- package/build/features/app/entity/entityStore.d.ts +2 -12
- package/build/features/app/entity/entityStore.js +7 -52
- package/build/features/bank/screens/BankDetails/BankStatement.js +2 -1
- package/build/features/business/screens/BusinessType/Article.js +1 -1
- package/build/features/business/screens/BusinessType/LicenseCertificate.js +2 -1
- package/build/features/entity/screens/EntityName/Article.js +12 -53
- package/build/features/entity/screens/EntityName/EntityName.js +2 -3
- package/build/features/entity/screens/EntityName/LicenseCertificate.js +2 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/CivilIDFile.js +2 -1
- package/build/features/individual/screens/AdditionalIndividualInfo/SignatureFile.js +2 -1
- package/build/features/shared/UploadFile/FileUpload.d.ts +27 -0
- package/build/features/shared/UploadFile/FileUpload.js +220 -0
- package/build/features/shared/UploadFile/UploadWrapper.d.ts +31 -0
- package/build/features/shared/UploadFile/UploadWrapper.js +114 -0
- package/build/features/shared/UploadFile/index.d.ts +2 -1
- package/build/features/shared/UploadFile/index.js +2 -1
- package/build/features/shared/UploadMultipleFile/UploadFile.d.ts +5 -26
- package/build/features/shared/UploadMultipleFile/UploadFile.js +47 -49
- package/build/features/shared/UploadMultipleFile/UploadMultipleFile.d.ts +4 -2
- package/build/features/shared/UploadMultipleFile/UploadMultipleFile.js +9 -15
- package/build/features/tax/screens/TaxDetails/TaxDocument.js +2 -1
- package/build/utils/array.js +11 -4
- package/package.json +1 -1
|
@@ -0,0 +1,220 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
13
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
14
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
15
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
16
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
17
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
18
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
22
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
23
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
24
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
25
|
+
function step(op) {
|
|
26
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
27
|
+
while (_) try {
|
|
28
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
29
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
30
|
+
switch (op[0]) {
|
|
31
|
+
case 0: case 1: t = op; break;
|
|
32
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
33
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
34
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
35
|
+
default:
|
|
36
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
37
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
38
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
39
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
40
|
+
if (t[2]) _.ops.pop();
|
|
41
|
+
_.trys.pop(); continue;
|
|
42
|
+
}
|
|
43
|
+
op = body.call(thisArg, _);
|
|
44
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
45
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
49
|
+
import React from 'react';
|
|
50
|
+
import { useTranslation } from 'react-i18next';
|
|
51
|
+
import { alpha, styled, useTheme } from '@mui/material/styles';
|
|
52
|
+
import Box from '@mui/material/Box';
|
|
53
|
+
import ClearIcon from '@mui/icons-material/Clear';
|
|
54
|
+
import { CircularProgress as MUICircularProgress } from '@mui/material';
|
|
55
|
+
import Collapse from '../../../components/Collapse';
|
|
56
|
+
import { CircularProgress } from '../../../components/ProgressBar';
|
|
57
|
+
import Text from '../../../components/Text';
|
|
58
|
+
import Icon from '../../../components/Icon';
|
|
59
|
+
import { maskFileName } from '../../../utils';
|
|
60
|
+
import API from '../../../api';
|
|
61
|
+
import { FileStatus, ICONS_NAMES, MAX_FILE_SIZE_FOUR_MB, VALID_FILE_FORMATS } from '../../../constants';
|
|
62
|
+
import CheckIcon from '../../shared/CheckIcon';
|
|
63
|
+
var BoxStyled = styled(Box)(function (_a) {
|
|
64
|
+
var theme = _a.theme;
|
|
65
|
+
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(0, 2.5, 0), width: '88%', wordBreak: 'break-all', display: 'flex', justifyContent: 'space-between' }));
|
|
66
|
+
});
|
|
67
|
+
var UploadBoxStyled = styled(Box, { shouldForwardProp: function (prop) { return prop !== 'uploading'; } })(function (_a) {
|
|
68
|
+
var theme = _a.theme, uploading = _a.uploading;
|
|
69
|
+
return (__assign(__assign({}, theme.typography.caption), { background: uploading ? alpha(theme.palette.primary.main, 0.5) : theme.palette.primary.main, color: theme.palette.common.white, fontWeight: theme.typography.fontWeightRegular, cursor: 'pointer', width: '12%', display: 'flex', justifyContent: 'center', alignItems: 'center' }));
|
|
70
|
+
});
|
|
71
|
+
var ClearIconStyled = styled(ClearIcon)(function (_a) {
|
|
72
|
+
var theme = _a.theme;
|
|
73
|
+
return ({
|
|
74
|
+
width: theme.spacing(3),
|
|
75
|
+
height: theme.spacing(3),
|
|
76
|
+
cursor: 'pointer',
|
|
77
|
+
color: theme.palette.common.white
|
|
78
|
+
});
|
|
79
|
+
});
|
|
80
|
+
export var InputContainerStyled = styled(Box)(function () { return ({
|
|
81
|
+
display: 'flex',
|
|
82
|
+
width: '100%',
|
|
83
|
+
justifyContent: 'center'
|
|
84
|
+
}); });
|
|
85
|
+
var ProgressBoxStyled = styled(Box)(function () { return ({
|
|
86
|
+
display: 'flex',
|
|
87
|
+
justifyContent: 'center',
|
|
88
|
+
alignItems: 'center'
|
|
89
|
+
}); });
|
|
90
|
+
var WarningIconStyled = styled(Icon)(function (_a) {
|
|
91
|
+
var theme = _a.theme;
|
|
92
|
+
return ({
|
|
93
|
+
width: theme.spacing(1.625),
|
|
94
|
+
height: theme.spacing(1.625),
|
|
95
|
+
marginInline: theme.spacing(0.5)
|
|
96
|
+
});
|
|
97
|
+
});
|
|
98
|
+
var ErrorIconStyled = styled(Icon)(function (_a) {
|
|
99
|
+
var theme = _a.theme;
|
|
100
|
+
return ({
|
|
101
|
+
width: theme.spacing(1.625),
|
|
102
|
+
height: theme.spacing(1.625),
|
|
103
|
+
marginInline: theme.spacing(0.5)
|
|
104
|
+
});
|
|
105
|
+
});
|
|
106
|
+
var WarningContainer = styled(Box)(function (_a) {
|
|
107
|
+
var theme = _a.theme;
|
|
108
|
+
return (__assign({ background: alpha(theme.palette.warning.main, 0.1), paddingBlock: theme.spacing(1.5), paddingInlineStart: theme.spacing(2.5), flexDirection: 'row', display: 'flex', justifyContent: 'center', color: theme.palette.warning.light, padding: theme.spacing(0.5, 1), borderRadius: '101px', alignItems: 'center', marginTop: theme.spacing(1.25) }, theme.typography.caption));
|
|
109
|
+
});
|
|
110
|
+
var FileUpload = function (_a) {
|
|
111
|
+
var key = _a.key, show = _a.show, title = _a.title, file = _a.file, uploadedFile = _a.uploadedFile, onSuccess = _a.onSuccess, onDelete = _a.onDelete, onUpdate = _a.onUpdate, sx = _a.sx, purpose = _a.purpose, isSubmitting = _a.isSubmitting;
|
|
112
|
+
var theme = useTheme();
|
|
113
|
+
var t = useTranslation().t;
|
|
114
|
+
var _b = file || {}, name = _b.name, size = _b.size, type = _b.type;
|
|
115
|
+
var _c = uploadedFile || {}, status = _c.status, progress = _c.progress, error = _c.error, fileId = _c.fileId;
|
|
116
|
+
var uploadFile = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
117
|
+
var uploadPayload, onUploadProgress, data, fileId;
|
|
118
|
+
return __generator(this, function (_a) {
|
|
119
|
+
switch (_a.label) {
|
|
120
|
+
case 0:
|
|
121
|
+
uploadPayload = {
|
|
122
|
+
file_link_create: true,
|
|
123
|
+
title: title || (file === null || file === void 0 ? void 0 : file.name),
|
|
124
|
+
purpose: purpose,
|
|
125
|
+
file: file
|
|
126
|
+
};
|
|
127
|
+
onUploadProgress = function (progressEvent) {
|
|
128
|
+
var progress = ((progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.loaded) / (progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.total)) * 100;
|
|
129
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { progress: Math.floor(progress), status: FileStatus.UPLOADING, error: '' });
|
|
130
|
+
onUpdate(uploadedFile, true);
|
|
131
|
+
};
|
|
132
|
+
return [4, API.fileService.uploadFile(uploadPayload, { onUploadProgress: onUploadProgress })];
|
|
133
|
+
case 1:
|
|
134
|
+
data = (_a.sent()).data;
|
|
135
|
+
fileId = (data || {}).id;
|
|
136
|
+
if (fileId) {
|
|
137
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { status: FileStatus.SUCCESS, fileId: fileId, error: '' });
|
|
138
|
+
onSuccess(uploadedFile);
|
|
139
|
+
}
|
|
140
|
+
else {
|
|
141
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { progress: 0, status: FileStatus.ERROR, error: t('file_upload_error') });
|
|
142
|
+
onUpdate(uploadedFile, false);
|
|
143
|
+
}
|
|
144
|
+
return [2];
|
|
145
|
+
}
|
|
146
|
+
});
|
|
147
|
+
}); };
|
|
148
|
+
var downloadFile = function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
149
|
+
var onDownloadProgress, data, _a;
|
|
150
|
+
return __generator(this, function (_b) {
|
|
151
|
+
switch (_b.label) {
|
|
152
|
+
case 0:
|
|
153
|
+
onDownloadProgress = function (progressEvent) {
|
|
154
|
+
var progress = ((progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.loaded) / (progressEvent === null || progressEvent === void 0 ? void 0 : progressEvent.total)) * 100;
|
|
155
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { progress: Math.floor(progress), status: FileStatus.DOWNLOADING, error: '' });
|
|
156
|
+
onUpdate(uploadedFile, true);
|
|
157
|
+
};
|
|
158
|
+
_b.label = 1;
|
|
159
|
+
case 1:
|
|
160
|
+
_b.trys.push([1, 3, , 4]);
|
|
161
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { progress: 0, status: FileStatus.DOWNLOADING, error: '' });
|
|
162
|
+
onUpdate(uploadedFile, true);
|
|
163
|
+
return [4, API.fileService.downloadFile(fileId, uploadedFile === null || uploadedFile === void 0 ? void 0 : uploadedFile.name, { onDownloadProgress: onDownloadProgress })];
|
|
164
|
+
case 2:
|
|
165
|
+
data = (_b.sent()).data;
|
|
166
|
+
if (data) {
|
|
167
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { status: FileStatus.SUCCESS, error: '' });
|
|
168
|
+
onSuccess(uploadedFile);
|
|
169
|
+
}
|
|
170
|
+
return [3, 4];
|
|
171
|
+
case 3:
|
|
172
|
+
_a = _b.sent();
|
|
173
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { error: t('file_download_error'), status: FileStatus.SUCCESS });
|
|
174
|
+
onUpdate(uploadedFile, false);
|
|
175
|
+
return [3, 4];
|
|
176
|
+
case 4: return [2];
|
|
177
|
+
}
|
|
178
|
+
});
|
|
179
|
+
}); };
|
|
180
|
+
var handleDeleteFile = function () {
|
|
181
|
+
onDelete();
|
|
182
|
+
};
|
|
183
|
+
var getProgressComponent = function () {
|
|
184
|
+
if (status === FileStatus.ERROR)
|
|
185
|
+
return _jsx(ErrorIconStyled, { src: ICONS_NAMES.ERROR_ICON });
|
|
186
|
+
if (status === FileStatus.SUCCESS)
|
|
187
|
+
return _jsx(CheckIcon, {});
|
|
188
|
+
if (status === FileStatus.DOWNLOADING && !progress)
|
|
189
|
+
return _jsx(MUICircularProgress, { size: 25, thickness: 5 });
|
|
190
|
+
if (progress)
|
|
191
|
+
return (_jsx(CircularProgress, { sx: { backgroundColor: alpha(theme.palette.primary.main, 0.05), borderRadius: '32px' }, textSx: { fontSize: theme.spacing(1.125) }, value: progress, size: 35 }));
|
|
192
|
+
return _jsx(_Fragment, {});
|
|
193
|
+
};
|
|
194
|
+
React.useEffect(function () {
|
|
195
|
+
if (!file)
|
|
196
|
+
return;
|
|
197
|
+
else if (!VALID_FILE_FORMATS.includes(type)) {
|
|
198
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { status: FileStatus.ERROR, error: t('file_not_supported_alert') });
|
|
199
|
+
onUpdate(uploadedFile, false);
|
|
200
|
+
}
|
|
201
|
+
else if (size > MAX_FILE_SIZE_FOUR_MB) {
|
|
202
|
+
uploadedFile = __assign(__assign({}, uploadedFile), { status: FileStatus.ERROR, error: t('file_size_alert') });
|
|
203
|
+
onUpdate(uploadedFile, false);
|
|
204
|
+
}
|
|
205
|
+
else {
|
|
206
|
+
if (status === FileStatus.INIT || status === FileStatus.ERROR) {
|
|
207
|
+
uploadFile();
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
}, [name]);
|
|
211
|
+
var canDownloadFile = fileId && status !== FileStatus.DOWNLOADING;
|
|
212
|
+
var canDeleteFile = status !== FileStatus.UPLOADING && status !== FileStatus.DOWNLOADING;
|
|
213
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsx(Box, __assign({ sx: { pointerEvents: isSubmitting ? 'none' : 'auto' } }, { children: _jsxs(InputContainerStyled, __assign({ sx: __assign({ borderTop: "1px solid ".concat(alpha(theme.palette.divider, 0.8)), borderBottom: "1px solid ".concat(alpha(theme.palette.divider, 0.8)) }, sx) }, { children: [_jsxs(BoxStyled, { children: [_jsxs(Box, __assign({ sx: {
|
|
214
|
+
display: 'flex',
|
|
215
|
+
flexDirection: 'column',
|
|
216
|
+
padding: theme.spacing(1.5, 0, 1.5),
|
|
217
|
+
width: '100%'
|
|
218
|
+
} }, { children: [_jsxs(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', cursor: canDownloadFile ? 'pointer' : 'auto' }, onClick: canDownloadFile ? function () { return downloadFile(); } : undefined }, { children: [_jsx(Icon, { src: ICONS_NAMES.DOC_ICON }), _jsx(Text, { children: name && maskFileName(name) })] })), _jsx(Box, __assign({ sx: { display: 'flex', flexDirection: 'row', justifyContent: 'center' } }, { children: _jsx(Collapse, __assign({ in: !!error, timeout: 400 }, { children: _jsxs(WarningContainer, { children: [_jsx(WarningIconStyled, { src: ICONS_NAMES.WARNING_ICON }), _jsx(Text, { children: t(error) })] }) })) }))] })), _jsx(ProgressBoxStyled, { children: getProgressComponent() })] }), _jsx(UploadBoxStyled, __assign({ uploading: status === FileStatus.UPLOADING || status === FileStatus.DOWNLOADING, onClick: canDeleteFile ? function () { return handleDeleteFile(); } : undefined }, { children: _jsx(ClearIconStyled, {}) }))] })) }), key) })));
|
|
219
|
+
};
|
|
220
|
+
export default FileUpload;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Control, FieldValues } from 'react-hook-form';
|
|
3
|
+
import { FileDetails } from '../../../@types';
|
|
4
|
+
export declare const InputContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material/styles").Theme> & {
|
|
5
|
+
children?: React.ReactNode;
|
|
6
|
+
component?: React.ElementType<any> | undefined;
|
|
7
|
+
ref?: React.Ref<unknown> | undefined;
|
|
8
|
+
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
9
|
+
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
|
|
10
|
+
ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
|
|
11
|
+
}, 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>, {}, {}>;
|
|
12
|
+
interface UploadWrapperProps {
|
|
13
|
+
id: string;
|
|
14
|
+
control: Control<FieldValues, any>;
|
|
15
|
+
label: string;
|
|
16
|
+
purpose: string;
|
|
17
|
+
fileTitle?: string;
|
|
18
|
+
required?: boolean;
|
|
19
|
+
title: string;
|
|
20
|
+
subTitle: string;
|
|
21
|
+
dragDescription: string;
|
|
22
|
+
uploadingTitle: string;
|
|
23
|
+
successTitle: string;
|
|
24
|
+
isSubmitting?: boolean;
|
|
25
|
+
onFileUploaded: (fileId: string) => void;
|
|
26
|
+
fileUploadingStatus?: (uploading: boolean) => void;
|
|
27
|
+
onDeleteFile: () => void;
|
|
28
|
+
defaultFile?: FileDetails;
|
|
29
|
+
}
|
|
30
|
+
declare const UploadWrapper: ({ id, label, control, required, title, subTitle, dragDescription, uploadingTitle, successTitle, isSubmitting, onFileUploaded, fileUploadingStatus, onDeleteFile, purpose, fileTitle, defaultFile }: UploadWrapperProps) => JSX.Element;
|
|
31
|
+
export default UploadWrapper;
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
|
+
import { useController } from 'react-hook-form';
|
|
16
|
+
import { styled } from '@mui/material/styles';
|
|
17
|
+
import Box from '@mui/material/Box';
|
|
18
|
+
import { DragAndDrop } from '../../../components/FileInput';
|
|
19
|
+
import Collapse from '../../../components/Collapse';
|
|
20
|
+
import { getFileType } from '../../../utils';
|
|
21
|
+
import { FileStatus } from '../../../constants';
|
|
22
|
+
import { InputLabelStyled } from '../../shared/Input/Input';
|
|
23
|
+
import { ScreenContainer } from '../../shared/Containers';
|
|
24
|
+
import Mandatory from '../../shared/Mandatory';
|
|
25
|
+
import FileUpload from './FileUpload';
|
|
26
|
+
var FeatureStyled = styled(ScreenContainer)(function (_a) {
|
|
27
|
+
var theme = _a.theme;
|
|
28
|
+
return ({
|
|
29
|
+
marginBlockStart: theme.spacing(0)
|
|
30
|
+
});
|
|
31
|
+
});
|
|
32
|
+
var LabelContainerStyled = styled(Box)(function (_a) {
|
|
33
|
+
var theme = _a.theme;
|
|
34
|
+
return ({
|
|
35
|
+
display: 'flex',
|
|
36
|
+
justifyContent: 'space-between',
|
|
37
|
+
padding: theme.spacing(0, 2.5, 1.25, 2.5),
|
|
38
|
+
alignItems: 'center'
|
|
39
|
+
});
|
|
40
|
+
});
|
|
41
|
+
export var InputContainerStyled = styled(Box)(function () { return ({
|
|
42
|
+
display: 'flex',
|
|
43
|
+
width: '100%',
|
|
44
|
+
justifyContent: 'center'
|
|
45
|
+
}); });
|
|
46
|
+
var UploadWrapper = function (_a) {
|
|
47
|
+
var id = _a.id, label = _a.label, control = _a.control, required = _a.required, title = _a.title, subTitle = _a.subTitle, dragDescription = _a.dragDescription, uploadingTitle = _a.uploadingTitle, successTitle = _a.successTitle, isSubmitting = _a.isSubmitting, onFileUploaded = _a.onFileUploaded, fileUploadingStatus = _a.fileUploadingStatus, onDeleteFile = _a.onDeleteFile, purpose = _a.purpose, fileTitle = _a.fileTitle, defaultFile = _a.defaultFile;
|
|
48
|
+
var t = useTranslation().t;
|
|
49
|
+
var _b = React.useState(''), error = _b[0], setError = _b[1];
|
|
50
|
+
var fileControl = useController({ name: "".concat(id, "File"), control: control });
|
|
51
|
+
var fileInfoControl = useController({ name: "".concat(id, "FileInfo"), control: control });
|
|
52
|
+
var fileData = fileControl.field.value;
|
|
53
|
+
var fileInfo = fileInfoControl.field.value;
|
|
54
|
+
React.useEffect(function () {
|
|
55
|
+
if (!fileData && !fileInfo && defaultFile) {
|
|
56
|
+
var title_1 = defaultFile.title, size = defaultFile.size, type = defaultFile.type, id_1 = defaultFile.id, docId = defaultFile.docId;
|
|
57
|
+
var fileData_1 = { name: title_1, size: size, type: getFileType(type) };
|
|
58
|
+
var fileInfoData = {
|
|
59
|
+
fileId: id_1,
|
|
60
|
+
docId: docId,
|
|
61
|
+
status: FileStatus.SUCCESS,
|
|
62
|
+
progress: 100,
|
|
63
|
+
error: '',
|
|
64
|
+
name: title_1 || ''
|
|
65
|
+
};
|
|
66
|
+
fileControl.field.onChange(fileData_1);
|
|
67
|
+
fileInfoControl.field.onChange(fileInfoData);
|
|
68
|
+
}
|
|
69
|
+
}, [defaultFile]);
|
|
70
|
+
var handleFileChange = function (files) {
|
|
71
|
+
if (!isSubmitting) {
|
|
72
|
+
if ((files === null || files === void 0 ? void 0 : files.length) > 0) {
|
|
73
|
+
setError('');
|
|
74
|
+
var fileData_2 = files[0];
|
|
75
|
+
fileControl.field.onChange(fileData_2);
|
|
76
|
+
fileInfoControl.field.onChange({
|
|
77
|
+
fileId: '',
|
|
78
|
+
docId: '',
|
|
79
|
+
status: FileStatus.INIT,
|
|
80
|
+
progress: 0,
|
|
81
|
+
error: '',
|
|
82
|
+
name: fileData_2.name
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
var handleDelete = function () {
|
|
88
|
+
if (!isSubmitting) {
|
|
89
|
+
setError('');
|
|
90
|
+
if (required)
|
|
91
|
+
setError(t('should_upload_file'));
|
|
92
|
+
fileControl.field.onChange(undefined);
|
|
93
|
+
fileInfoControl.field.onChange(undefined);
|
|
94
|
+
onDeleteFile();
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
var handleSuccess = function (fileInfo) {
|
|
98
|
+
if (fileInfo) {
|
|
99
|
+
fileInfoControl.field.onChange(__assign({}, fileInfo));
|
|
100
|
+
onFileUploaded(fileInfo.fileId);
|
|
101
|
+
fileUploadingStatus === null || fileUploadingStatus === void 0 ? void 0 : fileUploadingStatus(false);
|
|
102
|
+
}
|
|
103
|
+
};
|
|
104
|
+
var handleUpdate = function (fileInfo, loadingStatus) {
|
|
105
|
+
if (fileInfo) {
|
|
106
|
+
fileInfoControl.field.onChange(__assign({}, fileInfo));
|
|
107
|
+
fileUploadingStatus === null || fileUploadingStatus === void 0 ? void 0 : fileUploadingStatus(loadingStatus);
|
|
108
|
+
}
|
|
109
|
+
};
|
|
110
|
+
var fileExists = !!fileInfo;
|
|
111
|
+
var fileUploaded = (fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.status) === FileStatus.SUCCESS || (fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.status) === FileStatus.DOWNLOADING;
|
|
112
|
+
return (_jsxs(FeatureStyled, { children: [_jsx(LabelContainerStyled, { children: _jsx(InputLabelStyled, { children: _jsxs(_Fragment, { children: [label, required && _jsx(Mandatory, {})] }) }) }), _jsx(Collapse, __assign({ in: !fileUploaded }, { children: _jsx(InputContainerStyled, __assign({ sx: { mb: 2.5 } }, { children: _jsx(DragAndDrop, { title: title, subTitle: subTitle, description: dragDescription, fileExists: fileExists, uploadingTitle: uploadingTitle, successTitle: successTitle, progress: fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.progress, uploading: (fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.status) === FileStatus.UPLOADING, uploadSuccess: fileUploaded, onSuccess: handleFileChange, error: (fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.error) || error, multiple: false }) })) })), _jsx(Collapse, __assign({ in: fileExists, timeout: 300 }, { children: _jsx(FileUpload, { show: fileUploaded, purpose: purpose, title: fileTitle || '', isSubmitting: isSubmitting, uploadedFile: fileInfo, file: fileData, onSuccess: handleSuccess, onDelete: handleDelete, onUpdate: handleUpdate }) }))] }));
|
|
113
|
+
};
|
|
114
|
+
export default UploadWrapper;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { SxProps, Theme } from '@mui/material/styles';
|
|
3
|
+
import { FileInfo, FileType } from '../../../constants';
|
|
3
4
|
export declare const InputContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<Theme> & {
|
|
4
5
|
children?: React.ReactNode;
|
|
5
6
|
component?: React.ElementType<any> | undefined;
|
|
@@ -8,41 +9,19 @@ export declare const InputContainerStyled: import("@emotion/styled").StyledCompo
|
|
|
8
9
|
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
|
|
9
10
|
ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
|
|
10
11
|
}, 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<Theme>, {}, {}>;
|
|
11
|
-
export declare enum FileStatus {
|
|
12
|
-
INIT = "init",
|
|
13
|
-
UPLOADING = "uploading",
|
|
14
|
-
DOWNLOADING = "downloading",
|
|
15
|
-
SUCCESS = "success",
|
|
16
|
-
ERROR = "error",
|
|
17
|
-
ALREADY_UPLOADED = "already_uploaded"
|
|
18
|
-
}
|
|
19
|
-
export declare enum DeleteFileStatus {
|
|
20
|
-
NONE = "none",
|
|
21
|
-
DELETING = "deleting",
|
|
22
|
-
ERROR = "error",
|
|
23
|
-
SUCCESS = "success"
|
|
24
|
-
}
|
|
25
|
-
export declare type FileInfo = {
|
|
26
|
-
fileId: string;
|
|
27
|
-
docId: string;
|
|
28
|
-
name: string;
|
|
29
|
-
status: FileStatus;
|
|
30
|
-
progress: number;
|
|
31
|
-
error: string;
|
|
32
|
-
deleteStatus: DeleteFileStatus;
|
|
33
|
-
};
|
|
34
12
|
export declare type UploadFileProps = {
|
|
35
13
|
index: number;
|
|
36
14
|
purpose: string;
|
|
37
15
|
file: File;
|
|
16
|
+
fileType: FileType;
|
|
38
17
|
required?: boolean;
|
|
39
18
|
title?: string;
|
|
40
19
|
uploadedFiles: Array<FileInfo>;
|
|
41
20
|
onSuccess: (index: number, file: FileInfo) => void;
|
|
42
|
-
onFailure: (index: number, file: FileInfo) => void;
|
|
43
21
|
onDelete: (index: number) => void;
|
|
44
|
-
|
|
22
|
+
onUpdate: (index: number, file: FileInfo, loadingStatus: boolean) => void;
|
|
45
23
|
sx?: SxProps<Theme> | undefined;
|
|
24
|
+
isSubmitting?: boolean;
|
|
46
25
|
};
|
|
47
|
-
declare const UploadFile: ({ index, title, file, uploadedFiles, onSuccess,
|
|
26
|
+
declare const UploadFile: ({ index, title, file, fileType, uploadedFiles, onSuccess, onDelete, onUpdate, sx, purpose, required, isSubmitting }: UploadFileProps) => JSX.Element;
|
|
48
27
|
export default UploadFile;
|