Skip to content

Commit

Permalink
Merge pull request #656 from OpenSignLabs/staging
Browse files Browse the repository at this point in the history 
v1.5.8
  • Loading branch information
@nxglabs
nxglabs authored May 7, 2024
2 parents b29c7d5 + c564b57 commit ff9a495
Show file tree
Hide file tree
Showing 34 changed files with 2,302 additions and 1,041 deletions.
198 changes: 79 additions & 119 deletions apps/OpenSign/package-lock.json
View file

Large diffs are not rendered by default.

14 changes: 7 additions & 7 deletions apps/OpenSign/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"@formkit/auto-animate": "^0.8.1",
"@formkit/auto-animate": "^0.8.2",
"@radix-ui/themes": "^2.0.3",
"@react-pdf/renderer": "^3.4.0",
"@react-pdf/renderer": "^3.4.4",
"@reduxjs/toolkit": "^2.2.1",
"axios": "^1.6.8",
"file-saver": "^2.0.5",
Expand All @@ -31,15 +31,15 @@
"react-pdf": "^7.7.1",
"react-quill": "^2.0.0",
"react-redux": "^9.1.0",
"react-rnd": "^10.4.1",
"react-rnd": "^10.4.10",
"react-router-dom": "^6.22.3",
"react-scripts": "5.0.1",
"react-scrollbars-custom": "^4.1.1",
"react-select": "^5.8.0",
"react-signature-canvas": "^1.0.6",
"react-tooltip": "^5.26.3",
"react-web-share": "^2.0.2",
"reactour": "^1.19.2",
"reactour": "^1.19.3",
"redux": "^5.0.1",
"redux-thunk": "^3.1.0",
"regex-parser": "^2.3.0",
Expand Down Expand Up @@ -83,14 +83,14 @@
}
},
"devDependencies": {
"@babel/runtime-corejs2": "^7.24.1",
"autoprefixer": "^10.4.18",
"@babel/runtime-corejs2": "^7.24.5",
"autoprefixer": "^10.4.19",
"commitizen": "^4.3.0",
"eslint": "^8.57.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.34.1",
"lint-staged": "^15.2.2",
"postcss": "^8.4.37",
"postcss": "^8.4.38",
"prettier": "^2.8.8",
"pretty-quick": "^3.3.1",
"tailwindcss": "^3.4.1"
Expand Down
4 changes: 4 additions & 0 deletions apps/OpenSign/src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -109,6 +109,10 @@ function App() {
path="/login/:id/:userMail/:contactBookId/:serverUrl"
element={<LazyPage Page={GuestLogin} />}
/>
<Route
path="/login/:base64url"
element={<LazyPage Page={GuestLogin} />}
/>
<Route path="/debugpdf" element={<LazyPage Page={DebugPdf} />} />
<Route
path="/forgetpassword"
Expand Down
2 changes: 1 addition & 1 deletion apps/OpenSign/src/components/pdf/EmailBody.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ export function EmailBody(props) {
required
value={props.requestSubject}
onChange={(e) => props.setRequestSubject(e.target.value)}
placeholder="${senderName} has requested you to sign ${documentName}"
placeholder='${senderName} has requested you to sign "${documentName}"'
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
/>
<label className="text-sm ml-2 mt-3">
Expand Down
249 changes: 119 additions & 130 deletions apps/OpenSign/src/components/pdf/PdfHeader.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from "react";
import React, { useState } from "react";
import PrevNext from "./PrevNext";
import printModule from "print-js";
import { getBase64FromUrl } from "../../constant/Utils";
Expand All @@ -7,8 +7,9 @@ import "../../styles/signature.css";
import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
import { useNavigate } from "react-router-dom";
import { themeColor } from "../../constant/const";
import Certificate from "./Certificate";
import { PDFDownloadLink } from "@react-pdf/renderer";
import axios from "axios";
import ModalUi from "../../primitives/ModalUi";
import Parse from "parse";

function Header({
isPdfRequestFiles,
Expand Down Expand Up @@ -39,6 +40,7 @@ function Header({
signerPos && signerPos?.filter((data) => data.Role !== "prefill");
const isMobile = window.innerWidth < 767;
const navigate = useNavigate();
const [isCertificate, setIsCertificate] = useState(false);
const isGuestSigner = localStorage.getItem("isGuestSigner");
//for go to previous page
function previousPage() {
Expand All @@ -61,30 +63,43 @@ function Header({
const handleToPrint = async (event) => {
event.preventDefault();

const pdf = await getBase64FromUrl(pdfUrl);
const isAndroidDevice = navigator.userAgent.match(/Android/i);
const isAppleDevice =
(/iPad|iPhone|iPod/.test(navigator.platform) ||
(navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1)) &&
!window.MSStream;
if (isAndroidDevice || isAppleDevice) {
const byteArray = Uint8Array.from(
atob(pdf)
.split("")
.map((char) => char.charCodeAt(0))
);
const blob = new Blob([byteArray], { type: "application/pdf" });
const blobUrl = URL.createObjectURL(blob);
window.open(blobUrl, "_blank");
} else {
printModule({ printable: pdf, type: "pdf", base64: true });
try {
const url = await Parse.Cloud.run("getsignedurl", { url: pdfUrl });
const pdf = await getBase64FromUrl(url);
const isAndroidDevice = navigator.userAgent.match(/Android/i);
const isAppleDevice =
(/iPad|iPhone|iPod/.test(navigator.platform) ||
(navigator.platform === "MacIntel" &&
navigator.maxTouchPoints > 1)) &&
!window.MSStream;
if (isAndroidDevice || isAppleDevice) {
const byteArray = Uint8Array.from(
atob(pdf)
.split("")
.map((char) => char.charCodeAt(0))
);
const blob = new Blob([byteArray], { type: "application/pdf" });
const blobUrl = URL.createObjectURL(blob);
window.open(blobUrl, "_blank");
} else {
printModule({ printable: pdf, type: "pdf", base64: true });
}
} catch (err) {
console.log("err in getsignedurl", err);
alert("something went wrong, please try again later.");
}
};

//handle download signed pdf
const handleDownloadPdf = () => {
const handleDownloadPdf = async () => {
const pdfName = pdfDetails[0] && pdfDetails[0].Name;
saveAs(pdfUrl, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
try {
const url = await Parse.Cloud.run("getsignedurl", { url: pdfUrl });
saveAs(url, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
} catch (err) {
console.log("err in getsignedurl", err);
alert("something went wrong, please try again later.");
}
};

const sanitizeFileName = (pdfName) => {
Expand All @@ -102,55 +117,41 @@ function Header({
} catch (err) {
console.log("err in download in certificate", err);
}
} else {
setIsCertificate(true);
try {
const data = {
docId: pdfDetails[0]?.objectId
};
const docDetails = await axios.post(
`${localStorage.getItem("baseUrl")}functions/getDocument`,
data,
{
headers: {
"Content-Type": "application/json",
"X-Parse-Application-Id": localStorage.getItem("parseAppId"),
sessionToken: localStorage.getItem("accesstoken")
}
}
);
if (docDetails.data && docDetails.data.result) {
const doc = docDetails.data.result;
if (doc?.CertificateUrl) {
await fetch(doc?.CertificateUrl);
const certificateUrl = doc?.CertificateUrl;
saveAs(certificateUrl, `Certificate_signed_by_OpenSign™.pdf`);
setIsCertificate(false);
} else {
setIsCertificate(true);
}
}
} catch (err) {
console.log("err in download in certificate", err);
alert("something went wrong, please try again later.");
}
}
};

const GenerateCertificate = () => {
//after generate download certifcate pdf
const handleDownload = (pdfBlob, fileName) => {
if (pdfBlob) {
const url = window.URL.createObjectURL(pdfBlob);
// Create a temporary anchor element
const link = document.createElement("a");
link.href = url;
link.download = fileName;
// Append the anchor to the body
document.body.appendChild(link);
// Programmatically click the anchor to trigger the download
link.click();
// Remove the anchor from the body
document.body.removeChild(link);
// Release the object URL to free up resources
window.URL.revokeObjectURL(url);
}
};

return (
<PDFDownloadLink
onClick={(e) => e.preventDefault()}
style={{ textDecoration: "none", zIndex: "35" }}
document={<Certificate pdfData={pdfDetails} />}
>
{({ blob, loading }) => (
<button
onClick={() =>
handleDownload(
blob,
`completion certificate-${
pdfDetails[0] && pdfDetails[0].Name
}.pdf`
)
}
disabled={loading}
className=" md:bg-[#08bc66] border-none focus:outline-none flex flex-row items-center md:shadow md:rounded-[3px] py-[3px] md:px-[11px] md:text-white text-black md:font-[500] text-[13px] mr-[5px]"
>
<i className="fa-solid fa-award py-[3px]" aria-hidden="true"></i>
<span className="md:hidden lg:block ml-1">Certificate</span>
</button>
)}
</PDFDownloadLink>
);
};
return (
<div style={{ padding: "5px 0px 5px 0px" }} className="mobileHead">
{isMobile && isShowHeader ? (
Expand Down Expand Up @@ -240,32 +241,24 @@ function Header({
</div>
</DropdownMenu.Item>
{isCompleted && (
<>
{pdfDetails[0] && pdfDetails[0]?.CertificateUrl ? (
<DropdownMenu.Item
className="DropdownMenuItem"
onClick={() => handleDownloadCertificate()}
>
<div
style={{
border: "none",
backgroundColor: "#fff"
}}
>
<i
className="fa-solid fa-award"
style={{ marginRight: "2px" }}
aria-hidden="true"
></i>
Certificate
</div>
</DropdownMenu.Item>
) : (
<DropdownMenu.Item className="DropdownMenuItem">
<GenerateCertificate />
</DropdownMenu.Item>
)}
</>
<DropdownMenu.Item
className="DropdownMenuItem"
onClick={() => handleDownloadCertificate()}
>
<div
style={{
border: "none",
backgroundColor: "#fff"
}}
>
<i
className="fa-solid fa-award"
style={{ marginRight: "2px" }}
aria-hidden="true"
></i>
Certificate
</div>
</DropdownMenu.Item>
)}
{isSignYourself && (
<DropdownMenu.Item
Expand Down Expand Up @@ -442,25 +435,17 @@ function Header({
alreadySign ? (
<div style={{ display: "flex", flexDirection: "row" }}>
{isCompleted && (
<>
{pdfDetails[0] && pdfDetails[0]?.CertificateUrl ? (
<button
type="button"
onClick={() => handleDownloadCertificate()}
className="flex flex-row items-center shadow rounded-[3px] py-[3px] px-[11px] text-white font-[500] text-[13px] mr-[5px] bg-[#08bc66]"
>
<i
className="fa-solid fa-award py-[3px]"
aria-hidden="true"
></i>
<span className="hidden lg:block ml-1">
Certificate
</span>
</button>
) : (
<GenerateCertificate />
)}
</>
<button
type="button"
onClick={() => handleDownloadCertificate()}
className="flex flex-row items-center shadow rounded-[3px] py-[3px] px-[11px] text-white font-[500] text-[13px] mr-[5px] bg-[#08bc66]"
>
<i
className="fa-solid fa-award py-[3px]"
aria-hidden="true"
></i>
<span className="hidden lg:block ml-1">Certificate</span>
</button>
)}

<button
Expand Down Expand Up @@ -520,23 +505,17 @@ function Header({
) : isCompleted ? (
<div style={{ display: "flex", flexDirection: "row" }}>
{isCompleted && (
<>
{pdfDetails[0] && pdfDetails[0]?.CertificateUrl ? (
<button
type="button"
onClick={() => handleDownloadCertificate()}
className="flex flex-row items-center shadow rounded-[3px] py-[3px] px-[11px] text-white font-[500] text-[13px] mr-[5px] bg-[#08bc66]"
>
<i
className="fa-solid fa-award py-[3px]"
aria-hidden="true"
></i>
<span className="hidden lg:block ml-1">Certificate</span>
</button>
) : (
<GenerateCertificate />
)}
</>
<button
type="button"
onClick={() => handleDownloadCertificate()}
className="flex flex-row items-center shadow rounded-[3px] py-[3px] px-[11px] text-white font-[500] text-[13px] mr-[5px] bg-[#08bc66]"
>
<i
className="fa-solid fa-award py-[3px]"
aria-hidden="true"
></i>
<span className="hidden lg:block ml-1">Certificate</span>
</button>
)}
<button
onClick={handleToPrint}
Expand Down Expand Up @@ -592,6 +571,16 @@ function Header({
)}
</div>
)}
<ModalUi
isOpen={isCertificate}
title={"Generating certificate"}
handleClose={() => setIsCertificate(false)}
>
<div className="p-3 md:p-5 text-[13px] md:text-base text-center">
<p>Completion certificate is generating,</p>
<p>please wait for some time if not download try again later</p>
</div>
</ModalUi>
</div>
);
}
Expand Down
Loading

0 comments on commit ff9a495

Please sign in to comment.