diff --git a/apps/OpenSign/package-lock.json b/apps/OpenSign/package-lock.json index 94de8ab4c..e5fb4cc1e 100644 --- a/apps/OpenSign/package-lock.json +++ b/apps/OpenSign/package-lock.json @@ -43,6 +43,7 @@ "react-scrollbars-custom": "^4.1.1", "react-select": "^5.8.0", "react-signature-canvas": "^1.0.6", + "react-tooltip": "^5.26.3", "reactour": "^1.19.2", "redux": "^4.2.1", "redux-thunk": "^2.4.2", @@ -20145,6 +20146,19 @@ } } }, + "node_modules/react-tooltip": { + "version": "5.26.3", + "resolved": "https://registry.npmjs.org/react-tooltip/-/react-tooltip-5.26.3.tgz", + "integrity": "sha512-MpYAws8CEHUd/RC4GaDCdoceph/T4KHM5vS5Dbk8FOmLMvvIht2ymP2htWdrke7K6lqPO8rz8+bnwWUIXeDlzg==", + "dependencies": { + "@floating-ui/dom": "^1.6.1", + "classnames": "^2.3.0" + }, + "peerDependencies": { + "react": ">=16.14.0", + "react-dom": ">=16.14.0" + } + }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", diff --git a/apps/OpenSign/package.json b/apps/OpenSign/package.json index 80baff0ab..b1c11a070 100644 --- a/apps/OpenSign/package.json +++ b/apps/OpenSign/package.json @@ -38,6 +38,7 @@ "react-scrollbars-custom": "^4.1.1", "react-select": "^5.8.0", "react-signature-canvas": "^1.0.6", + "react-tooltip": "^5.26.3", "reactour": "^1.19.2", "redux": "^4.2.1", "redux-thunk": "^2.4.2", diff --git a/apps/OpenSign/src/components/shared/fields/CreateFolder.js b/apps/OpenSign/src/components/shared/fields/CreateFolder.js index 80af92051..ec70bef19 100644 --- a/apps/OpenSign/src/components/shared/fields/CreateFolder.js +++ b/apps/OpenSign/src/components/shared/fields/CreateFolder.js @@ -11,6 +11,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { const [name, setName] = useState(""); const [folderList, setFolderList] = useState([]); const [isAlert, setIsAlert] = useState(false); + const [isLoader, setIsLoader] = useState(false); const [selectedParent, setSelectedParent] = useState(); const [alert, setAlert] = useState({ type: "info", message: "" }); useEffect(() => { @@ -42,6 +43,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { }; const handleCreateFolder = async (event) => { event.preventDefault(); + handleLoader(true); if (name) { const currentUser = Parse.User.current(); const exsitQuery = new Parse.Query(folderCls); @@ -52,7 +54,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { } const templExist = await exsitQuery.first(); if (templExist) { - setAlert({ type: "dange", message: "Folder already exist!" }); + setAlert({ type: "danger", message: "Folder already exist!" }); setIsAlert(true); setTimeout(() => { setIsAlert(false); @@ -74,6 +76,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { template.set("CreatedBy", Parse.User.createWithoutData(currentUser.id)); const res = await template.save(); if (res) { + handleLoader(false); setAlert({ type: "success", message: "Folder created successfully!" @@ -88,6 +91,7 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { } } } else { + handleLoader(false); setAlert({ type: "info", message: "Please fill folder name" }); setIsAlert(true); setTimeout(() => { @@ -98,10 +102,21 @@ const CreateFolder = ({ parentFolderId, onSuccess, folderCls }) => { const handleOptions = (e) => { setSelectedParent(e.target.value); }; + const handleLoader = (status) => { + setIsLoader(status); + }; return (
{isAlert && {alert.message}} -
+
+ {isLoader && ( +
+
+
+ )}

Create Folder