From ac0cdd28cf1e47235c85e38094d50e298e0b3681 Mon Sep 17 00:00:00 2001 From: RaktimaNXG Date: Tue, 5 Dec 2023 12:07:25 +0530 Subject: [PATCH 1/3] feat: mail button on header after sign document in signyourself flow --- .../src/Component/SignYourselfPdf.js | 1 + .../src/Component/component/emailComponent.js | 12 ++++- .../src/Component/component/header.js | 51 +++++++++++++++++-- .../SignDocuments/src/css/signature.css | 11 +++- 4 files changed, 68 insertions(+), 7 deletions(-) diff --git a/microfrontends/SignDocuments/src/Component/SignYourselfPdf.js b/microfrontends/SignDocuments/src/Component/SignYourselfPdf.js index e816f99d6..2d5bb3b2b 100644 --- a/microfrontends/SignDocuments/src/Component/SignYourselfPdf.js +++ b/microfrontends/SignDocuments/src/Component/SignYourselfPdf.js @@ -989,6 +989,7 @@ function SignYourSelf() { currentSigner={true} alreadySign={pdfUrl ? true : false} isSignYourself={true} + setIsEmail={setIsEmail} /> {/* className="hidePdf" */} diff --git a/microfrontends/SignDocuments/src/Component/component/emailComponent.js b/microfrontends/SignDocuments/src/Component/component/emailComponent.js index cb67fd0b3..9ae70a8da 100644 --- a/microfrontends/SignDocuments/src/Component/component/emailComponent.js +++ b/microfrontends/SignDocuments/src/Component/component/emailComponent.js @@ -68,10 +68,13 @@ function EmailComponent({ if (sendMail.data.result.status === "success") { setIsEmail(false); + setEmailValue(""); + setEmailCount(""); setSuccessEmail(true); setTimeout(() => { setSuccessEmail(false); - }, 3000); + }, 1000); + setIsLoading(false); } else if (sendMail.data.result.status === "error") { setIsLoading(false); @@ -81,6 +84,7 @@ function EmailComponent({ alert("Something went wrong!"); } }; + //function for remove email const removeChip = (index) => { const updateEmailCount = emailCount.filter((data, key) => key !== index); @@ -363,7 +367,11 @@ function EmailComponent({ }} type="button" className="finishBtn" - onClick={() => setIsEmail(false)} + onClick={() => { + setIsEmail(false); + setEmailValue(""); + setEmailCount(""); + }} > Close diff --git a/microfrontends/SignDocuments/src/Component/component/header.js b/microfrontends/SignDocuments/src/Component/component/header.js index d7f4724ed..fe6b0cab0 100644 --- a/microfrontends/SignDocuments/src/Component/component/header.js +++ b/microfrontends/SignDocuments/src/Component/component/header.js @@ -33,7 +33,8 @@ function Header({ currentSigner, dataTut4, alreadySign, - isSignYourself + isSignYourself, + setIsEmail }) { const isMobile = window.innerWidth < 767; const navigate = useNavigate(); @@ -329,9 +330,29 @@ function Header({ ) : ( isSignYourself && ( - - - + <> + + + + setIsEmail(true)} + > +
+ + Mail +
+ + ) )} Download + ) : (
diff --git a/microfrontends/SignDocuments/src/css/signature.css b/microfrontends/SignDocuments/src/css/signature.css index fb97f992e..cfaf4c14c 100644 --- a/microfrontends/SignDocuments/src/css/signature.css +++ b/microfrontends/SignDocuments/src/css/signature.css @@ -8,7 +8,16 @@ .penContainer { width: 460px; } - +.mailBtn{ + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18); + padding: 3px 15px !important; + background-color: rgb(79 190 241); + border: none !important; + color: white !important; +} +.mailBtn:hover { + box-shadow: 0 2px 4px rgba(154, 36, 36, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18); +} .signatureBtn { border: 1.5px solid #47a3ad; margin-bottom: 10px; From 428bb3b7c3e9f7e054c6aaad0debf7799156b0e5 Mon Sep 17 00:00:00 2001 From: RaktimaNXG Date: Tue, 5 Dec 2023 13:08:42 +0530 Subject: [PATCH 2/3] fix: design of sent mail message,change variable name emailCount to emailList --- .../src/Component/component/emailComponent.js | 28 ++++++++--------- .../src/Component/component/emailToast.js | 18 +++++++++++ .../src/Component/component/renderPdf.js | 31 ++----------------- .../SignDocuments/src/css/signature.css | 8 +++++ 4 files changed, 43 insertions(+), 42 deletions(-) create mode 100644 microfrontends/SignDocuments/src/Component/component/emailToast.js diff --git a/microfrontends/SignDocuments/src/Component/component/emailComponent.js b/microfrontends/SignDocuments/src/Component/component/emailComponent.js index 9ae70a8da..99b44872d 100644 --- a/microfrontends/SignDocuments/src/Component/component/emailComponent.js +++ b/microfrontends/SignDocuments/src/Component/component/emailComponent.js @@ -20,14 +20,14 @@ function EmailComponent({ pdfName, sender }) { - const [emailCount, setEmailCount] = useState([]); + const [emailList, setEmailList] = useState([]); const [emailValue, setEmailValue] = useState(); const [isLoading, setIsLoading] = useState(false); //function for send email const sendEmail = async () => { setIsLoading(true); let sendMail; - for (let i = 0; i < emailCount.length; i++) { + for (let i = 0; i < emailList.length; i++) { try { const imgPng = "https://qikinnovation.ams3.digitaloceanspaces.com/logo.png"; @@ -44,7 +44,7 @@ function EmailComponent({ let params = { pdfName: pdfName, url: pdfUrl, - recipient: emailCount[i], + recipient: emailList[i], subject: `${sender.name} has signed the doc - ${pdfName}`, from: sender.email, html: @@ -69,7 +69,7 @@ function EmailComponent({ if (sendMail.data.result.status === "success") { setIsEmail(false); setEmailValue(""); - setEmailCount(""); + setEmailList([]); setSuccessEmail(true); setTimeout(() => { setSuccessEmail(false); @@ -87,8 +87,8 @@ function EmailComponent({ //function for remove email const removeChip = (index) => { - const updateEmailCount = emailCount.filter((data, key) => key !== index); - setEmailCount(updateEmailCount); + const updateEmailCount = emailList.filter((data, key) => key !== index); + setEmailList(updateEmailCount); }; //function for get email value const handleEmailValue = (e) => { @@ -99,10 +99,10 @@ function EmailComponent({ //function for save email in array after press enter const handleEnterPress = (e) => { if (e.key === "Enter" && emailValue) { - setEmailCount((prev) => [...prev, emailValue]); + setEmailList((prev) => [...prev, emailValue]); setEmailValue(""); } else if (e === "add" && emailValue) { - setEmailCount((prev) => [...prev, emailValue]); + setEmailList((prev) => [...prev, emailValue]); setEmailValue(""); } }; @@ -253,7 +253,7 @@ function EmailComponent({ > Recipients added here will get a copy of the signed document.

- {emailCount.length > 0 ? ( + {emailList.length > 0 ? ( <>
- {emailCount.map((data, ind) => { + {emailList.map((data, ind) => { return (
- {emailCount.length <= 9 && ( + {emailList.length <= 9 && ( { setIsEmail(false); setEmailValue(""); - setEmailCount(""); + setEmailList([]); }} > Close