Skip to content

Commit

Permalink
Merge pull request #965 from OpenSignLabs/multiuser_issue
Browse files Browse the repository at this point in the history 
fix: change send email hint, email validation, remove underline from stamp and image modal
  • Loading branch information
@prafull-opensignlabs
prafull-opensignlabs authored Jul 24, 2024
2 parents a334cda + 15d73ee commit c20611b
Show file tree
Hide file tree
Showing 5 changed files with 84 additions and 69 deletions.
27 changes: 18 additions & 9 deletions apps/OpenSign/public/static/js/public-template.bundle.js
View file

Large diffs are not rendered by default.

116 changes: 60 additions & 56 deletions apps/OpenSign/src/components/pdf/EmailComponent.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import React, { useState } from "react";
import { saveAs } from "file-saver";
import axios from "axios";
import { getBase64FromUrl } from "../../constant/Utils";
import { themeColor } from "../../constant/const";
import { themeColor, emailRegex } from "../../constant/const";
import printModule from "print-js";
import Loader from "../../primitives/Loader";
import ModalUi from "../../primitives/ModalUi";
Expand All @@ -19,8 +19,9 @@ function EmailComponent({
activeMailAdapter
}) {
const [emailList, setEmailList] = useState([]);
const [emailValue, setEmailValue] = useState();
const [emailValue, setEmailValue] = useState("");
const [isLoading, setIsLoading] = useState(false);
const [emailErr, setEmailErr] = useState(false);
//function for send email
const sendEmail = async () => {
setIsLoading(true);
Expand Down Expand Up @@ -111,17 +112,30 @@ function EmailComponent({
//function for get email value
const handleEmailValue = (e) => {
const value = e.target.value;
setEmailErr(false);
setEmailValue(value);
};

//function for save email in array after press enter
const handleEnterPress = (e) => {
const pattern = emailRegex;
const validate = emailValue?.match(pattern);
if (e.key === "Enter" && emailValue) {
setEmailList((prev) => [...prev, emailValue]);
setEmailValue("");
if (validate) {
const emailLowerCase = emailValue?.toLowerCase();
setEmailList((prev) => [...prev, emailLowerCase]);
setEmailValue("");
} else {
setEmailErr(true);
}
} else if (e === "add" && emailValue) {
setEmailList((prev) => [...prev, emailValue]);
setEmailValue("");
if (validate) {
const emailLowerCase = emailValue?.toLowerCase();
setEmailList((prev) => [...prev, emailLowerCase]);
setEmailValue("");
} else {
setEmailErr(true);
}
}
};

Expand Down Expand Up @@ -179,7 +193,6 @@ function EmailComponent({
Successfully signed!
</span>
<div className="flex flex-row">
<div></div>
{!isAndroid && (
<button
onClick={handleToPrint}
Expand All @@ -203,72 +216,63 @@ function EmailComponent({
Recipients added here will get a copy of the signed document.
</p>
{emailList.length > 0 ? (
<>
<div className="p-0 border-[1.5px] op-border-primary rounded w-full text-[15px]">
<div className="flex flex-row flex-wrap">
{emailList.map((data, ind) => {
return (
<div
className="flex flex-row items-center op-bg-primary m-[4px] rounded-md py-[5px] px-[10px]"
key={ind}
<div className="p-0 border-[1.5px] op-border-primary rounded w-full text-[15px]">
<div className="flex flex-row flex-wrap">
{emailList.map((data, ind) => {
return (
<div
className="flex flex-row items-center op-bg-primary m-[4px] rounded-md py-[5px] px-[10px]"
key={ind}
>
<span className="text-base-100 text-[13px]">
{data}
</span>
<span
className="text-base-100 text-[13px] font-semibold ml-[7px] cursor-pointer"
onClick={() => removeChip(ind)}
>
<span className="text-base-100 text-[13px]">
{data}
</span>
<span
className="text-base-100 text-[13px] font-semibold ml-[7px] cursor-pointer"
onClick={() => removeChip(ind)}
>
<i className="fa-light fa-xmark"></i>
</span>
</div>
);
})}
</div>
{emailList.length <= 9 && (
<input
type="text"
value={emailValue}
className="p-[10px] pb-[20px] rounded w-full text-[15px] bg-transparent outline-none"
onChange={handleEmailValue}
onKeyDown={handleEnterPress}
onBlur={() => {
if (emailValue) {
handleEnterPress("add");
}
}}
required
/>
)}
<i className="fa-light fa-xmark"></i>
</span>
</div>
);
})}
</div>
</>
{emailList.length <= 9 && (
<input
type="email"
value={emailValue}
className="p-[10px] pb-[20px] rounded w-full text-[15px] bg-transparent outline-none"
onChange={handleEmailValue}
onKeyDown={handleEnterPress}
onBlur={() => emailValue && handleEnterPress("add")}
required
/>
)}
</div>
) : (
<div>
<input
type="text"
type="email"
value={emailValue}
className="p-[10px] pb-[20px] rounded w-full text-[15px] outline-none bg-transparent border-[1.5px] op-border-primary"
onChange={handleEmailValue}
onKeyDown={handleEnterPress}
placeholder="Add the email addresses"
onBlur={() => {
if (emailValue) {
handleEnterPress("add");
}
}}
placeholder="Add an email address and hit enter"
onBlur={() => emailValue && handleEnterPress("add")}
required
/>
</div>
)}
{emailErr && (
<p className="text-xs text-[red] ml-1.5 mt-0.5">
please provide correct email address
</p>
)}
<button
className={`${
emailValue ? "cursor-pointer" : "cursor-default"
} op-btn op-btn-primary op-btn-sm m-2 shadow-md`}
onClick={() => {
if (emailValue) {
handleEnterPress("add");
}
}}
onClick={() => emailValue && handleEnterPress("add")}
>
<i className="fa-light fa-plus" aria-hidden="true"></i>
</button>
Expand Down
3 changes: 2 additions & 1 deletion apps/OpenSign/src/components/pdf/PlaceholderType.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import "../../styles/signature.css";
import RegexParser from "regex-parser";
import { emailRegex } from "../../constant/const";
const textWidgetCls =
"w-full h-full md:min-w-full md:min-h-full z-[999] text-[12px] rounded-[2px] border-[1px] border-[#007bff] overflow-hidden resize-none outline-none text-base-content item-center whitespace-pre-wrap";
const selectWidgetCls =
Expand Down Expand Up @@ -61,7 +62,7 @@ function PlaceholderType(props) {
if (validateType && validateType !== "text") {
switch (validateType) {
case "email":
regexValidation = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
regexValidation = emailRegex;
validateExpression(regexValidation);
break;
case "number":
Expand Down
6 changes: 3 additions & 3 deletions apps/OpenSign/src/components/pdf/SignPad.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,6 @@ function SignPad({
const isWidgetType = currWidgetsDetails?.type;
const signatureType = currWidgetsDetails?.signatureType;
const url = currWidgetsDetails?.SignUrl;

//checking widget type and draw type signature url
if (isInitial) {
if (isWidgetType === "initials" && signatureType === "draw" && url) {
Expand Down Expand Up @@ -299,8 +298,9 @@ function SignPad({
<div className="flex flex-row justify-between mt-[3px]">
<div className="flex flex-row justify-between gap-[5px] md:gap-[8px] text-[11px] md:text-base">
{isStamp ? (
<span className="op-link-primary op-link">
{widgetType === "image"
<span className="text-base-content font-bold text-lg">
{widgetType === "image" ||
currWidgetsDetails?.type === "image"
? "Upload image"
: "Upload stamp image"}
</span>
Expand Down
1 change: 1 addition & 0 deletions apps/OpenSign/src/constant/const.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ export const templateCls = "contracts_Template";
export const documentCls = "contracts_Document";
export const themeColor = "#47a3ad";
export const iconColor = "#686968";
export const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
export const isEnableSubscription = true;
// process.env.REACT_APP_ENABLE_SUBSCRIPTION &&
// process.env.REACT_APP_ENABLE_SUBSCRIPTION?.toLowerCase() === "true"
Expand Down

0 comments on commit c20611b

Please sign in to comment.