Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-13 00:03:33 +10:00
Code Issues Packages Projects Releases Wiki Activity

Apply prettier config to all files

Browse Source
This commit is contained in:
Ephraim Atta-Duncan
2023-04-04 22:02:32 +00:00
parent 85f2b5e84a
commit 84b57d715c
94 changed files with 956 additions and 1386 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -121,6 +121,7 @@ Follow these steps to setup documenso on you local machnine:
- Register a new user at http://localhost:3000/signup
---
- Optional: Seed the database using <code>npm run db-seed</code> to create a test user and document
- Optional: Upload and sign <code>apps\web\ressources\example.pdf</code> manually to test your setup

20
apps/web/components/editor/editable-field.tsx
View File

@ -1,8 +1,9 @@
import React, { useState } from "react";
import Draggable from "react-draggable";
import Logo from "../logo";
import { IconButton } from "@documenso/ui";
import Logo from "../logo";
import { XCircleIcon } from "@heroicons/react/20/solid";
import Draggable from "react-draggable";
const stc = require("string-to-color");
type FieldPropsType = {
@ -51,21 +52,19 @@ export default function EditableField(props: FieldPropsType) {
onMouseDown={(e: any) => {
e.preventDefault();
e.stopPropagation();
}}
>
}}>
{/* width: 192 height 96 */}
<div
hidden={props.hidden}
ref={nodeRef}
className="cursor-move opacity-80 p-2 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none"
className="absolute top-0 left-0 m-auto h-16 w-48 cursor-move select-none flex-row-reverse p-2 text-center text-lg font-bold opacity-80"
style={{
background: stc(props.field.Recipient.email),
}}
>
<div className="m-auto overflow-hidden flex-row-reverse text-lg font-bold text-center">
}}>
<div className="m-auto flex-row-reverse overflow-hidden text-center text-lg font-bold">
{field.type}
{field.type === "SIGNATURE" ? (
<div className="text-xs text-center">
<div className="text-center text-xs">
{`${props.field.Recipient?.name} <${props.field.Recipient?.email}>`}
</div>
) : (
@ -79,8 +78,7 @@ export default function EditableField(props: FieldPropsType) {
icon={XCircleIcon}
onClick={(event: any) => {
props.onDelete(props.field.id);
}}
></IconButton>
}}></IconButton>
</strong>
</div>
</Draggable>

23
apps/web/components/editor/field-type-selector.tsx
View File

@ -1,7 +1,8 @@
import { useEffect, useState } from "react";
import { RadioGroup } from "@headlessui/react";
import { classNames } from "@documenso/lib";
import { RadioGroup } from "@headlessui/react";
import { FieldType } from "@prisma/client";
const stc = require("string-to-color");
export default function FieldTypeSelector(props: any) {
@ -24,8 +25,7 @@ export default function FieldTypeSelector(props: any) {
value={selectedFieldType}
onChange={(e: any) => {
setSelectedFieldType(e);
}}
>
}}>
<div className="space-y-4">
{fieldTypes.map((fieldType) => (
<RadioGroup.Option
@ -37,30 +37,23 @@ export default function FieldTypeSelector(props: any) {
className={({ checked, active }) =>
classNames(
checked ? "border-neon border-2" : "border-transparent",
"hover:bg-slate-100 select-none relative block cursor-pointer rounded-lg border bg-white px-3 py-2 focus:outline-none sm:flex sm:justify-between"
"relative block cursor-pointer select-none rounded-lg border bg-white px-3 py-2 hover:bg-slate-100 focus:outline-none sm:flex sm:justify-between"
)
}
>
}>
{({ active, checked }) => (
<>
<span className="flex items-center">
<span className="flex flex-col text-sm">
<RadioGroup.Label
as="span"
className="font-medium text-gray-900"
>
<RadioGroup.Label as="span" className="font-medium text-gray-900">
<span
className="inline-block h-4 w-4 flex-shrink-0 rounded-full mr-3 align-middle"
className="mr-3 inline-block h-4 w-4 flex-shrink-0 rounded-full align-middle"
style={{
background: stc(props.selectedRecipient?.email),
}}
/>
<span className="align-middle">
{" "}
{
fieldTypes.filter((e) => e.id === fieldType.id)[0]
.name
}
{fieldTypes.filter((e) => e.id === fieldType.id)[0].name}
</span>
</RadioGroup.Label>
</span>

61
apps/web/components/editor/pdf-editor.tsx
View File

@ -1,13 +1,14 @@
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import { useRouter } from "next/router";
import dynamic from "next/dynamic";
import { useState } from "react";
import { createOrUpdateField, deleteField } from "@documenso/lib/api";
import { createField } from "@documenso/features/editor";
import RecipientSelector from "./recipient-selector";
import FieldTypeSelector from "./field-type-selector";
import { InformationCircleIcon } from "@heroicons/react/24/outline";
import dynamic from "next/dynamic";
import Link from "next/link";
import { useRouter } from "next/router";
import { createField } from "@documenso/features/editor";
import { createOrUpdateField, deleteField } from "@documenso/lib/api";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import FieldTypeSelector from "./field-type-selector";
import RecipientSelector from "./recipient-selector";
import { InformationCircleIcon } from "@heroicons/react/24/outline";
const stc = require("string-to-color");
const PDFViewer = dynamic(() => import("./pdf-viewer"), {
@ -20,8 +21,7 @@ export default function PDFEditor(props: any) {
const [selectedRecipient, setSelectedRecipient]: any = useState();
const [selectedFieldType, setSelectedFieldType] = useState();
const noRecipients =
props?.document.Recipient.length === 0 ||
props?.document.Recipient.every((e: any) => !e.email);
props?.document.Recipient.length === 0 || props?.document.Recipient.every((e: any) => !e.email);
function onPositionChangedHandler(position: any, id: any) {
if (!position) return;
@ -53,26 +53,16 @@ export default function PDFEditor(props: any) {
<div hidden={!noRecipients} className="rounded-md bg-yellow-50 p-4">
<div className="flex">
<div className="flex-shrink-0">
<InformationCircleIcon
className="h-5 w-5 text-yellow-400"
aria-hidden="true"
/>
<InformationCircleIcon className="h-5 w-5 text-yellow-400" aria-hidden="true" />
</div>
<div className="ml-3 flex-1 md:flex md:justify-between">
<p className="text-sm text-yellow-700">
This document does not have any recipients. Add recipients to
create fields.
This document does not have any recipients. Add recipients to create fields.
</p>
<p className="mt-3 text-sm md:mt-0 md:ml-6">
<Link
href={
NEXT_PUBLIC_WEBAPP_URL +
"/documents/" +
props.document.id +
"/recipients"
}
className="whitespace-nowrap font-medium text-yellow-700 hover:text-yellow-600"
>
href={NEXT_PUBLIC_WEBAPP_URL + "/documents/" + props.document.id + "/recipients"}
className="whitespace-nowrap font-medium text-yellow-700 hover:text-yellow-600">
Add Recipients
<span aria-hidden="true"> &rarr;</span>
</Link>
@ -98,21 +88,13 @@ export default function PDFEditor(props: any) {
}}
onMouseDown={(e: any, page: number) => {
if (e.button === 0) addField(e, page);
}}
></PDFViewer>
}}></PDFViewer>
<div
hidden={noRecipients}
className="fixed left-0 top-1/3 max-w-xs border border-slate-300 bg-white py-4 pr-5 rounded-md"
>
<RecipientSelector
recipients={props?.document?.Recipient}
onChange={setSelectedRecipient}
/>
className="fixed left-0 top-1/3 max-w-xs rounded-md border border-slate-300 bg-white py-4 pr-5">
<RecipientSelector recipients={props?.document?.Recipient} onChange={setSelectedRecipient} />
<hr className="m-3 border-slate-300"></hr>
<FieldTypeSelector
selectedRecipient={selectedRecipient}
onChange={setSelectedFieldType}
/>
<FieldTypeSelector selectedRecipient={selectedRecipient} onChange={setSelectedFieldType} />
</div>
</div>
</>
@ -123,12 +105,7 @@ export default function PDFEditor(props: any) {
if (!selectedFieldType) return;
if (noRecipients) return;
const signatureField = createField(
e,
page,
selectedRecipient,
selectedFieldType
);
const signatureField = createField(e, page, selectedRecipient, selectedFieldType);
createOrUpdateField(props?.document, signatureField).then((res) => {
setFields((prevState) => [...prevState, res]);

77
apps/web/components/editor/pdf-signer.tsx
View File

@ -1,21 +1,14 @@
import Logo from "../logo";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import { useRouter } from "next/router";
import dynamic from "next/dynamic";
import SignatureDialog from "./signature-dialog";
import { useEffect, useState } from "react";
import { Button } from "@documenso/ui";
import {
CheckBadgeIcon,
InformationCircleIcon,
} from "@heroicons/react/24/outline";
import { FieldType } from "@prisma/client";
import {
createOrUpdateField,
deleteField,
signDocument,
} from "@documenso/lib/api";
import dynamic from "next/dynamic";
import { useRouter } from "next/router";
import { createField } from "@documenso/features/editor";
import { createOrUpdateField, deleteField, signDocument } from "@documenso/lib/api";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import { Button } from "@documenso/ui";
import Logo from "../logo";
import SignatureDialog from "./signature-dialog";
import { CheckBadgeIcon, InformationCircleIcon } from "@heroicons/react/24/outline";
import { FieldType } from "@prisma/client";
const PDFViewer = dynamic(() => import("./pdf-viewer"), {
ssr: false,
@ -27,9 +20,7 @@ export default function PDFSigner(props: any) {
const [signingDone, setSigningDone] = useState(false);
const [localSignatures, setLocalSignatures] = useState<any[]>([]);
const [fields, setFields] = useState<any[]>(props.fields);
const signatureFields = fields.filter(
(field) => field.type === FieldType.SIGNATURE
);
const signatureFields = fields.filter((field) => field.type === FieldType.SIGNATURE);
const [dialogField, setDialogField] = useState<any>();
useEffect(() => {
@ -80,9 +71,9 @@ export default function PDFSigner(props: any) {
<div className="bg-neon p-4">
<div className="flex">
<div className="flex-shrink-0">
<Logo className="h-12 w-12 -mt-2.5"></Logo>
<Logo className="-mt-2.5 h-12 w-12"></Logo>
</div>
<div className="ml-3 flex-1 md:flex md:justify-between text-center justify-start items-center">
<div className="ml-3 flex-1 items-center justify-start text-center md:flex md:justify-between">
<p className="text-lg text-slate-700">
{props.document.User.name
? `${props.document.User.name} (${props.document.User.email})`
@ -96,17 +87,10 @@ export default function PDFSigner(props: any) {
icon={CheckBadgeIcon}
className="float-right"
onClick={() => {
signDocument(
props.document,
localSignatures,
`${router.query.token}`
).then(() => {
router.push(
`/documents/${props.document.id}/signed?token=${router.query.token}`
);
signDocument(props.document, localSignatures, `${router.query.token}`).then(() => {
router.push(`/documents/${props.document.id}/signed?token=${router.query.token}`);
});
}}
>
}}>
Done
</Button>
</p>
@ -117,15 +101,11 @@ export default function PDFSigner(props: any) {
<div className="bg-yellow-50 p-4">
<div className="flex">
<div className="flex-shrink-0">
<InformationCircleIcon
className="h-5 w-5 text-yellow-400"
aria-hidden="true"
/>
<InformationCircleIcon className="h-5 w-5 text-yellow-400" aria-hidden="true" />
</div>
<div className="ml-3 flex-1 md:flex md:justify-between">
<p className="text-sm text-yellow-700">
You can sign this document anywhere you like, but maybe look for
a signature line.
You can sign this document anywhere you like, but maybe look for a signature line.
</p>
</div>
</div>
@ -144,12 +124,10 @@ export default function PDFSigner(props: any) {
pdfUrl={`${NEXT_PUBLIC_WEBAPP_URL}/api/documents/${router.query.id}?token=${router.query.token}`}
onClick={onClick}
onMouseDown={function onMouseDown(e: any, page: number) {
if (signatureFields.length === 0)
addFreeSignature(e, page, props.recipient);
if (signatureFields.length === 0) addFreeSignature(e, page, props.recipient);
}}
onMouseUp={() => {}}
onDelete={onDeleteHandler}
></PDFViewer>
onDelete={onDeleteHandler}></PDFViewer>
</>
);
@ -157,27 +135,16 @@ export default function PDFSigner(props: any) {
// Check if all fields are signed..
if (signatureFields.length > 0) {
// If there are no fields to sign at least one signature is enough
return fields
.filter((field) => field.type === FieldType.SIGNATURE)
.every((field) => field.signature);
return fields.filter((field) => field.type === FieldType.SIGNATURE).every((field) => field.signature);
} else {
return localSignatures.length > 0;
}
}
function addFreeSignature(e: any, page: number, recipient: any): any {
const freeSignatureField = createField(
e,
page,
recipient,
FieldType.FREE_SIGNATURE
);
const freeSignatureField = createField(e, page, recipient, FieldType.FREE_SIGNATURE);
createOrUpdateField(
props.document,
freeSignatureField,
recipient.token
).then((res) => {
createOrUpdateField(props.document, freeSignatureField, recipient.token).then((res) => {
setFields((prevState) => [...prevState, res]);
setDialogField(res);
setOpen(true);

33
apps/web/components/editor/pdf-viewer.jsx
View File

@ -1,9 +1,9 @@
import { Fragment, useState } from "react";
import { Document, Page } from "react-pdf/dist/esm/entry.webpack5";
import EditableField from "./editable-field";
import SignableField from "./signable-field";
import short from "short-uuid";
import { FieldType } from "@prisma/client";
import { Document, Page } from "react-pdf/dist/esm/entry.webpack5";
import short from "short-uuid";
export default function PDFViewer(props) {
const [numPages, setNumPages] = useState(null);
@ -30,19 +30,14 @@ export default function PDFViewer(props) {
return (
<>
<div
hidden={loading}
onMouseUp={props.onMouseUp}
style={{ height: numPages * pageHeight + 1000 }}
>
<div className="max-w-xs mt-6"></div>
<div hidden={loading} onMouseUp={props.onMouseUp} style={{ height: numPages * pageHeight + 1000 }}>
<div className="mt-6 max-w-xs"></div>
<Document
file={props.pdfUrl}
onLoadSuccess={onDocumentLoadSuccess}
options={options}
renderMode="canvas"
className="absolute w-auto mx-auto left-0 right-0"
>
className="absolute left-0 right-0 mx-auto w-auto">
{Array.from({ length: numPages }, (_, index) => (
<Fragment key={short.generate().toString()}>
<div
@ -57,8 +52,7 @@ export default function PDFViewer(props) {
position: "relative",
...props.style,
}}
className="mx-auto w-fit"
>
className="mx-auto w-fit">
<Page
className="mt-5"
key={`page_${index + 1}`}
@ -69,8 +63,7 @@ export default function PDFViewer(props) {
if (e.height) setPageHeight(e.height);
setLoading(false);
}}
onRenderError={() => setLoading(false)}
></Page>
onRenderError={() => setLoading(false)}></Page>
{props?.fields
.filter((field) => field.page === index)
.map((field) =>
@ -80,21 +73,15 @@ export default function PDFViewer(props) {
key={field.id}
field={field}
className="absolute"
onDelete={onDeleteHandler}
></SignableField>
onDelete={onDeleteHandler}></SignableField>
) : (
<EditableField
hidden={
field.Signature ||
field.inserted ||
field.type === FieldType.FREE_SIGNATURE
}
hidden={field.Signature || field.inserted || field.type === FieldType.FREE_SIGNATURE}
key={field.id}
field={field}
className="absolute"
onPositionChanged={onPositionChangedHandler}
onDelete={onDeleteHandler}
></EditableField>
onDelete={onDeleteHandler}></EditableField>
)
)}
</div>

31
apps/web/components/editor/recipient-selector.tsx
View File

@ -1,13 +1,12 @@
import { Fragment, useEffect, useState } from "react";
import { classNames } from "@documenso/lib";
import { Listbox, Transition } from "@headlessui/react";
import { CheckIcon, ChevronUpDownIcon } from "@heroicons/react/24/outline";
import { classNames } from "@documenso/lib";
const stc = require("string-to-color");
export default function RecipientSelector(props: any) {
const [selectedRecipient, setSelectedRecipient]: any = useState(
props?.recipients[0]
);
const [selectedRecipient, setSelectedRecipient]: any = useState(props?.recipients[0]);
useEffect(() => {
props.onChange(selectedRecipient);
@ -18,11 +17,10 @@ export default function RecipientSelector(props: any) {
value={selectedRecipient}
onChange={(e: any) => {
setSelectedRecipient(e);
}}
>
}}>
{({ open }) => (
<div className="relative mt-1 mb-2">
<Listbox.Button className="select-none relative w-full cursor-default rounded-md border border-gray-300 bg-white py-2 pl-3 pr-10 text-left focus:border-neon focus:outline-none focus:ring-1 focus:ring-neon sm:text-sm">
<Listbox.Button className="focus:border-neon focus:ring-neon relative w-full cursor-default select-none rounded-md border border-gray-300 bg-white py-2 pl-3 pr-10 text-left focus:outline-none focus:ring-1 sm:text-sm">
<span className="flex items-center">
<span
className="inline-block h-4 w-4 flex-shrink-0 rounded-full"
@ -33,10 +31,7 @@ export default function RecipientSelector(props: any) {
</span>
</span>
<span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
<ChevronUpDownIcon
className="h-5 w-5 text-gray-400"
aria-hidden="true"
/>
<ChevronUpDownIcon className="h-5 w-5 text-gray-400" aria-hidden="true" />
</span>
</Listbox.Button>
@ -45,20 +40,18 @@ export default function RecipientSelector(props: any) {
as={Fragment}
leave="transition ease-in duration-100"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
leaveTo="opacity-0">
<Listbox.Options className="absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm">
{props?.recipients.map((recipient: any) => (
<Listbox.Option
key={recipient?.id}
className={({ active }) =>
classNames(
active ? "text-white bg-neon-dark" : "text-gray-900",
active ? "bg-neon-dark text-white" : "text-gray-900",
"relative cursor-default select-none py-2 pl-3 pr-9"
)
}
value={recipient}
>
value={recipient}>
{({ selected, active }) => (
<>
<div className="flex items-center">
@ -72,8 +65,7 @@ export default function RecipientSelector(props: any) {
className={classNames(
selected ? "font-semibold" : "font-normal",
"ml-3 block truncate"
)}
>
)}>
{`${selectedRecipient?.name} <${selectedRecipient?.email}>`}
</span>
</div>
@ -83,8 +75,7 @@ export default function RecipientSelector(props: any) {
className={classNames(
active ? "text-white" : "text-neon-dark",
"absolute inset-y-0 right-0 flex items-center pr-4"
)}
>
)}>
<CheckIcon className="h-5 w-5" aria-hidden="true" />
</span>
) : null}

24
apps/web/components/editor/signable-field.tsx
View File

@ -1,8 +1,9 @@
import React, { useState } from "react";
import Draggable from "react-draggable";
import { classNames } from "@documenso/lib";
import { IconButton } from "@documenso/ui";
import { XCircleIcon } from "@heroicons/react/20/solid";
import { classNames } from "@documenso/lib";
import Draggable from "react-draggable";
const stc = require("string-to-color");
type FieldPropsType = {
@ -37,31 +38,26 @@ export default function SignableField(props: FieldPropsType) {
onMouseDown={(e: any) => {
// e.preventDefault();
e.stopPropagation();
}}
>
}}>
<div
onClick={(e: any) => {
if (!field?.signature) props.onClick(props.field);
}}
ref={nodeRef}
className={classNames(
"opacity-80 m-auto w-48 h-16 flex-row-reverse text-lg font-bold text-center absolute top-0 left-0 select-none",
field.type === "SIGNATURE"
? "cursor-pointer hover:brightness-50"
: "cursor-not-allowed"
"absolute top-0 left-0 m-auto h-16 w-48 select-none flex-row-reverse text-center text-lg font-bold opacity-80",
field.type === "SIGNATURE" ? "cursor-pointer hover:brightness-50" : "cursor-not-allowed"
)}
style={{
background: stc(props.field.Recipient.email),
}}
>
<div hidden={field?.signature} className="font-medium my-4">
}}>
<div hidden={field?.signature} className="my-4 font-medium">
{field.type === "SIGNATURE" ? "SIGN HERE" : ""}
{field.type === "DATE" ? <small>Date (filled on sign)</small> : ""}
</div>
<div
hidden={!field?.signature}
className="font-qwigley text-5xl m-auto w-auto flex-row-reverse font-medium text-center"
>
className="font-qwigley m-auto w-auto flex-row-reverse text-center text-5xl font-medium">
{field?.signature?.type === "type" ? (
<div className="my-4">{field?.signature.typedSignature}</div>
) : (
@ -69,7 +65,7 @@ export default function SignableField(props: FieldPropsType) {
)}
{field?.signature?.type === "draw" ? (
<img className="w-48 h-16" src={field?.signature?.signatureImage} />
<img className="h-16 w-48" src={field?.signature?.signatureImage} />
) : (
""
)}

72
apps/web/components/editor/signature-dialog.tsx
View File

@ -1,14 +1,10 @@
import { Fragment, useEffect, useState } from "react";
import { classNames } from "@documenso/lib";
import { localStorage } from "@documenso/lib";
import { Button, IconButton } from "@documenso/ui";
import { Dialog, Transition } from "@headlessui/react";
import {
LanguageIcon,
PencilIcon,
TrashIcon,
} from "@heroicons/react/24/outline";
import { Fragment, useEffect, useState } from "react";
import { LanguageIcon, PencilIcon, TrashIcon } from "@heroicons/react/24/outline";
import SignatureCanvas from "react-signature-canvas";
import { localStorage } from "@documenso/lib";
const tabs = [
{ name: "Type", icon: LanguageIcon, current: true },
@ -34,8 +30,7 @@ export default function SignatureDialog(props: any) {
onClose={() => {
props.setOpen(false);
setCurrent(tabs[0]);
}}
>
}}>
<Transition.Child
as={Fragment}
enter="ease-out duration-300"
@ -43,8 +38,7 @@ export default function SignatureDialog(props: any) {
enterTo="opacity-100"
leave="ease-in duration-200"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
leaveTo="opacity-0">
<div className="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" />
</Transition.Child>
@ -57,11 +51,10 @@ export default function SignatureDialog(props: any) {
enterTo="opacity-100 translate-y-0 sm:scale-100"
leave="ease-in duration-200"
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<Dialog.Panel className="min-h-[350px] relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-sm sm:p-6">
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">
<Dialog.Panel className="relative min-h-[350px] transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-sm sm:p-6">
<div className="">
<div className="border-b border-gray-200 mb-3">
<div className="mb-3 border-b border-gray-200">
<nav className="-mb-px flex space-x-8" aria-label="Tabs">
{tabs.map((tab) => (
<a
@ -72,16 +65,13 @@ export default function SignatureDialog(props: any) {
className={classNames(
tab.current
? "border-neon text-neon"
: "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300",
"group inline-flex items-center py-4 px-1 border-b-2 font-medium text-sm cursor-pointer"
: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700",
"group inline-flex cursor-pointer items-center border-b-2 py-4 px-1 text-sm font-medium"
)}
aria-current={tab.current ? "page" : undefined}
>
aria-current={tab.current ? "page" : undefined}>
<tab.icon
className={classNames(
tab.current
? "text-neon"
: "text-gray-400 group-hover:text-gray-500",
tab.current ? "text-neon" : "text-gray-400 group-hover:text-gray-500",
"-ml-0.5 mr-2 h-5 w-5"
)}
aria-hidden="true"
@ -93,7 +83,7 @@ export default function SignatureDialog(props: any) {
</div>
{isCurrentTab("Type") ? (
<div>
<div className="my-8 border-b border-gray-300 mb-3">
<div className="my-8 mb-3 border-b border-gray-300">
<input
value={typedSignature}
onChange={(e) => {
@ -101,7 +91,7 @@ export default function SignatureDialog(props: any) {
}}
className={classNames(
typedSignature ? "font-qwigley text-4xl" : "",
"leading-none h-10 align-bottom mt-14 text-center block w-full focus:border-neon focus:ring-neon text-2xl"
"focus:border-neon focus:ring-neon mt-14 block h-10 w-full text-center align-bottom text-2xl leading-none"
)}
placeholder="Kindly type your name"
/>
@ -113,24 +103,19 @@ export default function SignatureDialog(props: any) {
props.onClose();
props.setOpen(false);
setCurrent(tabs[0]);
}}
>
}}>
Cancel
</Button>
<Button
className="ml-3"
disabled={!typedSignature}
onClick={() => {
localStorage.setItem(
"typedSignature",
typedSignature
);
localStorage.setItem("typedSignature", typedSignature);
props.onClose({
type: "type",
typedSignature: typedSignature,
});
}}
>
}}>
Sign
</Button>
</div>
@ -145,8 +130,7 @@ export default function SignatureDialog(props: any) {
signCanvasRef = ref;
}}
canvasProps={{
className:
"sigCanvas border-b b-2 border-slate w-full h-full mb-3",
className: "sigCanvas border-b b-2 border-slate w-full h-full mb-3",
}}
clearOnResize={true}
onEnd={() => {
@ -154,22 +138,20 @@ export default function SignatureDialog(props: any) {
}}
/>
<IconButton
className="block float-left"
className="float-left block"
icon={TrashIcon}
onClick={() => {
signCanvasRef?.clear();
setSignatureEmpty(signCanvasRef?.isEmpty());
}}
></IconButton>
<div className="mt-10 float-right">
}}></IconButton>
<div className="float-right mt-10">
<Button
color="secondary"
onClick={() => {
props.onClose();
props.setOpen(false);
setCurrent(tabs[0]);
}}
>
}}>
Cancel
</Button>
<Button
@ -177,12 +159,10 @@ export default function SignatureDialog(props: any) {
onClick={() => {
props.onClose({
type: "draw",
signatureImage:
signCanvasRef.toDataURL("image/png"),
signatureImage: signCanvasRef.toDataURL("image/png"),
});
}}
disabled={signatureEmpty}
>
disabled={signatureEmpty}>
Sign
</Button>
</div>
@ -200,11 +180,11 @@ export default function SignatureDialog(props: any) {
</>
);
function isCurrentTab(tabName: string): boolean {
function isCurrentTab(tabName: string): boolean {
return currentTab.name === tabName;
}
function setCurrent(t: any) {
function setCurrent(t: any) {
tabs.forEach((tab) => {
tab.current = tab.name === t.name;
});

3
apps/web/components/layout.tsx
View File

@ -1,9 +1,8 @@
import { useEffect } from "react";
import { useRouter } from "next/router";
import { useSession } from "next-auth/react";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import Navigation from "./navigation";
import { useSession } from "next-auth/react";
function useRedirectToLoginIfUnauthenticated() {
const { data: session, status } = useSession();

49
apps/web/components/login.tsx
View File

@ -1,14 +1,13 @@
import { LockClosedIcon } from "@heroicons/react/20/solid";
import Link from "next/link";
import { FormProvider, useForm } from "react-hook-form";
import Logo from "./logo";
import { signIn } from "next-auth/react";
import { useState } from "react";
import Link from "next/link";
import { useRouter } from "next/router";
import { toast } from "react-hot-toast";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import { Button } from "@documenso/ui";
import Logo from "./logo";
import { LockClosedIcon } from "@heroicons/react/20/solid";
import { signIn } from "next-auth/react";
import { FormProvider, useForm } from "react-hook-form";
import { toast } from "react-hot-toast";
interface LoginValues {
email: string;
@ -22,10 +21,7 @@ export default function Login(props: any) {
const methods = useForm<LoginValues>();
const { register, formState } = methods;
const [errorMessage, setErrorMessage] = useState<string | null>(null);
let callbackUrl =
typeof router.query?.callbackUrl === "string"
? router.query.callbackUrl
: "";
let callbackUrl = typeof router.query?.callbackUrl === "string" ? router.query.callbackUrl : "";
// If not absolute URL, make it absolute
if (!/^https?:\/\//.test(callbackUrl)) {
@ -79,10 +75,7 @@ export default function Login(props: any) {
</h2>
</div>
<FormProvider {...methods}>
<form
className="mt-8 space-y-6"
onSubmit={methods.handleSubmit(onSubmit)}
>
<form className="mt-8 space-y-6" onSubmit={methods.handleSubmit(onSubmit)}>
<input type="hidden" name="remember" defaultValue="true" />
<div className="-space-y-px rounded-md shadow-sm">
<div>
@ -96,7 +89,7 @@ export default function Login(props: any) {
type="email"
autoComplete="email"
required
className="relative block w-full appearance-none rounded-none rounded-t-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon relative block w-full appearance-none rounded-none rounded-t-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:outline-none sm:text-sm"
placeholder="Email"
/>
</div>
@ -111,14 +104,14 @@ export default function Login(props: any) {
type="password"
autoComplete="current-password"
required
className="relative block w-full appearance-none rounded-none rounded-b-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon relative block w-full appearance-none rounded-none rounded-b-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:outline-none sm:text-sm"
placeholder="Password"
/>
</div>
</div>
<div className="flex items-center justify-between">
<div className="text-sm">
<a href="#" className="font-medium text-neon hover:text-neon">
<a href="#" className="text-neon hover:text-neon font-medium">
Forgot your password?
</a>
</div>
@ -127,11 +120,10 @@ export default function Login(props: any) {
<Button
type="submit"
disabled={formState.isSubmitting}
className="group relative flex w-full"
>
className="group relative flex w-full">
<span className="absolute inset-y-0 left-0 flex items-center pl-3">
<LockClosedIcon
className="h-5 w-5 text-neon-dark group-hover:text-neon disabled:group-hover:bg-gray-600 disabled:disabled:bg-gray-600"
className="text-neon-dark group-hover:text-neon h-5 w-5 disabled:disabled:bg-gray-600 disabled:group-hover:bg-gray-600"
aria-hidden="true"
/>
</span>
@ -140,10 +132,7 @@ export default function Login(props: any) {
</div>
<div>
<div className="relative">
<div
className="absolute inset-0 flex items-center"
aria-hidden="true"
>
<div className="absolute inset-0 flex items-center" aria-hidden="true">
<div className="w-full border-t border-gray-300" />
</div>
<div className="relative flex justify-center"></div>
@ -152,20 +141,14 @@ export default function Login(props: any) {
{props.allowSignup ? (
<p className="mt-2 text-center text-sm text-gray-600">
Are you new here?{" "}
<Link
href="/signup"
className="font-medium text-neon hover:text-neon"
>
<Link href="/signup" className="text-neon hover:text-neon font-medium">
Create a new Account
</Link>
</p>
) : (
<p className="mt-2 text-center text-sm text-gray-600">
Like Documenso{" "}
<Link
href="https://documenso.com"
className="font-medium text-neon hover:text-neon"
>
<Link href="https://documenso.com" className="text-neon hover:text-neon font-medium">
Hosted Documenso will be availible soon™
</Link>
</p>

17
apps/web/components/logo.tsx
View File

@ -1,25 +1,16 @@
import { classNames } from "@documenso/lib";
import Link from "next/link";
import { classNames } from "@documenso/lib";
export default function Logo(props: any) {
return (
<>
<Link href="/dashboard">
<svg
className="w-12"
viewBox="0 0 88.6758041381836 32.18000030517578"
{...props}
>
<rect
width="88.6758041381836"
height="32.18000030517578"
fill="transparent"
></rect>
<svg className="w-12" viewBox="0 0 88.6758041381836 32.18000030517578" {...props}>
<rect width="88.6758041381836" height="32.18000030517578" fill="transparent"></rect>
<g transform="matrix(1,0,0,1,-25.98720359802246,-66.41200256347656)">
<path
d="M99.004,68.26l-.845-1.848-23.226,2.299c-1.437,.142-2.876,.089-4.3-.156-2.949-.51-6.32-1.717-9.073-2.099-1.477-.206-2.934,.448-3.789,1.67-1.174,1.678-2.308,3.888-3.501,5.622-1.518,2.207-3.032,4.418-4.531,6.638-1.693,2.499-3.365,5.013-5.061,7.51-.103,.153-.333,.221-.503,.329-.079-.279-.306-.636-.206-.824,1.006-1.928,1.845-4,3.165-5.694,1.908-2.449,2.914-5.445,5.007-7.745,.342-.777,.845-1.466,1.151-2.244,.915-2.341-1.295-5.305-2.935-5.305h-.613c-1.196,0-2.526,.357-4.092,1.716-.986,.856-2.391,2.432-2.97,3.326-3.424,5.286-7.177,10.382-10.15,15.932-.365,.682-1.719,3.722-2.013,3.606-.214-.077-.159-.458-.041-.823,1.312-4.065,4.163-9.851,5.843-13.777,.41-.962,.635-1.516-.305-2.361-1.016-.913-2.669,.084-3.084,1.052-1.784,4.174-2.631,8.08-4.038,12.396-.466,1.43-.916,2.865-1.386,4.294-.273,.831-.548,1.661-.836,2.488-.112,.321-.226,.642-.345,.962-.032,.082-.064,.165-.095,.248-.006,.011-.003,.002-.009,.017-.005,.008-.003,.015-.006,.023-.011,.026-.021,.05-.03,.076-.024,.067-.012,.044,.009-.002-.691,1.577,.417,3.002,2.091,3.002,.808,0,1.552-1.431,1.943-2.055,1.224-1.957,3.28-5.125,4.36-7.163,.894-1.69,2.078-3.14,3.209-4.615,1.857-2.42,3.065-5.242,5.025-7.575,.33-.394,.694-.772,1.093-1.093,.121-.098,.473-.05,.618,.062,.124,.098,.2,.432,.127,.577-.397,.788-.863,1.542-1.278,2.322-1.481,2.79-2.953,5.582-4.425,8.377-1.16,2.204-2.659,5.055-3.551,6.755-.438,.833-.176,1.857,.604,2.382,0,0-.383,2.028,1.908,2.028,1.896,0,2.711-1.145,3.053-1.624,.348-.486,.748-.951,1.202-1.334,.151-.13,.563-.018,.821,.079,.076,.029,.085,.406,.03,.582-.398,1.272-.323,2.283,1.879,2.283,.784,0,2.218-1.283,2.904-2.213,.794-1.075,.731-1.1,1.415-2.244,1.678-2.821,3.132-5.055,4.751-7.91,1.083-1.91,2.175-3.854,3.294-5.516,.685-1.015,1.446-1.252,2.188-1.252s.409,.686,.336,1.025c-.071,.341-.677,1.545-2.531,4.35-1.115,1.687-2.244,3.367-3.308,5.084-1.075,1.736-2.141,3.48-3.205,5.225-.88,1.445,.162,3.467,1.854,3.467h2.765c2.653,0,5.302-.397,7.916-.851l7.41-1.287c1.421-.245,2.868-.298,4.303-.158l23.161,2.296,.845-1.849c4.61-9.858,15.211-11.322,15.66-11.38v-5.717c-.448-.058-11.05-1.522-15.66-11.381Zm-40.143,6.165c-.164,.465-.491,.922-.86,1.255-.918,.828-1.451,1.842-1.911,2.977-.512,1.269-1.829,2.119-1.966,3.65-.027,.3-.627,.577-1.006,.797-.109,.062-.357-.114-.524-.174,.015-.229-.024-.401,.039-.515,.848-1.495,1.678-3.002,2.584-4.462,.775-1.254,1.642-2.453,2.469-3.677,.085-.126,.158-.273,.27-.365,.457-.368,.93-.719,1.399-1.075,.497,.721-.312,1.071-.494,1.589Zm30.047,12.011c1.736,0,3.162-1.137,3.686-2.693h10.547c-3.02,1.916-6.1,4.684-8.402,8.716l-21.902-2.17v-15.584l21.902-2.167c2.302,4.032,5.382,6.802,8.402,8.714h-10.547c-.524-1.554-1.951-2.691-3.686-2.691-2.172,0-3.938,1.763-3.938,3.938s1.766,3.938,3.938,3.938Z"
className={classNames(props.dark ? "fill-white" : "fill-brown")}
></path>
className={classNames(props.dark ? "fill-white" : "fill-brown")}></path>
</g>
</svg>
</Link>

60
apps/web/components/navigation.tsx
View File

@ -1,23 +1,22 @@
import { Fragment, useEffect, useState } from "react";
import { Disclosure, Menu, Transition } from "@headlessui/react";
import Link from "next/link";
import { useRouter } from "next/router";
import { signOut, useSession } from "next-auth/react";
import avatarFromInitials from "avatar-from-initials";
import { toast } from "react-hot-toast";
import { getUser } from "@documenso/lib/api";
import Logo from "./logo";
import { Disclosure, Menu, Transition } from "@headlessui/react";
import {
ArrowRightOnRectangleIcon,
Bars3Icon,
BellIcon,
XMarkIcon,
UserCircleIcon,
ArrowRightOnRectangleIcon,
DocumentTextIcon,
ChartBarIcon,
DocumentTextIcon,
UserCircleIcon,
WrenchIcon,
XMarkIcon,
} from "@heroicons/react/24/outline";
import Logo from "./logo";
import { getUser } from "@documenso/lib/api";
import avatarFromInitials from "avatar-from-initials";
import { signOut, useSession } from "next-auth/react";
import { toast } from "react-hot-toast";
const navigation = [
{
@ -125,14 +124,12 @@ export default function TopNavigation() {
item.current
? "border-neon text-brown"
: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700",
"inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium"
"inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium"
)}
aria-current={item.current ? "page" : undefined}
>
aria-current={item.current ? "page" : undefined}>
<item.icon
className="flex-shrink-0 -ml-1 mr-3 h-6 w-6 inline"
aria-hidden="true"
></item.icon>
className="-ml-1 mr-3 inline h-6 w-6 flex-shrink-0"
aria-hidden="true"></item.icon>
{item.name}
</Link>
))}
@ -142,8 +139,7 @@ export default function TopNavigation() {
onClick={() => {
document?.getElementById("mb")?.click();
}}
className="hidden sm:ml-6 sm:flex sm:items-center hover:bg-gray-200 px-3 cursor-pointer"
>
className="hidden cursor-pointer px-3 hover:bg-gray-200 sm:ml-6 sm:flex sm:items-center">
<span className="text-sm">
<p className="font-bold">{user?.name || ""}</p>
<p>{user?.email}</p>
@ -152,8 +148,7 @@ export default function TopNavigation() {
<div>
<Menu.Button
id="mb"
className="flex max-w-xs items-center rounded-full bg-white text-sm"
>
className="flex max-w-xs items-center rounded-full bg-white text-sm">
<span className="sr-only">Open user menu</span>
<div
key={user?.email}
@ -170,8 +165,7 @@ export default function TopNavigation() {
enterTo="transform opacity-100 scale-100"
leave="transition ease-in duration-75"
leaveFrom="transform opacity-100 scale-100"
leaveTo="transform opacity-0 scale-95"
>
leaveTo="transform opacity-0 scale-95">
<Menu.Items className="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
{userNavigation.map((item) => (
<Menu.Item key={item.name}>
@ -182,12 +176,10 @@ export default function TopNavigation() {
className={classNames(
active ? "bg-gray-100" : "",
"block px-4 py-2 text-sm text-gray-700"
)}
>
)}>
<item.icon
className="flex-shrink-0 -ml-1 mr-3 h-6 w-6 inline"
aria-hidden="true"
></item.icon>
className="-ml-1 mr-3 inline h-6 w-6 flex-shrink-0"
aria-hidden="true"></item.icon>
{item.name}
</Link>
)}
@ -219,15 +211,14 @@ export default function TopNavigation() {
href={item.href}
className={classNames(
item.current
? "bg-teal-50 border-teal-500 text-teal-700"
: "border-transparent text-gray-600 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-800",
"block pl-3 pr-4 py-2 border-l-4 text-base font-medium"
? "border-teal-500 bg-teal-50 text-teal-700"
: "border-transparent text-gray-600 hover:border-gray-300 hover:bg-gray-50 hover:text-gray-800",
"block border-l-4 py-2 pl-3 pr-4 text-base font-medium"
)}
aria-current={item.current ? "page" : undefined}
onClick={() => {
close();
}}
>
}}>
{item.name}
</Link>
))}
@ -259,8 +250,7 @@ export default function TopNavigation() {
: item.click
}
href={item.href}
className="block px-4 py-2 text-base font-medium text-gray-500 hover:bg-gray-100 hover:text-gray-800"
>
className="block px-4 py-2 text-base font-medium text-gray-500 hover:bg-gray-100 hover:text-gray-800">
{item.name}
</Link>
))}

69
apps/web/components/settings.tsx
View File

@ -1,12 +1,12 @@
import { ChangeEvent, useEffect, useState } from "react";
import { KeyIcon, UserCircleIcon } from "@heroicons/react/24/outline";
import { useRouter } from "next/router";
import Link from "next/link";
import Head from "next/head";
import { useSession } from "next-auth/react";
import Link from "next/link";
import { useRouter } from "next/router";
import { updateUser } from "@documenso/features";
import { Button } from "@documenso/ui";
import { getUser } from "@documenso/lib/api";
import { Button } from "@documenso/ui";
import { KeyIcon, UserCircleIcon } from "@heroicons/react/24/outline";
import { useSession } from "next-auth/react";
const subNavigation = [
{
@ -74,15 +74,10 @@ export default function Setttings() {
</Head>
<header className="py-10">
<div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
<h1 className="text-3xl font-bold leading-tight tracking-tight text-brown">
Settings
</h1>
<h1 className="text-brown text-3xl font-bold leading-tight tracking-tight">Settings</h1>
</div>
</header>
<div
className="mx-auto max-w-screen-xl px-4 pb-6 sm:px-6 lg:px-8 lg:pb-16"
hidden={!user.email}
>
<div className="mx-auto max-w-screen-xl px-4 pb-6 sm:px-6 lg:px-8 lg:pb-16" hidden={!user.email}>
<div className="overflow-hidden rounded-lg bg-white shadow">
<div className="divide-y divide-gray-200 lg:grid lg:grid-cols-12 lg:divide-y-0 lg:divide-x">
<aside className="py-6 lg:col-span-3">
@ -93,18 +88,17 @@ export default function Setttings() {
href={item.href}
className={classNames(
item.current
? "bg-teal-50 border-neon-dark text-teal-700 hover:bg-teal-50 hover:text-teal-700"
? "border-neon-dark bg-teal-50 text-teal-700 hover:bg-teal-50 hover:text-teal-700"
: "border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900",
"group border-l-4 px-3 py-2 flex items-center text-sm font-medium"
"group flex items-center border-l-4 px-3 py-2 text-sm font-medium"
)}
aria-current={item.current ? "page" : undefined}
>
aria-current={item.current ? "page" : undefined}>
<item.icon
className={classNames(
item.current
? "text-teal-500 group-hover:text-teal-500"
: "text-gray-400 group-hover:text-gray-500",
"flex-shrink-0 -ml-1 mr-3 h-6 w-6"
"-ml-1 mr-3 h-6 w-6 flex-shrink-0"
)}
aria-hidden="true"
/>
@ -115,20 +109,14 @@ export default function Setttings() {
</aside>
<form
className="divide-y divide-gray-200 lg:col-span-9 min-h-[251px]"
className="min-h-[251px] divide-y divide-gray-200 lg:col-span-9"
action="#"
method="POST"
hidden={
subNavigation.filter((e) => e.current)[0]?.name !==
subNavigation[0].name
}
>
hidden={subNavigation.filter((e) => e.current)[0]?.name !== subNavigation[0].name}>
{/* Profile section */}
<div className="py-6 px-4 sm:p-6 lg:pb-8">
<div>
<h2 className="text-lg font-medium leading-6 text-gray-900">
Profile
</h2>
<h2 className="text-lg font-medium leading-6 text-gray-900">Profile</h2>
<p className="mt-1 text-sm text-gray-500">
Let people know who they are dealing with builds trust.
</p>
@ -136,10 +124,7 @@ export default function Setttings() {
<div className="my-6 grid grid-cols-12 gap-6">
<div className="col-span-12 sm:col-span-6">
<label
htmlFor="first-name"
className="block text-sm font-medium text-gray-700"
>
<label htmlFor="first-name" className="block text-sm font-medium text-gray-700">
Full Name
</label>
<input
@ -150,14 +135,11 @@ export default function Setttings() {
onChange={(e) => handleNameChange(e)}
onKeyDown={handleKeyPress}
autoComplete="given-name"
className="mt-1 block w-full rounded-md border border-gray-300 py-2 px-3 shadow-sm focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon mt-1 block w-full rounded-md border border-gray-300 py-2 px-3 shadow-sm focus:outline-none sm:text-sm"
/>
</div>
<div className="col-span-12 sm:col-span-6">
<label
htmlFor="first-name"
className="block text-sm font-medium text-gray-700"
>
<label htmlFor="first-name" className="block text-sm font-medium text-gray-700">
Email
</label>
<input
@ -167,7 +149,7 @@ export default function Setttings() {
name="first-name"
id="first-name"
autoComplete="given-name"
className="mt-1 block w-full rounded-md border disabled:bg-neutral-100 border-gray-300 py-2 px-3 shadow-sm focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon mt-1 block w-full rounded-md border border-gray-300 py-2 px-3 shadow-sm focus:outline-none disabled:bg-neutral-100 sm:text-sm"
/>
</div>
</div>
@ -175,21 +157,14 @@ export default function Setttings() {
</div>
</form>
<div
hidden={
subNavigation.filter((e) => e.current)[0]?.name !==
subNavigation[1].name
}
className="divide-y divide-gray-200 lg:col-span-9 min-h-[251px]"
>
hidden={subNavigation.filter((e) => e.current)[0]?.name !== subNavigation[1].name}
className="min-h-[251px] divide-y divide-gray-200 lg:col-span-9">
{/* Passwords section */}
<div className="py-6 px-4 sm:p-6 lg:pb-8">
<div>
<h2 className="text-lg font-medium leading-6 text-gray-900">
Password
</h2>
<h2 className="text-lg font-medium leading-6 text-gray-900">Password</h2>
<p className="mt-1 text-sm text-gray-500">
Forgot your passwort? Email <b>hi@documenso.com</b> to reset
it.
Forgot your passwort? Email <b>hi@documenso.com</b> to reset it.
</p>
</div>
</div>

28
apps/web/components/signup.tsx
View File

@ -1,9 +1,9 @@
import Link from "next/link";
import { signup } from "@documenso/lib/api";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
import { Button } from "@documenso/ui";
import { XCircleIcon } from "@heroicons/react/24/outline";
import { signIn } from "next-auth/react";
import Link from "next/link";
import { FormProvider, SubmitHandler, useForm } from "react-hook-form";
import { toast } from "react-hot-toast";
@ -107,8 +107,7 @@ export default function Signup(props: { source: string }) {
viewBox="0 0 24 24"
strokeWidth={1.5}
stroke="rgb(17 24 39 / var(--tw-text-opacity))"
className="w-8 h-8 inline mb-1"
>
className="mb-1 inline h-8 w-8">
<path
strokeLinecap="round"
strokeLinejoin="round"
@ -130,8 +129,7 @@ export default function Signup(props: { source: string }) {
form.clearErrors();
trigger();
}}
className="mt-8 space-y-6"
>
className="mt-8 space-y-6">
<input type="hidden" name="remember" defaultValue="true" />
<div className="-space-y-px rounded-md shadow-sm">
<div>
@ -145,7 +143,7 @@ export default function Signup(props: { source: string }) {
type="email"
autoComplete="email"
required
className="relative block w-full appearance-none rounded-none rounded-t-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon relative block w-full appearance-none rounded-none rounded-t-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:outline-none sm:text-sm"
placeholder="Email"
/>
</div>
@ -157,8 +155,7 @@ export default function Signup(props: { source: string }) {
{...register("password", {
minLength: {
value: 7,
message:
"Your password has to be at least 7 characters long.",
message: "Your password has to be at least 7 characters long.",
},
})}
id="password"
@ -166,7 +163,7 @@ export default function Signup(props: { source: string }) {
type="password"
autoComplete="current-password"
required
className="relative block w-full appearance-none rounded-none rounded-b-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
className="focus:border-neon focus:ring-neon relative block w-full appearance-none rounded-none rounded-b-md border border-gray-300 px-3 py-2 text-gray-900 placeholder-gray-500 focus:z-10 focus:outline-none sm:text-sm"
placeholder="Password"
/>
</div>
@ -177,16 +174,12 @@ export default function Signup(props: { source: string }) {
onClick={() => {
form.clearErrors();
}}
className="sgroup relative flex w-full"
>
className="sgroup relative flex w-full">
Create Account
</Button>
<div className="pt-2">
<div className="relative">
<div
className="absolute inset-0 flex items-center"
aria-hidden="true"
>
<div className="absolute inset-0 flex items-center" aria-hidden="true">
<div className="w-full border-t border-gray-300" />
</div>
<div className="relative flex justify-center"></div>
@ -194,10 +187,7 @@ export default function Signup(props: { source: string }) {
</div>
<p className="mt-2 text-center text-sm text-gray-600">
Already have an account?{" "}
<Link
href="/login"
className="font-medium text-neon hover:text-neon"
>
<Link href="/login" className="text-neon hover:text-neon font-medium">
Sign In
</Link>
</p>

3
apps/web/next.config.js
View File

@ -18,7 +18,6 @@ const withTM = require("next-transpile-modules")([
const plugins = [];
plugins.push(withTM);
const moduleExports = () =>
plugins.reduce((acc, next) => next(acc), nextConfig);
const moduleExports = () => plugins.reduce((acc, next) => next(acc), nextConfig);
module.exports = moduleExports;

18
apps/web/pages/404.jsx
View File

@ -1,31 +1,27 @@
import { ArrowSmallLeftIcon } from "@heroicons/react/20/solid";
import { Button } from "@documenso/ui";
import Logo from "../components/logo";
import { ArrowSmallLeftIcon } from "@heroicons/react/20/solid";
export default function Custom404() {
return (
<>
<main className="relative min-h-full bg-gray-100 isolate">
<main className="relative isolate min-h-full bg-gray-100">
<div className="absolute top-10 left-10">
<Logo className="w-10 md:w-20" />
</div>
<div className="px-6 py-48 mx-auto text-center max-w-7xl sm:py-40 lg:px-8">
<p className="text-base font-semibold leading-8 text-brown">404</p>
<h1 className="mt-4 text-3xl font-bold tracking-tight text-brown sm:text-5xl">
Page not found
</h1>
<div className="mx-auto max-w-7xl px-6 py-48 text-center sm:py-40 lg:px-8">
<p className="text-brown text-base font-semibold leading-8">404</p>
<h1 className="text-brown mt-4 text-3xl font-bold tracking-tight sm:text-5xl">Page not found</h1>
<p className="mt-4 text-base text-gray-700 sm:mt-6">
Sorry, we couldn’t find the page you’re looking for.
</p>
<div className="flex justify-center mt-10">
<div className="mt-10 flex justify-center">
<Button
color="secondary"
href="/"
icon={ArrowSmallLeftIcon}
className="text-base font-semibold leading-7 text-brown"
>
className="text-brown text-base font-semibold leading-7">
Back to home
</Button>
</div>

16
apps/web/pages/500.jsx
View File

@ -1,27 +1,23 @@
import Logo from "../components/logo";
import { Button } from "@documenso/ui";
import Logo from "../components/logo";
import { ArrowSmallLeftIcon } from "@heroicons/react/20/solid";
import { EllipsisVerticalIcon } from "@heroicons/react/20/solid";
export default function Custom500() {
return (
<>
<div className="relative flex flex-col items-center justify-center min-h-full text-white bg-black">
<div className="relative flex min-h-full flex-col items-center justify-center bg-black text-white">
<div className="absolute top-10 left-10">
<Logo dark className="w-10 md:w-20" />
</div>
<div className="px-4 py-10 mt-20 max-w-7xl">
<div className="mt-20 max-w-7xl px-4 py-10">
<p className="inline-flex items-center text-3xl font-bold sm:text-5xl">
500
<span className="relative px-3 font-thin sm:text-6xl -top-1.5">
|
</span>{" "}
<span className="text-base font-semibold align-middle sm:text-2xl">
Something went wrong.
</span>
<span className="relative -top-1.5 px-3 font-thin sm:text-6xl">|</span>{" "}
<span className="align-middle text-base font-semibold sm:text-2xl">Something went wrong.</span>
</p>
<div className="flex justify-center mt-10">
<div className="mt-10 flex justify-center">
<Button color="secondary" href="/" icon={ArrowSmallLeftIcon}>
Back to home
</Button>

18
apps/web/pages/_app.tsx
View File

@ -1,13 +1,14 @@
import "../styles/tailwind.css";
import { ReactElement, ReactNode } from "react";
import { NextPage } from "next";
import type { AppProps } from "next/app";
import "../../../node_modules/placeholder-loading/src/scss/placeholder-loading.scss";
import "../../../node_modules/react-resizable/css/styles.css";
import "react-tooltip/dist/react-tooltip.css";
import { ReactElement, ReactNode } from "react";
import type { AppProps } from "next/app";
import { NextPage } from "next";
import "../styles/tailwind.css";
import { SessionProvider } from "next-auth/react";
export { coloredConsole } from "@documenso/lib";
import { Toaster } from "react-hot-toast";
import "react-tooltip/dist/react-tooltip.css";
export { coloredConsole } from "@documenso/lib";
export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
getLayout?: (page: ReactElement) => ReactNode;
@ -17,10 +18,7 @@ type AppPropsWithLayout = AppProps & {
Component: NextPageWithLayout;
};
export default function App({
Component,
pageProps: { session, ...pageProps },
}: AppPropsWithLayout) {
export default function App({ Component, pageProps: { session, ...pageProps } }: AppPropsWithLayout) {
const getLayout = Component.getLayout || ((page: any) => page);
return (
<SessionProvider session={session}>

5
apps/web/pages/_document.jsx
View File

@ -5,10 +5,7 @@ export default function Document(props) {
let pageProps = props.__NEXT_DATA__?.props?.pageProps;
return (
<Html
className="h-full bg-gray-100 scroll-smooth font-normal antialiased"
lang="en"
>
<Html className="h-full scroll-smooth bg-gray-100 font-normal antialiased" lang="en">
<Head>
<meta name="color-scheme"></meta>
</Head>

16
apps/web/pages/api/auth/[...nextauth].ts
View File

@ -1,9 +1,9 @@
import NextAuth, { Session } from "next-auth";
import GitHubProvider from "next-auth/providers/github";
import CredentialsProvider from "next-auth/providers/credentials";
import { ErrorCode } from "@documenso/lib/auth";
import prisma from "@documenso/prisma";
import { verifyPassword } from "@documenso/lib/auth";
import prisma from "@documenso/prisma";
import NextAuth, { Session } from "next-auth";
import CredentialsProvider from "next-auth/providers/credentials";
import GitHubProvider from "next-auth/providers/github";
export default NextAuth({
secret: process.env.AUTH_SECRET,
@ -27,8 +27,7 @@ export default NextAuth({
password: {
label: "Password",
type: "password",
placeholder:
"Select a password. Here is some inspiration: https://xkcd.com/936/",
placeholder: "Select a password. Here is some inspiration: https://xkcd.com/936/",
},
},
async authorize(credentials: any) {
@ -57,10 +56,7 @@ export default NextAuth({
throw new Error(ErrorCode.UserMissingPassword);
}
const isCorrectPassword = await verifyPassword(
credentials.password,
user.password
);
const isCorrectPassword = await verifyPassword(credentials.password, user.password);
if (!isCorrectPassword) {
throw new Error(ErrorCode.IncorrectPassword);

5
apps/web/pages/api/auth/signup.ts
View File

@ -1,9 +1,8 @@
import { IdentityProvider } from "@prisma/client";
import { NextApiRequest, NextApiResponse } from "next";
import prisma from "@documenso/prisma";
import { hashPassword } from "@documenso/lib/auth";
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { IdentityProvider } from "@prisma/client";
async function postHandler(req: NextApiRequest, res: NextApiResponse) {
const { email, password, source } = req.body;

22
apps/web/pages/api/documents/[id].ts
View File

@ -1,13 +1,9 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { Document as PrismaDocument } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { addDigitalSignature } from "@documenso/signing/addDigitalSignature";
import { Document as PrismaDocument } from "@prisma/client";
async function getHandler(req: NextApiRequest, res: NextApiResponse) {
const { id: documentId } = req.query;
@ -46,8 +42,7 @@ async function getHandler(req: NextApiRequest, res: NextApiResponse) {
document = await getDocument(+documentId, req, res);
}
if (!document)
res.status(404).end(`No document with id ${documentId} found.`);
if (!document) res.status(404).end(`No document with id ${documentId} found.`);
const signaturesCount = await prisma.signature.count({
where: {
@ -61,18 +56,13 @@ async function getHandler(req: NextApiRequest, res: NextApiResponse) {
// No need to add a signature, if no one signed yet.
if (signaturesCount > 0) {
signedDocumentAsBase64 = await addDigitalSignature(
document?.document || ""
);
signedDocumentAsBase64 = await addDigitalSignature(document?.document || "");
}
const buffer: Buffer = Buffer.from(signedDocumentAsBase64, "base64");
res.setHeader("Content-Type", "application/pdf");
res.setHeader("Content-Length", buffer.length);
res.setHeader(
"Content-Disposition",
`attachment; filename=${document?.title}`
);
res.setHeader("Content-Disposition", `attachment; filename=${document?.title}`);
return res.status(200).send(buffer);
}

12
apps/web/pages/api/documents/[id]/fields/[fid].ts
View File

@ -1,13 +1,9 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import short from "short-uuid";
import { Document as PrismaDocument, FieldType } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { FieldType, Document as PrismaDocument } from "@prisma/client";
import short from "short-uuid";
async function deleteHandler(req: NextApiRequest, res: NextApiResponse) {
const user = await getUserFromToken(req, res);

18
apps/web/pages/api/documents/[id]/fields/index.ts
View File

@ -1,12 +1,8 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { Document as PrismaDocument, FieldType } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { FieldType, Document as PrismaDocument } from "@prisma/client";
async function getHandler(req: NextApiRequest, res: NextApiResponse) {
const user = await getUserFromToken(req, res);
@ -61,18 +57,14 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
});
if (!recipient || recipient?.documentId !== +documentId)
return res
.status(401)
.send("Recipient does not have access to this document.");
return res.status(401).send("Recipient does not have access to this document.");
}
if (user) {
const document: PrismaDocument = await getDocument(+documentId, req, res);
// todo entity ownerships checks
if (document.userId !== user.id) {
return res
.status(401)
.send("User does not have access to this document.");
return res.status(401).send("User does not have access to this document.");
}
}

12
apps/web/pages/api/documents/[id]/recipients/[rid].ts
View File

@ -1,13 +1,9 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import short from "short-uuid";
import { Document as PrismaDocument } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { Document as PrismaDocument } from "@prisma/client";
import short from "short-uuid";
async function deleteHandler(req: NextApiRequest, res: NextApiResponse) {
const user = await getUserFromToken(req, res);

12
apps/web/pages/api/documents/[id]/recipients/index.ts
View File

@ -1,13 +1,9 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import short from "short-uuid";
import { Document as PrismaDocument } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { Document as PrismaDocument } from "@prisma/client";
import short from "short-uuid";
async function postHandler(req: NextApiRequest, res: NextApiResponse) {
const user = await getUserFromToken(req, res);

11
apps/web/pages/api/documents/[id]/send.ts
View File

@ -1,12 +1,8 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { sendSigningRequest } from "@documenso/lib/mail";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { Document as PrismaDocument, SendStatus } from "@prisma/client";
async function postHandler(req: NextApiRequest, res: NextApiResponse) {
@ -23,8 +19,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
const document: PrismaDocument = await getDocument(+documentId, req, res);
if (!document)
res.status(404).end(`No document with id ${documentId} found.`);
if (!document) res.status(404).end(`No document with id ${documentId} found.`);
let recipientCondition: any = {
documentId: +documentId,

32
apps/web/pages/api/documents/[id]/sign.ts
View File

@ -1,11 +1,11 @@
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { SigningStatus, DocumentStatus } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { Document as PrismaDocument, FieldType } from "@prisma/client";
import { insertImageInPDF, insertTextInPDF } from "@documenso/pdf";
import { sendSigningDoneMail } from "@documenso/lib/mail";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import { insertImageInPDF, insertTextInPDF } from "@documenso/pdf";
import prisma from "@documenso/prisma";
import { DocumentStatus, SigningStatus } from "@prisma/client";
import { FieldType, Document as PrismaDocument } from "@prisma/client";
async function postHandler(req: NextApiRequest, res: NextApiResponse) {
const { token: recipientToken } = req.query;
@ -115,10 +115,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
},
data: {
document: documentWithInserts,
status:
unsignedRecipients.length > 0
? DocumentStatus.PENDING
: DocumentStatus.COMPLETED,
status: unsignedRecipients.length > 0 ? DocumentStatus.PENDING : DocumentStatus.COMPLETED,
},
});
@ -129,8 +126,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
});
document.document = documentWithInserts;
if (documentOwner)
await sendSigningDoneMail(recipient, document, documentOwner);
if (documentOwner) await sendSigningDoneMail(recipient, document, documentOwner);
}
return res.status(200).end();
@ -139,9 +135,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
if (signedField?.Signature?.signatureImageAsBase64) {
documentWithInserts = await insertImageInPDF(
documentWithInserts,
signedField.Signature
? signedField.Signature?.signatureImageAsBase64
: "",
signedField.Signature ? signedField.Signature?.signatureImageAsBase64 : "",
signedField.positionX,
signedField.positionY,
signedField.page
@ -169,12 +163,8 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
create: {
recipientId: recipient.id,
fieldId: signature.fieldId,
signatureImageAsBase64: signature.signatureImage
? signature.signatureImage
: null,
typedSignature: signature.typedSignature
? signature.typedSignature
: null,
signatureImageAsBase64: signature.signatureImage ? signature.signatureImage : null,
typedSignature: signature.typedSignature ? signature.typedSignature : null,
},
});
}

8
apps/web/pages/api/documents/index.ts
View File

@ -1,9 +1,9 @@
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { getUserFromToken } from "@documenso/lib/server";
import formidable from "formidable";
import { getDocumentsForUserFromToken } from "@documenso/lib/query";
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import { getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import formidable from "formidable";
export const config = {
api: {

1
apps/web/pages/api/health.ts
View File

@ -1,5 +1,4 @@
import type { NextApiRequest, NextApiResponse } from "next";
import { defaultHandler, defaultResponder } from "@documenso/lib/server";
import prisma from "@documenso/prisma";

15
apps/web/pages/api/test-sign/[id].ts
View File

@ -1,13 +1,9 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { NextApiRequest, NextApiResponse } from "next";
import { Document as PrismaDocument } from "@prisma/client";
import { getDocument } from "@documenso/lib/query";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { addDigitalSignature } from "@documenso/signing/addDigitalSignature";
import { Document as PrismaDocument } from "@prisma/client";
// todo remove before launch
@ -17,10 +13,7 @@ async function getHandler(req: NextApiRequest, res: NextApiResponse) {
const signedDocument = await addDigitalSignature(document.document);
res.setHeader("Content-Type", "application/pdf");
res.setHeader("Content-Length", signedDocument.length);
res.setHeader(
"Content-Disposition",
`attachment; filename=${document.title}`
);
res.setHeader("Content-Disposition", `attachment; filename=${document.title}`);
return res.status(200).send(signedDocument);
}

9
apps/web/pages/api/users/index.ts
View File

@ -1,11 +1,6 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import type { NextApiRequest, NextApiResponse } from "next";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
async function postHandler(req: NextApiRequest, res: NextApiResponse) {
const { method, body } = req;

9
apps/web/pages/api/users/me.ts
View File

@ -1,11 +1,6 @@
import {
defaultHandler,
defaultResponder,
getUserFromToken,
} from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import type { NextApiRequest, NextApiResponse } from "next";
import { defaultHandler, defaultResponder, getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
async function getHandler(req: NextApiRequest, res: NextApiResponse) {
const user = await getUserFromToken(req, res);

53
apps/web/pages/dashboard.tsx
View File

@ -1,7 +1,10 @@
import Head from "next/head";
import { ReactElement } from "react";
import Layout from "../components/layout";
import Head from "next/head";
import Link from "next/link";
import { uploadDocument } from "@documenso/features";
import { getDocumentsForUserFromToken } from "@documenso/lib/query";
import { getUserFromToken } from "@documenso/lib/server";
import Layout from "../components/layout";
import type { NextPageWithLayout } from "./_app";
import {
CheckBadgeIcon,
@ -9,15 +12,7 @@ import {
ExclamationTriangleIcon,
UsersIcon,
} from "@heroicons/react/24/outline";
import { uploadDocument } from "@documenso/features";
import {
DocumentStatus,
SendStatus,
SigningStatus,
Document as PrismaDocument,
} from "@prisma/client";
import { getUserFromToken } from "@documenso/lib/server";
import { getDocumentsForUserFromToken } from "@documenso/lib/query";
import { DocumentStatus, Document as PrismaDocument, SendStatus, SigningStatus } from "@prisma/client";
import { truncate } from "fs";
import { Tooltip as ReactTooltip } from "react-tooltip";
@ -55,19 +50,16 @@ const DashboardPage: NextPageWithLayout = (props: any) => {
<div className="py-10 max-sm:px-4">
<header>
<h1 className="text-3xl font-bold leading-tight tracking-tight text-gray-900">
Dashboard
</h1>
<h1 className="text-3xl font-bold leading-tight tracking-tight text-gray-900">Dashboard</h1>
</header>
<dl className="grid gap-5 mt-8 md:grid-cols-3 ">
<dl className="mt-8 grid gap-5 md:grid-cols-3 ">
{stats.map((item) => (
<Link href={item.link} key={item.name}>
<div className="px-4 py-3 overflow-hidden bg-white rounded-lg shadow md:p-6 sm:py-5">
<dt className="text-sm font-medium text-gray-500 truncate ">
<div className="overflow-hidden rounded-lg bg-white px-4 py-3 shadow sm:py-5 md:p-6">
<dt className="truncate text-sm font-medium text-gray-500 ">
<item.icon
className="flex-shrink-0 inline w-5 h-5 mr-3 text-neon sm:w-6 sm:h-6"
aria-hidden="true"
></item.icon>
className="text-neon mr-3 inline h-5 w-5 flex-shrink-0 sm:h-6 sm:w-6"
aria-hidden="true"></item.icon>
{item.name}
</dt>
<dd className="mt-1 text-2xl font-semibold tracking-tight text-gray-900 sm:text-3xl">
@ -92,25 +84,20 @@ const DashboardPage: NextPageWithLayout = (props: any) => {
onClick={() => {
document?.getElementById("fileUploadHelper")?.click();
}}
className="relative block w-full p-12 text-center border-2 border-gray-300 border-dashed rounded-lg cursor-pointer hover:border-neon focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
>
className="hover:border-neon relative block w-full cursor-pointer rounded-lg border-2 border-dashed border-gray-300 p-12 text-center focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">
<svg
className="w-12 h-12 mx-auto text-gray-400"
className="mx-auto h-12 w-12 text-gray-400"
stroke="currentColor"
fill="none"
viewBox="0 00 20 25"
aria-hidden="true"
>
aria-hidden="true">
<path
strokeLinecap="round"
strokeLinejoin="round"
d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m3.75 9v6m3-3H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z"
/>
</svg>
<span
id="add_document"
className="mt-2 block text-sm font-medium text-neon"
>
<span id="add_document" className="text-neon mt-2 block text-sm font-medium">
Add a new PDF document.
</span>
</div>
@ -147,9 +134,7 @@ export async function getServerSideProps(context: any) {
const documents: any[] = await getDocumentsForUserFromToken(context);
const drafts: PrismaDocument[] = documents.filter(
(d) => d.status === DocumentStatus.DRAFT
);
const drafts: PrismaDocument[] = documents.filter((d) => d.status === DocumentStatus.DRAFT);
const waiting: any[] = documents.filter(
(e) =>
@ -158,9 +143,7 @@ export async function getServerSideProps(context: any) {
e.Recipient.some((r: any) => r.signingStatus === SigningStatus.NOT_SIGNED)
);
const completed: PrismaDocument[] = documents.filter(
(d) => d.status === DocumentStatus.COMPLETED
);
const completed: PrismaDocument[] = documents.filter((d) => d.status === DocumentStatus.COMPLETED);
return {
props: {

179
apps/web/pages/documents.tsx
View File

@ -1,7 +1,12 @@
import { ReactElement, useEffect, useState } from "react";
import { NextPageContext } from "next";
import Head from "next/head";
import { useRouter } from "next/router";
import { uploadDocument } from "@documenso/features";
import { deleteDocument, getDocuments } from "@documenso/lib/api";
import { Button, IconButton, SelectBox } from "@documenso/ui";
import Layout from "../components/layout";
import type { NextPageWithLayout } from "./_app";
import Head from "next/head";
import {
ArrowDownTrayIcon,
CheckBadgeIcon,
@ -13,12 +18,7 @@ import {
PlusIcon,
TrashIcon,
} from "@heroicons/react/24/outline";
import { useRouter } from "next/router";
import { uploadDocument } from "@documenso/features";
import { DocumentStatus } from "@prisma/client";
import { Button, IconButton, SelectBox } from "@documenso/ui";
import { NextPageContext } from "next";
import { deleteDocument, getDocuments } from "@documenso/lib/api";
import { Tooltip as ReactTooltip } from "react-tooltip";
const DocumentsPage: NextPageWithLayout = (props: any) => {
@ -42,12 +42,8 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
{ label: "Last 12 months", value: 366 },
];
const [selectedStatusFilter, setSelectedStatusFilter] = useState(
statusFilters[0]
);
const [selectedCreatedFilter, setSelectedCreatedFilter] = useState(
createdFilter[0]
);
const [selectedStatusFilter, setSelectedStatusFilter] = useState(statusFilters[0]);
const [selectedCreatedFilter, setSelectedCreatedFilter] = useState(createdFilter[0]);
const loadDocuments = async () => {
if (!documents.length) setLoading(true);
@ -62,9 +58,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
useEffect(() => {
loadDocuments().finally(() => {
setSelectedStatusFilter(
statusFilters.filter(
(status) => status.value === props.filter.toUpperCase()
)[0]
statusFilters.filter((status) => status.value === props.filter.toUpperCase())[0]
);
});
}, []);
@ -79,9 +73,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
function filterDocumentes(documents: []): any {
let filteredDocuments = documents.filter(
(d: any) =>
d.status === selectedStatusFilter.value ||
selectedStatusFilter.value === "ALL"
(d: any) => d.status === selectedStatusFilter.value || selectedStatusFilter.value === "ALL"
);
filteredDocuments = filteredDocuments.filter((document: any) =>
@ -98,9 +90,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
const today: Date = new Date(); // Today's date
// Calculate the difference between the two dates in days
const diffInDays = Math.floor(
(today.getTime() - documentDate.getTime()) / millisecondsInDay
);
const diffInDays = Math.floor((today.getTime() - documentDate.getTime()) / millisecondsInDay);
console.log(diffInDays);
@ -114,12 +104,10 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
<title>Documents | Documenso</title>
</Head>
<div className="px-4 sm:px-6 lg:px-8">
<div className="sm:flex sm:items-center mt-10">
<div className="mt-10 sm:flex sm:items-center">
<div className="sm:flex-auto">
<header>
<h1 className="text-3xl font-bold leading-tight tracking-tight text-gray-900">
Documents
</h1>
<h1 className="text-3xl font-bold leading-tight tracking-tight text-gray-900">Documents</h1>
</header>
</div>
<div className="mt-4 sm:mt-0 sm:ml-16 sm:flex-none">
@ -127,27 +115,24 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
icon={DocumentPlusIcon}
onClick={() => {
document?.getElementById("fileUploadHelper")?.click();
}}
>
}}>
Add Document
</Button>
</div>
</div>
<div className="mt-3 mb-12">
<div className="w-fit block float-right ml-3 mt-7">
{filteredDocuments.length != 1
? filteredDocuments.length + " Documents"
: "1 Document"}
<div className="float-right ml-3 mt-7 block w-fit">
{filteredDocuments.length != 1 ? filteredDocuments.length + " Documents" : "1 Document"}
</div>
<SelectBox
className="w-1/4 block float-right"
className="float-right block w-1/4"
label="Created"
options={createdFilter}
value={selectedCreatedFilter}
onChange={setSelectedCreatedFilter}
/>
<SelectBox
className="w-1/4 block float-right ml-3"
className="float-right ml-3 block w-1/4"
label="Status"
options={statusFilters}
value={selectedStatusFilter}
@ -171,47 +156,28 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
</div>
</div>
</div>
<div
className="mt-28 flex flex-col"
hidden={!documents.length || loading}
>
<div className="mt-28 flex flex-col" hidden={!documents.length || loading}>
<div
className="-my-2 -mx-4 overflow-x-auto sm:-mx-6 lg:-mx-8"
hidden={!documents.length || loading}
>
hidden={!documents.length || loading}>
<div className="inline-block min-w-full py-2 align-middle md:px-6 lg:px-8">
<div className="overflow-hidden shadow ring-1 ring-black ring-opacity-5 md:rounded-lg">
<table className="min-w-full divide-y divide-gray-300">
<thead className="bg-gray-50">
<tr>
<th
scope="col"
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
>
<th scope="col" className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
Title
</th>
<th
scope="col"
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
>
<th scope="col" className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
Recipients
</th>
<th
scope="col"
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
>
<th scope="col" className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
Status
</th>
<th
scope="col"
className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"
>
<th scope="col" className="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
Created
</th>
<th
scope="col"
className="relative py-3.5 pl-3 pr-4 sm:pr-6"
>
<th scope="col" className="relative py-3.5 pl-3 pr-4 sm:pr-6">
<span className="sr-only">Delete</span>
</th>
</tr>
@ -220,9 +186,8 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
{filteredDocuments.map((document: any, index: number) => (
<tr
key={document.id}
className="hover:bg-gray-100 cursor-pointer"
onClick={(event) => showDocument(document.id)}
>
className="cursor-pointer hover:bg-gray-100"
onClick={(event) => showDocument(document.id)}>
<td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500">
{document.title || "#" + document.id}
</td>
@ -232,43 +197,32 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
{item.sendStatus === "NOT_SENT" ? (
<span
id="sent_icon"
className="inline-block flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800"
>
{item.name
? item.name + " <" + item.email + ">"
: item.email}
className="inline-block flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800">
{item.name ? item.name + " <" + item.email + ">" : item.email}
</span>
) : (
""
)}
{item.sendStatus === "SENT" &&
item.readStatus !== "OPENED" ? (
{item.sendStatus === "SENT" && item.readStatus !== "OPENED" ? (
<span id="sent_icon">
<span
id="sent_icon"
className="inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-green-800"
>
<EnvelopeIcon className="inline h-5 mr-1"></EnvelopeIcon>
{item.name
? item.name + " <" + item.email + ">"
: item.email}
className="inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-green-800">
<EnvelopeIcon className="mr-1 inline h-5"></EnvelopeIcon>
{item.name ? item.name + " <" + item.email + ">" : item.email}
</span>
</span>
) : (
""
)}
{item.readStatus === "OPENED" &&
item.signingStatus === "NOT_SIGNED" ? (
{item.readStatus === "OPENED" && item.signingStatus === "NOT_SIGNED" ? (
<span id="read_icon">
<span
id="sent_icon"
className="inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-green-800"
>
<CheckIcon className="inline h-5 -mr-2"></CheckIcon>
<CheckIcon className="inline h-5 mr-1"></CheckIcon>
{item.name
? item.name + " <" + item.email + ">"
: item.email}
className="inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-green-800">
<CheckIcon className="-mr-2 inline h-5"></CheckIcon>
<CheckIcon className="mr-1 inline h-5"></CheckIcon>
{item.name ? item.name + " <" + item.email + ">" : item.email}
</span>
</span>
) : (
@ -277,8 +231,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
{item.signingStatus === "SIGNED" ? (
<span id="signed_icon">
<span className="inline-block flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800">
<CheckBadgeIcon className="inline h-5 mr-1"></CheckBadgeIcon>{" "}
{item.email}
<CheckBadgeIcon className="mr-1 inline h-5"></CheckBadgeIcon> {item.email}
</span>
</span>
) : (
@ -307,9 +260,8 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
{formatDocumentStatus(document.status)}
<p>
<small hidden={document.Recipient.length === 0}>
{document.Recipient.filter(
(r: any) => r.signingStatus === "SIGNED"
).length || 0}
{document.Recipient.filter((r: any) => r.signingStatus === "SIGNED").length ||
0}
/{document.Recipient.length || 0}
</small>
</p>
@ -342,30 +294,20 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
onClick={(event: any) => {
event.preventDefault();
event.stopPropagation();
if (
confirm(
"Are you sure you want to delete this document"
)
) {
if (confirm("Are you sure you want to delete this document")) {
const documentsWithoutIndex = [...documents];
const removedItem: any =
documentsWithoutIndex.splice(index, 1);
const removedItem: any = documentsWithoutIndex.splice(index, 1);
setDocuments(documentsWithoutIndex);
deleteDocument(document.id)
.catch((err) => {
documentsWithoutIndex.splice(
index,
0,
removedItem
);
documentsWithoutIndex.splice(index, 0, removedItem);
setDocuments(documentsWithoutIndex);
})
.then(() => {
loadDocuments();
});
}
}}
></IconButton>
}}></IconButton>
<span className="sr-only">, {document.name}</span>
</div>
</td>
@ -374,29 +316,21 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
</tbody>
</table>
</div>
<div
hidden={filteredDocuments.length > 0}
className="mx-auto w-fit mt-12 p-3"
>
<FunnelIcon className="w-5 inline mr-1 align-middle" /> Nothing
here. Maybe try a different filter.
<div hidden={filteredDocuments.length > 0} className="mx-auto mt-12 w-fit p-3">
<FunnelIcon className="mr-1 inline w-5 align-middle" /> Nothing here. Maybe try a different
filter.
</div>
</div>
</div>
</div>
</div>
<div
className="text-center mt-24"
id="empty"
hidden={documents.length > 0 || loading}
>
<div className="mt-24 text-center" id="empty" hidden={documents.length > 0 || loading}>
<svg
className="mx-auto h-12 w-12 text-gray-400"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
aria-hidden="true"
>
aria-hidden="true">
<path
strokeLinecap="round"
strokeLinejoin="round"
@ -405,16 +339,13 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
</svg>
<h3 className="mt-2 text-sm font-medium text-gray-900">No documents</h3>
<p className="mt-1 text-sm text-gray-500">
Get started by adding a document. Any PDF will do.
</p>
<p className="mt-1 text-sm text-gray-500">Get started by adding a document. Any PDF will do.</p>
<div className="mt-6">
<Button
icon={PlusIcon}
onClick={() => {
document?.getElementById("fileUploadHelper")?.click();
}}
>
}}>
Add Document
</Button>
<input
@ -428,11 +359,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
/>
</div>
</div>
<ReactTooltip
anchorId="empty"
place="bottom"
content="No preparation needed. Any PDF will do."
/>
<ReactTooltip anchorId="empty" place="bottom" content="No preparation needed. Any PDF will do." />
</>
);
};

50
apps/web/pages/documents/[id]/index.tsx
View File

@ -1,20 +1,16 @@
import { ReactElement } from "react";
import Layout from "../../../components/layout";
import { NextPageWithLayout } from "../../_app";
import Link from "next/link";
import { useRouter } from "next/router";
import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib";
import { getUserFromToken } from "@documenso/lib/server";
import Link from "next/link";
import { DocumentStatus } from "@prisma/client";
import {
InformationCircleIcon,
PaperAirplaneIcon,
UsersIcon,
} from "@heroicons/react/24/outline";
import { getDocument } from "@documenso/lib/query";
import { Document as PrismaDocument } from "@prisma/client";
import { Button, Breadcrumb } from "@documenso/ui";
import { getUserFromToken } from "@documenso/lib/server";
import { Breadcrumb, Button } from "@documenso/ui";
import PDFEditor from "../../../components/editor/pdf-editor";
import Layout from "../../../components/layout";
import { NextPageWithLayout } from "../../_app";
import { InformationCircleIcon, PaperAirplaneIcon, UsersIcon } from "@heroicons/react/24/outline";
import { DocumentStatus } from "@prisma/client";
import { Document as PrismaDocument } from "@prisma/client";
const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
const router = useRouter();
@ -32,8 +28,7 @@ const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
},
{
title: props.document.title,
href:
NEXT_PUBLIC_WEBAPP_URL + "/documents/" + props.document.id,
href: NEXT_PUBLIC_WEBAPP_URL + "/documents/" + props.document.id,
},
]}
/>
@ -45,10 +40,7 @@ const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
</h2>
<div className="mt-1 flex flex-col sm:mt-0 sm:flex-row sm:flex-wrap sm:space-x-6">
<div className="mt-2 flex items-center text-sm text-gray-500">
<UsersIcon
className="mr-1.5 h-5 w-5 flex-shrink-0 text-gray-400"
aria-hidden="true"
/>
<UsersIcon className="mr-1.5 h-5 w-5 flex-shrink-0 text-gray-400" aria-hidden="true" />
<Link href={`/documents/${props.document.id}/recipients`}>
{props?.document?.Recipient?.length} Recipients
@ -67,21 +59,11 @@ const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
<Button
icon={PaperAirplaneIcon}
className="ml-3"
href={
NEXT_PUBLIC_WEBAPP_URL +
"/documents/" +
props.document.id +
"/recipients"
}
href={NEXT_PUBLIC_WEBAPP_URL + "/documents/" + props.document.id + "/recipients"}
onClick={() => {
if (
confirm(
`Send document out to ${props?.document?.Recipient?.length} recipients?`
)
) {
if (confirm(`Send document out to ${props?.document?.Recipient?.length} recipients?`)) {
}
}}
>
}}>
Prepare to Send
</Button>
</div>
@ -120,11 +102,7 @@ export async function getServerSideProps(context: any) {
const { id: documentId } = context.query;
try {
const document: PrismaDocument = await getDocument(
+documentId,
context.req,
context.res
);
const document: PrismaDocument = await getDocument(+documentId, context.req, context.res);
return {
props: {

100
apps/web/pages/documents/[id]/recipients.tsx
View File

@ -1,25 +1,24 @@
import Head from "next/head";
import { ReactElement, useRef, useState } from "react";
import Head from "next/head";
import { NEXT_PUBLIC_WEBAPP_URL, classNames } from "@documenso/lib";
import { createOrUpdateRecipient, deleteRecipient, sendSigningRequests } from "@documenso/lib/api";
import { getDocument } from "@documenso/lib/query";
import { getUserFromToken } from "@documenso/lib/server";
import { Breadcrumb, Button, Dialog, IconButton } from "@documenso/ui";
import Layout from "../../../components/layout";
import { NextPageWithLayout } from "../../_app";
import { classNames, NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib";
import {
ArrowDownTrayIcon,
CheckBadgeIcon,
CheckIcon,
EnvelopeIcon,
PaperAirplaneIcon,
PencilSquareIcon,
TrashIcon,
UserPlusIcon,
EnvelopeIcon,
XMarkIcon,
} from "@heroicons/react/24/outline";
import { getUserFromToken } from "@documenso/lib/server";
import { getDocument } from "@documenso/lib/query";
import { Document as PrismaDocument, DocumentStatus } from "@prisma/client";
import { Breadcrumb, Button, Dialog, IconButton } from "@documenso/ui";
import { createOrUpdateRecipient, deleteRecipient, sendSigningRequests } from "@documenso/lib/api";
import { DocumentStatus, Document as PrismaDocument } from "@prisma/client";
import { FormProvider, useFieldArray, useForm, useWatch } from "react-hook-form";
export type FormValues = {
@ -71,23 +70,22 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
<Head>
<title>{title}</title>
</Head>
<div className="px-6 mt-10 sm:px-0">
<div className="mt-10 px-6 sm:px-0">
<div>
<Breadcrumb document={props.document} items={breadcrumbItems} />
</div>
<div className="mt-2 md:flex md:items-center md:justify-between">
<div className="flex-1 min-w-0">
<div className="min-w-0 flex-1">
<h2 className="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-3xl sm:tracking-tight">
{props.document.title}
</h2>
</div>
<div className="flex flex-shrink-0 mt-4 md:mt-0 md:ml-4">
<div className="mt-4 flex flex-shrink-0 md:mt-0 md:ml-4">
<Button
icon={ArrowDownTrayIcon}
color="secondary"
className="mr-2"
href={"/api/documents/" + props.document.id}
>
href={"/api/documents/" + props.document.id}>
Download
</Button>
<Button
@ -95,8 +93,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
disabled={props.document.status === DocumentStatus.COMPLETED}
color={props.document.status === DocumentStatus.COMPLETED ? "primary" : "secondary"}
className="mr-2"
href={breadcrumbItems[1].href}
>
href={breadcrumbItems[1].href}>
Edit Document
</Button>
<Button
@ -108,43 +105,33 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
}}
disabled={
(formValues.length || 0) === 0 ||
!formValues.some(
(r: any) => r.email && !hasEmailError(r) && r.sendStatus === "NOT_SENT"
) ||
!formValues.some((r: any) => r.email && !hasEmailError(r) && r.sendStatus === "NOT_SENT") ||
loading
}
>
}>
Send
</Button>
</div>
</div>
<div className="p-4 mt-10 overflow-hidden bg-white rounded-md shadow sm:p-6">
<div className="pb-3 border-b border-gray-200 sm:pb-5">
<div className="mt-10 overflow-hidden rounded-md bg-white p-4 shadow sm:p-6">
<div className="border-b border-gray-200 pb-3 sm:pb-5">
<h3 className="text-lg font-medium leading-6 text-gray-900 ">Signers</h3>
<p className="max-w-4xl mt-2 text-sm text-gray-500">
The people who will sign the document.
</p>
<p className="mt-2 max-w-4xl text-sm text-gray-500">The people who will sign the document.</p>
</div>
<FormProvider {...form}>
<form
onChange={() => {
trigger();
}}
>
}}>
<ul role="list" className="divide-y divide-gray-200">
{fields.map((item: any, index: number) => (
<li
key={index}
className="w-full px-2 py-3 border-0 hover:bg-green-50 group sm:py-4"
>
<li key={index} className="group w-full border-0 px-2 py-3 hover:bg-green-50 sm:py-4">
<div id="container" className="block w-full lg:flex lg:justify-between">
<div className="block space-y-2 md:space-x-2 md:space-y-0 md:flex">
<div className="block space-y-2 md:flex md:space-x-2 md:space-y-0">
<div
className={classNames(
"md:w-[250px] rounded-md border border-gray-300 px-3 py-2 shadow-sm focus-within:border-neon focus-within:ring-1 focus-within:ring-neon",
"focus-within:border-neon focus-within:ring-neon rounded-md border border-gray-300 px-3 py-2 shadow-sm focus-within:ring-1 md:w-[250px]",
item.sendStatus === "SENT" ? "bg-gray-100" : ""
)}
>
)}>
<label htmlFor="name" className="block text-xs font-medium text-gray-900">
Email
</label>
@ -170,7 +157,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
documentId: props.document.id,
});
}}
className="block w-full p-0 text-gray-900 placeholder-gray-500 disabled:bg-neutral-100 border-0 outline-none sm:text-sm bg-inherit"
className="block w-full border-0 bg-inherit p-0 text-gray-900 placeholder-gray-500 outline-none disabled:bg-neutral-100 sm:text-sm"
placeholder="john.dorian@loremipsum.com"
/>
{errors?.signers?.[index] ? (
@ -183,10 +170,9 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
</div>
<div
className={classNames(
"md:w-[250px] rounded-md border border-gray-300 px-3 py-2 shadow-sm focus-within:border-neon focus-within:ring-1 focus-within:ring-neon",
"focus-within:border-neon focus-within:ring-neon rounded-md border border-gray-300 px-3 py-2 shadow-sm focus-within:ring-1 md:w-[250px]",
item.sendStatus === "SENT" ? "bg-gray-100" : ""
)}
>
)}>
<label htmlFor="name" className="block text-xs font-medium text-gray-900">
Name (optional)
</label>
@ -209,19 +195,18 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
documentId: props.document.id,
});
}}
className="block w-full p-0 text-gray-900 placeholder-gray-500 disabled:bg-neutral-100 border-0 outline-none sm:text-sm bg-inherit"
className="block w-full border-0 bg-inherit p-0 text-gray-900 placeholder-gray-500 outline-none disabled:bg-neutral-100 sm:text-sm"
placeholder="John Dorian"
/>
</div>
</div>
<div className="flex items-center space-x-2 lg:ml-2">
<div className="flex mb-2 mr-2 lg:mr-0">
<div className="mb-2 mr-2 flex lg:mr-0">
<div key={item.id} className="space-x-2">
{item.sendStatus === "NOT_SENT" ? (
<span
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800"
>
className="mt-3 inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800">
Not Sent
</span>
) : (
@ -231,9 +216,8 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
<span id="sent_icon">
<span
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800 "
>
<CheckIcon className="inline h-5 mr-1" /> Sent
className="mt-3 inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800 ">
<CheckIcon className="mr-1 inline h-5" /> Sent
</span>
</span>
) : (
@ -243,10 +227,9 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
<span id="read_icon">
<span
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800"
>
<CheckIcon className="inline h-5 -mr-2"></CheckIcon>
<CheckIcon className="inline h-5 mr-1"></CheckIcon>
className="mt-3 inline-block flex-shrink-0 rounded-full bg-yellow-200 px-2 py-0.5 text-xs font-medium text-gray-800">
<CheckIcon className="-mr-2 inline h-5"></CheckIcon>
<CheckIcon className="mr-1 inline h-5"></CheckIcon>
Seen
</span>
</span>
@ -257,9 +240,8 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
<span id="signed_icon">
<span
id="sent_icon"
className="inline-block mt-3 flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800"
>
<CheckBadgeIcon className="inline h-5 mr-1"></CheckBadgeIcon>
className="mt-3 inline-block flex-shrink-0 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-800">
<CheckBadgeIcon className="mr-1 inline h-5"></CheckBadgeIcon>
Signed
</span>
</span>
@ -268,7 +250,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
)}
</div>
</div>
<div className="flex mr-1">
<div className="mr-1 flex">
<IconButton
icon={PaperAirplaneIcon}
disabled={
@ -286,8 +268,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
setLoading(false);
});
}
}}
>
}}>
Resend
</IconButton>
<IconButton
@ -320,8 +301,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
}).then((res) => {
append(res);
});
}}
>
}}>
Add Signer
</Button>
</form>
@ -336,7 +316,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
open={open}
setLoading={setLoading}
setOpen={setOpen}
icon={<EnvelopeIcon className="w-6 h-6 text-green-600" aria-hidden="true" />}
icon={<EnvelopeIcon className="h-6 w-6 text-green-600" aria-hidden="true" />}
/>
</>
);

53
apps/web/pages/documents/[id]/sign.tsx
View File

@ -1,11 +1,11 @@
import prisma from "@documenso/prisma";
import Head from "next/head";
import { NextPageWithLayout } from "../../_app";
import { ReadStatus } from "@prisma/client";
import PDFSigner from "../../../components/editor/pdf-signer";
import Link from "next/link";
import prisma from "@documenso/prisma";
import PDFSigner from "../../../components/editor/pdf-signer";
import { NextPageWithLayout } from "../../_app";
import { ClockIcon } from "@heroicons/react/24/outline";
import { FieldType, DocumentStatus } from "@prisma/client";
import { ReadStatus } from "@prisma/client";
import { DocumentStatus, FieldType } from "@prisma/client";
const SignPage: NextPageWithLayout = (props: any) => {
return (
@ -14,36 +14,22 @@ const SignPage: NextPageWithLayout = (props: any) => {
<title>Sign | Documenso</title>
</Head>
{!props.expired ? (
<PDFSigner
document={props.document}
recipient={props.recipient}
fields={props.fields}
/>
<PDFSigner document={props.document} recipient={props.recipient} fields={props.fields} />
) : (
<>
<div className="mx-auto w-fit px-4 py-16 sm:px-6 sm:py-24 lg:px-8">
<ClockIcon className="text-neon w-10 inline mr-1"></ClockIcon>
<h1 className="text-base font-medium text-neon inline align-middle">
Time flies.
</h1>
<p className="mt-2 text-4xl font-bold tracking-tight">
This signing link is expired.
</p>
<ClockIcon className="text-neon mr-1 inline w-10"></ClockIcon>
<h1 className="text-neon inline align-middle text-base font-medium">Time flies.</h1>
<p className="mt-2 text-4xl font-bold tracking-tight">This signing link is expired.</p>
<p className="mt-2 text-base text-gray-500">
Please ask{" "}
{props.document.User.name
? `${props.document.User.name}`
: `the sender`}{" "}
to resend it.
Please ask {props.document.User.name ? `${props.document.User.name}` : `the sender`} to resend
it.
</p>
<div className="mx-auto w-fit text-xl pt-20"></div>
<div className="mx-auto w-fit pt-20 text-xl"></div>
</div>
<div>
<div className="relative mx-96">
<div
className="absolute inset-0 flex items-center"
aria-hidden="true"
>
<div className="absolute inset-0 flex items-center" aria-hidden="true">
<div className="w-full border-t border-gray-300" />
</div>
<div className="relative flex justify-center"></div>
@ -51,10 +37,7 @@ const SignPage: NextPageWithLayout = (props: any) => {
</div>
<p className="mt-4 text-center text-sm text-gray-600">
Want to send of your own?{" "}
<Link
href="/signup?source=expired"
className="font-medium text-neon hover:text-neon"
>
<Link href="/signup?source=expired" className="text-neon hover:text-neon font-medium">
Create your own Account
</Link>
</p>
@ -118,13 +101,9 @@ export async function getServerSideProps(context: any) {
return {
props: {
recipient: JSON.parse(JSON.stringify(recipient)),
document: JSON.parse(
JSON.stringify({ ...recipient.Document, document: "" })
),
document: JSON.parse(JSON.stringify({ ...recipient.Document, document: "" })),
fields: JSON.parse(JSON.stringify(unsignedFields)),
expired: recipient.expired
? new Date(recipient.expired) < new Date()
: false,
expired: recipient.expired ? new Date(recipient.expired) < new Date() : false,
},
};
}

57
apps/web/pages/documents/[id]/signed.tsx
View File

@ -1,16 +1,14 @@
import prisma from "@documenso/prisma";
import Head from "next/head";
import { NextPageWithLayout } from "../../_app";
import { ArrowDownTrayIcon, CheckBadgeIcon } from "@heroicons/react/24/outline";
import { Button, IconButton } from "@documenso/ui";
import Link from "next/link";
import { useRouter } from "next/router";
import prisma from "@documenso/prisma";
import { Button, IconButton } from "@documenso/ui";
import { NextPageWithLayout } from "../../_app";
import { ArrowDownTrayIcon, CheckBadgeIcon } from "@heroicons/react/24/outline";
const Signed: NextPageWithLayout = (props: any) => {
const router = useRouter();
const allRecipientsSigned = props.document.Recipient?.every(
(r: any) => r.signingStatus === "SIGNED"
);
const allRecipientsSigned = props.document.Recipient?.every((r: any) => r.signingStatus === "SIGNED");
return (
<>
@ -18,53 +16,31 @@ const Signed: NextPageWithLayout = (props: any) => {
<title>Sign | Documenso</title>
</Head>
<div className="mx-auto w-fit px-4 py-16 sm:px-6 sm:py-24 lg:px-8">
<CheckBadgeIcon className="text-neon w-10 inline mr-1"></CheckBadgeIcon>
<h1 className="text-base font-medium text-neon inline align-middle">
It's done!
</h1>
<p className="mt-2 text-4xl font-bold tracking-tight">
You signed "{props.document.title}"
</p>
<p
className="mt-2 text-base text-gray-500 max-w-sm"
hidden={allRecipientsSigned}
>
<CheckBadgeIcon className="text-neon mr-1 inline w-10"></CheckBadgeIcon>
<h1 className="text-neon inline align-middle text-base font-medium">It's done!</h1>
<p className="mt-2 text-4xl font-bold tracking-tight">You signed "{props.document.title}"</p>
<p className="mt-2 max-w-sm text-base text-gray-500" hidden={allRecipientsSigned}>
You will be notfied when all recipients have signed.
</p>
<p
className="mt-2 text-base text-gray-500 max-w-sm"
hidden={!allRecipientsSigned}
>
<p className="mt-2 max-w-sm text-base text-gray-500" hidden={!allRecipientsSigned}>
All recipients signed.
</p>
<div
className="mx-auto w-fit text-xl pt-20"
hidden={!allRecipientsSigned}
>
<div className="mx-auto w-fit pt-20 text-xl" hidden={!allRecipientsSigned}>
<Button
icon={ArrowDownTrayIcon}
color="secondary"
onClick={(event: any) => {
event.preventDefault();
event.stopPropagation();
router.push(
"/api/documents/" +
props.document.id +
"?token=" +
props.recipient.token
);
}}
>
router.push("/api/documents/" + props.document.id + "?token=" + props.recipient.token);
}}>
Download "{props.document.title}"
</Button>
</div>
</div>
<div>
<div className="relative mx-96">
<div
className="absolute inset-0 flex items-center"
aria-hidden="true"
>
<div className="absolute inset-0 flex items-center" aria-hidden="true">
<div className="w-full border-t border-gray-300" />
</div>
<div className="relative flex justify-center"></div>
@ -72,10 +48,7 @@ const Signed: NextPageWithLayout = (props: any) => {
</div>
<p className="mt-4 text-center text-sm text-gray-600">
Want to send slick signing links like this one?{" "}
<Link
href="https://documenso.com"
className="font-medium text-neon hover:text-neon"
>
<Link href="https://documenso.com" className="text-neon hover:text-neon font-medium">
Hosted Documenso is coming soon™
</Link>
</p>

1
apps/web/pages/settings/account.tsx
View File

@ -1,2 +1,3 @@
import SettingsPage from ".";
export default SettingsPage;

1
apps/web/pages/settings/password.tsx
View File

@ -1,2 +1,3 @@
import SettingsPage from ".";
export default SettingsPage;

1
apps/web/pages/settings/profile.tsx
View File

@ -1,2 +1,3 @@
import SettingsPage from ".";
export default SettingsPage;

2
apps/web/postcss.config.js
View File

@ -3,4 +3,4 @@ module.exports = {
tailwindcss: {},
autoprefixer: {},
},
}
};

10
apps/web/styles/tailwind.css
View File

@ -24,9 +24,8 @@ body,
font-weight: 400;
font-display: swap;
src: url("/fonts/montserrat.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074,
U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin */
@ -36,7 +35,6 @@ body,
font-weight: 700;
font-display: swap;
src: url("/fonts/montserrat.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
U+FEFF, U+FFFD;
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074,
U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

6
packages/features/editor/createField.ts
View File

@ -14,10 +14,8 @@ export const createField = (
if (newFieldX < 0) newFieldX = 0;
if (newFieldY < 0) newFieldY = 0;
if (newFieldX + fieldSize.width > rect.width)
newFieldX = rect.width - fieldSize.width;
if (newFieldY + fieldSize.height > rect.height)
newFieldY = rect.height - fieldSize.height;
if (newFieldX + fieldSize.width > rect.width) newFieldX = rect.width - fieldSize.width;
if (newFieldY + fieldSize.height > rect.height) newFieldY = rect.height - fieldSize.height;
const signatureField = {
id: -1,

6
packages/features/uploadDocument.ts
View File

@ -1,6 +1,6 @@
import router from "next/router";
import toast from "react-hot-toast";
import { NEXT_PUBLIC_WEBAPP_URL } from "../lib/constants";
import toast from "react-hot-toast";
export const uploadDocument = async (event: any) => {
if (event.target.files && event.target.files[0]) {
@ -27,9 +27,7 @@ export const uploadDocument = async (event: any) => {
)
.then((response: Response) => {
response.json().then((createdDocumentIdFromBody) => {
router.push(
`${NEXT_PUBLIC_WEBAPP_URL}/documents/${createdDocumentIdFromBody}/recipients`
);
router.push(`${NEXT_PUBLIC_WEBAPP_URL}/documents/${createdDocumentIdFromBody}/recipients`);
});
});
}

17
packages/lib/api/deleteRecipient.ts
View File

@ -6,16 +6,13 @@ export const deleteRecipient = (recipient: any) => {
}
return toast.promise(
fetch(
"/api/documents/" + recipient.documentId + "/recipients/" + recipient.id,
{
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(recipient),
}
),
fetch("/api/documents/" + recipient.documentId + "/recipients/" + recipient.id, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(recipient),
}),
{
loading: "Deleting...",
success: "Deleted.",

2
packages/lib/api/index.ts
View File

@ -7,4 +7,4 @@ export { getDocuments } from "./getDocuments";
export { deleteDocument } from "./deleteDocument";
export { deleteRecipient } from "./deleteRecipient";
export { createOrUpdateRecipient } from "./createOrUpdateRecipient";
export { sendSigningRequests } from "./sendSigningRequests";
export { sendSigningRequests } from "./sendSigningRequests";

5
packages/lib/api/sendSigningRequests.ts
View File

@ -1,9 +1,6 @@
import toast from "react-hot-toast";
export const sendSigningRequests = async (
document: any,
resendTo: number[] = []
) => {
export const sendSigningRequests = async (document: any, resendTo: number[] = []) => {
if (!document || !document.id) return;
try {
const sent = await toast.promise(

6
packages/lib/api/signDocument.ts
View File

@ -1,11 +1,7 @@
import { useRouter } from "next/router";
import toast from "react-hot-toast";
export const signDocument = (
document: any,
signatures: any[],
token: string
): Promise<any> => {
export const signDocument = (document: any, signatures: any[], token: string): Promise<any> => {
const body = { documentId: document.id, signatures };
return toast.promise(

30
packages/lib/auth.ts
View File

@ -1,12 +1,8 @@
import { compare, hash } from "bcryptjs";
import type { NextApiRequest } from "next";
import type { Session } from "next-auth";
import {
getSession as getSessionInner,
GetSessionParams,
} from "next-auth/react";
import { HttpError } from "@documenso/lib/server";
import { compare, hash } from "bcryptjs";
import type { Session } from "next-auth";
import { GetSessionParams, getSession as getSessionInner } from "next-auth/react";
export async function hashPassword(password: string) {
const hashedPassword = await hash(password, 12);
@ -28,9 +24,7 @@ export function validPassword(password: string) {
return true;
}
export async function getSession(
options: GetSessionParams
): Promise<Session | null> {
export async function getSession(options: GetSessionParams): Promise<Session | null> {
const session = await getSessionInner(options);
// that these are equal are ensured in `[...nextauth]`'s callback
@ -43,11 +37,7 @@ export function isPasswordValid(
breakdown: boolean,
strict?: boolean
): { caplow: boolean; num: boolean; min: boolean; admin_min: boolean };
export function isPasswordValid(
password: string,
breakdown?: boolean,
strict?: boolean
) {
export function isPasswordValid(password: string, breakdown?: boolean, strict?: boolean) {
let cap = false, // Has uppercase characters
low = false, // Has lowercase characters
num = false, // At least one number
@ -63,8 +53,7 @@ export function isPasswordValid(
}
}
if (!breakdown)
return cap && low && num && min && (strict ? admin_min : true);
if (!breakdown) return cap && low && num && min && (strict ? admin_min : true);
let errors: Record<string, boolean> = { caplow: cap && low, num, min };
// Only return the admin key if strict mode is enabled.
@ -73,14 +62,11 @@ export function isPasswordValid(
return errors;
}
type CtxOrReq =
| { req: NextApiRequest; ctx?: never }
| { ctx: { req: NextApiRequest }; req?: never };
type CtxOrReq = { req: NextApiRequest; ctx?: never } | { ctx: { req: NextApiRequest }; req?: never };
export const ensureSession = async (ctxOrReq: CtxOrReq) => {
const session = await getSession(ctxOrReq);
if (!session?.user)
throw new HttpError({ statusCode: 401, message: "Unauthorized" });
if (!session?.user) throw new HttpError({ statusCode: 401, message: "Unauthorized" });
return session;
};

6
packages/lib/getSafeRedirectUrl.ts
View File

@ -12,11 +12,7 @@ export const getSafeRedirectUrl = (url = "") => {
const urlParsed = new URL(url);
// Avoid open redirection security vulnerability
if (
!["CONSOLE_URL", "WEBAPP_URL", "WEBSITE_URL"].some(
(u) => new URL(u).origin === urlParsed.origin
)
) {
if (!["CONSOLE_URL", "WEBAPP_URL", "WEBSITE_URL"].some((u) => new URL(u).origin === urlParsed.origin)) {
url = `${"WEBAPP_URL"}/`;
}

15
packages/lib/mail/sendSigningDoneMail.ts
View File

@ -1,13 +1,9 @@
import { sendMail } from "./sendMail";
import { signingCompleteTemplate } from "@documenso/lib/mail";
import { Document as PrismaDocument } from "@prisma/client";
import { addDigitalSignature } from "@documenso/signing/addDigitalSignature";
import { sendMail } from "./sendMail";
import { Document as PrismaDocument } from "@prisma/client";
export const sendSigningDoneMail = async (
recipient: any,
document: PrismaDocument,
user: any
) => {
export const sendSigningDoneMail = async (recipient: any, document: PrismaDocument, user: any) => {
await sendMail(
user.email,
`Completed: "${document.title}"`,
@ -15,10 +11,7 @@ export const sendSigningDoneMail = async (
[
{
filename: document.title,
content: Buffer.from(
await addDigitalSignature(document.document),
"base64"
),
content: Buffer.from(await addDigitalSignature(document.document), "base64"),
},
]
);

8
packages/lib/mail/sendSigningRequest.ts
View File

@ -1,8 +1,8 @@
import prisma from "@documenso/prisma";
import { sendMail } from "./sendMail";
import { SendStatus, ReadStatus, DocumentStatus } from "@prisma/client";
import { NEXT_PUBLIC_WEBAPP_URL } from "../constants";
import { signingRequestTemplate } from "@documenso/lib/mail";
import prisma from "@documenso/prisma";
import { NEXT_PUBLIC_WEBAPP_URL } from "../constants";
import { sendMail } from "./sendMail";
import { DocumentStatus, ReadStatus, SendStatus } from "@prisma/client";
export const sendSigningRequest = async (recipient: any, document: any, user: any) => {
const signingRequestMessage = user.name

2
packages/lib/mail/signingCompleteTemplate.ts
View File

@ -1,6 +1,6 @@
import { NEXT_PUBLIC_WEBAPP_URL } from "../constants";
import { Document as PrismaDocument } from "@prisma/client";
import { baseEmailTemplate } from "./baseTemplate";
import { Document as PrismaDocument } from "@prisma/client";
export const signingCompleteTemplate = (message: string) => {
const customContent = `

2
packages/lib/mail/signingRequestTemplate.ts
View File

@ -1,6 +1,6 @@
import { NEXT_PUBLIC_WEBAPP_URL } from "../constants";
import { Document as PrismaDocument } from "@prisma/client";
import { baseEmailTemplate } from "./baseTemplate";
import { Document as PrismaDocument } from "@prisma/client";
export const signingRequestTemplate = (
message: string,

6
packages/lib/query/getDocument.ts
View File

@ -2,11 +2,7 @@ import { getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
import { Document as PrismaDocument } from "@prisma/client";
export const getDocument = async (
documentId: number,
req: any,
res: any
): Promise<PrismaDocument> => {
export const getDocument = async (documentId: number, req: any, res: any): Promise<PrismaDocument> => {
const user = await getUserFromToken(req, res);
if (!user) return Promise.reject("Invalid user or token.");
if (!documentId) Promise.reject("No documentId");

4
packages/lib/query/getDocumentsForUserFromToken.ts
View File

@ -1,9 +1,7 @@
import { getUserFromToken } from "@documenso/lib/server";
import prisma from "@documenso/prisma";
export const getDocumentsForUserFromToken = async (
context: any
): Promise<any> => {
export const getDocumentsForUserFromToken = async (context: any): Promise<any> => {
const user = await getUserFromToken(context.req, context.res);
if (!user) return Promise.reject("Invalid user or token.");

1
packages/lib/server/defaultResponder.ts
View File

@ -1,5 +1,4 @@
import type { NextApiRequest, NextApiResponse } from "next";
import { getServerErrorFromUnknown } from "@documenso/lib/server";
type Handle<T> = (req: NextApiRequest, res: NextApiResponse) => Promise<T>;

6
packages/lib/server/getServerErrorFromUnknown.ts
View File

@ -1,9 +1,5 @@
import {
PrismaClientKnownRequestError,
NotFoundError,
} from "@prisma/client/runtime";
import { HttpError } from "@documenso/lib/server";
import { NotFoundError, PrismaClientKnownRequestError } from "@prisma/client/runtime";
export function getServerErrorFromUnknown(cause: unknown): HttpError {
// Error was manually thrown and does not need to be parsed.

2
packages/lib/server/getUserFromToken.ts
View File

@ -1,6 +1,6 @@
import { NextApiRequest, NextApiResponse } from "next";
import prisma from "@documenso/prisma";
import { User as PrismaUser } from "@prisma/client";
import { NextApiRequest, NextApiResponse } from "next";
import { getToken } from "next-auth/jwt";
import { signOut } from "next-auth/react";

2
packages/pdf/insertTextInPDF.ts
View File

@ -1,6 +1,6 @@
import { PDFDocument, rgb, StandardFonts } from "pdf-lib";
import fontkit from "@pdf-lib/fontkit";
import * as fs from "fs";
import { PDFDocument, StandardFonts, rgb } from "pdf-lib";
export async function insertTextInPDF(
pdfAsBase64: string,

4
packages/prisma/index.ts
View File

@ -1,5 +1,5 @@
import { PrismaClient, Document, User } from "@prisma/client";
import { isENVProd } from "@documenso/lib"
import { isENVProd } from "@documenso/lib";
import { Document, PrismaClient, User } from "@prisma/client";
declare global {
var client: PrismaClient | undefined;

10
packages/prisma/seed.ts
View File

@ -1,7 +1,7 @@
import prisma from "@documenso/prisma";
import { hashPassword } from "@documenso/lib/auth";
import { IdentityProvider } from "@prisma/client";
import { coloredConsole } from "@documenso/lib";
import { hashPassword } from "@documenso/lib/auth";
import prisma from "@documenso/prisma";
import { IdentityProvider } from "@prisma/client";
async function createUser(userData: { email: string; password: string }) {
try {
@ -15,9 +15,7 @@ async function createUser(userData: { email: string; password: string }) {
return user;
} catch (error) {
console.info(
`WARN: Could not create user "${userData.email}". Maybe the email is already taken?`
);
console.info(`WARN: Could not create user "${userData.email}". Maybe the email is already taken?`);
}
}

13
packages/signing/addDigitalSignature.ts
View File

@ -1,17 +1,10 @@
import { PDFDocument, PDFHexString, PDFName, PDFNumber, PDFString } from "pdf-lib";
const fs = require("fs");
// Local copy of Node SignPDF because https://github.com/vbuch/node-signpdf/pull/187 was not published in NPM yet. Can be switched to npm packge.
const signer = require("./node-signpdf/dist/signpdf");
import {
PDFDocument,
PDFName,
PDFNumber,
PDFHexString,
PDFString,
} from "pdf-lib";
export const addDigitalSignature = async (
documentAsBase64: string
): Promise<string> => {
export const addDigitalSignature = async (documentAsBase64: string): Promise<string> => {
// Custom code to add Byterange to PDF
const PDFArrayCustom = require("./PDFArrayCustom");
const pdfBuffer = Buffer.from(documentAsBase64, "base64");

2
packages/signing/index.ts
View File

@ -1 +1 @@
export { signDocument } from "./signDocument";
export { signDocument } from "./signDocument";

13
packages/signing/node-signpdf/dist/SignPdfError.js vendored
View File

@ -1,9 +1,14 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = exports.ERROR_VERIFY_SIGNATURE = exports.ERROR_TYPE_UNKNOWN = exports.ERROR_TYPE_PARSE = exports.ERROR_TYPE_INPUT = void 0;
exports.default =
exports.ERROR_VERIFY_SIGNATURE =
exports.ERROR_TYPE_UNKNOWN =
exports.ERROR_TYPE_PARSE =
exports.ERROR_TYPE_INPUT =
void 0;
const ERROR_TYPE_UNKNOWN = 1;
exports.ERROR_TYPE_UNKNOWN = ERROR_TYPE_UNKNOWN;
const ERROR_TYPE_INPUT = 2;
@ -18,13 +23,11 @@ class SignPdfError extends Error {
super(msg);
this.type = type;
}
} // Shorthand
SignPdfError.TYPE_UNKNOWN = ERROR_TYPE_UNKNOWN;
SignPdfError.TYPE_INPUT = ERROR_TYPE_INPUT;
SignPdfError.TYPE_PARSE = ERROR_TYPE_PARSE;
SignPdfError.VERIFY_SIGNATURE = ERROR_VERIFY_SIGNATURE;
var _default = SignPdfError;
exports.default = _default;
exports.default = _default;

22
packages/signing/node-signpdf/dist/helpers/const.js vendored
View File

@ -1,18 +1,24 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.SUBFILTER_ETSI_CADES_DETACHED = exports.SUBFILTER_ADOBE_X509_SHA1 = exports.SUBFILTER_ADOBE_PKCS7_SHA1 = exports.SUBFILTER_ADOBE_PKCS7_DETACHED = exports.DEFAULT_SIGNATURE_LENGTH = exports.DEFAULT_BYTE_RANGE_PLACEHOLDER = void 0;
exports.SUBFILTER_ETSI_CADES_DETACHED =
exports.SUBFILTER_ADOBE_X509_SHA1 =
exports.SUBFILTER_ADOBE_PKCS7_SHA1 =
exports.SUBFILTER_ADOBE_PKCS7_DETACHED =
exports.DEFAULT_SIGNATURE_LENGTH =
exports.DEFAULT_BYTE_RANGE_PLACEHOLDER =
void 0;
const DEFAULT_SIGNATURE_LENGTH = 8192;
exports.DEFAULT_SIGNATURE_LENGTH = DEFAULT_SIGNATURE_LENGTH;
const DEFAULT_BYTE_RANGE_PLACEHOLDER = '**********';
const DEFAULT_BYTE_RANGE_PLACEHOLDER = "**********";
exports.DEFAULT_BYTE_RANGE_PLACEHOLDER = DEFAULT_BYTE_RANGE_PLACEHOLDER;
const SUBFILTER_ADOBE_PKCS7_DETACHED = 'adbe.pkcs7.detached';
const SUBFILTER_ADOBE_PKCS7_DETACHED = "adbe.pkcs7.detached";
exports.SUBFILTER_ADOBE_PKCS7_DETACHED = SUBFILTER_ADOBE_PKCS7_DETACHED;
const SUBFILTER_ADOBE_PKCS7_SHA1 = 'adbe.pkcs7.sha1';
const SUBFILTER_ADOBE_PKCS7_SHA1 = "adbe.pkcs7.sha1";
exports.SUBFILTER_ADOBE_PKCS7_SHA1 = SUBFILTER_ADOBE_PKCS7_SHA1;
const SUBFILTER_ADOBE_X509_SHA1 = 'adbe.x509.rsa.sha1';
const SUBFILTER_ADOBE_X509_SHA1 = "adbe.x509.rsa.sha1";
exports.SUBFILTER_ADOBE_X509_SHA1 = SUBFILTER_ADOBE_X509_SHA1;
const SUBFILTER_ETSI_CADES_DETACHED = 'ETSI.CAdES.detached';
exports.SUBFILTER_ETSI_CADES_DETACHED = SUBFILTER_ETSI_CADES_DETACHED;
const SUBFILTER_ETSI_CADES_DETACHED = "ETSI.CAdES.detached";
exports.SUBFILTER_ETSI_CADES_DETACHED = SUBFILTER_ETSI_CADES_DETACHED;

39
packages/signing/node-signpdf/dist/helpers/extractSignature.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _SignPdfError = _interopRequireDefault(require("../SignPdfError"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const getSubstringIndex = (str, substring, n) => {
let times = 0;
@ -30,42 +32,49 @@ const getSubstringIndex = (str, substring, n) => {
* @returns {Object} {ByteRange: Number[], signature: Buffer, signedData: Buffer}
*/
const extractSignature = (pdf, signatureCount = 1) => {
if (!(pdf instanceof Buffer)) {
throw new _SignPdfError.default('PDF expected as Buffer.', _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default("PDF expected as Buffer.", _SignPdfError.default.TYPE_INPUT);
} // const byteRangePos = pdf.indexOf('/ByteRange [');
const byteRangePos = getSubstringIndex(pdf, '/ByteRange [', signatureCount);
const byteRangePos = getSubstringIndex(pdf, "/ByteRange [", signatureCount);
if (byteRangePos === -1) {
throw new _SignPdfError.default('Failed to locate ByteRange.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default("Failed to locate ByteRange.", _SignPdfError.default.TYPE_PARSE);
}
const byteRangeEnd = pdf.indexOf(']', byteRangePos);
const byteRangeEnd = pdf.indexOf("]", byteRangePos);
if (byteRangeEnd === -1) {
throw new _SignPdfError.default('Failed to locate the end of the ByteRange.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
"Failed to locate the end of the ByteRange.",
_SignPdfError.default.TYPE_PARSE
);
}
const byteRange = pdf.slice(byteRangePos, byteRangeEnd + 1).toString();
const matches = /\/ByteRange \[(\d+) +(\d+) +(\d+) +(\d+) *\]/.exec(byteRange);
if (matches === null) {
throw new _SignPdfError.default('Failed to parse the ByteRange.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default("Failed to parse the ByteRange.", _SignPdfError.default.TYPE_PARSE);
}
const ByteRange = matches.slice(1).map(Number);
const signedData = Buffer.concat([pdf.slice(ByteRange[0], ByteRange[0] + ByteRange[1]), pdf.slice(ByteRange[2], ByteRange[2] + ByteRange[3])]);
const signatureHex = pdf.slice(ByteRange[0] + ByteRange[1] + 1, ByteRange[2]).toString('binary').replace(/(?:00|>)+$/, '');
const signature = Buffer.from(signatureHex, 'hex').toString('binary');
const signedData = Buffer.concat([
pdf.slice(ByteRange[0], ByteRange[0] + ByteRange[1]),
pdf.slice(ByteRange[2], ByteRange[2] + ByteRange[3]),
]);
const signatureHex = pdf
.slice(ByteRange[0] + ByteRange[1] + 1, ByteRange[2])
.toString("binary")
.replace(/(?:00|>)+$/, "");
const signature = Buffer.from(signatureHex, "hex").toString("binary");
return {
ByteRange: matches.slice(1, 5).map(Number),
signature,
signedData
signedData,
};
};
var _default = extractSignature;
exports.default = _default;
exports.default = _default;

29
packages/signing/node-signpdf/dist/helpers/findByteRange.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -9,7 +9,9 @@ var _SignPdfError = _interopRequireDefault(require("../SignPdfError"));
var _const = require("./const");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/**
* Finds ByteRange information within a given PDF Buffer if one exists
@ -17,25 +19,32 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
* @param {Buffer} pdf
* @returns {Object} {byteRangePlaceholder: String, byteRangeStrings: String[], byteRange: String[]}
*/
const findByteRange = pdf => {
const findByteRange = (pdf) => {
if (!(pdf instanceof Buffer)) {
throw new _SignPdfError.default('PDF expected as Buffer.', _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default("PDF expected as Buffer.", _SignPdfError.default.TYPE_INPUT);
}
const byteRangeStrings = pdf.toString().match(/\/ByteRange\s*\[{1}\s*(?:(?:\d*|\/\*{10})\s+){3}(?:\d+|\/\*{10}){1}\s*]{1}/g);
const byteRangeStrings = pdf
.toString()
.match(/\/ByteRange\s*\[{1}\s*(?:(?:\d*|\/\*{10})\s+){3}(?:\d+|\/\*{10}){1}\s*]{1}/g);
if (!byteRangeStrings) {
throw new _SignPdfError.default('No ByteRangeStrings found within PDF buffer', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
"No ByteRangeStrings found within PDF buffer",
_SignPdfError.default.TYPE_PARSE
);
}
const byteRangePlaceholder = byteRangeStrings.find(s => s.includes(`/${_const.DEFAULT_BYTE_RANGE_PLACEHOLDER}`));
const byteRanges = byteRangeStrings.map(brs => brs.match(/[^[\s]*(?:\d|\/\*{10})/g));
const byteRangePlaceholder = byteRangeStrings.find((s) =>
s.includes(`/${_const.DEFAULT_BYTE_RANGE_PLACEHOLDER}`)
);
const byteRanges = byteRangeStrings.map((brs) => brs.match(/[^[\s]*(?:\d|\/\*{10})/g));
return {
byteRangePlaceholder,
byteRangeStrings,
byteRanges
byteRanges,
};
};
var _default = findByteRange;
exports.default = _default;
exports.default = _default;

18
packages/signing/node-signpdf/dist/helpers/index.js vendored
View File

@ -1,37 +1,37 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
Object.defineProperty(exports, "extractSignature", {
enumerable: true,
get: function () {
return _extractSignature.default;
}
},
});
Object.defineProperty(exports, "findByteRange", {
enumerable: true,
get: function () {
return _findByteRange.default;
}
},
});
Object.defineProperty(exports, "pdfkitAddPlaceholder", {
enumerable: true,
get: function () {
return _pdfkitAddPlaceholder.default;
}
},
});
Object.defineProperty(exports, "plainAddPlaceholder", {
enumerable: true,
get: function () {
return _plainAddPlaceholder.default;
}
},
});
Object.defineProperty(exports, "removeTrailingNewLine", {
enumerable: true,
get: function () {
return _removeTrailingNewLine.default;
}
},
});
var _extractSignature = _interopRequireDefault(require("./extractSignature"));
@ -44,6 +44,8 @@ var _removeTrailingNewLine = _interopRequireDefault(require("./removeTrailingNew
var _findByteRange = _interopRequireDefault(require("./findByteRange"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
'This string is added so that jest collects coverage for this file'; // eslint-disable-line
("This string is added so that jest collects coverage for this file"); // eslint-disable-line

7
packages/signing/node-signpdf/dist/helpers/pdfkit/abstract_reference.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -17,10 +17,9 @@ PDFAbstractReference - abstract class for PDF reference
*/
class PDFAbstractReference {
toString() {
throw new Error('Must be implemented by subclasses');
throw new Error("Must be implemented by subclasses");
}
}
var _default = PDFAbstractReference;
exports.default = _default;
exports.default = _default;

73
packages/signing/node-signpdf/dist/helpers/pdfkit/pdfobject.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _abstract_reference = _interopRequireDefault(require("./abstract_reference"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/*
PDFObject by Devon Govett used below.
@ -20,26 +22,26 @@ Modifications may have been applied for the purposes of node-signpdf.
PDFObject - converts JavaScript types into their corresponding PDF types.
By Devon Govett
*/
const pad = (str, length) => (Array(length + 1).join('0') + str).slice(-length);
const pad = (str, length) => (Array(length + 1).join("0") + str).slice(-length);
const escapableRe = /[\n\r\t\b\f()\\]/g;
const escapable = {
'\n': '\\n',
'\r': '\\r',
'\t': '\\t',
'\b': '\\b',
'\f': '\\f',
'\\': '\\\\',
'(': '\\(',
')': '\\)'
"\n": "\\n",
"\r": "\\r",
"\t": "\\t",
"\b": "\\b",
"\f": "\\f",
"\\": "\\\\",
"(": "\\(",
")": "\\)",
}; // Convert little endian UTF-16 to big endian
const swapBytes = buff => buff.swap16();
const swapBytes = (buff) => buff.swap16();
class PDFObject {
static convert(object, encryptFn = null) {
// String literals are converted to the PDF name type
if (typeof object === 'string') {
if (typeof object === "string") {
return `/${object}`; // String objects are converted to PDF strings (UTF-16)
}
@ -55,29 +57,26 @@ class PDFObject {
}
} // If so, encode it as big endian UTF-16
let stringBuffer;
if (isUnicode) {
stringBuffer = swapBytes(Buffer.from(`\ufeff${string}`, 'utf16le'));
stringBuffer = swapBytes(Buffer.from(`\ufeff${string}`, "utf16le"));
} else {
stringBuffer = Buffer.from(string, 'ascii');
stringBuffer = Buffer.from(string, "ascii");
} // Encrypt the string when necessary
if (encryptFn) {
string = encryptFn(stringBuffer).toString('binary');
string = encryptFn(stringBuffer).toString("binary");
} else {
string = stringBuffer.toString('binary');
string = stringBuffer.toString("binary");
} // Escape characters as required by the spec
string = string.replace(escapableRe, c => escapable[c]);
string = string.replace(escapableRe, (c) => escapable[c]);
return `(${string})`; // Buffers are converted to PDF hex strings
}
if (Buffer.isBuffer(object)) {
return `<${object.toString('hex')}>`;
return `<${object.toString("hex")}>`;
}
if (object instanceof _abstract_reference.default) {
@ -85,51 +84,54 @@ class PDFObject {
}
if (object instanceof Date) {
let string = `D:${pad(object.getUTCFullYear(), 4)}${pad(object.getUTCMonth() + 1, 2)}${pad(object.getUTCDate(), 2)}${pad(object.getUTCHours(), 2)}${pad(object.getUTCMinutes(), 2)}${pad(object.getUTCSeconds(), 2)}Z`; // Encrypt the string when necessary
let string = `D:${pad(object.getUTCFullYear(), 4)}${pad(object.getUTCMonth() + 1, 2)}${pad(
object.getUTCDate(),
2
)}${pad(object.getUTCHours(), 2)}${pad(object.getUTCMinutes(), 2)}${pad(object.getUTCSeconds(), 2)}Z`; // Encrypt the string when necessary
if (encryptFn) {
string = encryptFn(Buffer.from(string, 'ascii')).toString('binary'); // Escape characters as required by the spec
string = encryptFn(Buffer.from(string, "ascii")).toString("binary"); // Escape characters as required by the spec
string = string.replace(escapableRe, c => escapable[c]);
string = string.replace(escapableRe, (c) => escapable[c]);
}
return `(${string})`;
}
if (Array.isArray(object)) {
const items = object.map(e => PDFObject.convert(e, encryptFn)).join(' ');
const items = object.map((e) => PDFObject.convert(e, encryptFn)).join(" ");
return `[${items}]`;
}
if ({}.toString.call(object) === '[object Object]') {
const out = ['<<'];
if ({}.toString.call(object) === "[object Object]") {
const out = ["<<"];
let streamData; // @todo this can probably be refactored into a reduce
Object.entries(object).forEach(([key, val]) => {
let checkedValue = '';
let checkedValue = "";
if (val.toString().indexOf('<<') !== -1) {
if (val.toString().indexOf("<<") !== -1) {
checkedValue = val;
} else {
checkedValue = PDFObject.convert(val, encryptFn);
}
if (key === 'stream') {
if (key === "stream") {
streamData = `${key}\n${val}\nendstream`;
} else {
out.push(`/${key} ${checkedValue}`);
}
});
out.push('>>');
out.push(">>");
if (streamData) {
out.push(streamData);
}
return out.join('\n');
return out.join("\n");
}
if (typeof object === 'number') {
if (typeof object === "number") {
return PDFObject.number(object);
}
@ -143,7 +145,6 @@ class PDFObject {
throw new Error(`unsupported number: ${n}`);
}
}
exports.default = PDFObject;
exports.default = PDFObject;

68
packages/signing/node-signpdf/dist/helpers/pdfkitAddPlaceholder.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -9,7 +9,9 @@ var _const = require("./const");
var _pdfkitReferenceMock = _interopRequireDefault(require("./pdfkitReferenceMock"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
// eslint-disable-next-line import/no-unresolved
@ -25,18 +27,18 @@ const pdfkitAddPlaceholder = ({
pdf,
pdfBuffer,
reason,
contactInfo = 'emailfromp1289@gmail.com',
name = 'Name from p12',
location = 'Location from p12',
contactInfo = "emailfromp1289@gmail.com",
name = "Name from p12",
location = "Location from p12",
signatureLength = _const.DEFAULT_SIGNATURE_LENGTH,
byteRangePlaceholder = _const.DEFAULT_BYTE_RANGE_PLACEHOLDER,
subFilter = _const.SUBFILTER_ADOBE_PKCS7_DETACHED
subFilter = _const.SUBFILTER_ADOBE_PKCS7_DETACHED,
}) => {
/* eslint-disable no-underscore-dangle,no-param-reassign */
// Generate the signature placeholder
const signature = pdf.ref({
Type: 'Sig',
Filter: 'Adobe.PPKLite',
Type: "Sig",
Filter: "Adobe.PPKLite",
SubFilter: subFilter,
ByteRange: [0, byteRangePlaceholder, byteRangePlaceholder, byteRangePlaceholder],
Contents: Buffer.from(String.fromCharCode(0).repeat(signatureLength)),
@ -47,11 +49,10 @@ const pdfkitAddPlaceholder = ({
// eslint-disable-line no-new-wrappers
Name: new String(name),
// eslint-disable-line no-new-wrappers
Location: new String(location) // eslint-disable-line no-new-wrappers
Location: new String(location), // eslint-disable-line no-new-wrappers
}); // Check if pdf already contains acroform field
const acroFormPosition = pdfBuffer.lastIndexOf('/Type /AcroForm');
const acroFormPosition = pdfBuffer.lastIndexOf("/Type /AcroForm");
const isAcroFormExists = acroFormPosition !== -1;
let fieldIds = [];
let acroFormId;
@ -65,13 +66,13 @@ const pdfkitAddPlaceholder = ({
// (generally it's 2 or 3, but I'm giving a big space though)
const maxAcroFormIdLength = 12;
let foundAcroFormId = '';
let foundAcroFormId = "";
let index = charsUntilIdEnd + 1;
for (index; index < charsUntilIdEnd + maxAcroFormIdLength; index += 1) {
const acroFormIdString = pdfBuffer.slice(acroFormPosition - index, acroFormIdEnd).toString();
if (acroFormIdString[0] === '\n') {
if (acroFormIdString[0] === "\n") {
break;
}
@ -80,25 +81,27 @@ const pdfkitAddPlaceholder = ({
}
const pdfSlice = pdfBuffer.slice(acroFormStart);
const acroForm = pdfSlice.slice(0, pdfSlice.indexOf('endobj')).toString();
const acroForm = pdfSlice.slice(0, pdfSlice.indexOf("endobj")).toString();
acroFormId = parseInt(foundAcroFormId);
const acroFormFields = acroForm.slice(acroForm.indexOf('/Fields [') + 9, acroForm.indexOf(']'));
fieldIds = acroFormFields.split(' ').filter((element, i) => i % 3 === 0).map(fieldId => new _pdfkitReferenceMock.default(fieldId));
const acroFormFields = acroForm.slice(acroForm.indexOf("/Fields [") + 9, acroForm.indexOf("]"));
fieldIds = acroFormFields
.split(" ")
.filter((element, i) => i % 3 === 0)
.map((fieldId) => new _pdfkitReferenceMock.default(fieldId));
}
const signatureName = 'Signature'; // Generate signature annotation widget
const signatureName = "Signature"; // Generate signature annotation widget
const widget = pdf.ref({
Type: 'Annot',
Subtype: 'Widget',
FT: 'Sig',
Type: "Annot",
Subtype: "Widget",
FT: "Sig",
Rect: [0, 0, 0, 0],
V: signature,
T: new String(signatureName + (fieldIds.length + 1)),
// eslint-disable-line no-new-wrappers
F: 4,
P: pdf.page.dictionary // eslint-disable-line no-underscore-dangle
P: pdf.page.dictionary, // eslint-disable-line no-underscore-dangle
});
pdf.page.dictionary.data.Annots = [widget]; // Include the widget in a page
@ -107,27 +110,30 @@ const pdfkitAddPlaceholder = ({
if (!isAcroFormExists) {
// Create a form (with the widget) and link in the _root
form = pdf.ref({
Type: 'AcroForm',
Type: "AcroForm",
SigFlags: 3,
Fields: [...fieldIds, widget]
Fields: [...fieldIds, widget],
});
} else {
// Use existing acroform and extend the fields with newly created widgets
form = pdf.ref({
Type: 'AcroForm',
SigFlags: 3,
Fields: [...fieldIds, widget]
}, acroFormId);
form = pdf.ref(
{
Type: "AcroForm",
SigFlags: 3,
Fields: [...fieldIds, widget],
},
acroFormId
);
}
pdf._root.data.AcroForm = form;
return {
signature,
form,
widget
widget,
};
/* eslint-enable no-underscore-dangle,no-param-reassign */
};
var _default = pdfkitAddPlaceholder;
exports.default = _default;
exports.default = _default;

11
packages/signing/node-signpdf/dist/helpers/pdfkitReferenceMock.js vendored
View File

@ -1,20 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _abstract_reference = _interopRequireDefault(require("./pdfkit/abstract_reference"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
class PDFKitReferenceMock extends _abstract_reference.default {
constructor(index, additionalData = undefined) {
super();
this.index = index;
if (typeof additionalData !== 'undefined') {
if (typeof additionalData !== "undefined") {
Object.assign(this, additionalData);
}
}
@ -22,8 +24,7 @@ class PDFKitReferenceMock extends _abstract_reference.default {
toString() {
return `${this.index} 0 R`;
}
}
var _default = PDFKitReferenceMock;
exports.default = _default;
exports.default = _default;

23
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/createBufferPageWithAnnotation.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -9,7 +9,9 @@ var _findObject = _interopRequireDefault(require("./findObject"));
var _getIndexFromRef = _interopRequireDefault(require("./getIndexFromRef"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const createBufferPageWithAnnotation = (pdf, info, pagesRef, widget) => {
const pagesDictionary = (0, _findObject.default)(pdf, info.xref, pagesRef).toString(); // Extend page dictionary with newly created annotations
@ -17,16 +19,16 @@ const createBufferPageWithAnnotation = (pdf, info, pagesRef, widget) => {
let annotsStart;
let annotsEnd;
let annots;
annotsStart = pagesDictionary.indexOf('/Annots');
annotsStart = pagesDictionary.indexOf("/Annots");
if (annotsStart > -1) {
annotsEnd = pagesDictionary.indexOf(']', annotsStart);
annotsEnd = pagesDictionary.indexOf("]", annotsStart);
annots = pagesDictionary.substr(annotsStart, annotsEnd + 1 - annotsStart);
annots = annots.substr(0, annots.length - 1); // remove the trailing ]
} else {
annotsStart = pagesDictionary.length;
annotsEnd = pagesDictionary.length;
annots = '/Annots [';
annots = "/Annots [";
}
const pagesDictionaryIndex = (0, _getIndexFromRef.default)(info.xref, pagesRef);
@ -34,14 +36,19 @@ const createBufferPageWithAnnotation = (pdf, info, pagesRef, widget) => {
annots = `${annots} ${widgetValue}]`; // add the trailing ] back
const preAnnots = pagesDictionary.substr(0, annotsStart);
let postAnnots = '';
let postAnnots = "";
if (pagesDictionary.length > annotsEnd) {
postAnnots = pagesDictionary.substr(annotsEnd + 1);
}
return Buffer.concat([Buffer.from(`${pagesDictionaryIndex} 0 obj\n`), Buffer.from('<<\n'), Buffer.from(`${preAnnots + annots + postAnnots}\n`), Buffer.from('\n>>\nendobj\n')]);
return Buffer.concat([
Buffer.from(`${pagesDictionaryIndex} 0 obj\n`),
Buffer.from("<<\n"),
Buffer.from(`${preAnnots + annots + postAnnots}\n`),
Buffer.from("\n>>\nendobj\n"),
]);
};
var _default = createBufferPageWithAnnotation;
exports.default = _default;
exports.default = _default;

16
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/createBufferRootWithAcroform.js vendored
View File

@ -1,18 +1,26 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _getIndexFromRef = _interopRequireDefault(require("./getIndexFromRef"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const createBufferRootWithAcroform = (pdf, info, form) => {
const rootIndex = (0, _getIndexFromRef.default)(info.xref, info.rootRef);
return Buffer.concat([Buffer.from(`${rootIndex} 0 obj\n`), Buffer.from('<<\n'), Buffer.from(`${info.root}\n`), Buffer.from(`/AcroForm ${form}`), Buffer.from('\n>>\nendobj\n')]);
return Buffer.concat([
Buffer.from(`${rootIndex} 0 obj\n`),
Buffer.from("<<\n"),
Buffer.from(`${info.root}\n`),
Buffer.from(`/AcroForm ${form}`),
Buffer.from("\n>>\nendobj\n"),
]);
};
var _default = createBufferRootWithAcroform;
exports.default = _default;
exports.default = _default;

24
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/createBufferTrailer.js vendored
View File

@ -1,21 +1,35 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
const createBufferTrailer = (pdf, info, addedReferences) => {
let rows = [];
rows[0] = '0000000000 65535 f '; // info.xref.tableRows[0];
rows[0] = "0000000000 65535 f "; // info.xref.tableRows[0];
addedReferences.forEach((offset, index) => {
const paddedOffset = `0000000000${offset}`.slice(-10);
rows[index + 1] = `${index} 1\n${paddedOffset} 00000 n `;
});
rows = rows.filter(row => row !== undefined);
return Buffer.concat([Buffer.from('xref\n'), Buffer.from(`${info.xref.startingIndex} 1\n`), Buffer.from(rows.join('\n')), Buffer.from('\ntrailer\n'), Buffer.from('<<\n'), Buffer.from(`/Size ${info.xref.maxIndex + 1}\n`), Buffer.from(`/Root ${info.rootRef}\n`), Buffer.from(info.infoRef ? `/Info ${info.infoRef}\n` : ''), Buffer.from(`/Prev ${info.xRefPosition}\n`), Buffer.from('>>\n'), Buffer.from('startxref\n'), Buffer.from(`${pdf.length}\n`), Buffer.from('%%EOF')]);
rows = rows.filter((row) => row !== undefined);
return Buffer.concat([
Buffer.from("xref\n"),
Buffer.from(`${info.xref.startingIndex} 1\n`),
Buffer.from(rows.join("\n")),
Buffer.from("\ntrailer\n"),
Buffer.from("<<\n"),
Buffer.from(`/Size ${info.xref.maxIndex + 1}\n`),
Buffer.from(`/Root ${info.rootRef}\n`),
Buffer.from(info.infoRef ? `/Info ${info.infoRef}\n` : ""),
Buffer.from(`/Prev ${info.xRefPosition}\n`),
Buffer.from(">>\n"),
Buffer.from("startxref\n"),
Buffer.from(`${pdf.length}\n`),
Buffer.from("%%EOF"),
]);
};
var _default = createBufferTrailer;
exports.default = _default;
exports.default = _default;

14
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/findObject.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _getIndexFromRef = _interopRequireDefault(require("./getIndexFromRef"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/**
* @param {Buffer} pdf
@ -18,12 +20,12 @@ const findObject = (pdf, refTable, ref) => {
const index = (0, _getIndexFromRef.default)(refTable, ref);
const offset = refTable.offsets.get(index);
let slice = pdf.slice(offset);
slice = slice.slice(0, slice.indexOf('endobj', 'utf8')); // FIXME: What if it is a stream?
slice = slice.slice(0, slice.indexOf("endobj", "utf8")); // FIXME: What if it is a stream?
slice = slice.slice(slice.indexOf('<<', 'utf8') + 2);
slice = slice.slice(0, slice.lastIndexOf('>>', 'utf8'));
slice = slice.slice(slice.indexOf("<<", "utf8") + 2);
slice = slice.slice(0, slice.lastIndexOf(">>", "utf8"));
return slice;
};
var _default = findObject;
exports.default = _default;
exports.default = _default;

10
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/getIndexFromRef.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _SignPdfError = _interopRequireDefault(require("../../SignPdfError"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/**
* @param {object} refTable
@ -15,7 +17,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
* @returns {number}
*/
const getIndexFromRef = (refTable, ref) => {
let [index] = ref.split(' ');
let [index] = ref.split(" ");
index = parseInt(index);
if (!refTable.offsets.has(index)) {
@ -26,4 +28,4 @@ const getIndexFromRef = (refTable, ref) => {
};
var _default = getIndexFromRef;
exports.default = _default;
exports.default = _default;

16
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/getPageRef.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = getPageRef;
@ -9,7 +9,9 @@ var _getPagesDictionaryRef = _interopRequireDefault(require("./getPagesDictionar
var _findObject = _interopRequireDefault(require("./findObject"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/**
* Finds the reference to a page.
@ -20,10 +22,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
function getPageRef(pdfBuffer, info) {
const pagesRef = (0, _getPagesDictionaryRef.default)(info);
const pagesDictionary = (0, _findObject.default)(pdfBuffer, info.xref, pagesRef);
const kidsPosition = pagesDictionary.indexOf('/Kids');
const kidsStart = pagesDictionary.indexOf('[', kidsPosition) + 1;
const kidsEnd = pagesDictionary.indexOf(']', kidsPosition);
const kidsPosition = pagesDictionary.indexOf("/Kids");
const kidsStart = pagesDictionary.indexOf("[", kidsPosition) + 1;
const kidsEnd = pagesDictionary.indexOf("]", kidsPosition);
const pages = pagesDictionary.slice(kidsStart, kidsEnd).toString();
const split = pages.trim().split(' ', 3);
const split = pages.trim().split(" ", 3);
return `${split[0]} ${split[1]} ${split[2]}`;
}
}

13
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/getPagesDictionaryRef.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = getPagesDictionaryRef;
var _SignPdfError = _interopRequireDefault(require("../../SignPdfError"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
/**
* @param {Object} info As extracted from readRef()
@ -17,8 +19,11 @@ function getPagesDictionaryRef(info) {
const match = pagesRefRegex.exec(info.root);
if (match === null) {
throw new _SignPdfError.default('Failed to find the pages descriptor. This is probably a problem in node-signpdf.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
"Failed to find the pages descriptor. This is probably a problem in node-signpdf.",
_SignPdfError.default.TYPE_PARSE
);
}
return match[1];
}
}

64
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/index.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -27,12 +27,14 @@ var _createBufferPageWithAnnotation = _interopRequireDefault(require("./createBu
var _createBufferTrailer = _interopRequireDefault(require("./createBufferTrailer"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const isContainBufferRootWithAcroform = pdf => {
const isContainBufferRootWithAcroform = (pdf) => {
const bufferRootWithAcroformRefRegex = /\/AcroForm\s+(\d+\s\d+\sR)/g;
const match = bufferRootWithAcroformRefRegex.exec(pdf.toString());
return match != null && match[1] != null && match[1] !== '';
return match != null && match[1] != null && match[1] !== "";
};
/**
* Adds a signature placeholder to a PDF Buffer.
@ -44,15 +46,14 @@ const isContainBufferRootWithAcroform = pdf => {
* not only on a freshly created through PDFKit one.
*/
const plainAddPlaceholder = ({
pdfBuffer,
reason,
contactInfo = 'emailfromp1289@gmail.com',
name = 'Name from p12',
location = 'Location from p12',
contactInfo = "emailfromp1289@gmail.com",
name = "Name from p12",
location = "Location from p12",
signatureLength = _const.DEFAULT_SIGNATURE_LENGTH,
subFilter = _const.SUBFILTER_ADOBE_PKCS7_DETACHED
subFilter = _const.SUBFILTER_ADOBE_PKCS7_DETACHED,
}) => {
let pdf = (0, _removeTrailingNewLine.default)(pdfBuffer);
const info = (0, _readPdf.default)(pdf);
@ -65,24 +66,27 @@ const plainAddPlaceholder = ({
const index = additionalIndex != null ? additionalIndex : info.xref.maxIndex;
addedReferences.set(index, pdf.length + 1); // + 1 new line
pdf = Buffer.concat([pdf, Buffer.from('\n'), Buffer.from(`${index} 0 obj\n`), Buffer.from(_pdfobject.default.convert(input)), Buffer.from('\nendobj\n')]);
pdf = Buffer.concat([
pdf,
Buffer.from("\n"),
Buffer.from(`${index} 0 obj\n`),
Buffer.from(_pdfobject.default.convert(input)),
Buffer.from("\nendobj\n"),
]);
return new _pdfkitReferenceMock.default(info.xref.maxIndex);
},
page: {
dictionary: new _pdfkitReferenceMock.default(pageIndex, {
data: {
Annots: []
}
})
Annots: [],
},
}),
},
_root: {
data: {}
}
data: {},
},
};
const {
form,
widget
} = (0, _pdfkitAddPlaceholder.default)({
const { form, widget } = (0, _pdfkitAddPlaceholder.default)({
pdf: pdfKitMock,
pdfBuffer,
reason,
@ -90,20 +94,32 @@ const plainAddPlaceholder = ({
name,
location,
signatureLength,
subFilter
subFilter,
});
if (!isContainBufferRootWithAcroform(pdf)) {
const rootIndex = (0, _getIndexFromRef.default)(info.xref, info.rootRef);
addedReferences.set(rootIndex, pdf.length + 1);
pdf = Buffer.concat([pdf, Buffer.from('\n'), (0, _createBufferRootWithAcroform.default)(pdf, info, form)]);
pdf = Buffer.concat([
pdf,
Buffer.from("\n"),
(0, _createBufferRootWithAcroform.default)(pdf, info, form),
]);
}
addedReferences.set(pageIndex, pdf.length + 1);
pdf = Buffer.concat([pdf, Buffer.from('\n'), (0, _createBufferPageWithAnnotation.default)(pdf, info, pageRef, widget)]);
pdf = Buffer.concat([pdf, Buffer.from('\n'), (0, _createBufferTrailer.default)(pdf, info, addedReferences)]);
pdf = Buffer.concat([
pdf,
Buffer.from("\n"),
(0, _createBufferPageWithAnnotation.default)(pdf, info, pageRef, widget),
]);
pdf = Buffer.concat([
pdf,
Buffer.from("\n"),
(0, _createBufferTrailer.default)(pdf, info, addedReferences),
]);
return pdf;
};
var _default = plainAddPlaceholder;
exports.default = _default;
exports.default = _default;

30
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/readPdf.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
@ -9,7 +9,9 @@ var _readRefTable = _interopRequireDefault(require("./readRefTable"));
var _findObject = _interopRequireDefault(require("./findObject"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const getValue = (trailer, key) => {
let index = trailer.indexOf(key);
@ -19,13 +21,16 @@ const getValue = (trailer, key) => {
}
const slice = trailer.slice(index);
index = slice.indexOf('/', 1);
index = slice.indexOf("/", 1);
if (index === -1) {
index = slice.indexOf('>', 1);
index = slice.indexOf(">", 1);
}
return slice.slice(key.length + 1, index).toString().trim(); // key + at least one space
return slice
.slice(key.length + 1, index)
.toString()
.trim(); // key + at least one space
};
/**
* Simplified parsing of a PDF Buffer.
@ -36,18 +41,17 @@ const getValue = (trailer, key) => {
* @param {Buffer} pdfBuffer
*/
const readPdf = pdfBuffer => {
const readPdf = (pdfBuffer) => {
// Extract the trailer dictionary.
const trailerStart = pdfBuffer.lastIndexOf('trailer'); // The trailer is followed by xref. Then an EOF. EOF's length is 6 characters.
const trailerStart = pdfBuffer.lastIndexOf("trailer"); // The trailer is followed by xref. Then an EOF. EOF's length is 6 characters.
const trailer = pdfBuffer.slice(trailerStart, pdfBuffer.length - 6);
let xRefPosition = trailer.slice(trailer.lastIndexOf('startxref') + 10).toString();
let xRefPosition = trailer.slice(trailer.lastIndexOf("startxref") + 10).toString();
xRefPosition = parseInt(xRefPosition);
const refTable = (0, _readRefTable.default)(pdfBuffer);
const rootRef = getValue(trailer, '/Root');
const rootRef = getValue(trailer, "/Root");
const root = (0, _findObject.default)(pdfBuffer, refTable, rootRef).toString();
const infoRef = getValue(trailer, '/Info');
const infoRef = getValue(trailer, "/Info");
return {
xref: refTable,
rootRef,
@ -55,9 +59,9 @@ const readPdf = pdfBuffer => {
infoRef,
trailerStart,
previousXrefs: [],
xRefPosition
xRefPosition,
};
};
var _default = readPdf;
exports.default = _default;
exports.default = _default;

56
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/readRefTable.js vendored
View File

@ -1,7 +1,7 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.getXref = exports.getLastTrailerPosition = exports.getFullXrefTable = exports.default = void 0;
@ -9,12 +9,14 @@ var _SignPdfError = _interopRequireDefault(require("../../SignPdfError"));
var _xrefToRefMap = _interopRequireDefault(require("./xrefToRefMap"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const getLastTrailerPosition = pdf => {
const trailerStart = pdf.lastIndexOf(Buffer.from('trailer', 'utf8'));
const getLastTrailerPosition = (pdf) => {
const trailerStart = pdf.lastIndexOf(Buffer.from("trailer", "utf8"));
const trailer = pdf.slice(trailerStart, pdf.length - 6);
const xRefPosition = trailer.slice(trailer.lastIndexOf(Buffer.from('startxref', 'utf8')) + 10).toString();
const xRefPosition = trailer.slice(trailer.lastIndexOf(Buffer.from("startxref", "utf8")) + 10).toString();
return parseInt(xRefPosition);
};
@ -23,47 +25,56 @@ exports.getLastTrailerPosition = getLastTrailerPosition;
const getXref = (pdf, position) => {
let refTable = pdf.slice(position); // slice starting from where xref starts
const realPosition = refTable.indexOf(Buffer.from('xref', 'utf8'));
const realPosition = refTable.indexOf(Buffer.from("xref", "utf8"));
if (realPosition === -1) {
throw new _SignPdfError.default(`Could not find xref anywhere at or after ${position}.`, _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
`Could not find xref anywhere at or after ${position}.`,
_SignPdfError.default.TYPE_PARSE
);
}
if (realPosition > 0) {
const prefix = refTable.slice(0, realPosition);
if (prefix.toString().replace(/\s*/g, '') !== '') {
throw new _SignPdfError.default(`Expected xref at ${position} but found other content.`, _SignPdfError.default.TYPE_PARSE);
if (prefix.toString().replace(/\s*/g, "") !== "") {
throw new _SignPdfError.default(
`Expected xref at ${position} but found other content.`,
_SignPdfError.default.TYPE_PARSE
);
}
}
const nextEofPosition = refTable.indexOf(Buffer.from('%%EOF', 'utf8'));
const nextEofPosition = refTable.indexOf(Buffer.from("%%EOF", "utf8"));
if (nextEofPosition === -1) {
throw new _SignPdfError.default('Expected EOF after xref and trailer but could not find one.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
"Expected EOF after xref and trailer but could not find one.",
_SignPdfError.default.TYPE_PARSE
);
}
refTable = refTable.slice(0, nextEofPosition);
refTable = refTable.slice(realPosition + 4); // move ahead with the "xref"
refTable = refTable.slice(refTable.indexOf('\n') + 1); // move after the next new line
refTable = refTable.slice(refTable.indexOf("\n") + 1); // move after the next new line
// extract the size
let size = refTable.toString().split('/Size')[1];
let size = refTable.toString().split("/Size")[1];
if (!size) {
throw new _SignPdfError.default('Size not found in xref table.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default("Size not found in xref table.", _SignPdfError.default.TYPE_PARSE);
}
size = /^\s*(\d+)/.exec(size);
if (size === null) {
throw new _SignPdfError.default('Failed to parse size of xref table.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default("Failed to parse size of xref table.", _SignPdfError.default.TYPE_PARSE);
}
size = parseInt(size[1]);
const [objects, infos] = refTable.toString().split('trailer');
const isContainingPrev = infos.split('/Prev')[1] != null;
const [objects, infos] = refTable.toString().split("trailer");
const isContainingPrev = infos.split("/Prev")[1] != null;
let prev;
if (isContainingPrev) {
@ -77,13 +88,13 @@ const getXref = (pdf, position) => {
return {
size,
prev,
xRefContent
xRefContent,
};
};
exports.getXref = getXref;
const getFullXrefTable = pdf => {
const getFullXrefTable = (pdf) => {
const lastTrailerPosition = getLastTrailerPosition(pdf);
const lastXrefTable = getXref(pdf, lastTrailerPosition);
@ -101,19 +112,18 @@ const getFullXrefTable = pdf => {
* @returns {object}
*/
exports.getFullXrefTable = getFullXrefTable;
const readRefTable = pdf => {
const readRefTable = (pdf) => {
const fullXrefTable = getFullXrefTable(pdf);
const startingIndex = 0;
const maxIndex = Math.max(...fullXrefTable.keys());
return {
startingIndex,
maxIndex,
offsets: fullXrefTable
offsets: fullXrefTable,
};
};
var _default = readRefTable;
exports.default = _default;
exports.default = _default;

34
packages/signing/node-signpdf/dist/helpers/plainAddPlaceholder/xrefToRefMap.js vendored
View File

@ -1,21 +1,23 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _SignPdfError = _interopRequireDefault(require("../../SignPdfError"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const xrefToRefMap = xrefString => {
const lines = xrefString.split('\n').filter(l => l !== '');
const xrefToRefMap = (xrefString) => {
const lines = xrefString.split("\n").filter((l) => l !== "");
let index = 0;
let expectedLines = 0;
const xref = new Map();
lines.forEach(line => {
const split = line.split(' ');
lines.forEach((line) => {
const split = line.split(" ");
if (split.length === 2) {
index = parseInt(split[0]);
@ -24,23 +26,29 @@ const xrefToRefMap = xrefString => {
}
if (expectedLines <= 0) {
throw new _SignPdfError.default('Too many lines in xref table.', _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default("Too many lines in xref table.", _SignPdfError.default.TYPE_PARSE);
}
expectedLines -= 1;
const [offset,, inUse] = split;
const [offset, , inUse] = split;
if (inUse.trim() === 'f') {
if (inUse.trim() === "f") {
index += 1;
return;
}
if (inUse.trim() !== 'n') {
throw new _SignPdfError.default(`Unknown in-use flag "${inUse}". Expected "n" or "f".`, _SignPdfError.default.TYPE_PARSE);
if (inUse.trim() !== "n") {
throw new _SignPdfError.default(
`Unknown in-use flag "${inUse}". Expected "n" or "f".`,
_SignPdfError.default.TYPE_PARSE
);
}
if (!/^\d+$/.test(offset.trim())) {
throw new _SignPdfError.default(`Expected integer offset. Got "${offset}".`, _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
`Expected integer offset. Got "${offset}".`,
_SignPdfError.default.TYPE_PARSE
);
}
const storeOffset = parseInt(offset.trim());
@ -51,4 +59,4 @@ const xrefToRefMap = xrefString => {
};
var _default = xrefToRefMap;
exports.default = _default;
exports.default = _default;

24
packages/signing/node-signpdf/dist/helpers/removeTrailingNewLine.js vendored
View File

@ -1,13 +1,15 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
exports.default = void 0;
var _SignPdfError = _interopRequireDefault(require("../SignPdfError"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
const sliceLastChar = (pdf, character) => {
const lastChar = pdf.slice(pdf.length - 1).toString();
@ -26,23 +28,25 @@ const sliceLastChar = (pdf, character) => {
* @returns {Buffer}
*/
const removeTrailingNewLine = pdf => {
const removeTrailingNewLine = (pdf) => {
if (!(pdf instanceof Buffer)) {
throw new _SignPdfError.default('PDF expected as Buffer.', _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default("PDF expected as Buffer.", _SignPdfError.default.TYPE_INPUT);
}
let output = pdf;
output = sliceLastChar(output, '\n');
output = sliceLastChar(output, '\r');
output = sliceLastChar(output, "\n");
output = sliceLastChar(output, "\r");
const lastLine = output.slice(output.length - 6).toString();
if (lastLine !== '\n%%EOF') {
throw new _SignPdfError.default('A PDF file must end with an EOF line.', _SignPdfError.default.TYPE_PARSE);
if (lastLine !== "\n%%EOF") {
throw new _SignPdfError.default(
"A PDF file must end with an EOF line.",
_SignPdfError.default.TYPE_PARSE
);
}
return output;
};
var _default = removeTrailingNewLine;
exports.default = _default;
exports.default = _default;

120
packages/signing/node-signpdf/dist/signpdf.js vendored
View File

@ -1,18 +1,18 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
value: true,
});
var _exportNames = {
SignPdf: true,
SignPdfError: true
SignPdfError: true,
};
exports.SignPdf = void 0;
Object.defineProperty(exports, "SignPdfError", {
enumerable: true,
get: function () {
return _SignPdfError.default;
}
},
});
exports.default = void 0;
@ -30,7 +30,7 @@ Object.keys(_helpers).forEach(function (key) {
enumerable: true,
get: function () {
return _helpers[key];
}
},
});
});
@ -44,11 +44,13 @@ Object.keys(_const).forEach(function (key) {
enumerable: true,
get: function () {
return _const[key];
}
},
});
});
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _interopRequireDefault(obj) {
return obj && obj.__esModule ? obj : { default: obj };
}
class SignPdf {
constructor() {
@ -59,77 +61,81 @@ class SignPdf {
sign(pdfBuffer, p12Buffer, additionalOptions = {}) {
const options = {
asn1StrictParsing: false,
passphrase: '',
...additionalOptions
passphrase: "",
...additionalOptions,
};
if (!(pdfBuffer instanceof Buffer)) {
throw new _SignPdfError.default('PDF expected as Buffer.', _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default("PDF expected as Buffer.", _SignPdfError.default.TYPE_INPUT);
}
if (!(p12Buffer instanceof Buffer)) {
throw new _SignPdfError.default('p12 certificate expected as Buffer.', _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default(
"p12 certificate expected as Buffer.",
_SignPdfError.default.TYPE_INPUT
);
}
let pdf = (0, _helpers.removeTrailingNewLine)(pdfBuffer); // Find the ByteRange placeholder.
const {
byteRangePlaceholder
} = (0, _helpers.findByteRange)(pdf);
const { byteRangePlaceholder } = (0, _helpers.findByteRange)(pdf);
if (!byteRangePlaceholder) {
throw new _SignPdfError.default(`Could not find empty ByteRange placeholder: ${byteRangePlaceholder}`, _SignPdfError.default.TYPE_PARSE);
throw new _SignPdfError.default(
`Could not find empty ByteRange placeholder: ${byteRangePlaceholder}`,
_SignPdfError.default.TYPE_PARSE
);
}
const byteRangePos = pdf.indexOf(byteRangePlaceholder); // Calculate the actual ByteRange that needs to replace the placeholder.
const byteRangeEnd = byteRangePos + byteRangePlaceholder.length;
const contentsTagPos = pdf.indexOf('/Contents ', byteRangeEnd);
const placeholderPos = pdf.indexOf('<', contentsTagPos);
const placeholderEnd = pdf.indexOf('>', placeholderPos);
const contentsTagPos = pdf.indexOf("/Contents ", byteRangeEnd);
const placeholderPos = pdf.indexOf("<", contentsTagPos);
const placeholderEnd = pdf.indexOf(">", placeholderPos);
const placeholderLengthWithBrackets = placeholderEnd + 1 - placeholderPos;
const placeholderLength = placeholderLengthWithBrackets - 2;
const byteRange = [0, 0, 0, 0];
byteRange[1] = placeholderPos;
byteRange[2] = byteRange[1] + placeholderLengthWithBrackets;
byteRange[3] = pdf.length - byteRange[2];
let actualByteRange = `/ByteRange [${byteRange.join(' ')}]`;
actualByteRange += ' '.repeat(byteRangePlaceholder.length - actualByteRange.length); // Replace the /ByteRange placeholder with the actual ByteRange
let actualByteRange = `/ByteRange [${byteRange.join(" ")}]`;
actualByteRange += " ".repeat(byteRangePlaceholder.length - actualByteRange.length); // Replace the /ByteRange placeholder with the actual ByteRange
pdf = Buffer.concat([pdf.slice(0, byteRangePos), Buffer.from(actualByteRange), pdf.slice(byteRangeEnd)]); // Remove the placeholder signature
pdf = Buffer.concat([pdf.slice(0, byteRange[1]), pdf.slice(byteRange[2], byteRange[2] + byteRange[3])]); // Convert Buffer P12 to a forge implementation.
const forgeCert = _nodeForge.default.util.createBuffer(p12Buffer.toString('binary'));
const forgeCert = _nodeForge.default.util.createBuffer(p12Buffer.toString("binary"));
const p12Asn1 = _nodeForge.default.asn1.fromDer(forgeCert);
const p12 = _nodeForge.default.pkcs12.pkcs12FromAsn1(p12Asn1, options.asn1StrictParsing, options.passphrase); // Extract safe bags by type.
const p12 = _nodeForge.default.pkcs12.pkcs12FromAsn1(
p12Asn1,
options.asn1StrictParsing,
options.passphrase
); // Extract safe bags by type.
// We will need all the certificates and the private key.
const certBags = p12.getBags({
bagType: _nodeForge.default.pki.oids.certBag
bagType: _nodeForge.default.pki.oids.certBag,
})[_nodeForge.default.pki.oids.certBag];
const keyBags = p12.getBags({
bagType: _nodeForge.default.pki.oids.pkcs8ShroudedKeyBag
bagType: _nodeForge.default.pki.oids.pkcs8ShroudedKeyBag,
})[_nodeForge.default.pki.oids.pkcs8ShroudedKeyBag];
const privateKey = keyBags[0].key; // Here comes the actual PKCS#7 signing.
const p7 = _nodeForge.default.pkcs7.createSignedData(); // Start off by setting the content.
p7.content = _nodeForge.default.util.createBuffer(pdf.toString('binary')); // Then add all the certificates (-cacerts & -clcerts)
p7.content = _nodeForge.default.util.createBuffer(pdf.toString("binary")); // Then add all the certificates (-cacerts & -clcerts)
// Keep track of the last found client certificate.
// This will be the public key that will be bundled in the signature.
let certificate;
Object.keys(certBags).forEach(i => {
const {
publicKey
} = certBags[i].cert;
Object.keys(certBags).forEach((i) => {
const { publicKey } = certBags[i].cert;
p7.addCertificate(certBags[i].cert); // Try to find the certificate that matches the private key.
if (privateKey.n.compareTo(publicKey.n) === 0 && privateKey.e.compareTo(publicKey.e) === 0) {
@ -137,57 +143,65 @@ class SignPdf {
}
});
if (typeof certificate === 'undefined') {
throw new _SignPdfError.default('Failed to find a certificate that matches the private key.', _SignPdfError.default.TYPE_INPUT);
if (typeof certificate === "undefined") {
throw new _SignPdfError.default(
"Failed to find a certificate that matches the private key.",
_SignPdfError.default.TYPE_INPUT
);
} // Add a sha256 signer. That's what Adobe.PPKLite adbe.pkcs7.detached expects.
p7.addSigner({
key: privateKey,
certificate,
digestAlgorithm: _nodeForge.default.pki.oids.sha256,
authenticatedAttributes: [{
type: _nodeForge.default.pki.oids.contentType,
value: _nodeForge.default.pki.oids.data
}, {
type: _nodeForge.default.pki.oids.signingTime,
// value can also be auto-populated at signing time
// We may also support passing this as an option to sign().
// Would be useful to match the creation time of the document for example.
value: new Date()
}, {
type: _nodeForge.default.pki.oids.messageDigest // value will be auto-populated at signing time
}]
authenticatedAttributes: [
{
type: _nodeForge.default.pki.oids.contentType,
value: _nodeForge.default.pki.oids.data,
},
{
type: _nodeForge.default.pki.oids.signingTime,
// value can also be auto-populated at signing time
// We may also support passing this as an option to sign().
// Would be useful to match the creation time of the document for example.
value: new Date(),
},
{
type: _nodeForge.default.pki.oids.messageDigest, // value will be auto-populated at signing time
},
],
}); // Sign in detached mode.
p7.sign({
detached: true
detached: true,
}); // Check if the PDF has a good enough placeholder to fit the signature.
const raw = _nodeForge.default.asn1.toDer(p7.toAsn1()).getBytes(); // placeholderLength represents the length of the HEXified symbols but we're
// checking the actual lengths.
if (raw.length * 2 > placeholderLength) {
throw new _SignPdfError.default(`Signature exceeds placeholder length: ${raw.length * 2} > ${placeholderLength}`, _SignPdfError.default.TYPE_INPUT);
throw new _SignPdfError.default(
`Signature exceeds placeholder length: ${raw.length * 2} > ${placeholderLength}`,
_SignPdfError.default.TYPE_INPUT
);
}
let signature = Buffer.from(raw, 'binary').toString('hex'); // Store the HEXified signature. At least useful in tests.
let signature = Buffer.from(raw, "binary").toString("hex"); // Store the HEXified signature. At least useful in tests.
this.lastSignature = signature; // Pad the signature with zeroes so the it is the same length as the placeholder
signature += Buffer.from(String.fromCharCode(0).repeat(placeholderLength / 2 - raw.length)).toString('hex'); // Place it in the document.
signature += Buffer.from(String.fromCharCode(0).repeat(placeholderLength / 2 - raw.length)).toString(
"hex"
); // Place it in the document.
pdf = Buffer.concat([pdf.slice(0, byteRange[1]), Buffer.from(`<${signature}>`), pdf.slice(byteRange[1])]); // Magic. Done.
return pdf;
}
}
exports.SignPdf = SignPdf;
var _default = new SignPdf();
exports.default = _default;
exports.default = _default;

26
packages/ui/components/breadcrumb/breadcrumb.tsx
View File

@ -1,23 +1,15 @@
import React from "react";
import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/20/solid";
import Link from "next/link";
import { ChevronLeftIcon, ChevronRightIcon } from "@heroicons/react/20/solid";
export function Breadcrumb(props: any) {
return (
<>
<nav className="sm:hidden" aria-label="Back">
<Link
href={
props.items.length > 1
? props.items[props.items.length - 2].href
: props.items[0].href
}
className="flex items-center text-sm font-medium text-gray-500 hover:text-gray-700"
>
<ChevronLeftIcon
className="-ml-1 mr-1 h-5 w-5 flex-shrink-0 text-gray-400"
aria-hidden="true"
/>
href={props.items.length > 1 ? props.items[props.items.length - 2].href : props.items[0].href}
className="flex items-center text-sm font-medium text-gray-500 hover:text-gray-700">
<ChevronLeftIcon className="-ml-1 mr-1 h-5 w-5 flex-shrink-0 text-gray-400" aria-hidden="true" />
Back
</Link>
</nav>
@ -26,19 +18,13 @@ export function Breadcrumb(props: any) {
{props?.items.map((item: any, index: number) => (
<React.Fragment key={item.href}>
{index > 0 ? (
<ChevronRightIcon
className="h-5 w-5 flex-shrink-0 text-gray-400"
aria-hidden="true"
/>
<ChevronRightIcon className="h-5 w-5 flex-shrink-0 text-gray-400" aria-hidden="true" />
) : (
""
)}
<li>
<div className="flex">
<Link
href={item.href}
className="text-sm font-medium text-gray-500 hover:text-gray-700"
>
<Link href={item.href} className="text-sm font-medium text-gray-500 hover:text-gray-700">
{item.title}
</Link>
</div>

23
packages/ui/components/button/Button.tsx
View File

@ -1,6 +1,6 @@
import { classNames } from "@documenso/lib";
import Link from "next/link";
import React from "react";
import Link from "next/link";
import { classNames } from "@documenso/lib";
export function Button(props: any) {
const isLink = typeof props.href !== "undefined" && !props.disabled;
@ -8,8 +8,7 @@ export function Button(props: any) {
const baseStyles =
"inline-flex items-center justify-center min-w-[80px] rounded-md border border-transparent px-4 py-2 text-sm font-medium shadow-sm disabled:bg-gray-300";
const primaryStyles = "text-white bg-neon hover:bg-neon-dark";
const secondaryStyles =
"border-gray-300 bg-white text-gray-700 hover:bg-gray-50";
const secondaryStyles = "border-gray-300 bg-white text-gray-700 hover:bg-gray-50";
return isLink ? (
<Link
@ -20,13 +19,9 @@ export function Button(props: any) {
color === "primary" ? primaryStyles : secondaryStyles,
props.className
)}
hidden={props.hidden}
>
hidden={props.hidden}>
{props.icon ? (
<props.icon
className="inline h-5 mr-1 text-inherit"
aria-hidden="true"
></props.icon>
<props.icon className="mr-1 inline h-5 text-inherit" aria-hidden="true"></props.icon>
) : (
""
)}
@ -43,13 +38,9 @@ export function Button(props: any) {
)}
onClick={props.onClick}
disabled={props.disabled || props.loading}
hidden={props.hidden}
>
hidden={props.hidden}>
{props.icon ? (
<props.icon
className="inline h-5 mr-1 text-inherit"
aria-hidden="true"
></props.icon>
<props.icon className="mr-1 inline h-5 text-inherit" aria-hidden="true"></props.icon>
) : (
""
)}

20
packages/ui/components/button/IconButton.tsx
View File

@ -1,6 +1,6 @@
import { classNames } from "@documenso/lib";
import Link from "next/link";
import React from "react";
import Link from "next/link";
import { classNames } from "@documenso/lib";
export function IconButton(props: any) {
const isLink = typeof props.href !== "undefined";
@ -18,13 +18,9 @@ export function IconButton(props: any) {
color === "primary" ? primaryStyles : secondaryStyles,
props.className
)}
hidden={props.hidden}
>
hidden={props.hidden}>
{props.icon ? (
<props.icon
className="inline text-inherit h-6 mr-1"
aria-hidden="true"
></props.icon>
<props.icon className="mr-1 inline h-6 text-inherit" aria-hidden="true"></props.icon>
) : (
""
)}
@ -40,13 +36,9 @@ export function IconButton(props: any) {
)}
onClick={props.onClick}
disabled={props.disabled}
hidden={props.hidden}
>
hidden={props.hidden}>
{props.icon ? (
<props.icon
className="inline text-inherit h-6 mr-1"
aria-hidden="true"
></props.icon>
<props.icon className="mr-1 inline h-6 text-inherit" aria-hidden="true"></props.icon>
) : (
""
)}

42
packages/ui/components/dialog/Dialog.tsx
View File

@ -1,8 +1,8 @@
import React from "react";
import { Transition, Dialog as DialogComponent } from "@headlessui/react";
import { Fragment } from "react";
import { Button } from "@documenso/ui";
import { sendSigningRequests } from "@documenso/lib/api";
import { Button } from "@documenso/ui";
import { Dialog as DialogComponent, Transition } from "@headlessui/react";
import { Document as PrismaDocument } from "@prisma/client";
type FormValue = {
@ -21,18 +21,8 @@ type DialogProps = {
icon: React.ReactNode;
};
export function Dialog({
title,
open,
setOpen,
document,
formValues,
setLoading,
icon,
}: DialogProps) {
const unsentEmailsLength = formValues.filter(
(s: any) => s.email && s.sendStatus != "SENT"
).length;
export function Dialog({ title, open, setOpen, document, formValues, setLoading, icon }: DialogProps) {
const unsentEmailsLength = formValues.filter((s: any) => s.email && s.sendStatus != "SENT").length;
return (
<Transition.Root show={open} as={Fragment}>
@ -44,13 +34,12 @@ export function Dialog({
enterTo="opacity-100"
leave="ease-in duration-200"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="fixed inset-0 transition-opacity bg-gray-500 bg-opacity-75" />
leaveTo="opacity-0">
<div className="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" />
</Transition.Child>
<div className="fixed inset-0 z-10 overflow-y-auto">
<div className="flex items-end justify-center min-h-full p-4 text-center sm:items-center sm:p-0">
<div className="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
<Transition.Child
as={Fragment}
enter="ease-out duration-300"
@ -58,18 +47,14 @@ export function Dialog({
enterTo="opacity-100 translate-y-0 sm:scale-100"
leave="ease-in duration-200"
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<DialogComponent.Panel className="relative px-4 pt-5 pb-4 overflow-hidden text-left transition-all transform bg-white rounded-lg shadow-xl sm:my-8 sm:w-full sm:max-w-lg sm:p-6">
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">
<DialogComponent.Panel className="relative transform overflow-hidden rounded-lg bg-white px-4 pt-5 pb-4 text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg sm:p-6">
<div>
<div className="flex items-center justify-center w-12 h-12 mx-auto bg-green-100 rounded-full">
<div className="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-green-100">
{icon}
</div>
<div className="mt-3 text-center sm:mt-5">
<DialogComponent.Title
as="h3"
className="text-lg font-medium leading-6 text-gray-900"
>
<DialogComponent.Title as="h3" className="text-lg font-medium leading-6 text-gray-900">
{title}
</DialogComponent.Title>
<div className="mt-2">
@ -79,7 +64,7 @@ export function Dialog({
</div>
</div>
</div>
<div className="flex justify-end gap-3 mt-5 sm:mt-6 sm:grid sm:grid-flow-row-dense sm:grid-cols-2 sm:flex-none ">
<div className="mt-5 flex justify-end gap-3 sm:mt-6 sm:grid sm:flex-none sm:grid-flow-row-dense sm:grid-cols-2 ">
<Button color="secondary" onClick={() => setOpen(false)}>
Cancel
</Button>
@ -90,8 +75,7 @@ export function Dialog({
sendSigningRequests(document).finally(() => {
setLoading(false);
});
}}
>
}}>
Send
</Button>
</div>

35
packages/ui/components/selectBox/SelectBox.tsx
View File

@ -1,7 +1,7 @@
import React, { Fragment, useState } from "react";
import { classNames } from "@documenso/lib";
import { Listbox, Transition } from "@headlessui/react";
import { CheckIcon, ChevronUpDownIcon } from "@heroicons/react/24/outline";
import React, { Fragment, useState } from "react";
export function SelectBox(props: any) {
return (
@ -10,21 +10,15 @@ export function SelectBox(props: any) {
value={props.value}
onChange={(e) => {
props.onChange(e);
}}
>
}}>
{({ open }) => (
<>
<Listbox.Label className="block text-sm font-medium text-gray-700">
{props.label}
</Listbox.Label>
<Listbox.Label className="block text-sm font-medium text-gray-700">{props.label}</Listbox.Label>
<div className="relative mt-1">
<Listbox.Button className="relative w-full cursor-default rounded-md border border-gray-300 bg-white py-2 pl-3 pr-10 text-left shadow-sm focus:border-neon focus:outline-none focus:ring-1 focus:ring-neon sm:text-sm">
<Listbox.Button className="focus:border-neon focus:ring-neon relative w-full cursor-default rounded-md border border-gray-300 bg-white py-2 pl-3 pr-10 text-left shadow-sm focus:outline-none focus:ring-1 sm:text-sm">
<span className="block truncate">{props?.value?.label}</span>
<span className="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2">
<ChevronUpDownIcon
className="h-5 w-5 text-gray-400"
aria-hidden="true"
/>
<ChevronUpDownIcon className="h-5 w-5 text-gray-400" aria-hidden="true" />
</span>
</Listbox.Button>
@ -33,28 +27,25 @@ export function SelectBox(props: any) {
as={Fragment}
leave="transition ease-in duration-100"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
leaveTo="opacity-0">
<Listbox.Options className="absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm">
{props.options.map((option: any) => (
<Listbox.Option
key={option.value}
className={({ active }) =>
classNames(
active ? "text-white bg-neon" : "text-gray-900",
active ? "bg-neon text-white" : "text-gray-900",
"relative cursor-default select-none py-2 pl-3 pr-9"
)
}
value={option}
>
value={option}>
{({ selected, active }) => (
<>
<span
className={classNames(
selected ? "font-semibold" : "font-normal",
"block truncate"
)}
>
)}>
{option.label}
</span>
@ -63,12 +54,8 @@ export function SelectBox(props: any) {
className={classNames(
active ? "text-white" : "text-neon",
"absolute inset-y-0 right-0 flex items-center pr-4"
)}
>
<CheckIcon
className="h-5 w-5"
aria-hidden="true"
/>
)}>
<CheckIcon className="h-5 w-5" aria-hidden="true" />
</span>
) : null}
</>