This commit is contained in:
prafull-opensignlabs
2025-09-29 04:47:23 +00:00
parent d1c405912b
commit d9fcc69ca4
35 changed files with 1370 additions and 1041 deletions
@@ -901,6 +901,10 @@
"thanks-for-feedback": "Danke für Ihr Feedback 🙏",
"share-your-feedback": "Teilen Sie Ihr Feedback",
"share-your-review": "Teilen Sie Ihre Bewertung",
"please-select-rating": "Bitte wählen Sie eine Bewertung aus",
"feedback-optional": "Feedback (optional)",
"feedback-saved": "Feedback wurde gespeichert.",
"feedback-save-error": "Feedback konnte nicht gespeichert werden, bitte versuchen Sie es erneut.",
"date-format": "Datumsformat",
"document-deleted": "Das Dokument wurde gelöscht oder Sie haben keinen Zugriff. Bitte kontaktieren Sie den Absender.",
"save-as-template-?": "Sind Sie sicher, dass Sie dieses Dokument als Vorlage speichern möchten?",
@@ -1216,6 +1220,15 @@
"p1": "Dies stellt sicher, dass das Abschlusszertifikat im endgültigen PDF-Dokument enthalten ist. Bitte beachten Sie jedoch, dass das Zertifikat nach dem Zusammenführen nicht mehr vom Hauptdokument getrennt werden kann.",
"p2": "Wenn Sie sich entscheiden, nicht zusammenzuführen, wird das Abschlusszertifikat als separate PDF-Datei zusammen mit dem unterzeichneten Dokument bereitgestellt."
},
"read-only-date-error": "Das schreibgeschützte Datums-Widget muss ein Standarddatum haben.",
"set-date": "Datum festlegen",
"set-today": "Unterzeichnungsdatum",
"enter-name": "Name eingeben",
"enter-email": "E-Mail eingeben"
}
"enter-email": "E-Mail eingeben",
"subscribe-to-opensign-msg": "Abonnieren Sie {{appName}} und genießen Sie unbegrenzt kostenlose digitale Signaturen.",
"duplicate-subscribe-msg": "Mit Duplizieren können Sie eine exakte Kopie der ausgewählten Vorlage erstellen, die Sie wiederverwenden oder ändern können, ohne das Original zu beeinflussen.",
"save-as-template-msg": "Speichern Sie dieses Dokument als wiederverwendbare Vorlage, die Sie für zukünftige Dokumente erneut nutzen können.",
"public-credit-alert": "Das Signieren über diesen Link verbraucht Ihre kostenlosen E-Mail-Credits. Als kostenloser Nutzer erhalten Sie 15 E-Mail-Credits pro Monat, um zu verhindern, dass Spammer unsere Systeme missbrauchen. Um höhere Limits und ununterbrochenen Zugriff zu genießen, abonnieren Sie die <1>OpenSign™-Bezahlpläne.</1>",
"know-more-about": "Mehr erfahren über",
"free-unlimited-signatures": "Kostenlose unbegrenzte Signaturen"
}
@@ -902,6 +902,10 @@
"thanks-for-feedback": "Thanks for your feedback 🙏",
"share-your-feedback": "Share your feedback",
"share-your-review": "Share your review",
"please-select-rating": "Please select a rating",
"feedback-optional": "Feedback (Optional)",
"feedback-saved": "Feedback has been saved.",
"feedback-save-error": "Unable to save feedback, please try again.",
"date-format": "Date format",
"document-deleted": "The document has been deleted or you don't have access. Please contact the sender.",
"save-as-template-?": "Are you sure you want to save this document as template?",
@@ -1208,8 +1212,8 @@
"enter-region-of-space": "Enter region of space",
"enter-access-key": "Enter access key",
"enter-secret-access-key": "Enter secret access key",
"otp-email":"Weve sent a verification code to",
"save-as-temp-warn":"Note: This document includes prefilled widgets, which will be automatically removed as they are already incorporated into the base document.",
"otp-email": "We've sent a verification code to",
"save-as-temp-warn": "Note: This document includes prefilled widgets, which will be automatically removed as they are already incorporated into the base document.",
"edit-document": "Edit document",
"modify": "Modify",
"merge-certificate-to-pdf": "Merge Certificate to PDF",
@@ -1217,6 +1221,15 @@
"p1": "This will ensure that the completion certificate is included in the final PDF document. However, please note that once merged, the certificate cannot be separated from the main document.",
"p2": "If you choose not to merge, the completion certificate will be provided as a separate PDF file along with the signed document."
},
"read-only-date-error": "Read-only date widget must have a default date.",
"set-date": "Set Date",
"set-today": "Signing Date",
"enter-name": "Enter name",
"enter-email": "Enter email"
}
"enter-email": "Enter email",
"subscribe-to-opensign-msg": "Subscribe to {{appName}} and enjoy unlimited free digital signatures.",
"duplicate-subscribe-msg": "Duplicate lets you create an exact copy of the selected template, allowing you to reuse or modify it without affecting the original.",
"save-as-template-msg": "Save this document as a reusable template that you can use again for future documents.",
"public-credit-alert": "Signing through this link consumes your free email credits. As a Free user, you are allotted 15 email credits per month to prevent spammers from abusing our systems. To enjoy higher limits and uninterrupted access, Subscribe to <1>OpenSign™ Paid plans.</1>",
"know-more-about": "Know more about",
"free-unlimited-signatures": "Free Unlimited Signatures"
}
@@ -902,6 +902,10 @@
"thanks-for-feedback": "Gracias por su comentario 🙏",
"share-your-feedback": "Comparta sus comentarios",
"share-your-review": "Comparta su reseña",
"please-select-rating": "Por favor seleccione una calificación",
"feedback-optional": "Comentarios (opcional)",
"feedback-saved": "Los comentarios han sido guardados.",
"feedback-save-error": "No se pudieron guardar los comentarios, inténtelo de nuevo.",
"date-format": "Formato de fecha",
"document-deleted": "El documento ha sido eliminado o no tiene acceso. Por favor, contacte al remitente.",
"save-as-template-?": "¿Está seguro de que desea guardar este documento como plantilla?",
@@ -1217,6 +1221,15 @@
"p1": "Esto garantizará que el certificado de finalización esté incluido en el documento PDF final. Sin embargo, tenga en cuenta que una vez combinado, el certificado no se podrá separar del documento principal.",
"p2": "Si elige no combinar, el certificado de finalización se proporcionará como un archivo PDF separado junto con el documento firmado."
},
"read-only-date-error": "El widget de fecha de solo lectura debe tener una fecha predeterminada.",
"set-date": "Establecer fecha",
"set-today": "Fecha de firma",
"enter-name": "Ingrese nombre",
"enter-email": "Ingrese correo electrónico"
}
"enter-email": "Ingrese correo electrónico",
"subscribe-to-opensign-msg": "Suscríbase a {{appName}} y disfrute de firmas digitales gratuitas ilimitadas.",
"duplicate-subscribe-msg": "Duplicar le permite crear una copia exacta de la plantilla seleccionada, lo que le permite reutilizarla o modificarla sin afectar al original.",
"save-as-template-msg": "Guarde este documento como una plantilla reutilizable que podrá usar nuevamente para futuros documentos.",
"public-credit-alert": "Firmar a través de este enlace consumirá sus créditos de correo electrónico gratuitos. Como usuario gratuito, se le asignan 15 créditos de correo electrónico por mes para evitar que los spammers abusen de nuestros sistemas. Para disfrutar de límites más altos y acceso ininterrumpido, suscríbase a los planes de pago de <1>OpenSign™.</1>",
"know-more-about": "Saber más sobre",
"free-unlimited-signatures": "¿Firmas ilimitadas gratis"
}
@@ -901,6 +901,10 @@
"thanks-for-feedback": "Merci pour votre retour 🙏",
"share-your-feedback": "Partagez votre avis",
"share-your-review": "Partagez votre avis",
"please-select-rating": "Veuillez sélectionner une note",
"feedback-optional": "Retour (optionnel)",
"feedback-saved": "Le retour a été enregistré.",
"feedback-save-error": "Impossible d'enregistrer le retour, veuillez réessayer.",
"date-format": "Format de date",
"document-deleted": "Le document a été supprimé ou vous n'y avez pas accès. Veuillez contacter l'expéditeur.",
"save-as-template-?": "Êtes-vous sûr de vouloir enregistrer ce document comme modèle ?",
@@ -1216,6 +1220,15 @@
"p1": "Cela garantira que le certificat de finalisation est inclus dans le document PDF final. Cependant, veuillez noter qu'une fois fusionné, le certificat ne peut plus être séparé du document principal.",
"p2": "Si vous choisissez de ne pas fusionner, le certificat de finalisation sera fourni sous forme de fichier PDF distinct accompagné du document signé."
},
"read-only-date-error": "Le widget de date en lecture seule doit avoir une date par défaut.",
"set-date": "Définir la date",
"set-today": "Date de signature",
"enter-name": "Saisir le nom",
"enter-email": "Saisir l'e-mail"
}
"enter-email": "Saisir l'e-mail",
"subscribe-to-opensign-msg": "Abonnez-vous à {{appName}} et profitez de signatures numériques gratuites illimitées.",
"duplicate-subscribe-msg": "Dupliquer vous permet de créer une copie exacte du modèle sélectionné, que vous pouvez réutiliser ou modifier sans affecter l'original.",
"save-as-template-msg": "Enregistrez ce document comme modèle réutilisable que vous pourrez utiliser à nouveau pour de futurs documents.",
"public-credit-alert": "Signer via ce lien consomme vos crédits e-mail gratuits. En tant qu'utilisateur gratuit, vous disposez de 15 crédits e-mail par mois afin dempêcher les spammeurs dabuser de nos systèmes. Pour profiter de limites plus élevées et d'un accès ininterrompu, abonnez-vous aux forfaits payants de <1>OpenSign™.</1>",
"know-more-about": "En savoir plus sur",
"free-unlimited-signatures": "Signatures illimitées gratuites"
}
@@ -901,6 +901,10 @@
"thanks-for-feedback": "आपकी प्रतिक्रिया के लिए धन्यवाद 🙏",
"share-your-feedback": "अपनी प्रतिक्रिया साझा करें",
"share-your-review": "अपनी समीक्षा साझा करें",
"please-select-rating": "कृपया एक रेटिंग चुनें",
"feedback-optional": "प्रतिक्रिया (वैकल्पिक)",
"feedback-saved": "प्रतिक्रिया सहेज ली गई है।",
"feedback-save-error": "प्रतिक्रिया सहेजी नहीं जा सकी, कृपया पुनः प्रयास करें।",
"date-format": "दिनांक प्रारूप",
"document-deleted": "दस्तावेज़ हटा दिया गया है या आपके पास पहुंच नहीं है। कृपया प्रेषक से संपर्क करें।",
"save-as-template-?": "क्या आप वाकई इस दस्तावेज़ को टेम्पलेट के रूप में सहेजना चाहते हैं?",
@@ -1216,7 +1220,15 @@
"p1": "यह सुनिश्चित करेगा कि पूर्णता प्रमाणपत्र अंतिम PDF दस्तावेज़ में शामिल हो। हालाँकि, कृपया ध्यान दें कि एक बार मिलाने के बाद, प्रमाणपत्र को मुख्य दस्तावेज़ से अलग नहीं किया जा सकता।",
"p2": "यदि आप मिलाना नहीं चुनते हैं, तो पूर्णता प्रमाणपत्र हस्ताक्षरित दस्तावेज़ के साथ एक अलग PDF फ़ाइल के रूप में प्रदान किया जाएगा।"
},
"read-only-date-error": "रीड-ओनली दिनांक विजेट में एक डिफ़ॉल्ट दिनांक होना आवश्यक है।",
"set-date": "दिनांक सेट करें",
"set-today": "हस्ताक्षर की तिथि",
"enter-name": "नाम दर्ज करें",
"enter-email": "ईमेल दर्ज करें"
}
"enter-email": "ईमेल दर्ज करें",
"subscribe-to-opensign-msg": "{{appName}} की सदस्यता लें और असीमित निःशुल्क डिजिटल हस्ताक्षरों का आनंद लें।",
"duplicate-subscribe-msg": "डुप्लिकेट करने से आप चयनित टेम्पलेट की एक सटीक प्रति बना सकते हैं, जिसे आप पुनः उपयोग या संशोधित कर सकते हैं बिना मूल को प्रभावित किए।",
"save-as-template-msg": "इस दस्तावेज़ को एक पुन: प्रयोज्य टेम्पलेट के रूप में सहेजें जिसे आप भविष्य के दस्तावेज़ों के लिए फिर से उपयोग कर सकते हैं।",
"public-credit-alert": "इस लिंक के माध्यम से हस्ताक्षर करने पर आपके निःशुल्क ईमेल क्रेडिट का उपभोग होगा। एक निःशुल्क उपयोगकर्ता के रूप में, आपको स्पैमर्स को हमारी प्रणाली का दुरुपयोग करने से रोकने के लिए प्रति माह 15 ईमेल क्रेडिट आवंटित किए जाते हैं। उच्च सीमा और निर्बाध पहुँच का आनंद लेने के लिए, <1>OpenSign™ पेड प्लान</1> की सदस्यता लें।",
"know-more-about": "इसके बारे में और जानें",
"free-unlimited-signatures": "मुफ़्त असीमित हस्ताक्षर"
}
@@ -901,6 +901,10 @@
"thanks-for-feedback": "Grazie per il tuo feedback 🙏",
"share-your-feedback": "Condividi il tuo feedback",
"share-your-review": "Condividi la tua recensione",
"please-select-rating": "Si prega di selezionare una valutazione",
"feedback-optional": "Feedback (opzionale)",
"feedback-saved": "Il feedback è stato salvato.",
"feedback-save-error": "Impossibile salvare il feedback, riprova.",
"date-format": "Formato data",
"document-deleted": "Il documento è stato eliminato o non hai accesso. Si prega di contattare il mittente.",
"save-as-template-?": "Sei sicuro di voler salvare questo documento come modello?",
@@ -1216,6 +1220,15 @@
"p1": "Questo garantirà che il certificato di completamento sia incluso nel documento PDF finale. Tuttavia, si noti che una volta unito, il certificato non può essere separato dal documento principale.",
"p2": "Se scegli di non unire, il certificato di completamento sarà fornito come file PDF separato insieme al documento firmato."
},
"read-only-date-error": "Il widget data di sola lettura deve avere una data predefinita.",
"set-date": "Imposta data",
"set-today": "Data di firma",
"enter-name": "Inserisci nome",
"enter-email": "Inserisci e-mail"
}
"enter-email": "Inserisci e-mail",
"subscribe-to-opensign-msg": "Abbonati a {{appName}} e goditi firme digitali gratuite illimitate.",
"duplicate-subscribe-msg": "Duplicare consente di creare una copia esatta del modello selezionato, permettendoti di riutilizzarlo o modificarlo senza influire sull'originale.",
"save-as-template-msg": "Salva questo documento come modello riutilizzabile che potrai usare di nuovo per documenti futuri.",
"public-credit-alert": "Firmare tramite questo link consumerà i tuoi crediti e-mail gratuiti. Come utente gratuito, ti vengono assegnati 15 crediti e-mail al mese per impedire agli spammer di abusare dei nostri sistemi. Per usufruire di limiti più elevati e accesso ininterrotto, abbonati ai piani a pagamento di <1>OpenSign™.</1>",
"know-more-about": "Scopri di più su",
"free-unlimited-signatures": "Firme illimitate gratuite"
}
+13 -3
View File
@@ -75,9 +75,12 @@ function Header(props) {
alert(t("only-pdf-allowed"));
return;
}
const mb = Math.round(file?.size / Math.pow(1024, 2));
if (mb > maxFileSize) {
alert(`${t("file-alert-1")} ${maxFileSize} MB`);
const fileSize =
maxFileSize;
const pdfsize = file?.size;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
@@ -134,6 +137,13 @@ function Header(props) {
useObjectStreams: false
});
const pdfBuffer = base64ToArrayBuffer(pdfBase64);
const pdfsize = pdfBuffer?.byteLength;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
props.setPdfArrayBuffer(pdfBuffer);
props.setPdfBase64Url(pdfBase64);
props.setIsUploadPdf && props.setIsUploadPdf(true);
+13 -3
View File
@@ -67,9 +67,12 @@ function PdfTools(props) {
alert(t("only-pdf-allowed"));
return;
}
const mb = Math.round(file?.size / Math.pow(1024, 2));
if (mb > maxFileSize) {
alert(`${t("file-alert-1")} ${maxFileSize} MB`);
const fileSize =
maxFileSize;
const pdfsize = file?.size;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
@@ -126,6 +129,13 @@ function PdfTools(props) {
useObjectStreams: false
});
const pdfBuffer = base64ToArrayBuffer(pdfBase64);
const pdfsize = pdfBuffer?.byteLength;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
props.setPdfArrayBuffer(pdfBuffer);
props.setPdfBase64Url(pdfBase64);
props.setIsUploadPdf && props.setIsUploadPdf(true);
+300 -145
View File
@@ -1,4 +1,4 @@
import { useState, useEffect } from "react";
import { useState, useEffect, forwardRef } from "react";
import BorderResize from "./BorderResize";
import { Rnd } from "react-rnd";
import {
@@ -15,7 +15,13 @@ import {
cellsWidget,
textWidget,
selectFormat,
randomId
randomId,
getYear,
getMonth,
months,
years,
getDefaultDate,
getDefaultFormat
} from "../../constant/Utils";
import PlaceholderType from "./PlaceholderType";
import moment from "moment";
@@ -29,47 +35,34 @@ import {
} from "../../redux/reducers/widgetSlice";
import { themeColor } from "../../constant/const";
import { useGuidelinesContext } from "../../context/GuidelinesContext";
//function to get default format
const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
//function to convert formated date to new Date() format
const getDefaultDate = (dateStr, format) => {
//get valid date format for moment to convert formated date to new Date() format
const formats = changeDateToMomentFormat(format);
const parsedDate = moment(dateStr, formats);
let date;
if (parsedDate.isValid()) {
date = new Date(parsedDate.toISOString());
return date;
} else {
date = new Date();
return date;
}
};
import DatePicker from "react-datepicker";
function Placeholder(props) {
const { t } = useTranslation();
const dispatch = useDispatch();
const prefillImg = useSelector((state) => state.widget.prefillImg);
const { showGuidelines } = useGuidelinesContext();
const statusArr = ["Required", "Optional"];
const widgetData =
props.pos?.options?.defaultValue || props.pos?.options?.response;
const [isDateModal, setIsDateModal] = useState(false);
const [containerScale, setContainerScale] = useState();
const [selectDate, setSelectDate] = useState({});
const [dateFormat, setDateFormat] = useState([]);
const [dateFormatList, setDateFormatList] = useState([]);
const [clickonWidget, setClickonWidget] = useState({});
const [isDateReadOnly, setIsDateReadOnly] = useState(
props?.pos?.options?.isReadOnly || false
const [formdata, setFormdata] = useState({
status: props?.pos?.options?.status || "required",
isReadOnly: props?.pos?.options?.isReadOnly || false
});
const [isToday, setIsToday] = useState(
props.pos?.options?.response === "today" ? true : false
);
const startDate = props?.pos?.options?.response
? getDefaultDate(
props?.pos?.options?.response,
props.pos?.options?.validation?.format
)
: new Date();
: "";
useEffect(() => {
const getPdfPageWidth = props.pdfOriginalWH.find(
(data) => data.pageNumber === props.pageNumber
@@ -102,29 +95,87 @@ function Placeholder(props) {
}
}, [widgetData]);
//function is used to convert date according to selected format
const handleGetFormatDate = (data, isDateChange) => {
const isSpecialDateFormat =
data?.format &&
["dd-MM-yyyy", "dd.MM.yyyy", "dd/MM/yyyy"].includes(data?.format);
let updateDate = data.date;
let date = "";
if (isSpecialDateFormat && updateDate) {
date = isDateChange
? moment(updateDate).format(changeDateToMomentFormat(data.format))
: updateDate;
} else if (updateDate) {
//using moment package is used to change date as per the format provided in selectDate obj e.g. - MM/dd/yyyy -> 03/12/2024
const newDate = new Date(updateDate);
date = moment(newDate.getTime()).format(
changeDateToMomentFormat(data?.format)
);
}
setSelectDate({ date: date, format: data?.format });
return date;
};
const saveDateSetting = (data) => {
if (formdata?.isReadOnly && !selectDate.date && !isToday) {
alert(t("read-only-date-error"));
return;
}
handleSaveDate(data);
setIsDateModal(false);
props.setFontColor("");
props.setFontSize("");
};
//function to save date and format on local array onchange date and onclick format
const handleSaveDate = (data, isDateChange) => {
const date = isToday ? "today" : handleGetFormatDate(data, isDateChange);
//`onChangeInput` is used to save data related to date in a placeholder field
onChangeInput(
date,
props.pos,
props.xyPosition,
props.index,
props.setXyPosition,
props.data && props.data.Id,
false,
data?.format,
props.fontSize || props.pos?.options?.fontSize || 12,
props.fontColor || props.pos?.options?.fontColor || "black",
formdata
);
};
//Date-picker- accept date - Thu Dec 30 2025 00:00:00 GMT+0530 (India Standard Time)
//if date have in this format - "30/12/2025"
//then first need to be convert in this format - Tue Dec 30 2025 00:00:00 GMT+0530 (India Standard Time)
//Using moment - moment("30/12/2025", "DD/MM/YYYY").toDate();
//moment package where we show date according to format in list
//it support date in this type - "2025-09-11"// ISO string, "2025-09-11T14:30:00" // ISO datetime
//function change format array list with selected date and format
const changeDateFormat = () => {
const updateDate = [];
dateFormatArr.map((data) => {
let date;
if (selectDate && selectDate.format === "dd-MM-yyyy") {
const [day, month, year] = selectDate.date.split("-");
let date = selectDate?.date || new Date();
const isString = typeof date === "string";
if (selectDate.format === "dd-MM-yyyy" && isString) {
const [day, month, year] = date.split("-");
date = new Date(`${year}-${month}-${day}`);
} else if (selectDate && selectDate.format === "dd.MM.yyyy") {
const [day, month, year] = selectDate.date.split(".");
} else if (selectDate.format === "dd.MM.yyyy" && isString) {
const [day, month, year] = date.split(".");
date = new Date(`${year}.${month}.${day}`);
} else if (selectDate && selectDate.format === "dd/MM/yyyy") {
const [day, month, year] = selectDate.date.split("/");
} else if (selectDate.format === "dd/MM/yyyy" && isString) {
const [day, month, year] = date.split("/");
date = new Date(`${year}/${month}/${day}`);
} else {
date = new Date(selectDate?.date);
date = selectDate?.date ? new Date(selectDate?.date) : new Date();
}
const milliseconds = date.getTime();
const newDate = moment(milliseconds).format(data);
const dateObj = { date: newDate, format: selectFormat(data) };
updateDate.push(dateObj);
});
setDateFormat(updateDate);
setDateFormatList(updateDate);
};
useEffect(() => {
@@ -287,41 +338,6 @@ function Placeholder(props) {
}
};
//function to save date and format on local array onchange date and onclick format
const handleSaveDate = (data, isDateChange) => {
const isSpecialDateFormat =
data?.format &&
["dd-MM-yyyy", "dd.MM.yyyy", "dd/MM/yyyy"].includes(data?.format);
let updateDate = data.date;
let date;
if (isSpecialDateFormat) {
date = isDateChange
? moment(updateDate).format(changeDateToMomentFormat(data.format))
: updateDate;
} else {
//using moment package is used to change date as per the format provided in selectDate obj e.g. - MM/dd/yyyy -> 03/12/2024
const newDate = new Date(updateDate);
date = moment(newDate.getTime()).format(
changeDateToMomentFormat(data?.format)
);
}
//`onChangeInput` is used to save data related to date in a placeholder field
onChangeInput(
date,
props.pos,
props.xyPosition,
props.index,
props.setXyPosition,
props.data && props.data.Id,
false,
data?.format,
props.fontSize || props.pos?.options?.fontSize || 12,
props.fontColor || props.pos?.options?.fontColor || "black",
isDateReadOnly || false
);
setSelectDate({ date: date, format: data?.format });
};
const setCellCount = (key, newCount) => {
props.setXyPosition((prev) => {
const isSignerList = prev.some((d) => d.signerPtr);
@@ -650,6 +666,40 @@ function Placeholder(props) {
return false;
}
};
const ExampleCustomInput = forwardRef(({ value, onClick }, ref) => (
<div
className="border-gray-400 rounded-[50px] border-[1px] px-3 md:ml-2 text-xs py-2 focus:outline-none hover:border-base-content "
onClick={onClick}
ref={ref}
>
{value}
<i className="fa-light fa-calendar ml-[5px]"></i>
</div>
));
ExampleCustomInput.displayName = "ExampleCustomInput";
const handleChangeFormat = (e) => {
const selectedIndex = e.target.value;
e.stopPropagation();
if (
props?.isPlaceholder &&
props?.data?.Role !== "prefill" &&
!selectDate?.date
) {
setSelectDate((prev) => ({
...prev,
format: dateFormatList[selectedIndex]?.format
}));
} else {
setSelectDate(dateFormatList[selectedIndex]);
}
};
const handleClearDate = () => {
setIsToday(false);
setSelectDate((prev) => ({
...prev,
date: ""
}));
};
return (
<>
{/* Check if a text widget (prefill type) exists. Once the user enters a value and clicks outside or the widget becomes non-selectable, it should appear as plain text (just like embedded text in a document). When the user clicks on the text again, it should become editable. */}
@@ -889,10 +939,8 @@ function Placeholder(props) {
(props?.isAlllowModify &&
!props?.assignedWidgetId.includes(props.pos.key))
}
setSelectDate={setSelectDate}
selectDate={selectDate}
startDate={startDate}
handleSaveDate={handleSaveDate}
xPos={props.xPos}
calculateFont={calculateFont}
setCellCount={setCellCount}
@@ -902,22 +950,18 @@ function Placeholder(props) {
)}
<ModalUi isOpen={isDateModal} title={t("widget-info")} showClose={false}>
<div className="text-base-content h-[100%] p-[20px]">
<div className="flex flex-col md:flex-row md:items-center gap-y-3">
<div className="flex flex-row items-center gap-x-1">
<div className="flex flex-col gap-3">
<div className="flex flex-col md:items-center md:flex-row gap-y-3">
<span className="capitalize">{t("format")} :</span>
<select
className="op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
className="op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs md:ml-4"
defaultValue={""}
onChange={(e) => {
const selectedIndex = e.target.value;
e.stopPropagation();
setSelectDate(dateFormat[selectedIndex]);
}}
onChange={(e) => handleChangeFormat(e)}
>
<option value="" disabled>
{t("select-date-format")}
</option>
{dateFormat.map((data, ind) => {
{dateFormatList.map((data, ind) => {
return (
<option className="text-[13px]" value={ind} key={ind}>
{data?.date ? data?.date : "nodata"}
@@ -925,79 +969,190 @@ function Placeholder(props) {
);
})}
</select>
<span className="text-xs text-gray-400 ml-1">
{selectDate.format}
</span>
</div>
<span className="text-xs text-gray-400 ml-1">
{selectDate.format}
</span>
</div>
<div className="flex flex-col md:flex-row gap-y-2 md:gap-y-0 gap-x-2 mt-3">
<div className="flex flex-row items-center">
<span className="capitalize">{t("font-size")} :</span>
<select
className="ml-[3px] md:ml:[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
value={props.fontSize || clickonWidget.options?.fontSize || 12}
onChange={(e) => props.setFontSize(parseInt(e.target.value))}
>
{fontsizeArr.map((size, ind) => (
<option className="text-[13px]" value={size} key={ind}>
{size}
</option>
))}
</select>
{props?.data?.Role !== "prefill" && props?.isPlaceholder && (
<>
<div className="flex flex-col md:flex-row md:items-center gap-2">
<span>{t("set-date")} :</span>
<DatePicker
renderCustomHeader={({ date, changeYear, changeMonth }) => (
<div className="flex justify-start md:ml-2 ">
<select
className="bg-transparent outline-none"
value={months[getMonth(date)]}
onChange={({ target: { value } }) =>
changeMonth(months.indexOf(value))
}
>
{months.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
<select
className="bg-transparent outline-none"
value={getYear(date)}
onChange={({ target: { value } }) =>
changeYear(value)
}
>
{years.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
</div>
)}
closeOnScroll={true}
selected={getDefaultDate(
selectDate?.date,
selectDate?.format
)}
popperPlacement="top-end"
customInput={<ExampleCustomInput />}
onChange={(date) => {
setIsToday(false);
const isDateChange = true;
const dateObj = {
date: date,
format: selectDate.format
};
handleGetFormatDate(dateObj, isDateChange);
}}
dateFormat={
selectDate
? selectDate?.format
: props.pos?.options?.validation?.format
? props.pos?.options?.validation?.format
: "MM/dd/yyyy"
}
portalId="root-portal"
/>
<label className=" flex items-center gap-1 cursor-pointer">
<input
checked={isToday}
type="checkbox"
className="op-checkbox op-checkbox-xs"
onClick={() => {
setSelectDate((prev) => ({
...prev,
date: ""
}));
setIsToday(!isToday);
}}
/>
<span className="ml-[2px]">{t("set-today")}</span>
</label>
<span
onClick={() => handleClearDate()}
className="underline text-blue-500 cursor-pointer md:ml-2"
>
{t("clear")}
</span>
</div>
<div className="flex flex-row items-center gap-[10px]">
{statusArr.map((data, ind) => {
return (
<div
key={ind}
className="flex flex-row gap-[5px] items-center"
>
<input
className="mr-[2px] op-radio op-radio-xs"
type="radio"
name="status"
onChange={() =>
setFormdata({
...formdata,
status: data.toLowerCase()
})
}
checked={
formdata.status.toLowerCase() === data.toLowerCase()
}
/>
<div className="text-[13px]">
{t(`widget-status.${data}`)}
</div>
</div>
);
})}
</div>
</>
)}
<div className="flex flex-col md:flex-row gap-y-2 md:gap-y-0 gap-x-2">
<div className="flex flex-row items-center">
<span className="capitalize">{t("font-size")} :</span>
<select
className="ml-[3px] md:ml:[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
value={
props.fontSize || clickonWidget.options?.fontSize || 12
}
onChange={(e) => props.setFontSize(parseInt(e.target.value))}
>
{fontsizeArr.map((size, ind) => (
<option className="text-[13px]" value={size} key={ind}>
{size}
</option>
))}
</select>
</div>
<div className="flex flex-row gap-1 items-center">
<span className="capitalize">{t("color")} :</span>
<select
value={
props.fontColor ||
clickonWidget.options?.fontColor ||
"black"
}
onChange={(e) => props.setFontColor(e.target.value)}
className="ml-[4px] md:ml[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
>
{fontColorArr.map((color, ind) => (
<option value={color} key={ind}>
{t(`color-type.${color}`)}
</option>
))}
</select>
<span
style={{
background:
props.fontColor || props.pos.options?.fontColor || "black"
}}
className="w-5 h-[19px] ml-1"
></span>
</div>
</div>
<div className="flex flex-row gap-1 items-center">
<span className="capitalize">{t("color")} :</span>
<select
value={
props.fontColor || clickonWidget.options?.fontColor || "black"
}
onChange={(e) => props.setFontColor(e.target.value)}
className="ml-[4px] md:ml[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
>
{fontColorArr.map((color, ind) => (
<option value={color} key={ind}>
{t(`color-type.${color}`)}
</option>
))}
</select>
<span
style={{
background:
props.fontColor || props.pos.options?.fontColor || "black"
}}
className="w-5 h-[19px] ml-1"
></span>
</div>
</div>
{props?.isPlaceholder && props?.data?.Role !== "prefill" && (
<div className="flex items-center mt-3">
<input
id="isReadOnly"
name="isReadOnly"
type="checkbox"
checked={
isDateReadOnly || props.pos.options?.isReadOnly || false
}
className="op-checkbox op-checkbox-xs"
onChange={() => setIsDateReadOnly(!isDateReadOnly)}
/>
<label
className="ml-1.5 mb-0 capitalize text-[13px]"
htmlFor="isreadonly"
>
{t("read-only")}
{props?.isPlaceholder && props?.data?.Role !== "prefill" && (
<label className="flex items-center gap-1 cursor-pointer">
<input
name="isReadOnly"
type="checkbox"
checked={formdata?.isReadOnly}
className="op-checkbox op-checkbox-xs"
onChange={() =>
setFormdata({
...formdata,
isReadOnly: !formdata?.isReadOnly
})
}
/>
<span className="capitalize ml-[2px]">{t("read-only")}</span>
</label>
</div>
)}
)}
</div>
<div className="h-[1px] w-full my-[15px] bg-[#9f9f9f]"></div>
<button
type="button"
className="op-btn op-btn-primary"
onClick={() => {
setIsDateModal(false);
handleSaveDate(selectDate);
props.setFontColor("");
props.setFontSize("");
saveDateSetting(selectDate);
}}
>
{t("save")}
@@ -34,8 +34,9 @@ function PlaceholderType(props) {
((props.isSelfSign || props.isNeedSign) &&
props.data?.signerObjId === props.signerObjId);
const isReadOnly =
props.pos.options?.isReadOnly ||
props.data?.signerObjId !== props.signerObjId;
props?.data?.Role !== "prefill" &&
(props.pos.options?.isReadOnly ||
props.data?.signerObjId !== props.signerObjId);
// prefer the latest response value over any default value
const widgetData =
props.pos?.options?.response ?? props.pos?.options?.defaultValue ?? "";
@@ -83,8 +84,7 @@ function PlaceholderType(props) {
color: fontColor,
fontFamily: "Arial, sans-serif"
}}
className={`${isReadOnly ? `select-none` : ``} ${selectWidgetCls} overflow-hidden`}
disabled={isReadOnly}
className={`${isReadOnly ? `select-none opacity-25` : ``} ${selectWidgetCls} overflow-hidden`}
onClick={onClick}
ref={ref}
>
@@ -399,11 +399,9 @@ function PlaceholderType(props) {
popperPlacement="top-end"
customInput={<ExampleCustomInput />}
dateFormat={
props.selectDate
? props.selectDate?.format
: props.pos?.options?.validation?.format
? props.pos?.options?.validation?.format
: "MM/dd/yyyy"
props?.selectDate?.format ||
props.pos?.options?.validation?.format ||
"MM/dd/yyyy"
}
/>
) : (
@@ -412,11 +410,9 @@ function PlaceholderType(props) {
className="select-none-cls overflow-hidden"
>
<span>
{props.selectDate
? props.selectDate?.format
: props.pos?.options?.validation?.format
? props.pos?.options?.validation?.format
: "MM/dd/yyyy"}
{props?.selectDate?.format ||
props.pos?.options?.validation?.format ||
"MM/dd/yyyy"}
</span>
</div>
);
@@ -53,7 +53,6 @@ function PrefillWidgetModal(props) {
const loadedSet = useRef(new Set());
const initializedRef = useRef(false); // prevent rerun on state updates
const prefillImg = useSelector((state) => state.widget.prefillImg);
const [uniqueWidget, setUniqueWidget] = useState([]);
const [image, setImage] = useState(null);
const [imageLoaders, setImageLoaders] = useState({});
const [currentWidget, setCurrentWidget] = useState("");
@@ -68,7 +67,7 @@ function PrefillWidgetModal(props) {
);
// useMemo to memoize the calculation of unique widgets
const memoizedUniqueWidget = useMemo(() => {
const uniqueWidget = useMemo(() => {
//functions to used remove duplicate name values across all pages
if (!props.prefillData) return [];
//This will help us track which name values have already been encountered across all pages.
@@ -119,10 +118,6 @@ function PrefillWidgetModal(props) {
savePrefillImg();
}, [props.xyPosition]);
useEffect(() => {
setUniqueWidget(memoizedUniqueWidget);
}, [memoizedUniqueWidget]);
useEffect(() => {
if (totalImages > 0 && loadedImages === totalImages) {
setLoading(false);
@@ -85,9 +85,12 @@ function RenderAllPdfPage(props) {
alert(t("only-pdf-allowed"));
return;
}
const mb = Math.round(file?.size / Math.pow(1024, 2));
if (mb > maxFileSize) {
alert(`${t("file-alert-1")} ${maxFileSize} MB`);
const fileSize =
maxFileSize;
const pdfsize = file?.size;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
@@ -144,6 +147,13 @@ function RenderAllPdfPage(props) {
useObjectStreams: false
});
const pdfBuffer = base64ToArrayBuffer(pdfBase64);
const pdfsize = pdfBuffer?.byteLength;
const fileSizeBytes = fileSize * 1024 * 1024;
if (pdfsize > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
removeFile(e);
return;
}
props.setPdfArrayBuffer(pdfBuffer);
props.setPdfBase64Url(pdfBase64);
props.setIsUploadPdf && props.setIsUploadPdf(true);
@@ -21,7 +21,9 @@ import {
convertTextToImg,
convertJpegToPng,
convertBase64ToFile,
generatePdfName
generatePdfName,
getDefaultDate,
getDefaultFormat
} from "../../constant/Utils";
import CellsWidget from "./CellsWidget";
import DatePicker from "react-datepicker";
@@ -45,22 +47,6 @@ import { emailRegex } from "../../constant/const";
import RegexParser from "regex-parser";
import { saveToMySign } from "../../utils/widgetUtils";
//function to get default format
const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
//function to convert formatted date to new Date() format
const getDefaultDate = (dateStr, format) => {
//get valid date format for moment to convert formatted date to new Date() format
const formats = changeDateToMomentFormat(format);
const parsedDate = moment(dateStr, formats);
let date;
if (parsedDate.isValid()) {
date = new Date(parsedDate.toISOString());
return date;
} else {
date = new Date();
return date;
}
};
const fontOptions = [
{ value: "Fasthand" },
{ value: "Dancing Script" },
@@ -175,7 +161,7 @@ function WidgetsValueModal(props) {
currWidgetsDetails?.options?.response,
currWidgetsDetails?.options?.validation?.format
)
: new Date()
: ""
);
useEffect(() => {
dispatch(setScrollTriggerId(currWidgetsDetails?.key));
@@ -256,9 +242,7 @@ function WidgetsValueModal(props) {
setXyPosition,
uniqueId,
false,
data?.format,
currWidgetsDetails?.options?.fontSize || 12,
currWidgetsDetails?.options?.fontColor || "black"
data?.format
);
setSelectDate({ date: date, format: data?.format });
};
@@ -880,13 +864,14 @@ function WidgetsValueModal(props) {
onClick={onClick}
ref={ref}
>
{value}
{value ? value : "Select date"}
<i className="fa-light fa-calendar ml-[5px]"></i>
</div>
));
ExampleCustomInput.displayName = "ExampleCustomInput";
//function to set onchange date
const handleOnDateChange = (date) => {
setWidgetValue(date);
setStartDate(date);
};
const handleOnchangeTextBox = (e) => {
@@ -1470,52 +1455,59 @@ function WidgetsValueModal(props) {
);
case "date":
return (
<div
className={`border-[1px] text-base-content data-[theme=opensigndark]:border-base-content data-[theme=opensigncss]:border-gray-300 rounded-[2px] p-1 px-3`}
>
<DatePicker
renderCustomHeader={({ date, changeYear, changeMonth }) => (
<div className="flex justify-start ml-2 ">
<select
className="bg-transparent outline-none"
value={months[getMonth(date)]}
onChange={({ target: { value } }) =>
changeMonth(months.indexOf(value))
}
>
{months.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
<select
className="bg-transparent outline-none"
value={getYear(date)}
onChange={({ target: { value } }) => changeYear(value)}
>
{years.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
</div>
)}
closeOnScroll={true}
selected={startDate}
onChange={(date) => handleOnDateChange(date)}
popperPlacement="top-end"
customInput={<ExampleCustomInput />}
dateFormat={
selectDate
? selectDate?.format
: currWidgetsDetails?.options?.validation?.format
? currWidgetsDetails?.options?.validation?.format
: "MM/dd/yyyy"
}
portalId="root-portal"
/>
<div className="flex flex-col">
<div
className={`border-[1px] text-base-content data-[theme=opensigndark]:border-base-content data-[theme=opensigncss]:border-gray-300 rounded-[2px] p-1 px-3`}
>
<DatePicker
renderCustomHeader={({ date, changeYear, changeMonth }) => (
<div className="flex justify-start ml-2 ">
<select
className="bg-transparent outline-none"
value={months[getMonth(date)]}
onChange={({ target: { value } }) =>
changeMonth(months.indexOf(value))
}
>
{months.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
<select
className="bg-transparent outline-none"
value={getYear(date)}
onChange={({ target: { value } }) => changeYear(value)}
>
{years.map((option) => (
<option key={option} value={option}>
{option}
</option>
))}
</select>
</div>
)}
closeOnScroll={true}
selected={startDate}
onChange={(date) => handleOnDateChange(date)}
popperPlacement="top-end"
customInput={<ExampleCustomInput />}
dateFormat={
selectDate
? selectDate?.format
: currWidgetsDetails?.options?.validation?.format
? currWidgetsDetails?.options?.validation?.format
: "MM/dd/yyyy"
}
portalId="root-portal"
/>
</div>
<div className="flex justify-center">
<span className="text-gray-300">
{currWidgetsDetails?.options?.validation?.format}
</span>
</div>
</div>
);
case "email":
@@ -1595,9 +1587,6 @@ function WidgetsValueModal(props) {
const isCheckBox =
!currWidgetsDetails.options?.isReadOnly &&
currWidgetsDetails.type === "checkbox";
const isRadio =
!currWidgetsDetails?.options?.isReadOnly &&
currWidgetsDetails?.type === radioButtonWidget;
if (isCheckBox) {
//get minimum required count if exist
const minCount =
+55 -22
View File
@@ -410,9 +410,14 @@ export const changeDateToMomentFormat = (format) => {
return "L";
}
};
export const addWidgetOptions = (type, signer, placeholder, widgetValue) => {
export const addWidgetOptions = (
type,
signer,
placeholder,
role,
widgetValue
) => {
let defaultOpt;
//condition to handle widgets name field
if (placeholder) {
const countSameWidget = placeholder?.reduce((count, page) => {
return count + page.pos.filter((item) => item.type === type).length;
@@ -472,7 +477,7 @@ export const addWidgetOptions = (type, signer, placeholder, widgetValue) => {
: "MM/dd/yyyy";
return {
...defaultOpt,
response: getDate(signer?.DateFormat),
response: role === "prefill" ? getDate(signer?.DateFormat) : "",
validation: { format: dateFormat, type: "date-format" }
};
}
@@ -1002,7 +1007,7 @@ export const onChangeInput = (
dateFormat,
fontSize,
fontColor,
isDateReadOnly
dateDetails
) => {
const isSigners = xyPosition.some(
(data) => data.signerPtr || data.Role === "prefill"
@@ -1034,9 +1039,18 @@ export const onChangeInput = (
options: {
...position.options,
response: value,
fontSize: fontSize,
fontColor: fontColor,
isReadOnly: isDateReadOnly || false,
fontSize: fontSize ? fontSize : position.options?.fontSize,
fontColor: fontColor
? fontColor
: position.options?.fontColor,
isReadOnly:
dateDetails?.isReadOnly !== "undefined"
? dateDetails?.isReadOnly
: position.options?.isReadOnly,
status:
dateDetails?.status !== "undefined"
? dateDetails?.status
: position.options?.status,
validation: {
type: "date-format",
format: dateFormat // This indicates the required date format explicitly.
@@ -1996,7 +2010,17 @@ export const embedWidgetsToDoc = async (
} else if (isTextTypeWidget) {
let textContent = "";
if (position?.options?.response) {
textContent = position.options?.response;
if (
position.type === "date" &&
position.options?.response === "today"
) {
const getFormat = changeDateToMomentFormat(
position?.options?.validation?.format
);
textContent = moment().format(getFormat);
} else {
textContent = position.options?.response;
}
} else if (position?.options?.defaultValue) {
textContent = position?.options?.defaultValue;
}
@@ -3448,18 +3472,7 @@ export const updateDateWidgetsRes = (
placeHolder: item?.placeHolder?.map((ph) => ({
...ph,
pos: ph?.pos?.map((widget) => {
// only for date widgets *and* missing response
if (widget.type === "date" && !widget.options.response) {
return {
...widget,
options: {
...widget.options,
response: getDate(
changeDateToMomentFormat(widget.options.validation.format)
)
}
};
} else if (
if (
["name", "email", "job title", "company"].includes(widget.type) &&
!widget.options.defaultValue &&
!widget.options.response
@@ -3593,6 +3606,7 @@ export const handleCheckResponse = (checkUser, setminRequiredCount) => {
//in `defaultValue` variable is used to get how many checkbox checked by default
const defaultValue =
requiredCheckbox[i].options?.defaultValue?.length;
const checkboxValue = response ? response : defaultValue;
//condition to check parseMin and parseMax greater than 0 then consider it as a required check box
if (
parseMin > 0 &&
@@ -3607,7 +3621,10 @@ export const handleCheckResponse = (checkUser, setminRequiredCount) => {
setminRequiredCount(parseMin);
}
//else condition to validate minimum required checkbox
else if (parseMin > 0 && (parseMin > response || !response)) {
else if (
parseMin > 0 &&
(parseMin > checkboxValue || !checkboxValue)
) {
if (!showAlert) {
showAlert = true;
widgetKey = requiredCheckbox[i].key;
@@ -3806,7 +3823,7 @@ export const sendEmailToSigners = async (
htmlReqBody,
variables
);
} else if (defaultMail) {
} else if (defaultMail?.body && defaultMail?.subject) {
const mailBody = defaultMail?.body;
const mailSubject = defaultMail.subject;
const replacedRequestBody = mailBody.replace(/"/g, "'");
@@ -4034,3 +4051,19 @@ export const handleDeleteWidget = (key, Id, pageNumber, signerPos) => {
}
}
};
//function to convert formatted date to new Date() format
export const getDefaultDate = (dateStr, format) => {
//get valid date format for moment to convert formatted date to new Date() format
const formats = changeDateToMomentFormat(format);
const parsedDate = moment(dateStr, formats);
let date;
if (parsedDate.isValid()) {
date = new Date(parsedDate.toISOString());
return date;
} else if (dateStr === "today") {
date = new Date();
return date;
}
};
//function to get default format
export const getDefaultFormat = (dateFormat) => dateFormat || "MM/dd/yyyy";
+1 -1
View File
@@ -9,7 +9,7 @@ export const getThemeIconColor = () => {
return theme === "opensigndark" ? "#CCCCCC" : "#686968";
};
export const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
export const maxFileSize = 10; // 10MB
export const maxTitleLength = 250; // 250 characters
export const maxNoteLength = 200; // 200 characters
export const maxDescriptionLength = 500; // 500 characters
export const maxFileSize = 80; // for cloud 10MB / 80MB for self-hosted
+1 -1
View File
@@ -27,7 +27,7 @@ function processDimensions(x, y, width, height) {
};
}
const DebugPdf = () => {
const {t} = useTranslation()
const { t } = useTranslation();
const { width } = useWindowSize();
const [pdf, setPdf] = useState("");
const [isModal, setIsModal] = useState(true);
+7 -5
View File
@@ -98,6 +98,8 @@ const Forms = (props) => {
extUserData?.IsTourEnabled === false
? "false"
: "true";
const fileSize =
maxFileSize;
useEffect(() => {
handleReset();
return () => abortController.abort();
@@ -136,11 +138,10 @@ const Forms = (props) => {
return;
}
// setFormData((prev) => ({ ...prev, file: files[0] }));
const totalMb = Math.round(
files.reduce((sum, f) => sum + f.size, 0) / Math.pow(1024, 2)
);
if (totalMb > maxFileSize) {
alert(`${t("file-alert-1")} ${maxFileSize} MB`);
const totalBytes = Math.round(files.reduce((sum, f) => sum + f.size, 0)); // in bytes
const fileSizeBytes = fileSize * 1024 * 1024;
if (totalBytes > fileSizeBytes) {
alert(`${t("file-alert-1")} ${fileSize} MB`);
setFileUpload("");
setSelectedFiles([]);
removeFile(e);
@@ -336,6 +337,7 @@ const Forms = (props) => {
} catch (error) {
alert(error.message);
setSelectedFiles([]);
removeFile(e);
}
};
// `isValidURL` is used to check valid webhook url
@@ -1512,6 +1512,7 @@ function PdfRequestFiles(
dragTypeValue,
owner,
filterSignerPos?.placeHolder,
null,
widgetValue
),
Width: widgetWidth / (containerScale * scale),
@@ -1548,6 +1549,7 @@ function PdfRequestFiles(
dragTypeValue,
owner,
filterSignerPos?.placeHolder,
null,
widgetValue
),
Width: widgetWidth / (containerScale * scale),
+6 -3
View File
@@ -553,7 +553,8 @@ function PlaceHolderSign() {
options: addWidgetOptions(
dragTypeValue,
owner,
filterSignerPos?.placeHolder
filterSignerPos?.placeHolder,
roleName
),
Width: widgetWidth / (containerScale * scale),
Height: widgetHeight / (containerScale * scale)
@@ -588,7 +589,8 @@ function PlaceHolderSign() {
options: addWidgetOptions(
dragTypeValue,
owner,
filterSignerPos?.placeHolder
filterSignerPos?.placeHolder,
roleName
),
Width: widgetWidth / (containerScale * scale),
Height: widgetHeight / (containerScale * scale)
@@ -2045,12 +2047,12 @@ function PlaceHolderSign() {
setSignBtnPosition={setSignBtnPosition}
pageNumber={pageNumber}
pdfBase64Url={pdfBase64Url}
signedUrl={pdfDetails?.[0]?.SignedUrl || ""}
setPdfArrayBuffer={setPdfArrayBuffer}
setPdfBase64Url={setPdfBase64Url}
setIsUploadPdf={setIsUploadPdf}
pdfArrayBuffer={pdfArrayBuffer}
isMergePdfBtn={true}
pdfDetails={pdfDetails}
/>
{/* pdf render view */}
<div className="w-full md:w-[57%] flex mr-4">
@@ -2070,6 +2072,7 @@ function PlaceHolderSign() {
setAllPages={setAllPages}
setPageNumber={setPageNumber}
setIsTour={setPlaceholderTour}
pdfDetails={pdfDetails}
/>
<div className=" w-full md:w-[95%] ">
{/* this modal is used show alert set placeholder for all signers before send mail */}
+1
View File
@@ -37,6 +37,7 @@ const Report = () => {
// Number of documents to fetch per API call
const docLimit = 20;
// below useEffect is call when id param change
useEffect(() => {
setReportName("");
+2 -1
View File
@@ -1250,12 +1250,12 @@ function SignYourSelf() {
pageNumber={pageNumber}
containerWH={containerWH}
pdfBase64Url={pdfBase64Url}
signedUrl={pdfDetails?.[0]?.SignedUrl || ""}
setPdfArrayBuffer={setPdfArrayBuffer}
setPdfBase64Url={setPdfBase64Url}
setIsUploadPdf={setIsUploadPdf}
pdfArrayBuffer={pdfArrayBuffer}
isMergePdfBtn={!pdfDetails?.[0]?.IsCompleted}
pdfDetails={pdfDetails}
/>
<div className="w-full md:w-[57%] flex mr-4">
<PdfTools
@@ -1273,6 +1273,7 @@ function SignYourSelf() {
setAllPages={setAllPages}
setPageNumber={setPageNumber}
isDisableEditTools={isCompleted}
pdfDetails={pdfDetails}
/>
<div className="w-full md:w-[95%]">
<ModalUi
@@ -348,8 +348,8 @@ const TemplatePlaceholder = () => {
setPrefillSigner([utils?.prefillObj()]);
}
setSignersData(updatedSigners);
setUniqueId(updatedSigners[0].Id);
setBlockColor(updatedSigners[0].blockColor);
setUniqueId(updatedSigners[0]?.Id);
setBlockColor(updatedSigners[0]?.blockColor);
setIsSelectId(0);
} else {
const updatedSigners = documentData[0].Signers.map((x, index) => ({
@@ -358,8 +358,8 @@ const TemplatePlaceholder = () => {
Role: "Role " + (index + 1)
}));
setSignersData(updatedSigners);
setUniqueId(updatedSigners[0].Id);
setBlockColor(updatedSigners[0].blockColor);
setUniqueId(updatedSigners[0]?.Id);
setBlockColor(updatedSigners[0]?.blockColor);
setPrefillSigner([utils?.prefillObj()]);
}
} else {
@@ -437,7 +437,6 @@ const TemplatePlaceholder = () => {
const addPositionOfSignature = (item, monitor) => {
getSignerPos(item, monitor);
};
// `getSignerPos` is used to get placeholder position when user place it and save it in array
const getSignerPos = (item, monitor) => {
if (uniqueId) {
@@ -483,7 +482,8 @@ const TemplatePlaceholder = () => {
options: addWidgetOptions(
dragTypeValue,
owner,
filterSignerPos?.placeHolder
filterSignerPos?.placeHolder,
roleName
),
Width: widgetWidth / (containerScale * scale),
Height: widgetHeight / (containerScale * scale)
@@ -517,7 +517,8 @@ const TemplatePlaceholder = () => {
options: addWidgetOptions(
dragTypeValue,
owner,
filterSignerPos?.placeHolder
filterSignerPos?.placeHolder,
roleName
),
Width: widgetWidth / (containerScale * scale),
Height: widgetHeight / (containerScale * scale)
@@ -614,7 +615,6 @@ const TemplatePlaceholder = () => {
setIsAddRole(true);
}
};
const tourAddRole = [
{
selector: '[data-tut="reactourAddbtn"]',
@@ -1774,12 +1774,12 @@ const TemplatePlaceholder = () => {
setSignBtnPosition={setSignBtnPosition}
pageNumber={pageNumber}
pdfBase64Url={pdfBase64Url}
signedUrl={pdfDetails?.[0]?.SignedUrl || ""}
setPdfArrayBuffer={setPdfArrayBuffer}
setPdfBase64Url={setPdfBase64Url}
setIsUploadPdf={setIsUploadPdf}
pdfArrayBuffer={pdfArrayBuffer}
isMergePdfBtn={true}
pdfDetails={pdfDetails}
/>
{/* pdf render view */}
@@ -1799,6 +1799,7 @@ const TemplatePlaceholder = () => {
allPages={allPages}
setAllPages={setAllPages}
setPageNumber={setPageNumber}
pdfDetails={pdfDetails}
/>
<div className="w-full md:w-[95%]">
<ModalUi
+4 -2
View File
@@ -9,10 +9,12 @@ const ModalUi = ({
showHeader = true,
showClose = true,
reduceWidth,
position
position,
crossColor
}) => {
const width = reduceWidth;
const isBottom = position === "bottom" ? "items-end pb-2 !bg-black/10" : "";
const crossBtnColor = crossColor ?? "text-base-content";
return (
<>
{isOpen && (
@@ -38,7 +40,7 @@ const ModalUi = ({
)}
{showClose && (
<button
className="op-btn op-btn-sm op-btn-circle op-btn-ghost text-base-content absolute right-2 top-2"
className={`${crossBtnColor} op-btn op-btn-sm op-btn-circle op-btn-ghost absolute right-2 top-2 z-40`}
onClick={() => handleClose && handleClose()}
>
@@ -330,6 +330,8 @@ const DocumentsReport = (props) => {
setIsModal({ [`extendexpiry_${item.objectId}`]: true });
}
};
// Get current list
const indexOfLastDoc = currentPage * props.docPerPage;
const indexOfFirstDoc = indexOfLastDoc - props.docPerPage;
@@ -792,6 +794,7 @@ const DocumentsReport = (props) => {
};
const handleCloseModal = () => {
setError("");
setIsModal({});
};
const handleSaveAsTemplate = async (doc) => {
@@ -30,7 +30,7 @@ import "../../styles/quill.css";
import BulkSendUi from "../../components/BulkSendUi";
import Loader from "../../primitives/Loader";
import { serverUrl_fn } from "../../constant/appinfo";
import { useTranslation } from "react-i18next";
import { Trans, useTranslation } from "react-i18next";
import { useElSize } from "../../hook/useElSize";
import LottieWithLoader from "../../primitives/DotLottieReact";
import PrefillWidgetModal from "../../components/pdf/PrefillWidgetsModal";
@@ -67,7 +67,7 @@ const TemplatesReport = (props) => {
const [userDetails, setUserDetails] = useState({});
const [isNextStep, setIsNextStep] = useState({});
const [isBulkSend, setIsBulkSend] = useState({});
const [templateDeatils, setTemplateDetails] = useState({});
const [templateDetails, setTemplateDetails] = useState({});
const [placeholders, setPlaceholders] = useState([]);
const [isLoader, setIsLoader] = useState({});
const [isShareWith, setIsShareWith] = useState({});
@@ -239,9 +239,8 @@ const TemplatesReport = (props) => {
);
if (checkIsSignatureExist) {
setActLoader({ [`${item.objectId}_${act.btnId}`]: true });
const templateDeatils = await fetchTemplate(item.objectId);
const templateData =
templateDeatils.data && templateDeatils.data.result;
const template = await fetchTemplate(item.objectId);
const templateData = template.data && template.data.result;
if (!templateData.error) {
setXyPosition(templateData?.Placeholders);
const signer = utils.handleSignersList(templateData);
@@ -284,7 +283,7 @@ const TemplatesReport = (props) => {
}
}
);
if (axiosRes) {
if (axiosRes?.data) {
return axiosRes;
}
} catch (e) {
@@ -297,10 +296,10 @@ const TemplatesReport = (props) => {
const navigatePageToDoc = async (templateRes, placeholder, signer) => {
setIsPrefillModal({});
const res = await createDocument(
[templateRes || templateDeatils],
[templateRes || templateDetails],
placeholder || xyPosition,
signer || signerList,
templateRes?.URL || templateDeatils?.URL
templateRes?.URL || templateDetails?.URL
);
if (res.status === "success") {
navigate(`/placeHolderSign/${res.id}`, {
@@ -879,8 +878,8 @@ const TemplatesReport = (props) => {
signerList,
setIsPrefillModal,
scale,
templateDeatils?.URL,
[templateDeatils],
templateDetails?.URL,
[templateDetails],
prefillImg,
extClass?.[0]?.UserId?.objectId,
);
@@ -1332,7 +1331,7 @@ const TemplatesReport = (props) => {
) : (
<BulkSendUi
Placeholders={placeholders}
item={templateDeatils}
item={templateDetails}
handleClose={handleQuickSendClose}
signatureType={signatureType}
/>
+1
View File
@@ -3,6 +3,7 @@ import { format, toZonedTime } from 'date-fns-tz';
import getPresignedUrl, { getSignedLocalUrl } from './cloud/parsefunction/getSignedUrl.js';
import crypto from 'node:crypto';
import { PDFDocument, rgb } from 'pdf-lib';
import { parseUploadFile } from './utils/fileUtils.js';
dotenv.config({ quiet: true });
@@ -13,8 +13,8 @@ export const app = express();
dotenv.config({ quiet: true });
app.use(cors());
app.use(express.json({ limit: '50mb' }));
app.use(express.urlencoded({ limit: '50mb', extended: true }));
app.use(express.json({ limit: '100mb' }));
app.use(express.urlencoded({ limit: '100mb', extended: true }));
app.post('/file_upload', uploadFile);
app.post('/docxtopdf', docxUpload.single('file'), docxtopdf);
@@ -7,6 +7,7 @@ import fs from 'node:fs';
import dotenv from 'dotenv';
import GenerateCertificate from './pdf/GenerateCertificate.js';
import { getSecureUrl } from '../../Utils.js';
import { parseUploadFile } from '../../utils/fileUtils.js';
dotenv.config({ quiet: true });
const eSignName = 'OpenSign';
const eSigncontact = 'hello@opensignlabs.com';
@@ -16,10 +17,14 @@ async function uploadFile(pdfName, filepath) {
try {
const filedata = fs.readFileSync(filepath);
let fileUrl;
const file = new Parse.File(pdfName, [...filedata], 'application/pdf');
await file.save({ useMasterKey: true });
const fileRes = getSecureUrl(file.url());
fileUrl = fileRes.url;
// const file = new Parse.File(pdfName, [...filedata], 'application/pdf');
// await file.save({ useMasterKey: true });
// const fileRes = getSecureUrl(file.url());
// fileUrl = fileRes.url;
const fileRes = await parseUploadFile(pdfName, filedata, 'application/pdf');
fileUrl = getSecureUrl(fileRes?.url)?.url;
return { imageUrl: fileUrl };
} catch (err) {
console.log('Err ', err);
@@ -52,7 +57,9 @@ export default async function generateCertificatebydocId(req) {
const certificatePath = `./exports/certificate_${docId}.pdf`;
try {
const getDocument = new Parse.Query('contracts_Document');
getDocument.include('ExtUserPtr,Signers,AuditTrail.UserPtr,Placeholders,ExtUserPtr.TenantId');
getDocument.include(
'ExtUserPtr,Signers,AuditTrail.UserPtr,Placeholders,ExtUserPtr.TenantId,ExtUserPtr.UserId'
);
const docRes = await getDocument.get(docId, { useMasterKey: true });
if (docRes && docRes?.get('IsCompleted') && !docRes?.get('CertificateUrl')) {
@@ -20,22 +20,23 @@ async function getTenantByUserId(userId, contactId) {
}
} else {
const query = new Parse.Query('contracts_Users');
query.equalTo('UserId', {
__type: 'Pointer',
className: '_User',
objectId: userId,
});
query.equalTo('UserId', { __type: 'Pointer', className: '_User', objectId: userId });
const extuser = await query.first({ useMasterKey: true });
if (extuser) {
const tenantId = extuser?.get('TenantId')?.id || '';
const user = extuser?.get('CreatedBy')?.id || userId;
const tenantCreditsQuery = new Parse.Query('partners_Tenant');
tenantCreditsQuery.equalTo('UserId', {
__type: 'Pointer',
className: '_User',
objectId: user,
});
tenantCreditsQuery.exclude('FileAdapters,PfxFile');
const res = await tenantCreditsQuery.first({ useMasterKey: true });
const tenantQuery = new Parse.Query('partners_Tenant');
if (tenantId) {
tenantQuery.equalTo('objectId', tenantId);
} else {
tenantQuery.equalTo('UserId', {
__type: 'Pointer',
className: '_User',
objectId: user,
});
}
tenantQuery.exclude('FileAdapters,PfxFile');
const res = await tenantQuery.first({ useMasterKey: true });
return res;
} else {
return {};
@@ -14,7 +14,7 @@ import { pdflibAddPlaceholder } from '@signpdf/placeholder-pdf-lib';
import { Placeholder } from './Placeholder.js';
import { SignPdf } from '@signpdf/signpdf';
import { P12Signer } from '@signpdf/signer-p12';
import { buildDownloadFilename } from '../../../utils/fileUtils.js';
import { buildDownloadFilename, parseUploadFile } from '../../../utils/fileUtils.js';
const serverUrl = cloudServerUrl; // process.env.SERVER_URL;
const APPID = serverAppId;
@@ -43,10 +43,14 @@ async function uploadFile(pdfName, filepath) {
try {
const filedata = fs.readFileSync(filepath);
let fileUrl;
const file = new Parse.File(pdfName, [...filedata], 'application/pdf');
await file.save({ useMasterKey: true });
const fileRes = getSecureUrl(file.url());
fileUrl = fileRes.url;
// const file = new Parse.File(pdfName, [...filedata], 'application/pdf');
// await file.save({ useMasterKey: true });
// const fileRes = getSecureUrl(file.url());
// fileUrl = fileRes.url;
const fileRes = await parseUploadFile(pdfName, filedata, 'application/pdf');
fileUrl = getSecureUrl(fileRes?.url)?.url;
return { imageUrl: fileUrl };
} catch (err) {
@@ -350,7 +354,7 @@ async function PDF(req) {
const publicUrl = req.headers.public_url;
// below bode is used to get info of docId
const docQuery = new Parse.Query('contracts_Document');
docQuery.include('ExtUserPtr,Signers,ExtUserPtr.TenantId,Bcc');
docQuery.include('ExtUserPtr,Signers,ExtUserPtr.TenantId,Bcc,CreatedBy');
docQuery.equalTo('objectId', docId);
const resDoc = await docQuery.first({ useMasterKey: true });
if (!resDoc) {
@@ -1,4 +1,6 @@
import { flattenPdf, getSecureUrl } from '../../Utils.js';
import { parseUploadFile } from '../../utils/fileUtils.js';
export default async function saveFile(request) {
if (!request.params.fileBase64) {
throw new Parse.Error(Parse.Error.INVALID_QUERY, 'Please provide file.');
@@ -10,6 +12,7 @@ export default async function saveFile(request) {
const extCls = new Parse.Query('contracts_Users');
extCls.equalTo('UserId', request.user);
extCls.include('TenantId');
extCls.include('UserId');
const resExt = await extCls.first({ useMasterKey: true });
if (resExt) {
const _resExt = JSON.parse(JSON.stringify(resExt));
@@ -20,17 +23,26 @@ export default async function saveFile(request) {
if (ext === 'pdf') {
mimeType = 'application/pdf';
const flatPdf = await flattenPdf(fileBase64);
file = [...flatPdf];
// file = [...flatPdf];
file = flatPdf;
} else if (ext === 'png' || ext === 'jpeg' || ext === 'jpg') {
mimeType = `image/${ext}`;
file = { base64: fileBase64 };
// file = { base64: fileBase64 };
file = Buffer.from(fileBase64, 'base64');
}
// const pdfFile = new Parse.File(fileName, file, mimeType);
// // Save the Parse File if needed
// const pdfData = await pdfFile.save({ useMasterKey: true });
// const presignedUrl = pdfData.url();
// const fileRes = getSecureUrl(presignedUrl);
// return { url: fileRes.url };
try {
const fileRes = await parseUploadFile(fileName, file, mimeType);
fileUrl = getSecureUrl(fileRes?.url)?.url;
return { url: fileUrl };
} catch (err) {
throw new Parse.Error(400, err?.message);
}
const pdfFile = new Parse.File(fileName, file, mimeType);
// Save the Parse File if needed
const pdfData = await pdfFile.save({ useMasterKey: true });
const presignedUrl = pdfData.url();
const fileRes = getSecureUrl(presignedUrl);
return { url: fileRes.url };
} else {
throw new Parse.Error(Parse.Error.OBJECT_NOT_FOUND, 'User not found.');
}
+3 -3
View File
@@ -100,7 +100,7 @@ export const config = {
appId: serverAppId,
logLevel: ['error'],
maxLimit: 500,
maxUploadSize: '30mb',
maxUploadSize: '100mb',
masterKey: process.env.MASTER_KEY, //Add your master key here. Keep it secret!
masterKeyIps: ['0.0.0.0/0', '::/0'], // '::1'
serverURL: cloudServerUrl, // Don't forget to change to https if needed
@@ -156,8 +156,8 @@ export const config = {
export const app = express();
app.use(cors());
app.use(express.json({ limit: '50mb' }));
app.use(express.urlencoded({ limit: '50mb', extended: true }));
app.use(express.json({ limit: '100mb' }));
app.use(express.urlencoded({ limit: '100mb', extended: true }));
app.use(function (req, res, next) {
req.headers['x-real-ip'] = getUserIP(req);
const publicUrl = 'https://' + req?.get('host');
+678 -686
View File
File diff suppressed because it is too large Load Diff
+3 -3
View File
@@ -18,8 +18,8 @@
"watch": "nodemon index.js"
},
"dependencies": {
"@aws-sdk/client-s3": "^3.888.0",
"@aws-sdk/s3-request-presigner": "^3.888.0",
"@aws-sdk/client-s3": "^3.891.0",
"@aws-sdk/s3-request-presigner": "^3.891.0",
"@parse/fs-files-adapter": "^3.0.0",
"@parse/s3-files-adapter": "^4.2.0",
"@pdf-lib/fontkit": "^1.1.1",
@@ -52,7 +52,7 @@
"posthog-node": "^5.8.4",
"qrcode": "^1.5.4",
"rate-limiter-flexible": "^7.3.1",
"sharp": "^0.34.3",
"sharp": "^0.34.4",
"speakeasy": "^2.0.0",
"ws": "^8.18.3"
},
+23
View File
@@ -1,3 +1,6 @@
import axios from 'axios';
import { cloudServerUrl, serverAppId } from '../Utils.js';
function formatFixedDate(date = new Date()) {
const dd = String(date.getDate()).padStart(2, '0');
const months = [
@@ -75,3 +78,23 @@ export function buildDownloadFilename(formatId, ctx) {
const safeExt = ext.replace(/\.+/g, '').toLowerCase() || 'pdf';
return `${stem}.${safeExt}`;
}
export async function parseUploadFile(fileName, fileData, mimeType) {
try {
const res = await axios.post(`${cloudServerUrl}/files/${fileName}`, fileData, {
headers: {
'X-Parse-Application-Id': serverAppId,
'X-Parse-Master-Key': process.env.MASTER_KEY,
'Content-Type': mimeType,
},
});
// console.log('File uploaded:', res.data);
return res.data;
} catch (err) {
const errorMessage = err?.response?.data?.error || 'Unknown error';
const statusCode = err?.response?.status || 500;
console.log('Err in parseUploadFile', errorMessage);
throw { message: errorMessage, code: statusCode };
}
}