Files
sign/apps/web/pages/documents/[id]/signed.tsx

111 lines
3.1 KiB
TypeScript
Raw Normal View History

2023-02-17 13:37:28 +01:00
import prisma from "@documenso/prisma";
import Head from "next/head";
import { NextPageWithLayout } from "../../_app";
2023-02-21 12:10:04 +01:00
import { ArrowDownTrayIcon, CheckBadgeIcon } from "@heroicons/react/24/outline";
import { Button, IconButton } from "@documenso/ui";
2023-02-17 14:22:51 +01:00
import Link from "next/link";
2023-02-21 12:10:04 +01:00
import { useRouter } from "next/router";
2023-02-17 13:37:28 +01:00
const SignPage: NextPageWithLayout = (props: any) => {
2023-02-21 12:10:04 +01:00
const router = useRouter();
const allRecipientsSigned = props.document.Recipient?.every(
(r: any) => r.signingStatus === "SIGNED"
);
2023-02-17 13:37:28 +01:00
return (
<>
<Head>
<title>Sign | Documenso</title>
</Head>
2023-02-17 14:22:51 +01:00
<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>
2023-02-21 12:10:04 +01:00
<p
className="mt-2 text-base text-gray-500 max-w-sm"
hidden={allRecipientsSigned}
>
2023-02-17 14:22:51 +01:00
You will be notfied when all recipients have signed.
</p>
2023-02-21 12:10:04 +01:00
<p
className="mt-2 text-base text-gray-500 max-w-sm"
hidden={!allRecipientsSigned}
>
All recipients signed.
</p>
<div
className="mx-auto w-fit text-xl pt-20"
hidden={!allRecipientsSigned}
>
<Button
icon={ArrowDownTrayIcon}
color="secondary"
onClick={(event: any) => {
event.preventDefault();
event.stopPropagation();
router.push("/api/documents/" + props.document.id);
}}
>
2023-02-21 15:58:45 +01:00
Download "{props.document.title}"
2023-02-21 12:10:04 +01:00
</Button>
</div>
2023-02-17 14:22:51 +01:00
</div>
<div>
<div className="relative mx-96">
<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>
</div>
</div>
<p className="mt-4 text-center text-sm text-gray-600">
Want to send slick signing links like this one?{" "}
<Link
href="/signup?source=signed"
className="font-medium text-neon hover:text-neon"
>
2023-02-17 14:22:51 +01:00
Create your own Account
</Link>
</p>
2023-02-17 13:37:28 +01:00
</>
);
};
export async function getServerSideProps(context: any) {
const recipientToken: string = context.query["token"];
const recipient = await prisma.recipient.findFirstOrThrow({
where: {
token: recipientToken,
},
include: {
2023-02-21 12:10:04 +01:00
Document: { include: { Recipient: true } },
2023-02-17 13:37:28 +01:00
},
});
const fields = await prisma.field.findMany({
where: {
documentId: recipient.Document.id,
},
include: {
Recipient: true,
},
});
return {
props: {
2023-02-24 09:24:31 +01:00
document: JSON.parse(JSON.stringify(recipient.Document)),
2023-02-24 15:59:19 +01:00
fields: JSON.parse(JSON.stringify(fields)),
2023-02-17 13:37:28 +01:00
},
};
}
export default SignPage;