diff --git a/apps/web/pages/api/documents/[id]/send.ts b/apps/web/pages/api/documents/[id]/send.ts
index c39e1ae4a..d5a7b7783 100644
--- a/apps/web/pages/api/documents/[id]/send.ts
+++ b/apps/web/pages/api/documents/[id]/send.ts
@@ -19,10 +19,18 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
     return;
   }
 
-  let document = await prisma.document.findFirst({
+  const document = await prisma.document.findFirstOrThrow({
     where: {
       id: +documentId,
     },
+    include: {
+      User: {
+        select: {
+          name: true,
+        },
+      },
+      Recipient: true,
+    },
   });
 
   if (!document)
@@ -35,14 +43,17 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
   });
 
   (await recipients).forEach(async (recipient) => {
-    sendSigningRequestMail(recipient, document);
-    await prisma.recipient.update({
-      where: { id: recipient.id },
+    await sendSigningRequestMail(recipient, document);
+    await prisma.recipient.updateMany({
+      where: {
+        id: recipient.id,
+        sendStatus: SendStatus.NOT_SENT,
+      },
       data: { sendStatus: SendStatus.SENT },
     });
   });
 
-  res.status(200);
+  return res.status(200).end();
 }
 
 export default defaultHandler({
diff --git a/apps/web/pages/api/documents/[id]/sign.ts b/apps/web/pages/api/documents/[id]/sign.ts
index bae6ecd71..2e5234d96 100644
--- a/apps/web/pages/api/documents/[id]/sign.ts
+++ b/apps/web/pages/api/documents/[id]/sign.ts
@@ -5,32 +5,45 @@ import {
 } from "@documenso/lib/server";
 import prisma from "@documenso/prisma";
 import { NextApiRequest, NextApiResponse } from "next";
+import { SigningStatus } from "@prisma/client";
 
 async function postHandler(req: NextApiRequest, res: NextApiResponse) {
   const existingUser = await getUserFromToken(req, res);
-  const { id: documentId } = req.query;
   const { token: recipientToken } = req.query;
 
-  if (!documentId) {
-    res.status(400).send("Missing parameter documentId.");
+  if (!recipientToken) {
+    res.status(401).send("Missing recipient token.");
+    return;
+  }
+
+  const recipient = await prisma.recipient.findFirstOrThrow({
+    where: { token: recipientToken?.toString() },
+  });
+
+  if (!recipient) {
+    res.status(401).send("Recipient not found.");
     return;
   }
 
   let document = await prisma.document.findFirst({
     where: {
-      id: +documentId,
+      id: recipient.documentId,
     },
   });
 
-  if (!document)
-    res.status(404).end(`No document with id ${documentId} found.`);
+  if (!document) res.status(404).end(`No document found.`);
 
-  const recipients = prisma.recipient.findMany({
-    where: { documentId: +documentId },
+  // todo sign ui
+
+  await prisma.recipient.update({
+    where: {
+      id: recipient.id,
+    },
+    data: {
+      signingStatus: SigningStatus.SIGNED,
+    },
   });
 
-  // todo sign stuff
-
   return res.status(200).end();
 }
 
diff --git a/apps/web/pages/documents/[id].tsx b/apps/web/pages/documents/[id]/index.tsx
similarity index 79%
rename from apps/web/pages/documents/[id].tsx
rename to apps/web/pages/documents/[id]/index.tsx
index f075993ed..3bdb71e24 100644
--- a/apps/web/pages/documents/[id].tsx
+++ b/apps/web/pages/documents/[id]/index.tsx
@@ -1,12 +1,12 @@
 import { ReactElement, useEffect } from "react";
-import Layout from "../../components/layout";
-import { NextPageWithLayout } from "../_app";
+import Layout from "../../../components/layout";
+import { NextPageWithLayout } from "../../_app";
 import { Document, Page, pdfjs } from "react-pdf";
 import dynamic from "next/dynamic";
 import { useRouter } from "next/router";
 import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib";
 
-const PDFViewer = dynamic(() => import("../../components/pdf-viewer"), {
+const PDFViewer = dynamic(() => import("../../../components/pdf-viewer"), {
   ssr: false,
 });
 
diff --git a/apps/web/pages/documents/[id]/sign.tsx b/apps/web/pages/documents/[id]/sign.tsx
new file mode 100644
index 000000000..4563926fd
--- /dev/null
+++ b/apps/web/pages/documents/[id]/sign.tsx
@@ -0,0 +1,22 @@
+import Head from "next/head";
+import { ReactElement } from "react";
+import Layout from "../../../components/layout";
+import Logo from "../../../components/logo";
+import { NextPageWithLayout } from "../../_app";
+
+const SignPage: NextPageWithLayout = () => {
+  return (
+    <>
+      <Head>
+        <title>Sign | Documenso</title>
+      </Head>
+      Hello, please sign at the dotted line.
+    </>
+  );
+};
+
+SignPage.getLayout = function getLayout(page: ReactElement) {
+  return <Layout>{page}</Layout>;
+};
+
+export default SignPage;
diff --git a/packages/lib/mail/sendMail.ts b/packages/lib/mail/sendMail.ts
index 1c9b314e0..b7d27f2c2 100644
--- a/packages/lib/mail/sendMail.ts
+++ b/packages/lib/mail/sendMail.ts
@@ -16,7 +16,7 @@ export const sendMail = async (
   );
 
   await transport.sendMail({
-    from: process.env.SENDGRID_API_KEY,
+    from: process.env.MAIL_FROM,
     to: to,
     subject: subject,
     html: htmlFormattedMessage,
diff --git a/packages/lib/mail/sendSignedMail.ts b/packages/lib/mail/sendSignedMail.ts
index bbed16a9b..e0de3d80f 100644
--- a/packages/lib/mail/sendSignedMail.ts
+++ b/packages/lib/mail/sendSignedMail.ts
@@ -3,8 +3,7 @@ import { NEXT_PUBLIC_WEBAPP_URL } from "@documenso/lib/constants";
 
 export const sendSignedMail = async (document: any, recipient: any) => {
   // todo check if recipient has an account
-
-  sendMail(
+  await sendMail(
     document.user.email,
     `${recipient.email} signed ${document.title}`,
     `Hi ${document.user.name}, ${recipient.email} has signed your document ${document.title}. Click <a href="${NEXT_PUBLIC_WEBAPP_URL}/document/${document.id}"> VIEW DOCUMENT</a> to view it now.`
diff --git a/packages/lib/mail/sendSigningRequestMail.ts b/packages/lib/mail/sendSigningRequestMail.ts
index 23942e9ff..c9544ec3e 100644
--- a/packages/lib/mail/sendSigningRequestMail.ts
+++ b/packages/lib/mail/sendSigningRequestMail.ts
@@ -1,9 +1,8 @@
 import { sendMail } from "./sendMail";
-
 export const sendSigningRequestMail = async (recipient: any, document: any) => {
-  sendMail(
+  await sendMail(
     recipient.email,
     `Please sign ${document.title}`,
-    `${document.user.name} has sent you a document to sign. Click <b><a href="https">SIGN DOCUMENT</a></b> to sign it now.`
+    `${document.User.name} has sent you a document to sign. Click <b><a href="${process.env.NEXT_PUBLIC_WEBAPP_URL}/documents/${document.id}/sign">SIGN DOCUMENT</a></b> to sign it now.`
   );
 };