From 092cb5d12aa1148fe5e382f22bb75612ace3e96f Mon Sep 17 00:00:00 2001 From: russfraze Date: Tue, 11 Jun 2024 11:15:57 -0700 Subject: [PATCH 1/5] add loading animation to upload doc modal --- package-lock.json | 11 +++++++---- src/components/Modals/UploadDocumentModal.jsx | 2 ++ src/components/Notification/LoadingAnimation.jsx | 10 +++++++++- 3 files changed, 18 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index b28e2f47a..f95663b14 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5477,7 +5477,9 @@ } }, "node_modules/caniuse-lite": { - "version": "1.0.30001561", + "version": "1.0.30001632", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001632.tgz", + "integrity": "sha512-udx3o7yHJfUxMLkGohMlVHCvFvWmirKh9JAH/d7WOLPetlH+LTL5cocMZ0t7oZx/mdlOWXti97xLZWc8uURRHg==", "funding": [ { "type": "opencollective", @@ -5491,8 +5493,7 @@ "type": "github", "url": "https://github.com/sponsors/ai" } - ], - "license": "CC-BY-4.0" + ] }, "node_modules/canonicalize": { "version": "2.0.0", @@ -18575,7 +18576,9 @@ "version": "1.0.1" }, "caniuse-lite": { - "version": "1.0.30001561" + "version": "1.0.30001632", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001632.tgz", + "integrity": "sha512-udx3o7yHJfUxMLkGohMlVHCvFvWmirKh9JAH/d7WOLPetlH+LTL5cocMZ0t7oZx/mdlOWXti97xLZWc8uURRHg==" }, "canonicalize": { "version": "2.0.0", diff --git a/src/components/Modals/UploadDocumentModal.jsx b/src/components/Modals/UploadDocumentModal.jsx index f2a531b07..2d408caab 100644 --- a/src/components/Modals/UploadDocumentModal.jsx +++ b/src/components/Modals/UploadDocumentModal.jsx @@ -20,6 +20,7 @@ import { useTheme } from '@mui/material/styles'; // Context Imports import { DocumentListContext } from '@contexts'; // Component Imports +import { LoadingAnimation } from '@components/Notification'; import ModalBase from './ModalBase'; import { DocumentSelection, FormSection } from '../Form'; import UploadButtonGroup from './UploadButtonGroup'; @@ -222,6 +223,7 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { + {processing && } ); diff --git a/src/components/Notification/LoadingAnimation.jsx b/src/components/Notification/LoadingAnimation.jsx index b14108be3..b384f7efc 100644 --- a/src/components/Notification/LoadingAnimation.jsx +++ b/src/components/Notification/LoadingAnimation.jsx @@ -33,7 +33,15 @@ const LoadingAnimation = ({ loadingItem, children }) => ( padding: '20px' }} > - + Loading {loadingItem}... From 8ece8ab7a7469e6278730ceacaeb5265e1d4fc05 Mon Sep 17 00:00:00 2001 From: russfraze Date: Mon, 1 Jul 2024 13:31:48 -0700 Subject: [PATCH 2/5] modal overlay changes --- src/components/Modals/UploadDocumentModal.jsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/Modals/UploadDocumentModal.jsx b/src/components/Modals/UploadDocumentModal.jsx index 2d408caab..09b4313f2 100644 --- a/src/components/Modals/UploadDocumentModal.jsx +++ b/src/components/Modals/UploadDocumentModal.jsx @@ -7,6 +7,7 @@ import ClearIcon from '@mui/icons-material/Clear'; import DialogActions from '@mui/material/DialogActions'; import FileUploadIcon from '@mui/icons-material/FileUpload'; import FormControl from '@mui/material/FormControl'; +import Backdrop from '@mui/material/Backdrop'; // import FormControlLabel from '@mui/material/FormControlLabel'; import FormHelperText from '@mui/material/FormHelperText'; // import Switch from '@mui/material/Switch'; @@ -223,8 +224,12 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { - {processing && } + {/* {processing && } */} + {/* */} + + + ); }; From 7318a3fc2ac53fd9c2644ec1242722714a6f12f3 Mon Sep 17 00:00:00 2001 From: russfraze Date: Mon, 2 Dec 2024 15:17:57 -0800 Subject: [PATCH 3/5] is modal prop --- src/components/Modals/UploadDocumentModal.jsx | 4 +--- src/components/Notification/LoadingAnimation.jsx | 5 +++-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/src/components/Modals/UploadDocumentModal.jsx b/src/components/Modals/UploadDocumentModal.jsx index 09b4313f2..57589a24a 100644 --- a/src/components/Modals/UploadDocumentModal.jsx +++ b/src/components/Modals/UploadDocumentModal.jsx @@ -224,11 +224,9 @@ const UploadDocumentModal = ({ showModal, setShowModal }) => { - {/* {processing && } */} - {/* */} - + ); diff --git a/src/components/Notification/LoadingAnimation.jsx b/src/components/Notification/LoadingAnimation.jsx index b384f7efc..52951dfb9 100644 --- a/src/components/Notification/LoadingAnimation.jsx +++ b/src/components/Notification/LoadingAnimation.jsx @@ -18,11 +18,12 @@ import Typography from '@mui/material/Typography'; * @name LoadingAnimation * @param {object} Props - Component props for LoadingAnimation * @param {string} Props.loadingItem - The name of what you plan on loading + * @param Props.isModal * @param {React.JSX.Element} [Props.children] - If used as a provider, wrapped * component will be used as the animation * @returns {React.ReactElement} Div of what is currently loading */ -const LoadingAnimation = ({ loadingItem, children }) => ( +const LoadingAnimation = ({ loadingItem, children, isModal }) => ( ( display: 'inline-block', mx: '2px', padding: '20px', - backgroundColor: 'background.tint' + backgroundColor: isModal ? 'background.tint' : 'background.main' }} > From 2de29d83f7e7ac969d5c48207862b26874bc844e Mon Sep 17 00:00:00 2001 From: russfraze Date: Mon, 2 Dec 2024 15:35:41 -0800 Subject: [PATCH 4/5] prop fix --- src/components/Notification/LoadingAnimation.jsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Notification/LoadingAnimation.jsx b/src/components/Notification/LoadingAnimation.jsx index 52951dfb9..101aab95d 100644 --- a/src/components/Notification/LoadingAnimation.jsx +++ b/src/components/Notification/LoadingAnimation.jsx @@ -18,6 +18,7 @@ import Typography from '@mui/material/Typography'; * @name LoadingAnimation * @param {object} Props - Component props for LoadingAnimation * @param {string} Props.loadingItem - The name of what you plan on loading + * @param {boolean} Props.isModal - The name of what you plan on loading * @param Props.isModal * @param {React.JSX.Element} [Props.children] - If used as a provider, wrapped * component will be used as the animation From d16d7dbfe9d75ebcad4be54ba4363437d575812d Mon Sep 17 00:00:00 2001 From: russfraze Date: Mon, 2 Dec 2024 15:44:27 -0800 Subject: [PATCH 5/5] is modal true --- src/components/Notification/LoadingAnimation.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Notification/LoadingAnimation.jsx b/src/components/Notification/LoadingAnimation.jsx index 101aab95d..f43ab8e29 100644 --- a/src/components/Notification/LoadingAnimation.jsx +++ b/src/components/Notification/LoadingAnimation.jsx @@ -18,7 +18,7 @@ import Typography from '@mui/material/Typography'; * @name LoadingAnimation * @param {object} Props - Component props for LoadingAnimation * @param {string} Props.loadingItem - The name of what you plan on loading - * @param {boolean} Props.isModal - The name of what you plan on loading + * @param {boolean} Props.isModal - If component is used in modal * @param Props.isModal * @param {React.JSX.Element} [Props.children] - If used as a provider, wrapped * component will be used as the animation