From 7babaa39b522a3b57c44a9ab26be05a85c723573 Mon Sep 17 00:00:00 2001
From: Timur Ercan <timur.ercan31@gmail.com>
Date: Fri, 24 Feb 2023 11:11:06 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=A7=B9=E2=9C=A8=20Resend=20Signing=20Requ?=
 =?UTF-8?q?est=20UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/pages/documents.tsx                 | 18 ++++-----
 apps/web/pages/documents/[id]/recipients.tsx | 39 ++++++++++++++------
 packages/lib/mail/sendSigningRequest.ts      |  4 +-
 3 files changed, 37 insertions(+), 24 deletions(-)

diff --git a/apps/web/pages/documents.tsx b/apps/web/pages/documents.tsx
index d478cc231..b1282a7f6 100644
--- a/apps/web/pages/documents.tsx
+++ b/apps/web/pages/documents.tsx
@@ -23,7 +23,7 @@ import { NextPageContext } from "next";
 const DocumentsPage: NextPageWithLayout = (props: any) => {
   const router = useRouter();
   const [documents, setDocuments]: any[] = useState([]);
-  const [filterdDocuments, setFilteredDocuments] = useState([]);
+  const [filteredDocuments, setFilteredDocuments] = useState([]);
 
   const [loading, setLoading] = useState(true);
   const statusFilters = [
@@ -138,8 +138,8 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
         </div>
         <div className="mt-3 mb-12">
           <div className="w-fit block float-right ml-3 mt-7">
-            {filterdDocuments.length != 1
-              ? filterdDocuments.length + " Documents"
+            {filteredDocuments.length != 1
+              ? filteredDocuments.length + " Documents"
               : "1 Document"}
           </div>
           <SelectBox
@@ -220,7 +220,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
                     </tr>
                   </thead>
                   <tbody className="divide-y divide-gray-200 bg-white">
-                    {filterdDocuments.map((document: any, index: number) => (
+                    {filteredDocuments.map((document: any, index: number) => (
                       <tr
                         key={document.id}
                         className="hover:bg-gray-100 cursor-pointer"
@@ -330,9 +330,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
                                 event.stopPropagation();
                                 router.push("/documents/" + document.id);
                               }}
-                            >
-                              Edit
-                            </IconButton>
+                            />
                             <IconButton
                               icon={ArrowDownTrayIcon}
                               className="mr-2"
@@ -341,9 +339,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
                                 event.stopPropagation();
                                 router.push("/api/documents/" + document.id);
                               }}
-                            >
-                              Download
-                            </IconButton>
+                            />
                             <IconButton
                               icon={TrashIcon}
                               onClick={(event: any) => {
@@ -384,7 +380,7 @@ const DocumentsPage: NextPageWithLayout = (props: any) => {
                 </table>
               </div>
               <div
-                hidden={filterdDocuments.length > 0}
+                hidden={filteredDocuments.length > 0}
                 className="mx-auto w-fit mt-12 p-3"
               >
                 <FunnelIcon className="w-5 inline mr-1 align-middle" /> Nothing
diff --git a/apps/web/pages/documents/[id]/recipients.tsx b/apps/web/pages/documents/[id]/recipients.tsx
index 5e079e326..7a0893427 100644
--- a/apps/web/pages/documents/[id]/recipients.tsx
+++ b/apps/web/pages/documents/[id]/recipients.tsx
@@ -10,8 +10,8 @@ import {
   EnvelopeIcon,
   PaperAirplaneIcon,
   PencilSquareIcon,
+  TrashIcon,
   UserPlusIcon,
-  XMarkIcon,
 } from "@heroicons/react/24/outline";
 import { getUserFromToken } from "@documenso/lib/server";
 import { getDocument } from "@documenso/lib/query";
@@ -236,9 +236,30 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
                       )}
                     </div>
                   </div>
-                  <div className="ml-auto flex">
+                  <div className="ml-auto flex mr-1">
                     <IconButton
-                      icon={XMarkIcon}
+                      icon={PaperAirplaneIcon}
+                      disabled={
+                        !item.id ||
+                        item.sendStatus !== "SENT" ||
+                        item.signingStatus === "SIGNED" ||
+                        loading
+                      }
+                      color="secondary"
+                      className="mr-4 h-9 my-auto"
+                      onClick={() => {
+                        if (confirm("Resend this signing request?")) {
+                          setLoading(true);
+                          send(props.document, [item.id]).finally(() => {
+                            setLoading(false);
+                          });
+                        }
+                      }}
+                    >
+                      Resend
+                    </IconButton>
+                    <IconButton
+                      icon={TrashIcon}
                       disabled={
                         !item.id || item.sendStatus === "SENT" || loading
                       }
@@ -254,7 +275,7 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
                         });
                       }}
                       className="group-hover:text-neon-dark group-hover:disabled:text-gray-400"
-                    ></IconButton>
+                    />
                   </div>
                 </div>
               </li>
@@ -445,17 +466,13 @@ export async function getServerSideProps(context: any) {
   };
 }
 
-async function send(document: any) {
-  // todo toast
-  // loading
+async function send(document: any, resendTo: number[] = []) {
   if (!document || !document.id) return;
   try {
     const sent = await toast.promise(
       fetch(`/api/documents/${document.id}/send`, {
-        body: "",
-        headers: {
-          "Content-Type": "application/json",
-        },
+        body: JSON.stringify({ resendTo: resendTo }),
+        headers: { "Content-Type": "application/json" },
         method: "POST",
       })
         .then((res: any) => {
diff --git a/packages/lib/mail/sendSigningRequest.ts b/packages/lib/mail/sendSigningRequest.ts
index ec91f5fce..d042b9a82 100644
--- a/packages/lib/mail/sendSigningRequest.ts
+++ b/packages/lib/mail/sendSigningRequest.ts
@@ -1,6 +1,6 @@
 import prisma from "@documenso/prisma";
 import { sendMail } from "./sendMail";
-import { SendStatus, DocumentStatus } from "@prisma/client";
+import { SendStatus, ReadStatus, DocumentStatus } from "@prisma/client";
 import { NEXT_PUBLIC_WEBAPP_URL } from "../constants";
 import { signingRequestTemplate } from "@documenso/lib/mail";
 
@@ -27,7 +27,7 @@ export const sendSigningRequest = async (
     where: {
       id: recipient.id,
     },
-    data: { sendStatus: SendStatus.SENT },
+    data: { sendStatus: SendStatus.SENT, readStatus: ReadStatus.NOT_OPENED },
   });
 
   await prisma.document.update({