🚸 ✨ Associate recipients to fields, improved flow

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

@@ -30,6 +30,7 @@ async function getHandler(req: NextApiRequest, res: NextApiResponse) {
 
   const fields = await prisma.field.findMany({
     where: { documentId: +documentId },
+    include: { Recipient: true },
   });
 
   return res.status(200).end(JSON.stringify(fields));
@@ -44,6 +45,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
     page: number;
     positionX: number;
     positionY: number;
+    Recipient: { id: number };
   } = req.body;
 
   if (!user) return;
@@ -69,6 +71,7 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
       page: +body.page,
       positionX: +body.positionX,
       positionY: +body.positionY,
+      recipientId: body.Recipient.id,
     },
     create: {
       documentId: +documentId,
@@ -76,6 +79,11 @@ async function postHandler(req: NextApiRequest, res: NextApiResponse) {
       page: +body.page,
       positionX: +body.positionX,
       positionY: +body.positionY,
+      // todo refactor only one type of recipientId
+      recipientId: body.Recipient.id,
+    },
+    include: {
+      Recipient: true,
     },
   });
 

apps/web/pages/documents/[id]/index.tsx

@@ -9,6 +9,7 @@ import { DocumentStatus } from "@prisma/client";
 import {
   InformationCircleIcon,
   PaperAirplaneIcon,
+  UserPlusIcon,
   UsersIcon,
 } from "@heroicons/react/24/outline";
 import { getDocument } from "@documenso/lib/query";
@@ -66,7 +67,6 @@ const DocumentsDetailPage: NextPageWithLayout = (props: any) => {
           <div className="mt-4 flex flex-shrink-0 md:mt-0 md:ml-4">
             <Button
               icon={PaperAirplaneIcon}
-              disabled={(props?.document?.Recipient?.length || 0) === 0}
               className="ml-3"
               href={
                 NEXT_PUBLIC_WEBAPP_URL +

apps/web/pages/documents/[id]/recipients.tsx

@@ -8,6 +8,7 @@ import {
   CheckIcon,
   EnvelopeIcon,
   PaperAirplaneIcon,
+  PencilSquareIcon,
   UserPlusIcon,
   XMarkIcon,
 } from "@heroicons/react/24/outline";
@@ -62,6 +63,14 @@ const RecipientsPage: NextPageWithLayout = (props: any) => {
             </h2>
           </div>
           <div className="mt-4 flex flex-shrink-0 md:mt-0 md:ml-4">
+            <Button
+              icon={PencilSquareIcon}
+              color="secondary"
+              className="mr-2"
+              href={breadcrumbItems[1].href}
+            >
+              Customize Document
+            </Button>
             <Button
               className="min-w-[125px]"
               color="primary"