nurseitaly-components 0.0.4 → 0.0.6

package/dist/common/AppDropzone/AppDropzone.js

@@ -9,5 +9,5 @@ export default function AppDropzone({ folder, onClose, onSuccess, onError, accep
     const handleConfirm = () => {
         bodyRef.current?.upload();
     };
-    return (_jsx(AppModal, { title: title || t('modal.title'), className: "modal-upload", close: onClose, confirm: handleConfirm, disableConfirm: disableConfirm, alternativeButton: alternativeButton, children: _jsx(AppDropzoneBody, { ref: bodyRef, folder: folder, onSuccess: onSuccess, onError: onError, accept: accept, messages: messages, onDrop: onDrop, keepName: keepName, showConfirmButton: false }) }));
+    return (_jsx(AppModal, { title: title || t('modal.title', { defaultValue: 'Upload a file' }), className: "modal-upload", close: onClose, confirm: handleConfirm, disableConfirm: disableConfirm, alternativeButton: alternativeButton, children: _jsx(AppDropzoneBody, { ref: bodyRef, folder: folder, onSuccess: onSuccess, onError: onError, accept: accept, messages: messages, onDrop: onDrop, keepName: keepName, showConfirmButton: false }) }));
 }

package/dist/common/AppDropzone/AppDropzoneBody.js

@@ -66,9 +66,14 @@ function AppDropzoneBodyInner({ folder, onSuccess, onError, accept, messages, on
     };
     const resolveMessage = (key) => {
         const customMessage = messages?.[key]?.trim();
-        return customMessage || t(key);
+        return (customMessage ||
+            t(key, {
+                defaultValue: key === 'label.dropzone'
+                    ? 'Drag and drop or click to upload a file'
+                    : 'You are uploading the following file:',
+            }));
     };
-    return (_jsxs("div", { className: "dropzone-container", children: [!file && (_jsx(Dropzone, { onDrop: (acceptedFiles) => handleDrop(acceptedFiles), accept: accept, maxFiles: 1, children: ({ getRootProps, getInputProps }) => (_jsxs("div", { ...getRootProps(), className: "dropzone", children: [_jsx("input", { ...getInputProps() }), _jsx("span", { children: resolveMessage('label.dropzone') })] })) })), file && (_jsxs("div", { className: "uploaded-file", children: [preview && _jsx("img", { className: "preview", src: preview, alt: "" }), !preview && (_jsxs(_Fragment, { children: [_jsx("b", { children: resolveMessage('label.uploaded.file') }), _jsx("span", { children: file.name })] })), showConfirmButton && (_jsxs("div", { className: "buttons", children: [_jsx(Button, { onClick: handleCancel, text: t('common:button.cancel'), size: "small", mode: "outlined", color: "danger" }), _jsx(Button, { onClick: upload, text: t('common:button.confirm'), size: "small", mode: "outlined", disabled: disableConfirm })] }))] }))] }));
+    return (_jsxs("div", { className: "dropzone-container", children: [!file && (_jsx(Dropzone, { onDrop: (acceptedFiles) => handleDrop(acceptedFiles), accept: accept, maxFiles: 1, children: ({ getRootProps, getInputProps }) => (_jsxs("div", { ...getRootProps(), className: "dropzone", children: [_jsx("input", { ...getInputProps() }), _jsx("span", { children: resolveMessage('label.dropzone') })] })) })), file && (_jsxs("div", { className: "uploaded-file", children: [preview && _jsx("img", { className: "preview", src: preview, alt: "" }), !preview && (_jsxs(_Fragment, { children: [_jsx("b", { children: resolveMessage('label.uploaded.file') }), _jsx("span", { children: file.name })] })), showConfirmButton && (_jsxs("div", { className: "buttons", children: [_jsx(Button, { onClick: handleCancel, text: t('common:button.cancel', { defaultValue: 'Cancel' }), size: "small", mode: "outlined", color: "danger" }), _jsx(Button, { onClick: upload, text: t('common:button.confirm', { defaultValue: 'Confirm' }), size: "small", mode: "outlined", disabled: disableConfirm })] }))] }))] }));
 }
 const AppDropzoneBody = forwardRef(AppDropzoneBodyInner);
 export default AppDropzoneBody;

package/dist/common/AppToast/AppToast.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useContext, useEffect } from 'react';
+import { useContext, useEffect, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import ReactLoading from 'react-loading';
 import { ToastContainer, toast } from 'react-toastify';
@@ -7,75 +7,74 @@ import 'react-toastify/dist/ReactToastify.css';
 import CommonContext from '../../configs/CommonContext';
 import { messageAction } from '../../configs/sessionTypes';
 import { EMPTY_TOAST } from './ToastMessage';
+const LOADING_TOAST_ID = 'loading';
+const MESSAGE_TOAST_ID = 'app-message';
+const MESSAGE_AUTO_CLOSE_MS = 5000;
 export default function AppToast() {
     const { t } = useTranslation('common');
     const { dispatch, state } = useContext(CommonContext);
-    const handleClose = () => {
-        toast.dismiss();
+    const messageValueRef = useRef(state.message.value);
+    messageValueRef.current = state.message.value;
+    const clearMessage = () => {
+        if (!messageValueRef.current)
+            return;
         dispatch(messageAction(EMPTY_TOAST));
     };
-    const handleClipboard = () => {
-        navigator.clipboard.writeText(state.message.value);
-    };
     const getLoading = () => (_jsxs("div", { className: "d-flex", children: [_jsx(ReactLoading, { type: "spinningBubbles", color: "blue", height: 24, width: 24 }), _jsx("span", { className: "ms-3", children: state.toastLoadingText ?? t('generic.loading') })] }));
-    const attachCloseToEscape = () => {
+    useEffect(() => {
         const closeOnEscape = (e) => {
-            if (e.keyCode === 27)
-                handleClose();
+            if (e.key === 'Escape')
+                toast.dismiss(MESSAGE_TOAST_ID);
         };
         window.addEventListener('keydown', closeOnEscape);
         return () => window.removeEventListener('keydown', closeOnEscape);
-    };
-    useEffect(() => {
-        attachCloseToEscape();
     }, []);
     useEffect(() => {
         if (state.toastLoading) {
             toast(getLoading(), {
-                toastId: 'loading',
+                toastId: LOADING_TOAST_ID,
                 position: 'top-right',
                 autoClose: false,
-                hideProgressBar: false,
+                hideProgressBar: true,
                 closeOnClick: false,
                 pauseOnHover: true,
                 draggable: false,
-                progress: undefined,
                 theme: 'light',
             });
         }
         else {
-            toast.dismiss();
+            toast.dismiss(LOADING_TOAST_ID);
         }
     }, [state.toastLoading, state.toastLoadingText]);
     useEffect(() => {
-        if (state.message && state.message.value !== '') {
-            switch (state.message.type) {
-                case 'error':
-                    toast.error(state.message.value, {
-                        onClose: () => handleClose(),
-                        onClick: () => handleClipboard(),
-                    });
-                    break;
-                case 'warning':
-                    toast.warning(state.message.value, {
-                        onClose: () => handleClose(),
-                    });
-                    break;
-                case 'success':
-                    toast.success(state.message.value, {
-                        onClose: () => handleClose(),
-                    });
-                    break;
-                default:
-                    toast(state.message.value, {
-                        onClose: () => handleClose(),
-                    });
-                    break;
-            }
-        }
-        else {
-            dispatch(messageAction(EMPTY_TOAST));
+        if (!state.message?.value)
+            return;
+        const baseOptions = {
+            toastId: MESSAGE_TOAST_ID,
+            autoClose: MESSAGE_AUTO_CLOSE_MS,
+            closeOnClick: true,
+            pauseOnFocusLoss: false,
+            onClose: () => clearMessage(),
+        };
+        switch (state.message.type) {
+            case 'error':
+                toast.error(state.message.value, {
+                    ...baseOptions,
+                    onClick: () => {
+                        navigator.clipboard.writeText(state.message.value);
+                    },
+                });
+                break;
+            case 'warning':
+                toast.warning(state.message.value, baseOptions);
+                break;
+            case 'success':
+                toast.success(state.message.value, baseOptions);
+                break;
+            default:
+                toast(state.message.value, baseOptions);
+                break;
         }
     }, [state.message]);
-    return _jsx(ToastContainer, { closeOnClick: true });
+    return (_jsx(ToastContainer, { closeOnClick: true, autoClose: MESSAGE_AUTO_CLOSE_MS, pauseOnFocusLoss: false }));
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "nurseitaly-components",
   "private": false,
-  "version": "0.0.4",
+  "version": "0.0.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {