fix: enforce users to have stripe account (#1131)

## Description

Currently users who sign in via Google SSO do not get assigned a Stripe
customer account.

This enforces the Stripe customer requirement on sign in.

There might be a better place to put this so it's open to any
suggestions.

apps/web/src/app/(dashboard)/documents/[id]/document-page-view.tsx

@@ -8,6 +8,7 @@ import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
 import { getServerComponentFlag } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
+import { getCompletedFieldsForDocument } from '@documenso/lib/server-only/field/get-completed-fields-for-document';
 import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
 import { symmetricDecrypt } from '@documenso/lib/universal/crypto';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
@@ -20,6 +21,7 @@ import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 
 import { StackAvatarsWithTooltip } from '~/components/(dashboard)/avatar/stack-avatars-with-tooltip';
 import { DocumentHistorySheet } from '~/components/document/document-history-sheet';
+import { DocumentReadOnlyFields } from '~/components/document/document-read-only-fields';
 import {
   DocumentStatus as DocumentStatusComponent,
   FRIENDLY_STATUS_MAP,
@@ -84,11 +86,16 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
     documentMeta.password = securePassword;
   }
 
-  const recipients = await getRecipientsForDocument({
-    documentId,
-    teamId: team?.id,
-    userId: user.id,
-  });
+  const [recipients, completedFields] = await Promise.all([
+    getRecipientsForDocument({
+      documentId,
+      teamId: team?.id,
+      userId: user.id,
+    }),
+    getCompletedFieldsForDocument({
+      documentId,
+    }),
+  ]);
 
   const documentWithRecipients = {
     ...document,
@@ -155,6 +162,13 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
           </CardContent>
         </Card>
 
+        {document.status === DocumentStatus.PENDING && (
+          <DocumentReadOnlyFields
+            fields={completedFields}
+            documentMeta={document.documentMeta || undefined}
+          />
+        )}
+
         <div className="col-span-12 lg:col-span-6 xl:col-span-5">
           <div className="space-y-6">
             <section className="border-border bg-widget flex flex-col rounded-xl border pb-4 pt-6">

apps/web/src/app/(dashboard)/documents/[id]/edit-document.tsx

@@ -224,10 +224,6 @@ export const EditDocumentForm = ({
     }
   };
 
-  const setSubjectFormFields = (subject?: string, message?: string) => {
-    // Add functionality here
-  };
-
   const onAddFieldsFormSubmit = async (data: TAddFieldsFormSchema) => {
     try {
       await addFields({
@@ -363,7 +359,6 @@ export const EditDocumentForm = ({
               fields={fields}
               onSubmit={onAddSubjectFormSubmit}
               isDocumentPdfLoaded={isDocumentPdfLoaded}
-              setSubjectFormFields={setSubjectFormFields}
             />
           </Stepper>
         </DocumentFlowFormContainer>

apps/web/src/app/(dashboard)/documents/[id]/logs/document-logs-page-view.tsx

@@ -133,7 +133,11 @@ export const DocumentLogsPageView = async ({ params, team }: DocumentLogsPageVie
         </div>
 
         <div className="mt-4 flex w-full flex-row sm:mt-0 sm:w-auto sm:self-end">
-          <DownloadCertificateButton className="mr-2" documentId={document.id} />
+          <DownloadCertificateButton
+            className="mr-2"
+            documentId={document.id}
+            documentStatus={document.status}
+          />
 
           <DownloadAuditLogButton documentId={document.id} />
         </div>

apps/web/src/app/(dashboard)/documents/[id]/logs/download-certificate-button.tsx

@@ -2,6 +2,7 @@
 
 import { DownloadIcon } from 'lucide-react';
 
+import { DocumentStatus } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
@@ -10,11 +11,13 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 export type DownloadCertificateButtonProps = {
   className?: string;
   documentId: number;
+  documentStatus: DocumentStatus;
 };
 
 export const DownloadCertificateButton = ({
   className,
   documentId,
+  documentStatus,
 }: DownloadCertificateButtonProps) => {
   const { toast } = useToast();
 
@@ -69,6 +72,7 @@ export const DownloadCertificateButton = ({
       className={cn('w-full sm:w-auto', className)}
       loading={isLoading}
       variant="outline"
+      disabled={documentStatus !== DocumentStatus.COMPLETED}
       onClick={() => void onDownloadCertificatesClick()}
     >
       {!isLoading && <DownloadIcon className="mr-1.5 h-4 w-4" />}

apps/web/src/app/(signing)/sign/[token]/page.tsx

@@ -6,6 +6,7 @@ import { getServerComponentSession } from '@documenso/lib/next-auth/get-server-c
 import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
 import { isRecipientAuthorized } from '@documenso/lib/server-only/document/is-recipient-authorized';
 import { viewedDocument } from '@documenso/lib/server-only/document/viewed-document';
+import { getCompletedFieldsForToken } from '@documenso/lib/server-only/field/get-completed-fields-for-token';
 import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
 import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { getRecipientSignatures } from '@documenso/lib/server-only/recipient/get-recipient-signatures';
@@ -37,7 +38,7 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
 
   const requestMetadata = extractNextHeaderRequestMetadata(requestHeaders);
 
-  const [document, fields, recipient] = await Promise.all([
+  const [document, fields, recipient, completedFields] = await Promise.all([
     getDocumentAndSenderByToken({
       token,
       userId: user?.id,
@@ -45,6 +46,7 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
     }).catch(() => null),
     getFieldsForToken({ token }),
     getRecipientByToken({ token }).catch(() => null),
+    getCompletedFieldsForToken({ token }),
   ]);
 
   if (
@@ -125,7 +127,12 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
       signature={user?.email === recipient.email ? user.signature : undefined}
     >
       <DocumentAuthProvider document={document} recipient={recipient} user={user}>
-        <SigningPageView recipient={recipient} document={document} fields={fields} />
+        <SigningPageView
+          recipient={recipient}
+          document={document}
+          fields={fields}
+          completedFields={completedFields}
+        />
       </DocumentAuthProvider>
     </SigningProvider>
   );

apps/web/src/app/(signing)/sign/[token]/signing-page-view.tsx

@@ -4,12 +4,14 @@ import { DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-form
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
 import type { DocumentAndSender } from '@documenso/lib/server-only/document/get-document-by-token';
+import type { CompletedField } from '@documenso/lib/types/fields';
 import type { Field, Recipient } from '@documenso/prisma/client';
 import { FieldType, RecipientRole } from '@documenso/prisma/client';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 
+import { DocumentReadOnlyFields } from '~/components/document/document-read-only-fields';
 import { truncateTitle } from '~/helpers/truncate-title';
 
 import { DateField } from './date-field';
@@ -23,9 +25,15 @@ export type SigningPageViewProps = {
   document: DocumentAndSender;
   recipient: Recipient;
   fields: Field[];
+  completedFields: CompletedField[];
 };
 
-export const SigningPageView = ({ document, recipient, fields }: SigningPageViewProps) => {
+export const SigningPageView = ({
+  document,
+  recipient,
+  fields,
+  completedFields,
+}: SigningPageViewProps) => {
   const truncatedTitle = truncateTitle(document.title);
 
   const { documentData, documentMeta } = document;
@@ -70,6 +78,8 @@ export const SigningPageView = ({ document, recipient, fields }: SigningPageView
         </div>
       </div>
 
+      <DocumentReadOnlyFields fields={completedFields} />
+
       <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
         {fields.map((field) =>
           match(field.type)

apps/web/src/app/(unauthenticated)/articles/signature-disclosure/page.tsx

@@ -5,7 +5,7 @@ import { Button } from '@documenso/ui/primitives/button';
 export default function SignatureDisclosure() {
   return (
     <div>
-      <article className="prose">
+      <article className="prose dark:prose-invert">
         <h1>Electronic Signature Disclosure</h1>
 
         <h2>Welcome</h2>

apps/web/src/components/(dashboard)/avatar/stack-avatars-with-tooltip.tsx

@@ -1,12 +1,10 @@
 'use client';
 
-import { useRef, useState } from 'react';
-
 import { getRecipientType } from '@documenso/lib/client-only/recipient-type';
 import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
 import { recipientAbbreviation } from '@documenso/lib/utils/recipient-formatter';
 import type { DocumentStatus, Recipient } from '@documenso/prisma/client';
-import { Popover, PopoverContent, PopoverTrigger } from '@documenso/ui/primitives/popover';
+import { PopoverHover } from '@documenso/ui/primitives/popover';
 
 import { AvatarWithRecipient } from './avatar-with-recipient';
 import { StackAvatar } from './stack-avatar';
@@ -25,11 +23,6 @@ export const StackAvatarsWithTooltip = ({
   position,
   children,
 }: StackAvatarsWithTooltipProps) => {
-  const [open, setOpen] = useState(false);
-
-  const isControlled = useRef(false);
-  const isMouseOverTimeout = useRef<NodeJS.Timeout | null>(null);
-
   const waitingRecipients = recipients.filter(
     (recipient) => getRecipientType(recipient) === 'waiting',
   );
@@ -46,117 +39,74 @@ export const StackAvatarsWithTooltip = ({
     (recipient) => getRecipientType(recipient) === 'unsigned',
   );
 
-  const onMouseEnter = () => {
-    if (isMouseOverTimeout.current) {
-      clearTimeout(isMouseOverTimeout.current);
-    }
-
-    if (isControlled.current) {
-      return;
-    }
-
-    isMouseOverTimeout.current = setTimeout(() => {
-      setOpen((o) => (!o ? true : o));
-    }, 200);
-  };
-
-  const onMouseLeave = () => {
-    if (isMouseOverTimeout.current) {
-      clearTimeout(isMouseOverTimeout.current);
-    }
-
-    if (isControlled.current) {
-      return;
-    }
-
-    setTimeout(() => {
-      setOpen((o) => (o ? false : o));
-    }, 200);
-  };
-
-  const onOpenChange = (newOpen: boolean) => {
-    isControlled.current = newOpen;
-
-    setOpen(newOpen);
-  };
-
   return (
-    <Popover open={open} onOpenChange={onOpenChange}>
-      <PopoverTrigger
-        className="flex cursor-pointer"
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-      >
-        {children || <StackAvatars recipients={recipients} />}
-      </PopoverTrigger>
-
-      <PopoverContent
-        side={position}
-        onMouseEnter={onMouseEnter}
-        onMouseLeave={onMouseLeave}
-        className="flex flex-col gap-y-5 py-2"
-      >
-        {completedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Completed</h1>
-            {completedRecipients.map((recipient: Recipient) => (
-              <div key={recipient.id} className="my-1 flex items-center gap-2">
-                <StackAvatar
-                  first={true}
-                  key={recipient.id}
-                  type={getRecipientType(recipient)}
-                  fallbackText={recipientAbbreviation(recipient)}
-                />
-                <div className="">
-                  <p className="text-muted-foreground text-sm">{recipient.email}</p>
-                  <p className="text-muted-foreground/70 text-xs">
-                    {RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName}
-                  </p>
-                </div>
+    <PopoverHover
+      trigger={children || <StackAvatars recipients={recipients} />}
+      contentProps={{
+        className: 'flex flex-col gap-y-5 py-2',
+        side: position,
+      }}
+    >
+      {completedRecipients.length > 0 && (
+        <div>
+          <h1 className="text-base font-medium">Completed</h1>
+          {completedRecipients.map((recipient: Recipient) => (
+            <div key={recipient.id} className="my-1 flex items-center gap-2">
+              <StackAvatar
+                first={true}
+                key={recipient.id}
+                type={getRecipientType(recipient)}
+                fallbackText={recipientAbbreviation(recipient)}
+              />
+              <div className="">
+                <p className="text-muted-foreground text-sm">{recipient.email}</p>
+                <p className="text-muted-foreground/70 text-xs">
+                  {RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName}
+                </p>
               </div>
-            ))}
-          </div>
-        )}
+            </div>
+          ))}
+        </div>
+      )}
 
-        {waitingRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Waiting</h1>
-            {waitingRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient
-                key={recipient.id}
-                recipient={recipient}
-                documentStatus={documentStatus}
-              />
-            ))}
-          </div>
-        )}
+      {waitingRecipients.length > 0 && (
+        <div>
+          <h1 className="text-base font-medium">Waiting</h1>
+          {waitingRecipients.map((recipient: Recipient) => (
+            <AvatarWithRecipient
+              key={recipient.id}
+              recipient={recipient}
+              documentStatus={documentStatus}
+            />
+          ))}
+        </div>
+      )}
 
-        {openedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Opened</h1>
-            {openedRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient
-                key={recipient.id}
-                recipient={recipient}
-                documentStatus={documentStatus}
-              />
-            ))}
-          </div>
-        )}
+      {openedRecipients.length > 0 && (
+        <div>
+          <h1 className="text-base font-medium">Opened</h1>
+          {openedRecipients.map((recipient: Recipient) => (
+            <AvatarWithRecipient
+              key={recipient.id}
+              recipient={recipient}
+              documentStatus={documentStatus}
+            />
+          ))}
+        </div>
+      )}
 
-        {uncompletedRecipients.length > 0 && (
-          <div>
-            <h1 className="text-base font-medium">Uncompleted</h1>
-            {uncompletedRecipients.map((recipient: Recipient) => (
-              <AvatarWithRecipient
-                key={recipient.id}
-                recipient={recipient}
-                documentStatus={documentStatus}
-              />
-            ))}
-          </div>
-        )}
-      </PopoverContent>
-    </Popover>
+      {uncompletedRecipients.length > 0 && (
+        <div>
+          <h1 className="text-base font-medium">Uncompleted</h1>
+          {uncompletedRecipients.map((recipient: Recipient) => (
+            <AvatarWithRecipient
+              key={recipient.id}
+              recipient={recipient}
+              documentStatus={documentStatus}
+            />
+          ))}
+        </div>
+      )}
+    </PopoverHover>
   );
 };

apps/web/src/components/document/document-read-only-fields.tsx

@@ -0,0 +1,112 @@
+'use client';
+
+import { useState } from 'react';
+
+import { P, match } from 'ts-pattern';
+
+import {
+  DEFAULT_DOCUMENT_DATE_FORMAT,
+  convertToLocalSystemFormat,
+} from '@documenso/lib/constants/date-formats';
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
+import type { CompletedField } from '@documenso/lib/types/fields';
+import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
+import type { DocumentMeta } from '@documenso/prisma/client';
+import { FieldType } from '@documenso/prisma/client';
+import { FieldRootContainer } from '@documenso/ui/components/field/field';
+import { Avatar, AvatarFallback } from '@documenso/ui/primitives/avatar';
+import { Button } from '@documenso/ui/primitives/button';
+import { FRIENDLY_FIELD_TYPE } from '@documenso/ui/primitives/document-flow/types';
+import { ElementVisible } from '@documenso/ui/primitives/element-visible';
+import { PopoverHover } from '@documenso/ui/primitives/popover';
+
+export type DocumentReadOnlyFieldsProps = {
+  fields: CompletedField[];
+  documentMeta?: DocumentMeta;
+};
+
+export const DocumentReadOnlyFields = ({ documentMeta, fields }: DocumentReadOnlyFieldsProps) => {
+  const [hiddenFieldIds, setHiddenFieldIds] = useState<Record<string, boolean>>({});
+
+  const handleHideField = (fieldId: string) => {
+    setHiddenFieldIds((prev) => ({ ...prev, [fieldId]: true }));
+  };
+
+  return (
+    <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+      {fields.map(
+        (field) =>
+          !hiddenFieldIds[field.secondaryId] && (
+            <FieldRootContainer
+              field={field}
+              key={field.id}
+              cardClassName="border-gray-100/50 !shadow-none backdrop-blur-[1px] bg-background/90"
+            >
+              <div className="absolute -right-3 -top-3">
+                <PopoverHover
+                  trigger={
+                    <Avatar className="dark:border-border h-8 w-8 border-2 border-solid border-gray-200/50 transition-colors hover:border-gray-200">
+                      <AvatarFallback className="bg-neutral-50 text-xs text-gray-400">
+                        {extractInitials(field.Recipient.name || field.Recipient.email)}
+                      </AvatarFallback>
+                    </Avatar>
+                  }
+                  contentProps={{
+                    className: 'flex w-fit flex-col py-2.5 text-sm',
+                  }}
+                >
+                  <p>
+                    <span className="font-semibold">
+                      {field.Recipient.name
+                        ? `${field.Recipient.name} (${field.Recipient.email})`
+                        : field.Recipient.email}{' '}
+                    </span>
+                    inserted a {FRIENDLY_FIELD_TYPE[field.type].toLowerCase()}
+                  </p>
+
+                  <Button
+                    variant="outline"
+                    className="mt-2.5 h-6 text-xs focus:outline-none focus-visible:ring-0"
+                    onClick={() => handleHideField(field.secondaryId)}
+                  >
+                    Hide field
+                  </Button>
+                </PopoverHover>
+              </div>
+
+              <div className="text-muted-foreground break-all text-sm">
+                {match(field)
+                  .with({ type: FieldType.SIGNATURE }, (field) =>
+                    field.Signature?.signatureImageAsBase64 ? (
+                      <img
+                        src={field.Signature.signatureImageAsBase64}
+                        alt="Signature"
+                        className="h-full w-full object-contain dark:invert"
+                      />
+                    ) : (
+                      <p className="font-signature text-muted-foreground text-lg duration-200 sm:text-xl md:text-2xl lg:text-3xl">
+                        {field.Signature?.typedSignature}
+                      </p>
+                    ),
+                  )
+                  .with(
+                    { type: P.union(FieldType.NAME, FieldType.TEXT, FieldType.EMAIL) },
+                    () => field.customText,
+                  )
+                  .with({ type: FieldType.DATE }, () =>
+                    convertToLocalSystemFormat(
+                      field.customText,
+                      documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
+                      documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE,
+                    ),
+                  )
+                  .with({ type: FieldType.FREE_SIGNATURE }, () => null)
+                  .exhaustive()}
+              </div>
+            </FieldRootContainer>
+          ),
+      )}
+    </ElementVisible>
+  );
+};

apps/web/src/pages/api/auth/[...nextauth].ts

@@ -2,6 +2,8 @@ import type { NextApiRequest, NextApiResponse } from 'next';
 
 import NextAuth from 'next-auth';
 
+import { getStripeCustomerByUser } from '@documenso/ee/server-only/stripe/get-customer';
+import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
 import { NEXT_AUTH_OPTIONS } from '@documenso/lib/next-auth/auth-options';
 import { extractNextApiRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { prisma } from '@documenso/prisma';
@@ -18,15 +20,29 @@ export default async function auth(req: NextApiRequest, res: NextApiResponse) {
       error: '/signin',
     },
     events: {
-      signIn: async ({ user }) => {
-        await prisma.userSecurityAuditLog.create({
-          data: {
-            userId: user.id,
-            ipAddress,
-            userAgent,
-            type: UserSecurityAuditLogType.SIGN_IN,
-          },
-        });
+      signIn: async ({ user: { id: userId } }) => {
+        const [user] = await Promise.all([
+          await prisma.user.findFirstOrThrow({
+            where: {
+              id: userId,
+            },
+          }),
+          await prisma.userSecurityAuditLog.create({
+            data: {
+              userId,
+              ipAddress,
+              userAgent,
+              type: UserSecurityAuditLogType.SIGN_IN,
+            },
+          }),
+        ]);
+
+        // Create the Stripe customer and attach it to the user if it doesn't exist.
+        if (user.customerId === null && IS_BILLING_ENABLED()) {
+          await getStripeCustomerByUser(user).catch((err) => {
+            console.error(err);
+          });
+        }
       },
       signOut: async ({ token }) => {
         const userId = typeof token.id === 'string' ? parseInt(token.id) : token.id;

apps/web/src/pages/api/trpc/[trpc].ts

@@ -3,7 +3,7 @@ import { createTrpcContext } from '@documenso/trpc/server/context';
 import { appRouter } from '@documenso/trpc/server/router';
 
 export const config = {
-  maxDuration: 60,
+  maxDuration: 120,
   api: {
     bodyParser: {
       sizeLimit: '50mb',

package-lock.json

@@ -22,7 +22,7 @@
         "eslint-config-custom": "*",
         "husky": "^9.0.11",
         "lint-staged": "^15.2.2",
-        "playwright": "1.41.0",
+        "playwright": "1.43.0",
         "prettier": "^2.5.1",
         "rimraf": "^5.0.1",
         "turbo": "^1.9.3"
@@ -4702,13 +4702,26 @@
         "node": ">=14"
       }
     },
+    "node_modules/@playwright/browser-chromium": {
+      "version": "1.43.0",
+      "resolved": "https://registry.npmjs.org/@playwright/browser-chromium/-/browser-chromium-1.43.0.tgz",
+      "integrity": "sha512-F0S4KIqSqQqm9EgsdtWjaJRpgP8cD2vWZHPSB41YI00PtXUobiv/3AnYISeL7wNuTanND7giaXQ4SIjkcIq3KQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "dependencies": {
+        "playwright-core": "1.43.0"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/@playwright/test": {
-      "version": "1.40.0",
-      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.40.0.tgz",
-      "integrity": "sha512-PdW+kn4eV99iP5gxWNSDQCbhMaDVej+RXL5xr6t04nbKLCBwYtA046t7ofoczHOm8u6c+45hpDKQVZqtqwkeQg==",
+      "version": "1.43.1",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.43.1.tgz",
+      "integrity": "sha512-HgtQzFgNEEo4TE22K/X7sYTYNqEMMTZmFS8kTq6m8hXj+m1D8TgwgIbumHddJa9h4yl4GkKb8/bgAl2+g7eDgA==",
       "dev": true,
       "dependencies": {
-        "playwright": "1.40.0"
+        "playwright": "1.43.1"
       },
       "bin": {
         "playwright": "cli.js"
@@ -4732,12 +4745,12 @@
       }
     },
     "node_modules/@playwright/test/node_modules/playwright": {
-      "version": "1.40.0",
-      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.40.0.tgz",
-      "integrity": "sha512-gyHAgQjiDf1m34Xpwzaqb76KgfzYrhK7iih+2IzcOCoZWr/8ZqmdBw+t0RU85ZmfJMgtgAiNtBQ/KS2325INXw==",
+      "version": "1.43.1",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.43.1.tgz",
+      "integrity": "sha512-V7SoH0ai2kNt1Md9E3Gwas5B9m8KR2GVvwZnAI6Pg0m3sh7UvgiYhRrhsziCmqMJNouPckiOhk8T+9bSAK0VIA==",
       "dev": true,
       "dependencies": {
-        "playwright-core": "1.40.0"
+        "playwright-core": "1.43.1"
       },
       "bin": {
         "playwright": "cli.js"
@@ -4750,9 +4763,9 @@
       }
     },
     "node_modules/@playwright/test/node_modules/playwright-core": {
-      "version": "1.40.0",
-      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.40.0.tgz",
-      "integrity": "sha512-fvKewVJpGeca8t0ipM56jkVSU6Eo0RmFvQ/MaCQNDYm+sdvKkMBBWTE1FdeMqIdumRaXXjZChWHvIzCGM/tA/Q==",
+      "version": "1.43.1",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.43.1.tgz",
+      "integrity": "sha512-EI36Mto2Vrx6VF7rm708qSnesVQKbxEWvPrfA1IPY6HgczBplDx7ENtx+K2n4kJ41sLLkuGfmb0ZLSSXlDhqPg==",
       "dev": true,
       "bin": {
         "playwright-core": "cli.js"
@@ -17660,11 +17673,11 @@
       }
     },
     "node_modules/playwright": {
-      "version": "1.41.0",
-      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.41.0.tgz",
-      "integrity": "sha512-XOsfl5ZtAik/T9oek4V0jAypNlaCNzuKOwVhqhgYT3os6kH34PzbRb74F0VWcLYa5WFdnmxl7qyAHBXvPv7lqQ==",
+      "version": "1.43.0",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.43.0.tgz",
+      "integrity": "sha512-SiOKHbVjTSf6wHuGCbqrEyzlm6qvXcv7mENP+OZon1I07brfZLGdfWV0l/efAzVx7TF3Z45ov1gPEkku9q25YQ==",
       "dependencies": {
-        "playwright-core": "1.41.0"
+        "playwright-core": "1.43.0"
       },
       "bin": {
         "playwright": "cli.js"
@@ -17676,6 +17689,17 @@
         "fsevents": "2.3.2"
       }
     },
+    "node_modules/playwright-core": {
+      "version": "1.43.0",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.43.0.tgz",
+      "integrity": "sha512-iWFjyBUH97+pUFiyTqSLd8cDMMOS0r2ZYz2qEsPjH8/bX++sbIJT35MSwKnp1r/OQBAqC5XO99xFbJ9XClhf4w==",
+      "bin": {
+        "playwright-core": "cli.js"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/playwright/node_modules/fsevents": {
       "version": "2.3.2",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
@@ -17689,17 +17713,6 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
-    "node_modules/playwright/node_modules/playwright-core": {
-      "version": "1.41.0",
-      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.41.0.tgz",
-      "integrity": "sha512-UGKASUhXmvqm2Lxa1fNr8sFwAtqjpgBRr9jQ7XBI8Rn5uFiEowGUGwrruUQsVPIom4bk7Lt+oLGpXobnXzrBIw==",
-      "bin": {
-        "playwright-core": "cli.js"
-      },
-      "engines": {
-        "node": ">=16"
-      }
-    },
     "node_modules/possible-typed-array-names": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz",
@@ -24968,7 +24981,7 @@
         "next-auth": "4.24.5",
         "oslo": "^0.17.0",
         "pdf-lib": "^1.17.1",
-        "playwright": "1.41.0",
+        "playwright": "1.43.0",
         "react": "18.2.0",
         "remeda": "^1.27.1",
         "stripe": "^12.7.0",
@@ -24976,23 +24989,10 @@
         "zod": "^3.22.4"
       },
       "devDependencies": {
-        "@playwright/browser-chromium": "1.41.0",
+        "@playwright/browser-chromium": "1.43.0",
         "@types/luxon": "^3.3.1"
       }
     },
-    "packages/lib/node_modules/@playwright/browser-chromium": {
-      "version": "1.41.0",
-      "resolved": "https://registry.npmjs.org/@playwright/browser-chromium/-/browser-chromium-1.41.0.tgz",
-      "integrity": "sha512-TaHfh3rDsz4+tVKdMMo4kdFOk8/4U6cPyMXHhoiJVmhOhjHXjR0qPMoa5gz5jDGl478cn5SoXmtgKPgTDFuS0g==",
-      "dev": true,
-      "hasInstallScript": true,
-      "dependencies": {
-        "playwright-core": "1.41.0"
-      },
-      "engines": {
-        "node": ">=16"
-      }
-    },
     "packages/lib/node_modules/nanoid": {
       "version": "4.0.2",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-4.0.2.tgz",
@@ -25010,18 +25010,6 @@
         "node": "^14 || ^16 || >=18"
       }
     },
-    "packages/lib/node_modules/playwright-core": {
-      "version": "1.41.0",
-      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.41.0.tgz",
-      "integrity": "sha512-UGKASUhXmvqm2Lxa1fNr8sFwAtqjpgBRr9jQ7XBI8Rn5uFiEowGUGwrruUQsVPIom4bk7Lt+oLGpXobnXzrBIw==",
-      "dev": true,
-      "bin": {
-        "playwright-core": "cli.js"
-      },
-      "engines": {
-        "node": ">=16"
-      }
-    },
     "packages/prettier-config": {
       "name": "@documenso/prettier-config",
       "version": "0.0.0",

package.json

@@ -38,7 +38,7 @@
     "eslint-config-custom": "*",
     "husky": "^9.0.11",
     "lint-staged": "^15.2.2",
-    "playwright": "1.41.0",
+    "playwright": "1.43.0",
     "prettier": "^2.5.1",
     "rimraf": "^5.0.1",
     "turbo": "^1.9.3"

packages/api/v1/implementation.ts

@@ -229,6 +229,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
         requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
+      await upsertDocumentMeta({
+        documentId: document.id,
+        userId: user.id,
+        ...body.meta,
+        requestMetadata: extractNextApiRequestMetadata(args.req),
+      });
+
       const recipients = await setRecipientsForDocument({
         userId: user.id,
         teamId: team?.id,
@@ -324,10 +331,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       await upsertDocumentMeta({
         documentId: document.id,
         userId: user.id,
-        subject: body.meta.subject,
-        message: body.meta.message,
-        dateFormat: body.meta.dateFormat,
-        timezone: body.meta.timezone,
+        ...body.meta,
         requestMetadata: extractNextApiRequestMetadata(args.req),
       });
     }

packages/lib/package.json

@@ -39,7 +39,7 @@
     "next-auth": "4.24.5",
     "oslo": "^0.17.0",
     "pdf-lib": "^1.17.1",
-    "playwright": "1.41.0",
+    "playwright": "1.43.0",
     "react": "18.2.0",
     "remeda": "^1.27.1",
     "stripe": "^12.7.0",
@@ -48,6 +48,6 @@
   },
   "devDependencies": {
     "@types/luxon": "^3.3.1",
-    "@playwright/browser-chromium": "1.41.0"
+    "@playwright/browser-chromium": "1.43.0"
   }
 }

packages/lib/server-only/document/complete-document-with-token.ts

@@ -137,7 +137,7 @@ export const completeDocumentWithToken = async ({
     await sendPendingEmail({ documentId, recipientId: recipient.id });
   }
 
-  const documents = await prisma.document.updateMany({
+  const haveAllRecipientsSigned = await prisma.document.findFirst({
     where: {
       id: document.id,
       Recipient: {
@@ -146,13 +146,9 @@ export const completeDocumentWithToken = async ({
         },
       },
     },
-    data: {
-      status: DocumentStatus.COMPLETED,
-      completedAt: new Date(),
-    },
   });
 
-  if (documents.count > 0) {
+  if (haveAllRecipientsSigned) {
     await sealDocument({ documentId: document.id, requestMetadata });
   }
 

packages/lib/server-only/document/delete-document.ts

@@ -75,18 +75,20 @@ export const deleteDocument = async ({
   }
 
   // Continue to hide the document from the user if they are a recipient.
+  // Dirty way of doing this but it's faster than refetching the document.
   if (userRecipient?.documentDeletedAt === null) {
-    await prisma.recipient.update({
-      where: {
-        documentId_email: {
-          documentId: document.id,
-          email: user.email,
+    await prisma.recipient
+      .update({
+        where: {
+          id: userRecipient.id,
         },
-      },
-      data: {
-        documentDeletedAt: new Date().toISOString(),
-      },
-    });
+        data: {
+          documentDeletedAt: new Date().toISOString(),
+        },
+      })
+      .catch(() => {
+        // Do nothing.
+      });
   }
 
   // Return partial document for API v1 response.

packages/lib/server-only/document/seal-document.ts

@@ -40,6 +40,11 @@ export const sealDocument = async ({
   const document = await prisma.document.findFirstOrThrow({
     where: {
       id: documentId,
+      Recipient: {
+        every: {
+          signingStatus: SigningStatus.SIGNED,
+        },
+      },
     },
     include: {
       documentData: true,
@@ -53,10 +58,6 @@ export const sealDocument = async ({
     throw new Error(`Document ${document.id} has no document data`);
   }
 
-  if (document.status !== DocumentStatus.COMPLETED) {
-    throw new Error(`Document ${document.id} has not been completed`);
-  }
-
   const recipients = await prisma.recipient.findMany({
     where: {
       documentId: document.id,
@@ -92,9 +93,9 @@ export const sealDocument = async ({
   // !: Need to write the fields onto the document as a hard copy
   const pdfData = await getFile(documentData);
 
-  const certificate = await getCertificatePdf({ documentId }).then(async (doc) =>
-    PDFDocument.load(doc),
-  );
+  const certificate = await getCertificatePdf({ documentId })
+    .then(async (doc) => PDFDocument.load(doc))
+    .catch(() => null);
 
   const doc = await PDFDocument.load(pdfData);
 
@@ -103,11 +104,13 @@ export const sealDocument = async ({
   doc.getForm().flatten();
   flattenAnnotations(doc);
 
-  const certificatePages = await doc.copyPages(certificate, certificate.getPageIndices());
+  if (certificate) {
+    const certificatePages = await doc.copyPages(certificate, certificate.getPageIndices());
 
-  certificatePages.forEach((page) => {
-    doc.addPage(page);
-  });
+    certificatePages.forEach((page) => {
+      doc.addPage(page);
+    });
+  }
 
   for (const field of fields) {
     await insertFieldInPDF(doc, field);
@@ -138,6 +141,16 @@ export const sealDocument = async ({
   }
 
   await prisma.$transaction(async (tx) => {
+    await tx.document.update({
+      where: {
+        id: document.id,
+      },
+      data: {
+        status: DocumentStatus.COMPLETED,
+        completedAt: new Date(),
+      },
+    });
+
     await tx.documentData.update({
       where: {
         id: documentData.id,

packages/lib/server-only/document/send-document.tsx

@@ -4,6 +4,8 @@ import { mailer } from '@documenso/email/mailer';
 import { render } from '@documenso/email/render';
 import { DocumentInviteEmailTemplate } from '@documenso/email/templates/document-invite';
 import { FROM_ADDRESS, FROM_NAME } from '@documenso/lib/constants/email';
+import { sealDocument } from '@documenso/lib/server-only/document/seal-document';
+import { updateDocument } from '@documenso/lib/server-only/document/update-document';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
 import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
@@ -211,6 +213,31 @@ export const sendDocument = async ({
     }),
   );
 
+  const allRecipientsHaveNoActionToTake = document.Recipient.every(
+    (recipient) => recipient.role === RecipientRole.CC,
+  );
+
+  if (allRecipientsHaveNoActionToTake) {
+    const updatedDocument = await updateDocument({
+      documentId,
+      userId,
+      teamId,
+      data: { status: DocumentStatus.COMPLETED },
+    });
+
+    await sealDocument({ documentId: updatedDocument.id, requestMetadata });
+
+    // Keep the return type the same for the `sendDocument` method
+    return await prisma.document.findFirstOrThrow({
+      where: {
+        id: documentId,
+      },
+      include: {
+        Recipient: true,
+      },
+    });
+  }
+
   const updatedDocument = await prisma.$transaction(async (tx) => {
     if (document.status === DocumentStatus.DRAFT) {
       await tx.documentAuditLog.create({

packages/lib/server-only/field/get-completed-fields-for-document.ts

@@ -0,0 +1,29 @@
+import { prisma } from '@documenso/prisma';
+import { SigningStatus } from '@documenso/prisma/client';
+
+export type GetCompletedFieldsForDocumentOptions = {
+  documentId: number;
+};
+
+export const getCompletedFieldsForDocument = async ({
+  documentId,
+}: GetCompletedFieldsForDocumentOptions) => {
+  return await prisma.field.findMany({
+    where: {
+      documentId,
+      Recipient: {
+        signingStatus: SigningStatus.SIGNED,
+      },
+      inserted: true,
+    },
+    include: {
+      Signature: true,
+      Recipient: {
+        select: {
+          name: true,
+          email: true,
+        },
+      },
+    },
+  });
+};

packages/lib/server-only/field/get-completed-fields-for-token.ts

@@ -0,0 +1,33 @@
+import { prisma } from '@documenso/prisma';
+import { SigningStatus } from '@documenso/prisma/client';
+
+export type GetCompletedFieldsForTokenOptions = {
+  token: string;
+};
+
+export const getCompletedFieldsForToken = async ({ token }: GetCompletedFieldsForTokenOptions) => {
+  return await prisma.field.findMany({
+    where: {
+      Document: {
+        Recipient: {
+          some: {
+            token,
+          },
+        },
+      },
+      Recipient: {
+        signingStatus: SigningStatus.SIGNED,
+      },
+      inserted: true,
+    },
+    include: {
+      Signature: true,
+      Recipient: {
+        select: {
+          name: true,
+          email: true,
+        },
+      },
+    },
+  });
+};

packages/lib/server-only/htmltopdf/get-certificate-pdf.ts

@@ -18,7 +18,9 @@ export const getCertificatePdf = async ({ documentId }: GetCertificatePdfOptions
   let browser: Browser;
 
   if (process.env.NEXT_PRIVATE_BROWSERLESS_URL) {
-    browser = await chromium.connect(process.env.NEXT_PRIVATE_BROWSERLESS_URL);
+    // !: Use CDP rather than the default `connect` method to avoid coupling to the playwright version.
+    // !: Previously we would have to keep the playwright version in sync with the browserless version to avoid errors.
+    browser = await chromium.connectOverCDP(process.env.NEXT_PRIVATE_BROWSERLESS_URL);
   } else {
     browser = await chromium.launch();
   }
@@ -33,6 +35,7 @@ export const getCertificatePdf = async ({ documentId }: GetCertificatePdfOptions
 
   await page.goto(`${NEXT_PUBLIC_WEBAPP_URL()}/__htmltopdf/certificate?d=${encryptedId}`, {
     waitUntil: 'networkidle',
+    timeout: 10_000,
   });
 
   const result = await page.pdf({

packages/lib/server-only/template/create-document-from-template.ts

@@ -89,6 +89,10 @@ export const createDocumentFromTemplate = async ({
 
       const documentRecipient = document.Recipient.find((doc) => doc.email === recipient?.email);
 
+      if (!documentRecipient) {
+        throw new Error('Recipient not found.');
+      }
+
       return {
         type: field.type,
         page: field.page,
@@ -99,7 +103,7 @@ export const createDocumentFromTemplate = async ({
         customText: field.customText,
         inserted: field.inserted,
         documentId: document.id,
-        recipientId: documentRecipient?.id || null,
+        recipientId: documentRecipient.id,
       };
     }),
   });

packages/lib/server-only/template/duplicate-template.ts

@@ -81,6 +81,10 @@ export const duplicateTemplate = async ({
         (doc) => doc.email === recipient?.email,
       );
 
+      if (!duplicatedTemplateRecipient) {
+        throw new Error('Recipient not found.');
+      }
+
       return {
         type: field.type,
         page: field.page,
@@ -91,7 +95,7 @@ export const duplicateTemplate = async ({
         customText: field.customText,
         inserted: field.inserted,
         templateId: duplicatedTemplate.id,
-        recipientId: duplicatedTemplateRecipient?.id || null,
+        recipientId: duplicatedTemplateRecipient.id,
       };
     }),
   });

packages/lib/server-only/webhooks/get-webhooks-by-user-id.ts

@@ -4,6 +4,7 @@ export const getWebhooksByUserId = async (userId: number) => {
   return await prisma.webhook.findMany({
     where: {
       userId,
+      teamId: null,
     },
     orderBy: {
       createdAt: 'desc',

packages/lib/types/fields.ts

@@ -0,0 +1,3 @@
+import type { getCompletedFieldsForToken } from '../server-only/field/get-completed-fields-for-token';
+
+export type CompletedField = Awaited<ReturnType<typeof getCompletedFieldsForToken>>[number];

packages/lib/universal/get-feature-flag.ts

@@ -17,6 +17,7 @@ export const getFlag = async (
   options?: GetFlagOptions,
 ): Promise<TFeatureFlagValue> => {
   const requestHeaders = options?.requestHeaders ?? {};
+  delete requestHeaders['content-length'];
 
   if (!isFeatureFlagEnabled()) {
     return LOCAL_FEATURE_FLAGS[flag] ?? true;
@@ -25,7 +26,7 @@ export const getFlag = async (
   const url = new URL(`${APP_BASE_URL()}/api/feature-flag/get`);
   url.searchParams.set('flag', flag);
 
-  const response = await fetch(url, {
+  return await fetch(url, {
     headers: {
       ...requestHeaders,
     },
@@ -35,9 +36,10 @@ export const getFlag = async (
   })
     .then(async (res) => res.json())
     .then((res) => ZFeatureFlagValueSchema.parse(res))
-    .catch(() => false);
-
-  return response;
+    .catch((err) => {
+      console.error(err);
+      return LOCAL_FEATURE_FLAGS[flag] ?? false;
+    });
 };
 
 /**
@@ -50,6 +52,7 @@ export const getAllFlags = async (
   options?: GetFlagOptions,
 ): Promise<Record<string, TFeatureFlagValue>> => {
   const requestHeaders = options?.requestHeaders ?? {};
+  delete requestHeaders['content-length'];
 
   if (!isFeatureFlagEnabled()) {
     return LOCAL_FEATURE_FLAGS;
@@ -67,7 +70,10 @@ export const getAllFlags = async (
   })
     .then(async (res) => res.json())
     .then((res) => z.record(z.string(), ZFeatureFlagValueSchema).parse(res))
-    .catch(() => LOCAL_FEATURE_FLAGS);
+    .catch((err) => {
+      console.error(err);
+      return LOCAL_FEATURE_FLAGS;
+    });
 };
 
 /**
@@ -89,7 +95,10 @@ export const getAllAnonymousFlags = async (): Promise<Record<string, TFeatureFla
   })
     .then(async (res) => res.json())
     .then((res) => z.record(z.string(), ZFeatureFlagValueSchema).parse(res))
-    .catch(() => LOCAL_FEATURE_FLAGS);
+    .catch((err) => {
+      console.error(err);
+      return LOCAL_FEATURE_FLAGS;
+    });
 };
 
 interface GetFlagOptions {

packages/prisma/migrations/20240418140819_remove_impossible_field_optional_states/migration.sql

@@ -0,0 +1,11 @@
+/*
+  Warnings:
+
+  - Made the column `recipientId` on table `Field` required. This step will fail if there are existing NULL values in that column.
+
+*/
+-- Drop all Fields where the recipientId is null
+DELETE FROM "Field" WHERE "recipientId" IS NULL;
+
+-- AlterTable
+ALTER TABLE "Field" ALTER COLUMN "recipientId" SET NOT NULL;

packages/prisma/schema.prisma

@@ -387,7 +387,7 @@ model Field {
   secondaryId String     @unique @default(cuid())
   documentId  Int?
   templateId  Int?
-  recipientId Int?
+  recipientId Int
   type        FieldType
   page        Int
   positionX   Decimal    @default(0)
@@ -398,7 +398,7 @@ model Field {
   inserted    Boolean
   Document    Document?  @relation(fields: [documentId], references: [id], onDelete: Cascade)
   Template    Template?  @relation(fields: [templateId], references: [id], onDelete: Cascade)
-  Recipient   Recipient? @relation(fields: [recipientId], references: [id], onDelete: Cascade)
+  Recipient   Recipient  @relation(fields: [recipientId], references: [id], onDelete: Cascade)
   Signature   Signature?
 
   @@index([documentId])

packages/trpc/server/document-router/router.ts

@@ -4,6 +4,7 @@ import { DateTime } from 'luxon';
 import { getServerLimits } from '@documenso/ee/server-only/limits/server';
 import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
+import { AppError } from '@documenso/lib/errors/app-error';
 import { encryptSecondaryData } from '@documenso/lib/server-only/crypto/encrypt';
 import { upsertDocumentMeta } from '@documenso/lib/server-only/document-meta/upsert-document-meta';
 import { createDocument } from '@documenso/lib/server-only/document/create-document';
@@ -20,6 +21,7 @@ import { updateDocumentSettings } from '@documenso/lib/server-only/document/upda
 import { updateTitle } from '@documenso/lib/server-only/document/update-title';
 import { symmetricEncrypt } from '@documenso/lib/universal/crypto';
 import { extractNextApiRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
+import { DocumentStatus } from '@documenso/prisma/client';
 
 import { authenticatedProcedure, procedure, router } from '../trpc';
 import {
@@ -221,10 +223,6 @@ export const documentRouter = router({
       }
     }),
 
-  getDocumentMetaById: authenticatedProcedure
-    .input(ZSetSettingsForDocumentMutationSchema)
-    .mutation(async ({ input, ctx }) => {}),
-
   setTitleForDocument: authenticatedProcedure
     .input(ZSetTitleForDocumentMutationSchema)
     .mutation(async ({ input, ctx }) => {
@@ -417,6 +415,10 @@ export const documentRouter = router({
           teamId,
         });
 
+        if (document.status !== DocumentStatus.COMPLETED) {
+          throw new AppError('DOCUMENT_NOT_COMPLETE');
+        }
+
         const encrypted = encryptSecondaryData({
           data: document.id.toString(),
           expiresAt: DateTime.now().plus({ minutes: 5 }).toJSDate().valueOf(),

packages/ui/components/field/field.tsx

@@ -19,6 +19,7 @@ export type FieldContainerPortalProps = {
   field: Field;
   className?: string;
   children: React.ReactNode;
+  cardClassName?: string;
 };
 
 export function FieldContainerPortal({
@@ -44,7 +45,7 @@ export function FieldContainerPortal({
   );
 }
 
-export function FieldRootContainer({ field, children }: FieldContainerPortalProps) {
+export function FieldRootContainer({ field, children, cardClassName }: FieldContainerPortalProps) {
   const [isValidating, setIsValidating] = useState(false);
 
   const ref = React.useRef<HTMLDivElement>(null);
@@ -78,6 +79,7 @@ export function FieldRootContainer({ field, children }: FieldContainerPortalProp
           {
             'border-orange-300 ring-1 ring-orange-300': !field.inserted && isValidating,
           },
+          cardClassName,
         )}
         ref={ref}
         data-inserted={field.inserted ? 'true' : 'false'}

packages/ui/primitives/document-flow/add-settings.tsx

@@ -9,7 +9,11 @@ import { useForm } from 'react-hook-form';
 import { DATE_FORMATS, DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
 import { DOCUMENT_AUTH_TYPES } from '@documenso/lib/constants/document-auth';
 import { DEFAULT_DOCUMENT_TIME_ZONE, TIME_ZONES } from '@documenso/lib/constants/time-zones';
-import { DocumentAccessAuth, DocumentActionAuth } from '@documenso/lib/types/document-auth';
+import {
+  DocumentAccessAuth,
+  DocumentActionAuth,
+  DocumentAuth,
+} from '@documenso/lib/types/document-auth';
 import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
 import { DocumentStatus, type Field, type Recipient, SendStatus } from '@documenso/prisma/client';
 import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
@@ -216,9 +220,9 @@ export const AddSettingsFormPartial = ({
                           </p>
 
                           <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
-                            <li>
+                            {/* <li>
                               <strong>Require account</strong> - The recipient must be signed in
-                            </li>
+                            </li> */}
                             <li>
                               <strong>Require passkey</strong> - The recipient must have an account
                               and passkey configured via their settings
@@ -242,11 +246,13 @@ export const AddSettingsFormPartial = ({
                         </SelectTrigger>
 
                         <SelectContent position="popper">
-                          {Object.values(DocumentActionAuth).map((authType) => (
-                            <SelectItem key={authType} value={authType}>
-                              {DOCUMENT_AUTH_TYPES[authType].value}
-                            </SelectItem>
-                          ))}
+                          {Object.values(DocumentActionAuth)
+                            .filter((auth) => auth !== DocumentAuth.ACCOUNT)
+                            .map((authType) => (
+                              <SelectItem key={authType} value={authType}>
+                                {DOCUMENT_AUTH_TYPES[authType].value}
+                              </SelectItem>
+                            ))}
 
                           {/* Note: -1 is remapped in the Zod schema to the required value. */}
                           <SelectItem value={'-1'}>None</SelectItem>

packages/ui/primitives/document-flow/add-settings.types.ts

@@ -28,8 +28,6 @@ export const ZAddSettingsFormSchema = z.object({
     ZDocumentActionAuthTypesSchema.optional(),
   ),
   meta: z.object({
-    subject: z.string().optional(),
-    message: z.string().optional(),
     timezone: z.string().optional().default(DEFAULT_DOCUMENT_TIME_ZONE),
     dateFormat: z.string().optional().default(DEFAULT_DOCUMENT_DATE_FORMAT),
     redirectUrl: z

packages/ui/primitives/document-flow/add-signers.tsx

@@ -302,10 +302,10 @@ export const AddSignersFormPartial = ({
                                         global action signing authentication method configured in
                                         the "General Settings" step
                                       </li>
-                                      <li>
+                                      {/* <li>
                                         <strong>Require account</strong> - The recipient must be
                                         signed in
-                                      </li>
+                                      </li> */}
                                       <li>
                                         <strong>Require passkey</strong> - The recipient must have
                                         an account and passkey configured via their settings
@@ -326,11 +326,13 @@ export const AddSignersFormPartial = ({
                                 {/* Note: -1 is remapped in the Zod schema to the required value. */}
                                 <SelectItem value="-1">Inherit authentication method</SelectItem>
 
-                                {Object.values(RecipientActionAuth).map((authType) => (
-                                  <SelectItem key={authType} value={authType}>
-                                    {DOCUMENT_AUTH_TYPES[authType].value}
-                                  </SelectItem>
-                                ))}
+                                {Object.values(RecipientActionAuth)
+                                  .filter((auth) => auth !== RecipientActionAuth.ACCOUNT)
+                                  .map((authType) => (
+                                    <SelectItem key={authType} value={authType}>
+                                      {DOCUMENT_AUTH_TYPES[authType].value}
+                                    </SelectItem>
+                                  ))}
                               </SelectContent>
                             </Select>
                           </FormControl>

packages/ui/primitives/document-flow/add-subject.tsx

@@ -1,7 +1,5 @@
 'use client';
 
-import { useEffect } from 'react';
-
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useForm } from 'react-hook-form';
 
@@ -32,8 +30,6 @@ export type AddSubjectFormProps = {
   document: DocumentWithData;
   onSubmit: (_data: TAddSubjectFormSchema) => void;
   isDocumentPdfLoaded: boolean;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  setSubjectFormFields: (subject?: string, message?: string) => void;
 };
 
 export const AddSubjectFormPartial = ({
@@ -43,12 +39,10 @@ export const AddSubjectFormPartial = ({
   document,
   onSubmit,
   isDocumentPdfLoaded,
-  setSubjectFormFields,
 }: AddSubjectFormProps) => {
   const {
     register,
     handleSubmit,
-    getValues,
     formState: { errors, isSubmitting },
   } = useForm<TAddSubjectFormSchema>({
     defaultValues: {
@@ -63,13 +57,6 @@ export const AddSubjectFormPartial = ({
   const onFormSubmit = handleSubmit(onSubmit);
   const { currentStep, totalSteps, previousStep } = useStep();
 
-  useEffect(() => {
-    return () => {
-      const { meta } = getValues();
-      setSubjectFormFields(meta.subject, meta.message);
-    };
-  }, [getValues, setSubjectFormFields]);
-
   return (
     <>
       <DocumentFlowFormContainerHeader

packages/ui/primitives/popover.tsx

@@ -30,4 +30,66 @@ const PopoverContent = React.forwardRef<
 
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
-export { Popover, PopoverTrigger, PopoverContent };
+type PopoverHoverProps = {
+  trigger: React.ReactNode;
+  children: React.ReactNode;
+  contentProps?: React.ComponentPropsWithoutRef<typeof PopoverContent>;
+};
+
+const PopoverHover = ({ trigger, children, contentProps }: PopoverHoverProps) => {
+  const [open, setOpen] = React.useState(false);
+
+  const isControlled = React.useRef(false);
+  const isMouseOver = React.useRef<boolean>(false);
+
+  const onMouseEnter = () => {
+    isMouseOver.current = true;
+
+    if (isControlled.current) {
+      return;
+    }
+
+    setOpen(true);
+  };
+
+  const onMouseLeave = () => {
+    isMouseOver.current = false;
+
+    if (isControlled.current) {
+      return;
+    }
+
+    setTimeout(() => {
+      setOpen(isMouseOver.current);
+    }, 200);
+  };
+
+  const onOpenChange = (newOpen: boolean) => {
+    isControlled.current = newOpen;
+
+    setOpen(newOpen);
+  };
+
+  return (
+    <Popover open={open} onOpenChange={onOpenChange}>
+      <PopoverTrigger
+        className="flex cursor-pointer outline-none"
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+      >
+        {trigger}
+      </PopoverTrigger>
+
+      <PopoverContent
+        side="top"
+        onMouseEnter={onMouseEnter}
+        onMouseLeave={onMouseLeave}
+        {...contentProps}
+      >
+        {children}
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export { Popover, PopoverTrigger, PopoverContent, PopoverHover };

packages/ui/primitives/template-flow/add-template-placeholder-recipients.tsx

@@ -282,6 +282,7 @@ export const AddTemplatePlaceholderRecipientsFormPartial = ({
           <Button
             type="button"
             className="dark:bg-muted dark:hover:bg-muted/80 bg-black/5 hover:bg-black/10"
+            variant="secondary"
             disabled={
               isSubmitting || getValues('signers').some((signer) => signer.email === user?.email)
             }