@swan-io/shared-business 11.3.0 → 11.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/shared-business",
-  "version": "11.3.0",
+  "version": "11.3.2",
   "engines": {
     "node": ">=20.9.0",
     "pnpm": "^9.13.0"
@@ -26,13 +26,13 @@
   ],
   "license": "MIT",
   "peerDependencies": {
-    "@swan-io/lake": "11.3.0"
+    "@swan-io/lake": "11.3.2"
   },
   "dependencies": {
-    "@formatjs/intl": "^3.1.0",
+    "@formatjs/intl": "^3.1.3",
     "@placekit/client-js": "^2.3.0",
     "@swan-io/boxed": "^3.2.0",
-    "@swan-io/request": "^1.0.6",
+    "@swan-io/request": "^2.0.0",
     "@swan-io/use-form": "^3.1.0",
     "dayjs": "^1.11.13",
     "iban": "^0.0.14",
@@ -42,16 +42,16 @@
     "react-dropzone": "^14.3.5",
     "react-native-web": "^0.19.13",
     "rifm": "^0.12.1",
-    "ts-pattern": "^5.6.0",
-    "uuid": "^11.0.4"
+    "ts-pattern": "^5.6.1",
+    "uuid": "^11.0.5"
   },
   "devDependencies": {
     "@types/iban": "0.0.35",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
     "@types/react-native": "^0.72.8",
-    "jsdom": "^25.0.1",
-    "vitest": "^2.1.8",
-    "@swan-io/lake": "11.3.0"
+    "jsdom": "^26.0.0",
+    "vitest": "^3.0.2",
+    "@swan-io/lake": "11.3.2"
   }
 }

package/src/components/ChoicePicker.js

@@ -107,6 +107,7 @@ export const ChoicePicker = ({ tile = true, items, getId = identity, large = fal
     const containerRef = useRef(null);
     const { desktop } = useResponsive(breakpoints.medium);
     const [mobilePosition, setMobilePosition] = useState("start");
+    // biome-ignore lint/correctness/useExhaustiveDependencies:
     useEffect(() => {
         if (desktop) {
             return;
@@ -126,7 +127,7 @@ export const ChoicePicker = ({ tile = true, items, getId = identity, large = fal
             onChange(items[0]);
         }
         // disable exhaustive-deps because we only want to run this effect only when screen size go from desktop to mobile
-    }, [desktop]); // eslint-disable-line react-hooks/exhaustive-deps
+    }, [desktop]);
     const onScroll = () => {
         // prevent scroll event when we change screen size from mobile to desktop
         if (desktop) {

package/src/components/FileInput.js

@@ -114,7 +114,10 @@ export const FileInput = ({ icon = "document-regular", accept, value, disabled =
             .exhaustive();
     }, [value]);
     const { getRootProps, getInputProps, isDragActive, fileRejections } = useDropzone({
-        accept: accept.reduce((acc, item) => ({ ...acc, [item]: [] }), {}),
+        accept: accept.reduce((acc, item) => {
+            acc[item] = [];
+            return acc;
+        }, {}),
         onDropAccepted: onFiles,
         onDropRejected: onError,
         disabled,

package/src/components/FileTile.js

@@ -39,7 +39,7 @@ const styles = StyleSheet.create({
     progress: {
         height: 4,
         transitionProperty: "width",
-        transitionDuration: "300ms",
+        transitionDuration: "1000ms",
         transitionTimingFunction: "ease-in-out",
         borderRadius: 2,
         backgroundColor: colors.current[500],
@@ -52,7 +52,7 @@ export const FileTile = ({ file: { id, statusInfo, name, url }, showId = false,
     const [isDeleting, setIsDeleting] = useState(false);
     const [isDeleteModalVisible, setIsDeleteModalVisible] = useState(false);
     const onPressRemove = useCallback(() => {
-        if (onRemove != undefined) {
+        if (onRemove != null) {
             setIsDeleting(true);
             onRemove().tap(() => {
                 setIsDeleting(false);

package/src/components/FilesUploader.js

@@ -22,7 +22,7 @@ const FilesUploaderWithRef = ({ maxSize, accept, icon, getUploadConfig, onRemove
             return;
         }
         const onChange = onChangeRef.current;
-        if (onChange != undefined) {
+        if (onChange != null) {
             onChange(files);
         }
     }, [files]);
@@ -30,7 +30,7 @@ const FilesUploaderWithRef = ({ maxSize, accept, icon, getUploadConfig, onRemove
                             files.forEach(file => {
                                 upload(getUploadConfig(file), file);
                             });
-                        }, accept: accept, icon: icon, description: formatAndSizeDescription, maxSize: maxSize }), _jsx(Space, { height: 12 })] })) : null, files.map((file, index) => (_jsxs(Fragment, { children: [index > 0 ? _jsx(Space, { height: 12 }) : null, _jsx(FileTile, { file: file, showId: showIds, onRemove: onRemoveFile != undefined && file.statusInfo.status === "Uploaded"
+                        }, accept: accept, icon: icon, description: formatAndSizeDescription, maxSize: maxSize }), _jsx(Space, { height: 12 })] })) : null, files.map((file, index) => (_jsxs(Fragment, { children: [index > 0 ? _jsx(Space, { height: 12 }) : null, _jsx(FileTile, { file: file, showId: showIds, onRemove: onRemoveFile != null && file.statusInfo.status === "Uploaded"
                             ? () => onRemoveFile(file).tapOk(() => {
                                 remove(file.id);
                             })

package/src/components/LakeModal.js

@@ -136,5 +136,5 @@ export const LakeModal = ({ visible, icon, title, color = "current", children, m
     if (rootElement == null) {
         return null;
     }
-    return (_jsx(Portal, { container: rootElement, children: _jsxs(View, { "aria-modal": true, style: [styles.container, !visible && styles.inert], children: [_jsx(TransitionView, { style: styles.fill, enter: styles.overlayEnter, leave: styles.overlayLeave, children: visible ? _jsx(View, { style: styles.overlay }) : null }), _jsx(Suspendable, { fallback: _jsx(LoadingView, { color: backgroundColor.accented, delay: 0 }), children: _jsx(TransitionView, { style: styles.fill, enter: styles.modalEnter, leave: styles.modalLeave, children: visible ? (_jsx(ResponsiveContainer, { style: styles.root, breakpoint: breakpoints.tiny, children: ({ large, small }) => (_jsx(FocusTrap, { autoFocus: true, focusLock: true, returnFocus: true, onEscapeKey: onPressClose, style: styles.trap, children: _jsxs(ScrollView, { style: styles.modalContainer, contentContainerStyle: large ? styles.modalContentContainer : styles.modalContentContainerSmall, children: [onPressClose != null ? (_jsx(Pressable, { onPress: onPressClose, style: styles.pressableOverlay })) : null, _jsxs(View, { role: "dialog", style: [large ? styles.modal : styles.modalSmall, { maxWidth }], children: [_jsxs(View, { style: styles.modalHeader, children: [_jsxs(View, { style: styles.modalIconTitle, children: [icon != null ? (_jsx(Icon, { name: icon, size: large ? 40 : 32, color: colors[color][500] })) : null, icon != null && title != null ? _jsx(Space, { height: 12 }) : null, title != null ? (_jsxs(_Fragment, { children: [_jsx(LakeHeading, { level: 2, variant: "h3", children: title }), _jsx(Space, { height: 12 })] })) : null] }), onPressClose != null ? (_jsx(LakeButton, { style: styles.closeButton, mode: "tertiary", onPress: onPressClose, icon: "lake-close", ariaLabel: t("common.close") })) : null] }), typeof children == "function" ? children({ large, small }) : children] })] }) })) })) : null }) })] }) }));
+    return (_jsx(Portal, { container: rootElement, children: _jsxs(View, { "aria-modal": true, style: [styles.container, !visible && styles.inert], children: [_jsx(TransitionView, { style: styles.fill, enter: styles.overlayEnter, leave: styles.overlayLeave, children: visible ? _jsx(View, { style: styles.overlay }) : null }), _jsx(Suspendable, { fallback: _jsx(LoadingView, { color: backgroundColor.accented, delay: 0 }), children: _jsx(TransitionView, { style: styles.fill, enter: styles.modalEnter, leave: styles.modalLeave, children: visible ? (_jsx(ResponsiveContainer, { style: styles.root, breakpoint: breakpoints.tiny, children: ({ large, small }) => (_jsx(FocusTrap, { autoFocus: true, focusLock: true, returnFocus: true, onEscapeKey: onPressClose, style: styles.trap, children: _jsxs(ScrollView, { style: styles.modalContainer, contentContainerStyle: large ? styles.modalContentContainer : styles.modalContentContainerSmall, children: [onPressClose != null ? (_jsx(Pressable, { onPress: onPressClose, style: styles.pressableOverlay })) : null, _jsxs(View, { role: "dialog", style: [large ? styles.modal : styles.modalSmall, { maxWidth }], children: [_jsxs(View, { style: styles.modalHeader, children: [_jsxs(View, { style: styles.modalIconTitle, children: [icon != null ? (_jsx(Icon, { name: icon, size: large ? 40 : 32, color: colors[color][500] })) : null, icon != null && title != null ? _jsx(Space, { height: 12 }) : null, title != null ? (_jsxs(_Fragment, { children: [_jsx(LakeHeading, { level: 2, variant: "h3", children: title }), _jsx(Space, { height: 12 })] })) : null] }), onPressClose != null ? (_jsx(LakeButton, { style: styles.closeButton, mode: "tertiary", onPress: onPressClose, icon: "lake-close", ariaLabel: t("common.close") })) : null] }), typeof children === "function" ? children({ large, small }) : children] })] }) })) })) : null }) })] }) }));
 };

package/src/components/SupportChat.js

@@ -14,6 +14,7 @@ const zendeskFieldMapping = {
 };
 const [zendeskApi, setZendeskApi] = Deferred.make();
 export const SupportChat = ({ children, accentColor, type, additionalInfo }) => {
+    // biome-ignore lint/correctness/useExhaustiveDependencies(zE):
     useEffect(() => {
         const script = document.createElement("script");
         script.id = "ze-snippet";
@@ -21,7 +22,7 @@ export const SupportChat = ({ children, accentColor, type, additionalInfo }) =>
         document.body.append(script);
         script.addEventListener("load", () => {
             const intervalId = setInterval(() => {
-                if (typeof zE != "undefined") {
+                if (typeof zE !== "undefined") {
                     setZendeskApi(zE);
                     clearInterval(intervalId);
                 }
@@ -37,6 +38,7 @@ export const SupportChat = ({ children, accentColor, type, additionalInfo }) =>
             color: { theme: accentColor !== null && accentColor !== void 0 ? accentColor : "#26232f" },
         };
     }, [accentColor]);
+    // biome-ignore lint/correctness/useExhaustiveDependencies(zE):
     useEffect(() => {
         const { firstName, lastName, email, projectName, ...fieldInfos } = additionalInfo;
         const values = Dict.entries({ ...fieldInfos, email });
@@ -74,6 +76,7 @@ export const SupportChat = ({ children, accentColor, type, additionalInfo }) =>
             }
         });
     }, [accentColor, additionalInfo]);
+    // biome-ignore lint/correctness/useExhaustiveDependencies(zE):
     const onPressShow = useCallback(() => {
         try {
             zE("webWidget", "show");

package/src/components/SupportingDocumentCollection.js

@@ -41,21 +41,11 @@ const Help = (props) => {
 };
 export const getSupportingDocumentPurposeLabel = (purpose) => {
     const key = `supportingDocuments.purpose.${purpose}`;
-    if (isTranslationKey(key)) {
-        return t(key);
-    }
-    else {
-        return purpose;
-    }
+    return isTranslationKey(key) ? t(key) : purpose;
 };
 export const getSupportingDocumentPurposeDescriptionLabel = (purpose) => {
     const key = `supportingDocuments.purpose.${purpose}.description`;
-    if (isTranslationKey(key)) {
-        return t(key);
-    }
-    else {
-        return "";
-    }
+    return isTranslationKey(key) ? t(key) : "";
 };
 export const SupportingDocumentCollectionWithRef = ({ documents, generateUpload, uploadFile, requiredDocumentPurposes, templateLanguage = locale.language, status, onRemoveFile, showIds = false, readOnly = false, getPurposeMetadata, readonlyDocumentPurposes = [], }, ref) => {
     const [showPowerOfAttorneyModal, setShowPowerOfAttorneyModal] = useState(false);
@@ -141,7 +131,9 @@ export const SupportingDocumentCollectionWithRef = ({ documents, generateUpload,
                 return (_jsxs(Fragment, { children: [_jsx(LakeLabel, { label: getSupportingDocumentPurposeLabel(purpose), description: label, help: isNotNullish(metadata) ? (_jsx(Help, { type: "button", label: metadata.title, onPress: () => setCurrentMetadata(metadata) })) : (match(purpose)
                                 .with("PowerOfAttorney", () => (_jsx(Help, { type: "button", icon: "arrow-down-filled", label: t("supportingDocuments.help.downloadTemplate"), onPress: () => setShowPowerOfAttorneyModal(true) })))
                                 .with("SwornStatement", () => (_jsx(Help, { type: "button", icon: "arrow-down-filled", label: t("supportingDocuments.help.downloadTemplate"), onPress: () => setShowSwornStatementModal(true) })))
-                                .otherwise(() => null)), render: () => (_jsx(FilesUploader, { ref: ref => (filesUploaderRefByPurpose.current[purpose] = ref), 
+                                .otherwise(() => null)), render: () => (_jsx(FilesUploader, { ref: ref => {
+                                    filesUploaderRefByPurpose.current[purpose] = ref;
+                                }, 
                                 // Only allow uploading is the Supporting Document Collection awaits for docs
                                 // and that the specific purpose isn't already fully validated
                                 canUpload: !readonlyDocumentPurposes.includes(purpose) &&
@@ -149,16 +141,16 @@ export const SupportingDocumentCollectionWithRef = ({ documents, generateUpload,
                                     status === "WaitingForDocument" &&
                                     !areAllDocumentsValidated, accept: ACCEPTED_FORMATS, maxSize: 20000000, icon: "document-regular", initialFiles: files, generateUpload: generateUpload, getUploadConfig: file => ({ fileName: file.name, purpose }), uploadFile: isNotNullish(uploadFile)
                                     ? uploadFile
-                                    : ({ upload, file, onLoadStart, onProgress }) => {
+                                    : ({ upload, file, onProgress }) => {
                                         const body = new FormData();
                                         upload.fields.forEach(({ key, value }) => body.append(key, value));
                                         body.append("file", file);
+                                        setTimeout(() => onProgress(0.8), 100);
                                         return Request.make({
                                             url: upload.url,
                                             method: "POST",
-                                            onLoadStart,
-                                            onProgress,
                                             body,
+                                            type: "text",
                                         }).mapOkToResult(badStatusToError);
                                     }, formatAndSizeDescription: t("supportingDocuments.documentTypes", {
                                     maxSizeMB: 20000000 / 1000000,
@@ -171,6 +163,6 @@ export const SupportingDocumentCollectionWithRef = ({ documents, generateUpload,
                                 .with("fr", () => "fr")
                                 .with("de", () => "de")
                                 .with("es", () => "es")
-                                .otherwise(() => "en")}.pdf`), children: t("supportingDocuments.downloadTemplate") }) })] }), _jsxs(LakeModal, { visible: showSwornStatementModal, title: t("supportingDocuments.purpose.SwornStatement"), icon: "document-regular", onPressClose: () => setShowSwornStatementModal(false), children: [_jsx(LakeText, { children: t("supportingDocuments.purpose.SwornStatement.description") }), _jsx(Space, { height: 16 }), _jsx(LakeButtonGroup, { paddingBottom: 0, children: _jsx(LakeButton, { grow: true, color: "current", onPress: () => window.open("/sworn-statement-template/es.pdf"), children: t("supportingDocuments.downloadTemplate") }) })] }), _jsx(LakeModal, { visible: isNotNullish(currentMetadata), title: t("supportingDocuments.informations"), icon: "document-regular", onPressClose: () => setCurrentMetadata(undefined), children: _jsx(ReadOnlyFieldList, { children: currentMetadata === null || currentMetadata === void 0 ? void 0 : currentMetadata.values.map(({ title, value, type }) => (_jsx(LakeLabel, { type: "viewSmall", label: title, actions: type === "copy" && (_jsx(LakeCopyButton, { valueToCopy: value, copiedText: t("copyButton.copiedTooltip"), copyText: t("copyButton.copyTooltip") })), render: () => (_jsx(LakeText, { variant: "regular", color: colors.gray[900], children: value })) }))) }) })] }));
+                                .otherwise(() => "en")}.pdf`), children: t("supportingDocuments.downloadTemplate") }) })] }), _jsxs(LakeModal, { visible: showSwornStatementModal, title: t("supportingDocuments.purpose.SwornStatement"), icon: "document-regular", onPressClose: () => setShowSwornStatementModal(false), children: [_jsx(LakeText, { children: t("supportingDocuments.purpose.SwornStatement.description") }), _jsx(Space, { height: 16 }), _jsx(LakeButtonGroup, { paddingBottom: 0, children: _jsx(LakeButton, { grow: true, color: "current", onPress: () => window.open("/sworn-statement-template/es.pdf"), children: t("supportingDocuments.downloadTemplate") }) })] }), _jsx(LakeModal, { visible: isNotNullish(currentMetadata), title: t("supportingDocuments.informations"), icon: "document-regular", onPressClose: () => setCurrentMetadata(undefined), children: _jsx(ReadOnlyFieldList, { children: currentMetadata === null || currentMetadata === void 0 ? void 0 : currentMetadata.values.map(({ title, value, type }, index) => (_jsx(LakeLabel, { type: "viewSmall", label: title, actions: type === "copy" && (_jsx(LakeCopyButton, { valueToCopy: value, copiedText: t("copyButton.copiedTooltip"), copyText: t("copyButton.copyTooltip") })), render: () => (_jsx(LakeText, { variant: "regular", color: colors.gray[900], children: value })) }, `metadata-${index}`))) }) })] }));
 };
 export const SupportingDocumentCollection = forwardRef(SupportingDocumentCollectionWithRef);

package/src/components/ToastStack.js

@@ -77,7 +77,7 @@ const Toast = memo(({ variant, uid, title, description, error, progress, onClose
     const [visibleState, setVisibleState] = useState("copy");
     const hasDescription = isNotNullishOrEmpty(description);
     const [requestId] = useState(() => {
-        if (error == undefined) {
+        if (error == null) {
             return Option.None();
         }
         return Array.findMap(errorsToArray(error), error => Option.fromNullable(getErrorToRequestId().get(error)));

package/src/hooks/useFilesUploader.d.ts

@@ -4,8 +4,7 @@ export type UploadFileInput<UploadOutput> = {
     id: string;
     upload: UploadOutput;
     file: File;
-    onLoadStart: (event: ProgressEvent<XMLHttpRequestEventTarget>) => void;
-    onProgress: (event: ProgressEvent<XMLHttpRequestEventTarget>) => void;
+    onProgress: (progress: number) => void;
 };
 export type UploadOutputWithId<UploadOutput> = {
     id: string;

package/src/hooks/useFilesUploader.js

@@ -15,7 +15,7 @@ export const useFilesUploader = (config) => {
         return config
             .generateUpload(uploadInput)
             .tapError(error => {
-            if (config.onError != undefined) {
+            if (config.onError != null) {
                 config.onError(error);
             }
         })
@@ -28,14 +28,14 @@ export const useFilesUploader = (config) => {
                     name: file.name,
                 },
             ]);
-            const onProgress = (event) => {
+            const onProgress = (progress) => {
                 setFiles(files => files.map(file => {
                     if (file.id !== id) {
                         return file;
                     }
                     return {
                         ...file,
-                        statusInfo: { status: "Uploading", progress: event.loaded / event.total },
+                        statusInfo: { status: "Uploading", progress },
                     };
                 }));
             };
@@ -44,7 +44,6 @@ export const useFilesUploader = (config) => {
                 id,
                 upload,
                 file,
-                onLoadStart: onProgress,
                 onProgress,
             })
                 .tapOk(() => {
@@ -59,7 +58,7 @@ export const useFilesUploader = (config) => {
                 }));
             })
                 .tapError(error => {
-                if (config.onError != undefined) {
+                if (config.onError != null) {
                     config.onError(error);
                 }
                 setFiles(files => files.filter(file => file.id !== id));