fix: polish

## Description

Currently if you try to load the document edit page when fields need to
be rendered, you will not be able to see the fields until you proceed to
the next step.

This is because the fields require the document PDF to be loaded prior
to rendering them.

This PR resolves that issue by only rendering the fields after the PDF
is loaded.

## Changes Made

- Add a state to track whether the PDF is loaded
- Render the fields only after the PDF is loaded

## Testing Performed

Tested document flow manually and the fields are rendered correctly on
load.

## Checklist

- [X] I have tested these changes locally and they work as expected.
- [X] I have updated the documentation to reflect these changes, if
applicable.

.env.example

@@ -55,6 +55,9 @@ NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH=
 NEXT_PUBLIC_UPLOAD_TRANSPORT="database"
 # OPTIONAL: Defines the endpoint to use for the S3 storage transport. Relevant when using third-party S3-compatible providers.
 NEXT_PRIVATE_UPLOAD_ENDPOINT="http://127.0.0.1:9002"
+# OPTIONAL: Defines the force path style to use for the S3 storage transport. Relevant when using third-party S3-compatible providers.
+# This will change it from using virtual hosts <bucket>.domain.com/<path> to fully qualified paths domain.com/<bucket>/<path>
+NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE="false"
 # OPTIONAL: Defines the region to use for the S3 storage transport. Defaults to us-east-1.
 NEXT_PRIVATE_UPLOAD_REGION="unknown"
 # REQUIRED: Defines the bucket to use for the S3 storage transport.
@@ -104,6 +107,7 @@ NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT=5
 NEXT_PRIVATE_STRIPE_API_KEY=
 NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET=
 NEXT_PUBLIC_STRIPE_COMMUNITY_PLAN_MONTHLY_PRICE_ID=
+NEXT_PUBLIC_STRIPE_ENTERPRISE_PLAN_MONTHLY_PRICE_ID=
 
 # [[FEATURES]]
 # OPTIONAL: Leave blank to disable PostHog and feature flags.

apps/marketing/src/app/(marketing)/singleplayer/client.tsx

@@ -161,6 +161,7 @@ export const SinglePlayerClient = () => {
     signingStatus: 'NOT_SIGNED',
     sendStatus: 'NOT_SENT',
     role: 'SIGNER',
+    authOptions: null,
   };
 
   const onFileDrop = async (file: File) => {
@@ -246,6 +247,7 @@ export const SinglePlayerClient = () => {
                   recipients={uploadedFile ? [placeholderRecipient] : []}
                   fields={fields}
                   onSubmit={onFieldsSubmit}
+                  isDocumentPdfLoaded={true}
                 />
               </fieldset>
 

apps/web/next.config.js

@@ -1,5 +1,4 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-const { withAxiom } = require('next-axiom');
 const fs = require('fs');
 const path = require('path');
 const { version } = require('./package.json');
@@ -92,4 +91,4 @@ const config = {
   },
 };
 
-module.exports = withAxiom(config);
+module.exports = config;

apps/web/package.json

@@ -33,7 +33,6 @@
     "micro": "^10.0.1",
     "next": "14.0.3",
     "next-auth": "4.24.5",
-    "next-axiom": "^1.1.1",
     "next-plausible": "^3.10.1",
     "next-themes": "^0.2.1",
     "perfect-freehand": "^1.2.0",

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

@@ -8,19 +8,18 @@ import {
   DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
   SKIP_QUERY_BATCH_META,
 } from '@documenso/lib/constants/trpc';
-import { DocumentStatus } from '@documenso/prisma/client';
 import type { DocumentWithDetails } from '@documenso/prisma/types/document';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { AddFieldsFormPartial } from '@documenso/ui/primitives/document-flow/add-fields';
 import type { TAddFieldsFormSchema } from '@documenso/ui/primitives/document-flow/add-fields.types';
+import { AddSettingsFormPartial } from '@documenso/ui/primitives/document-flow/add-settings';
+import type { TAddSettingsFormSchema } from '@documenso/ui/primitives/document-flow/add-settings.types';
 import { AddSignersFormPartial } from '@documenso/ui/primitives/document-flow/add-signers';
 import type { TAddSignersFormSchema } from '@documenso/ui/primitives/document-flow/add-signers.types';
 import { AddSubjectFormPartial } from '@documenso/ui/primitives/document-flow/add-subject';
 import type { TAddSubjectFormSchema } from '@documenso/ui/primitives/document-flow/add-subject.types';
-import { AddTitleFormPartial } from '@documenso/ui/primitives/document-flow/add-title';
-import type { TAddTitleFormSchema } from '@documenso/ui/primitives/document-flow/add-title.types';
 import { DocumentFlowFormContainer } from '@documenso/ui/primitives/document-flow/document-flow-root';
 import type { DocumentFlowStep } from '@documenso/ui/primitives/document-flow/types';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
@@ -33,15 +32,17 @@ export type EditDocumentFormProps = {
   className?: string;
   initialDocument: DocumentWithDetails;
   documentRootPath: string;
+  isDocumentEnterprise: boolean;
 };
 
-type EditDocumentStep = 'title' | 'signers' | 'fields' | 'subject';
-const EditDocumentSteps: EditDocumentStep[] = ['title', 'signers', 'fields', 'subject'];
+type EditDocumentStep = 'settings' | 'signers' | 'fields' | 'subject';
+const EditDocumentSteps: EditDocumentStep[] = ['settings', 'signers', 'fields', 'subject'];
 
 export const EditDocumentForm = ({
   className,
   initialDocument,
   documentRootPath,
+  isDocumentEnterprise,
 }: EditDocumentFormProps) => {
   const { toast } = useToast();
 
@@ -49,6 +50,8 @@ export const EditDocumentForm = ({
   const searchParams = useSearchParams();
   const team = useOptionalCurrentTeam();
 
+  const [isDocumentPdfLoaded, setIsDocumentPdfLoaded] = useState(false);
+
   const utils = trpc.useUtils();
 
   const { data: document, refetch: refetchDocument } =
@@ -65,7 +68,7 @@ export const EditDocumentForm = ({
 
   const { Recipient: recipients, Field: fields } = document;
 
-  const { mutateAsync: addTitle } = trpc.document.setTitleForDocument.useMutation({
+  const { mutateAsync: setSettingsForDocument } = trpc.document.setSettingsForDocument.useMutation({
     ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
     onSuccess: (newData) => {
       utils.document.getDocumentWithDetailsById.setData(
@@ -121,9 +124,9 @@ export const EditDocumentForm = ({
     trpc.document.setPasswordForDocument.useMutation();
 
   const documentFlow: Record<EditDocumentStep, DocumentFlowStep> = {
-    title: {
-      title: 'Add Title',
-      description: 'Add the title to the document.',
+    settings: {
+      title: 'General',
+      description: 'Configure general settings for the document.',
       stepIndex: 1,
     },
     signers: {
@@ -147,8 +150,7 @@ export const EditDocumentForm = ({
     // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
     const searchParamStep = searchParams?.get('step') as EditDocumentStep | undefined;
 
-    let initialStep: EditDocumentStep =
-      document.status === DocumentStatus.DRAFT ? 'title' : 'signers';
+    let initialStep: EditDocumentStep = 'settings';
 
     if (
       searchParamStep &&
@@ -161,12 +163,23 @@ export const EditDocumentForm = ({
     return initialStep;
   });
 
-  const onAddTitleFormSubmit = async (data: TAddTitleFormSchema) => {
+  const onAddSettingsFormSubmit = async (data: TAddSettingsFormSchema) => {
     try {
-      await addTitle({
+      const { timezone, dateFormat, redirectUrl } = data.meta;
+
+      await setSettingsForDocument({
         documentId: document.id,
         teamId: team?.id,
+        data: {
           title: data.title,
+          globalAccessAuth: data.globalAccessAuth ?? null,
+          globalActionAuth: data.globalActionAuth ?? null,
+        },
+        meta: {
+          timezone,
+          dateFormat,
+          redirectUrl,
+        },
       });
 
       // Router refresh is here to clear the router cache for when navigating to /documents.
@@ -178,7 +191,7 @@ export const EditDocumentForm = ({
 
       toast({
         title: 'Error',
-        description: 'An error occurred while updating title.',
+        description: 'An error occurred while updating the document settings.',
         variant: 'destructive',
       });
     }
@@ -189,7 +202,11 @@ export const EditDocumentForm = ({
       await addSigners({
         documentId: document.id,
         teamId: team?.id,
-        signers: data.signers,
+        signers: data.signers.map((signer) => ({
+          ...signer,
+          // Explicitly set to null to indicate we want to remove auth if required.
+          actionAuth: signer.actionAuth || null,
+        })),
       });
 
       // Router refresh is here to clear the router cache for when navigating to /documents.
@@ -230,7 +247,7 @@ export const EditDocumentForm = ({
   };
 
   const onAddSubjectFormSubmit = async (data: TAddSubjectFormSchema) => {
-    const { subject, message, timezone, dateFormat, redirectUrl } = data.meta;
+    const { subject, message } = data.meta;
 
     try {
       await sendDocument({
@@ -239,9 +256,6 @@ export const EditDocumentForm = ({
         meta: {
           subject,
           message,
-          dateFormat,
-          timezone,
-          redirectUrl,
         },
       });
 
@@ -294,6 +308,7 @@ export const EditDocumentForm = ({
             document={document}
             password={document.documentMeta?.password}
             onPasswordSubmit={onPasswordSubmit}
+            onDocumentLoad={() => setIsDocumentPdfLoaded(true)}
           />
         </CardContent>
       </Card>
@@ -307,30 +322,35 @@ export const EditDocumentForm = ({
             currentStep={currentDocumentFlow.stepIndex}
             setCurrentStep={(step) => setStep(EditDocumentSteps[step - 1])}
           >
-            <AddTitleFormPartial
+            <AddSettingsFormPartial
               key={recipients.length}
-              documentFlow={documentFlow.title}
+              documentFlow={documentFlow.settings}
               document={document}
               recipients={recipients}
               fields={fields}
-              onSubmit={onAddTitleFormSubmit}
+              isDocumentEnterprise={isDocumentEnterprise}
+              isDocumentPdfLoaded={isDocumentPdfLoaded}
+              onSubmit={onAddSettingsFormSubmit}
             />
-
             <AddSignersFormPartial
               key={recipients.length}
               documentFlow={documentFlow.signers}
-              document={document}
               recipients={recipients}
               fields={fields}
+              isDocumentEnterprise={isDocumentEnterprise}
               onSubmit={onAddSignersFormSubmit}
+              isDocumentPdfLoaded={isDocumentPdfLoaded}
             />
+
             <AddFieldsFormPartial
               key={fields.length}
               documentFlow={documentFlow.fields}
               recipients={recipients}
               fields={fields}
               onSubmit={onAddFieldsFormSubmit}
+              isDocumentPdfLoaded={isDocumentPdfLoaded}
             />
+
             <AddSubjectFormPartial
               key={recipients.length}
               documentFlow={documentFlow.subject}
@@ -338,6 +358,7 @@ export const EditDocumentForm = ({
               recipients={recipients}
               fields={fields}
               onSubmit={onAddSubjectFormSubmit}
+              isDocumentPdfLoaded={isDocumentPdfLoaded}
             />
           </Stepper>
         </DocumentFlowFormContainer>

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

@@ -3,6 +3,7 @@ import { redirect } from 'next/navigation';
 
 import { ChevronLeft, Users2 } from 'lucide-react';
 
+import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
 import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentWithDetailsById } from '@documenso/lib/server-only/document/get-document-with-details-by-id';
@@ -35,6 +36,11 @@ export const DocumentEditPageView = async ({ params, team }: DocumentEditPageVie
 
   const { user } = await getRequiredServerComponentSession();
 
+  const isDocumentEnterprise = await isUserEnterprise({
+    userId: user.id,
+    teamId: team?.id,
+  });
+
   const document = await getDocumentWithDetailsById({
     id: documentId,
     userId: user.id,
@@ -97,6 +103,7 @@ export const DocumentEditPageView = async ({ params, team }: DocumentEditPageVie
         className="mt-8"
         initialDocument={document}
         documentRootPath={documentRootPath}
+        isDocumentEnterprise={isDocumentEnterprise}
       />
     </div>
   );

apps/web/src/app/(dashboard)/settings/security/passkeys/create-passkey-dialog.tsx

@@ -38,6 +38,7 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type CreatePasskeyDialogProps = {
   trigger?: React.ReactNode;
+  onSuccess?: () => void;
 } & Omit<DialogPrimitive.DialogProps, 'children'>;
 
 const ZCreatePasskeyFormSchema = z.object({
@@ -48,7 +49,7 @@ type TCreatePasskeyFormSchema = z.infer<typeof ZCreatePasskeyFormSchema>;
 
 const parser = new UAParser();
 
-export const CreatePasskeyDialog = ({ trigger, ...props }: CreatePasskeyDialogProps) => {
+export const CreatePasskeyDialog = ({ trigger, onSuccess, ...props }: CreatePasskeyDialogProps) => {
   const [open, setOpen] = useState(false);
   const [formError, setFormError] = useState<string | null>(null);
 
@@ -84,6 +85,7 @@ export const CreatePasskeyDialog = ({ trigger, ...props }: CreatePasskeyDialogPr
         duration: 5000,
       });
 
+      onSuccess?.();
       setOpen(false);
     } catch (err) {
       if (err.name === 'NotAllowedError') {

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

@@ -6,7 +6,9 @@ import { getServerSession } from 'next-auth';
 import { match } from 'ts-pattern';
 
 import signingCelebration from '@documenso/assets/images/signing-celebration.png';
+import { getServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentAndSenderByToken } from '@documenso/lib/server-only/document/get-document-by-token';
+import { isRecipientAuthorized } from '@documenso/lib/server-only/document/is-recipient-authorized';
 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';
@@ -17,6 +19,7 @@ import { SigningCard3D } from '@documenso/ui/components/signing-card';
 
 import { truncateTitle } from '~/helpers/truncate-title';
 
+import { SigningAuthPageView } from '../signing-auth-page';
 import { DocumentPreviewButton } from './document-preview-button';
 
 export type CompletedSigningPageProps = {
@@ -32,8 +35,11 @@ export default async function CompletedSigningPage({
     return notFound();
   }
 
+  const { user } = await getServerComponentSession();
+
   const document = await getDocumentAndSenderByToken({
     token,
+    requireAccessAuth: false,
   }).catch(() => null);
 
   if (!document || !document.documentData) {
@@ -53,6 +59,17 @@ export default async function CompletedSigningPage({
     return notFound();
   }
 
+  const isDocumentAccessValid = await isRecipientAuthorized({
+    type: 'ACCESS',
+    document,
+    recipient,
+    userId: user?.id,
+  });
+
+  if (!isDocumentAccessValid) {
+    return <SigningAuthPageView email={recipient.email} />;
+  }
+
   const signatures = await getRecipientSignatures({ recipientId: recipient.id });
 
   const recipientName =

apps/web/src/app/(signing)/sign/[token]/date-field.tsx

@@ -12,6 +12,8 @@ import {
 } from '@documenso/lib/constants/date-formats';
 import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -54,16 +56,23 @@ export const DateField = ({
 
   const tooltipText = `"${field.customText}" will appear on the document as it has a timezone of "${timezone}".`;
 
-  const onSign = async () => {
+  const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
         value: dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
+        authOptions,
       });
 
       startTransition(() => router.refresh());
     } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === AppErrorCode.UNAUTHORIZED) {
+        throw error;
+      }
+
       console.error(err);
 
       toast({

apps/web/src/app/(signing)/sign/[token]/document-action-auth-2fa.tsx

@@ -0,0 +1,172 @@
+import { useEffect, useState } from 'react';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+
+import { AppError } from '@documenso/lib/errors/app-error';
+import { DocumentAuth, type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
+import { RecipientRole } from '@documenso/prisma/client';
+import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import { DialogFooter } from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import { Input } from '@documenso/ui/primitives/input';
+
+import { EnableAuthenticatorAppDialog } from '~/components/forms/2fa/enable-authenticator-app-dialog';
+
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
+
+export type DocumentActionAuth2FAProps = {
+  actionTarget?: 'FIELD' | 'DOCUMENT';
+  actionVerb?: string;
+  open: boolean;
+  onOpenChange: (value: boolean) => void;
+  onReauthFormSubmit: (values?: TRecipientActionAuth) => Promise<void> | void;
+};
+
+const Z2FAAuthFormSchema = z.object({
+  token: z
+    .string()
+    .min(4, { message: 'Token must at least 4 characters long' })
+    .max(10, { message: 'Token must be at most 10 characters long' }),
+});
+
+type T2FAAuthFormSchema = z.infer<typeof Z2FAAuthFormSchema>;
+
+export const DocumentActionAuth2FA = ({
+  actionTarget = 'FIELD',
+  actionVerb = 'sign',
+  onReauthFormSubmit,
+  open,
+  onOpenChange,
+}: DocumentActionAuth2FAProps) => {
+  const { recipient, user, isCurrentlyAuthenticating, setIsCurrentlyAuthenticating } =
+    useRequiredDocumentAuthContext();
+
+  const form = useForm<T2FAAuthFormSchema>({
+    resolver: zodResolver(Z2FAAuthFormSchema),
+    defaultValues: {
+      token: '',
+    },
+  });
+
+  const [is2FASetupSuccessful, setIs2FASetupSuccessful] = useState(false);
+  const [formErrorCode, setFormErrorCode] = useState<string | null>(null);
+
+  const onFormSubmit = async ({ token }: T2FAAuthFormSchema) => {
+    try {
+      setIsCurrentlyAuthenticating(true);
+
+      await onReauthFormSubmit({
+        type: DocumentAuth.TWO_FACTOR_AUTH,
+        token,
+      });
+
+      setIsCurrentlyAuthenticating(false);
+
+      onOpenChange(false);
+    } catch (err) {
+      setIsCurrentlyAuthenticating(false);
+
+      const error = AppError.parseError(err);
+      setFormErrorCode(error.code);
+
+      // Todo: Alert.
+    }
+  };
+
+  useEffect(() => {
+    form.reset({
+      token: '',
+    });
+
+    setIs2FASetupSuccessful(false);
+    setFormErrorCode(null);
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [open]);
+
+  if (!user?.twoFactorEnabled && !is2FASetupSuccessful) {
+    return (
+      <div className="space-y-4">
+        <Alert variant="warning">
+          <AlertDescription>
+            <p>
+              {recipient.role === RecipientRole.VIEWER && actionTarget === 'DOCUMENT'
+                ? 'You need to setup 2FA to mark this document as viewed.'
+                : `You need to setup 2FA to ${actionVerb.toLowerCase()} this ${actionTarget.toLowerCase()}.`}
+            </p>
+
+            {user?.identityProvider === 'DOCUMENSO' && (
+              <p className="mt-2">
+                By enabling 2FA, you will be required to enter a code from your authenticator app
+                every time you sign in.
+              </p>
+            )}
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+            Close
+          </Button>
+
+          <EnableAuthenticatorAppDialog onSuccess={() => setIs2FASetupSuccessful(true)} />
+        </DialogFooter>
+      </div>
+    );
+  }
+
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onFormSubmit)}>
+        <fieldset disabled={isCurrentlyAuthenticating}>
+          <div className="space-y-4">
+            <FormField
+              control={form.control}
+              name="token"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel required>2FA token</FormLabel>
+
+                  <FormControl>
+                    <Input {...field} placeholder="Token" />
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            {formErrorCode && (
+              <Alert variant="destructive">
+                <AlertTitle>Unauthorized</AlertTitle>
+                <AlertDescription>
+                  We were unable to verify your details. Please try again or contact support
+                </AlertDescription>
+              </Alert>
+            )}
+
+            <DialogFooter>
+              <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+                Cancel
+              </Button>
+
+              <Button type="submit" loading={isCurrentlyAuthenticating}>
+                Sign
+              </Button>
+            </DialogFooter>
+          </div>
+        </fieldset>
+      </form>
+    </Form>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/document-action-auth-account.tsx

@@ -0,0 +1,79 @@
+import { useState } from 'react';
+
+import { DateTime } from 'luxon';
+import { signOut } from 'next-auth/react';
+
+import { RecipientRole } from '@documenso/prisma/client';
+import { trpc } from '@documenso/trpc/react';
+import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import { DialogFooter } from '@documenso/ui/primitives/dialog';
+
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
+
+export type DocumentActionAuthAccountProps = {
+  actionTarget?: 'FIELD' | 'DOCUMENT';
+  actionVerb?: string;
+  onOpenChange: (value: boolean) => void;
+};
+
+export const DocumentActionAuthAccount = ({
+  actionTarget = 'FIELD',
+  actionVerb = 'sign',
+  onOpenChange,
+}: DocumentActionAuthAccountProps) => {
+  const { recipient } = useRequiredDocumentAuthContext();
+
+  const [isSigningOut, setIsSigningOut] = useState(false);
+
+  const { mutateAsync: encryptSecondaryData } = trpc.crypto.encryptSecondaryData.useMutation();
+
+  const handleChangeAccount = async (email: string) => {
+    try {
+      setIsSigningOut(true);
+
+      const encryptedEmail = await encryptSecondaryData({
+        data: email,
+        expiresAt: DateTime.now().plus({ days: 1 }).toMillis(),
+      });
+
+      await signOut({
+        callbackUrl: `/signin?email=${encodeURIComponent(encryptedEmail)}`,
+      });
+    } catch {
+      setIsSigningOut(false);
+
+      // Todo: Alert.
+    }
+  };
+
+  return (
+    <fieldset disabled={isSigningOut} className="space-y-4">
+      <Alert variant="warning">
+        <AlertDescription>
+          {actionTarget === 'DOCUMENT' && recipient.role === RecipientRole.VIEWER ? (
+            <span>
+              To mark this document as viewed, you need to be logged in as{' '}
+              <strong>{recipient.email}</strong>
+            </span>
+          ) : (
+            <span>
+              To {actionVerb.toLowerCase()} this {actionTarget.toLowerCase()}, you need to be logged
+              in as <strong>{recipient.email}</strong>
+            </span>
+          )}
+        </AlertDescription>
+      </Alert>
+
+      <DialogFooter>
+        <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+          Cancel
+        </Button>
+
+        <Button onClick={async () => handleChangeAccount(recipient.email)} loading={isSigningOut}>
+          Login
+        </Button>
+      </DialogFooter>
+    </fieldset>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/document-action-auth-dialog.tsx

@@ -0,0 +1,90 @@
+import { P, match } from 'ts-pattern';
+
+import {
+  DocumentAuth,
+  type TRecipientActionAuth,
+  type TRecipientActionAuthTypes,
+} from '@documenso/lib/types/document-auth';
+import type { FieldType } from '@documenso/prisma/client';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@documenso/ui/primitives/dialog';
+
+import { DocumentActionAuth2FA } from './document-action-auth-2fa';
+import { DocumentActionAuthAccount } from './document-action-auth-account';
+import { DocumentActionAuthPasskey } from './document-action-auth-passkey';
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
+
+export type DocumentActionAuthDialogProps = {
+  title?: string;
+  documentAuthType: TRecipientActionAuthTypes;
+  description?: string;
+  actionTarget: FieldType | 'DOCUMENT';
+  open: boolean;
+  onOpenChange: (value: boolean) => void;
+
+  /**
+   * The callback to run when the reauth form is filled out.
+   */
+  onReauthFormSubmit: (values?: TRecipientActionAuth) => Promise<void> | void;
+};
+
+export const DocumentActionAuthDialog = ({
+  title,
+  description,
+  documentAuthType,
+  open,
+  onOpenChange,
+  onReauthFormSubmit,
+}: DocumentActionAuthDialogProps) => {
+  const { recipient, user, isCurrentlyAuthenticating } = useRequiredDocumentAuthContext();
+
+  const handleOnOpenChange = (value: boolean) => {
+    if (isCurrentlyAuthenticating) {
+      return;
+    }
+
+    onOpenChange(value);
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={handleOnOpenChange}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>{title || 'Sign field'}</DialogTitle>
+
+          <DialogDescription>
+            {description || 'Reauthentication is required to sign this field'}
+          </DialogDescription>
+        </DialogHeader>
+
+        {match({ documentAuthType, user })
+          .with(
+            { documentAuthType: DocumentAuth.ACCOUNT },
+            { user: P.when((user) => !user || user.email !== recipient.email) }, // Assume all current auth methods requires them to be logged in.
+            () => <DocumentActionAuthAccount onOpenChange={onOpenChange} />,
+          )
+          .with({ documentAuthType: DocumentAuth.PASSKEY }, () => (
+            <DocumentActionAuthPasskey
+              open={open}
+              onOpenChange={onOpenChange}
+              onReauthFormSubmit={onReauthFormSubmit}
+            />
+          ))
+          .with({ documentAuthType: DocumentAuth.TWO_FACTOR_AUTH }, () => (
+            <DocumentActionAuth2FA
+              open={open}
+              onOpenChange={onOpenChange}
+              onReauthFormSubmit={onReauthFormSubmit}
+            />
+          ))
+          .with({ documentAuthType: DocumentAuth.EXPLICIT_NONE }, () => null)
+          .exhaustive()}
+      </DialogContent>
+    </Dialog>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/document-action-auth-passkey.tsx

@@ -0,0 +1,252 @@
+import { useEffect, useState } from 'react';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { browserSupportsWebAuthn, startAuthentication } from '@simplewebauthn/browser';
+import { Loader } from 'lucide-react';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+
+import { AppError } from '@documenso/lib/errors/app-error';
+import { DocumentAuth, type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
+import { RecipientRole } from '@documenso/prisma/client';
+import { trpc } from '@documenso/trpc/react';
+import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import { DialogFooter } from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';
+
+import { CreatePasskeyDialog } from '~/app/(dashboard)/settings/security/passkeys/create-passkey-dialog';
+
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
+
+export type DocumentActionAuthPasskeyProps = {
+  actionTarget?: 'FIELD' | 'DOCUMENT';
+  actionVerb?: string;
+  open: boolean;
+  onOpenChange: (value: boolean) => void;
+  onReauthFormSubmit: (values?: TRecipientActionAuth) => Promise<void> | void;
+};
+
+const ZPasskeyAuthFormSchema = z.object({
+  passkeyId: z.string(),
+});
+
+type TPasskeyAuthFormSchema = z.infer<typeof ZPasskeyAuthFormSchema>;
+
+export const DocumentActionAuthPasskey = ({
+  actionTarget = 'FIELD',
+  actionVerb = 'sign',
+  onReauthFormSubmit,
+  open,
+  onOpenChange,
+}: DocumentActionAuthPasskeyProps) => {
+  const {
+    recipient,
+    passkeyData,
+    preferredPasskeyId,
+    setPreferredPasskeyId,
+    isCurrentlyAuthenticating,
+    setIsCurrentlyAuthenticating,
+    refetchPasskeys,
+  } = useRequiredDocumentAuthContext();
+
+  const form = useForm<TPasskeyAuthFormSchema>({
+    resolver: zodResolver(ZPasskeyAuthFormSchema),
+    defaultValues: {
+      passkeyId: preferredPasskeyId || '',
+    },
+  });
+
+  const { mutateAsync: createPasskeyAuthenticationOptions } =
+    trpc.auth.createPasskeyAuthenticationOptions.useMutation();
+
+  const [formErrorCode, setFormErrorCode] = useState<string | null>(null);
+
+  const onFormSubmit = async ({ passkeyId }: TPasskeyAuthFormSchema) => {
+    try {
+      setPreferredPasskeyId(passkeyId);
+      setIsCurrentlyAuthenticating(true);
+
+      const { options, tokenReference } = await createPasskeyAuthenticationOptions({
+        preferredPasskeyId: passkeyId,
+      });
+
+      const authenticationResponse = await startAuthentication(options);
+
+      await onReauthFormSubmit({
+        type: DocumentAuth.PASSKEY,
+        authenticationResponse,
+        tokenReference,
+      });
+
+      setIsCurrentlyAuthenticating(false);
+
+      onOpenChange(false);
+    } catch (err) {
+      setIsCurrentlyAuthenticating(false);
+
+      if (err.name === 'NotAllowedError') {
+        return;
+      }
+
+      const error = AppError.parseError(err);
+      setFormErrorCode(error.code);
+
+      // Todo: Alert.
+    }
+  };
+
+  useEffect(() => {
+    form.reset({
+      passkeyId: preferredPasskeyId || '',
+    });
+
+    setFormErrorCode(null);
+  }, [open, form, preferredPasskeyId]);
+
+  if (!browserSupportsWebAuthn()) {
+    return (
+      <div className="space-y-4">
+        <Alert variant="warning">
+          <AlertDescription>
+            Your browser does not support passkeys, which is required to {actionVerb.toLowerCase()}{' '}
+            this {actionTarget.toLowerCase()}.
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+            Close
+          </Button>
+        </DialogFooter>
+      </div>
+    );
+  }
+
+  if (passkeyData.isInitialLoading || (passkeyData.isError && passkeyData.passkeys.length === 0)) {
+    return (
+      <div className="flex h-28 items-center justify-center">
+        <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+      </div>
+    );
+  }
+
+  if (passkeyData.isError) {
+    return (
+      <div className="h-28 space-y-4">
+        <Alert variant="destructive">
+          <AlertDescription>Something went wrong while loading your passkeys.</AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+            Cancel
+          </Button>
+
+          <Button type="button" onClick={() => void refetchPasskeys()}>
+            Retry
+          </Button>
+        </DialogFooter>
+      </div>
+    );
+  }
+
+  if (passkeyData.passkeys.length === 0) {
+    return (
+      <div className="space-y-4">
+        <Alert variant="warning">
+          <AlertDescription>
+            {recipient.role === RecipientRole.VIEWER && actionTarget === 'DOCUMENT'
+              ? 'You need to setup a passkey to mark this document as viewed.'
+              : `You need to setup a passkey to ${actionVerb.toLowerCase()} this ${actionTarget.toLowerCase()}.`}
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+            Cancel
+          </Button>
+
+          <CreatePasskeyDialog
+            onSuccess={async () => refetchPasskeys()}
+            trigger={<Button>Setup</Button>}
+          />
+        </DialogFooter>
+      </div>
+    );
+  }
+
+  return (
+    <Form {...form}>
+      <form onSubmit={form.handleSubmit(onFormSubmit)}>
+        <fieldset disabled={isCurrentlyAuthenticating}>
+          <div className="space-y-4">
+            <FormField
+              control={form.control}
+              name="passkeyId"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel required>Passkey</FormLabel>
+
+                  <FormControl>
+                    <Select {...field} onValueChange={field.onChange}>
+                      <SelectTrigger className="bg-background text-muted-foreground">
+                        <SelectValue
+                          data-testid="documentAccessSelectValue"
+                          placeholder="Select passkey"
+                        />
+                      </SelectTrigger>
+
+                      <SelectContent position="popper">
+                        {passkeyData.passkeys.map((passkey) => (
+                          <SelectItem key={passkey.id} value={passkey.id}>
+                            {passkey.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
+                  </FormControl>
+
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            {formErrorCode && (
+              <Alert variant="destructive">
+                <AlertTitle>Unauthorized</AlertTitle>
+                <AlertDescription>
+                  We were unable to verify your details. Please try again or contact support
+                </AlertDescription>
+              </Alert>
+            )}
+
+            <DialogFooter>
+              <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+                Cancel
+              </Button>
+
+              <Button type="submit" loading={isCurrentlyAuthenticating}>
+                Sign
+              </Button>
+            </DialogFooter>
+          </div>
+        </fieldset>
+      </form>
+    </Form>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/document-auth-provider.tsx

@@ -0,0 +1,230 @@
+'use client';
+
+import { createContext, useContext, useEffect, useMemo, useState } from 'react';
+
+import { match } from 'ts-pattern';
+
+import { MAXIMUM_PASSKEYS } from '@documenso/lib/constants/auth';
+import type {
+  TDocumentAuthOptions,
+  TRecipientAccessAuthTypes,
+  TRecipientActionAuthTypes,
+  TRecipientAuthOptions,
+} from '@documenso/lib/types/document-auth';
+import { DocumentAuth } from '@documenso/lib/types/document-auth';
+import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
+import {
+  type Document,
+  FieldType,
+  type Passkey,
+  type Recipient,
+  type User,
+} from '@documenso/prisma/client';
+import { trpc } from '@documenso/trpc/react';
+
+import type { DocumentActionAuthDialogProps } from './document-action-auth-dialog';
+import { DocumentActionAuthDialog } from './document-action-auth-dialog';
+
+type PasskeyData = {
+  passkeys: Omit<Passkey, 'credentialId' | 'credentialPublicKey'>[];
+  isInitialLoading: boolean;
+  isRefetching: boolean;
+  isError: boolean;
+};
+
+export type DocumentAuthContextValue = {
+  executeActionAuthProcedure: (_value: ExecuteActionAuthProcedureOptions) => Promise<void>;
+  document: Document;
+  documentAuthOption: TDocumentAuthOptions;
+  setDocument: (_value: Document) => void;
+  recipient: Recipient;
+  recipientAuthOption: TRecipientAuthOptions;
+  setRecipient: (_value: Recipient) => void;
+  derivedRecipientAccessAuth: TRecipientAccessAuthTypes | null;
+  derivedRecipientActionAuth: TRecipientActionAuthTypes | null;
+  isAuthRedirectRequired: boolean;
+  isCurrentlyAuthenticating: boolean;
+  setIsCurrentlyAuthenticating: (_value: boolean) => void;
+  passkeyData: PasskeyData;
+  preferredPasskeyId: string | null;
+  setPreferredPasskeyId: (_value: string | null) => void;
+  user?: User | null;
+  refetchPasskeys: () => Promise<void>;
+};
+
+const DocumentAuthContext = createContext<DocumentAuthContextValue | null>(null);
+
+export const useDocumentAuthContext = () => {
+  return useContext(DocumentAuthContext);
+};
+
+export const useRequiredDocumentAuthContext = () => {
+  const context = useDocumentAuthContext();
+
+  if (!context) {
+    throw new Error('Document auth context is required');
+  }
+
+  return context;
+};
+
+export interface DocumentAuthProviderProps {
+  document: Document;
+  recipient: Recipient;
+  user?: User | null;
+  children: React.ReactNode;
+}
+
+export const DocumentAuthProvider = ({
+  document: initialDocument,
+  recipient: initialRecipient,
+  user,
+  children,
+}: DocumentAuthProviderProps) => {
+  const [document, setDocument] = useState(initialDocument);
+  const [recipient, setRecipient] = useState(initialRecipient);
+
+  const [isCurrentlyAuthenticating, setIsCurrentlyAuthenticating] = useState(false);
+  const [preferredPasskeyId, setPreferredPasskeyId] = useState<string | null>(null);
+
+  const {
+    documentAuthOption,
+    recipientAuthOption,
+    derivedRecipientAccessAuth,
+    derivedRecipientActionAuth,
+  } = useMemo(
+    () =>
+      extractDocumentAuthMethods({
+        documentAuth: document.authOptions,
+        recipientAuth: recipient.authOptions,
+      }),
+    [document, recipient],
+  );
+
+  const passkeyQuery = trpc.auth.findPasskeys.useQuery(
+    {
+      perPage: MAXIMUM_PASSKEYS,
+    },
+    {
+      keepPreviousData: true,
+      enabled: derivedRecipientActionAuth === DocumentAuth.PASSKEY,
+    },
+  );
+
+  const passkeyData: PasskeyData = {
+    passkeys: passkeyQuery.data?.data || [],
+    isInitialLoading: passkeyQuery.isInitialLoading,
+    isRefetching: passkeyQuery.isRefetching,
+    isError: passkeyQuery.isError,
+  };
+
+  const [documentAuthDialogPayload, setDocumentAuthDialogPayload] =
+    useState<ExecuteActionAuthProcedureOptions | null>(null);
+
+  /**
+   * The pre calculated auth payload if the current user is authenticated correctly
+   * for the `derivedRecipientActionAuth`.
+   *
+   * Will be `null` if the user still requires authentication, or if they don't need
+   * authentication.
+   */
+  const preCalculatedActionAuthOptions = match(derivedRecipientActionAuth)
+    .with(DocumentAuth.ACCOUNT, () => {
+      if (recipient.email !== user?.email) {
+        return null;
+      }
+
+      return {
+        type: DocumentAuth.ACCOUNT,
+      };
+    })
+    .with(DocumentAuth.EXPLICIT_NONE, () => ({
+      type: DocumentAuth.EXPLICIT_NONE,
+    }))
+    .with(DocumentAuth.PASSKEY, DocumentAuth.TWO_FACTOR_AUTH, null, () => null)
+    .exhaustive();
+
+  const executeActionAuthProcedure = async (options: ExecuteActionAuthProcedureOptions) => {
+    // Directly run callback if no auth required.
+    if (!derivedRecipientActionAuth || options.actionTarget !== FieldType.SIGNATURE) {
+      await options.onReauthFormSubmit();
+      return;
+    }
+
+    // Run callback with precalculated auth options if available.
+    if (preCalculatedActionAuthOptions) {
+      setDocumentAuthDialogPayload(null);
+      await options.onReauthFormSubmit(preCalculatedActionAuthOptions);
+      return;
+    }
+
+    // Request the required auth from the user.
+    setDocumentAuthDialogPayload({
+      ...options,
+    });
+  };
+
+  useEffect(() => {
+    const { passkeys } = passkeyData;
+
+    if (!preferredPasskeyId && passkeys.length > 0) {
+      setPreferredPasskeyId(passkeys[0].id);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [passkeyData.passkeys]);
+
+  // Assume that a user must be logged in for any auth requirements.
+  const isAuthRedirectRequired = Boolean(
+    derivedRecipientActionAuth &&
+      derivedRecipientActionAuth !== DocumentAuth.EXPLICIT_NONE &&
+      user?.email !== recipient.email,
+  );
+
+  const refetchPasskeys = async () => {
+    await passkeyQuery.refetch();
+  };
+
+  return (
+    <DocumentAuthContext.Provider
+      value={{
+        user,
+        document,
+        setDocument,
+        executeActionAuthProcedure,
+        recipient,
+        setRecipient,
+        documentAuthOption,
+        recipientAuthOption,
+        derivedRecipientAccessAuth,
+        derivedRecipientActionAuth,
+        isAuthRedirectRequired,
+        isCurrentlyAuthenticating,
+        setIsCurrentlyAuthenticating,
+        passkeyData,
+        preferredPasskeyId,
+        setPreferredPasskeyId,
+        refetchPasskeys,
+      }}
+    >
+      {children}
+
+      {documentAuthDialogPayload && derivedRecipientActionAuth && (
+        <DocumentActionAuthDialog
+          open={true}
+          onOpenChange={() => setDocumentAuthDialogPayload(null)}
+          onReauthFormSubmit={documentAuthDialogPayload.onReauthFormSubmit}
+          actionTarget={documentAuthDialogPayload.actionTarget}
+          documentAuthType={derivedRecipientActionAuth}
+        />
+      )}
+    </DocumentAuthContext.Provider>
+  );
+};
+
+type ExecuteActionAuthProcedureOptions = Omit<
+  DocumentActionAuthDialogProps,
+  'open' | 'onOpenChange' | 'documentAuthType' | 'recipientRole'
+>;
+
+DocumentAuthProvider.displayName = 'DocumentAuthProvider';

apps/web/src/app/(signing)/sign/[token]/email-field.tsx

@@ -7,6 +7,8 @@ import { useRouter } from 'next/navigation';
 import { Loader } from 'lucide-react';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -39,17 +41,24 @@ export const EmailField = ({ field, recipient }: EmailFieldProps) => {
 
   const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
 
-  const onSign = async () => {
+  const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
         value: providedEmail ?? '',
         isBase64: false,
+        authOptions,
       });
 
       startTransition(() => router.refresh());
     } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === AppErrorCode.UNAUTHORIZED) {
+        throw error;
+      }
+
       console.error(err);
 
       toast({

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

@@ -8,6 +8,7 @@ import { useSession } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
 
 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import { sortFieldsByPosition, validateFieldsInserted } from '@documenso/lib/utils/fields';
 import { type Document, type Field, type Recipient, RecipientRole } from '@documenso/prisma/client';
 import { trpc } from '@documenso/trpc/react';
@@ -41,10 +42,10 @@ export const SigningForm = ({ document, recipient, fields, redirectUrl }: Signin
   const { mutateAsync: completeDocumentWithToken } =
     trpc.recipient.completeDocumentWithToken.useMutation();
 
-  const {
-    handleSubmit,
-    formState: { isSubmitting },
-  } = useForm();
+  const { handleSubmit, formState } = useForm();
+
+  // Keep the loading state going if successful since the redirect may take some time.
+  const isSubmitting = formState.isSubmitting || formState.isSubmitSuccessful;
 
   const uninsertedFields = useMemo(() => {
     return sortFieldsByPosition(fields.filter((field) => !field.inserted));
@@ -64,9 +65,20 @@ export const SigningForm = ({ document, recipient, fields, redirectUrl }: Signin
       return;
     }
 
+    await completeDocument();
+
+    // Reauth is currently not required for completing the document.
+    // await executeActionAuthProcedure({
+    //   onReauthFormSubmit: completeDocument,
+    //   actionTarget: 'DOCUMENT',
+    // });
+  };
+
+  const completeDocument = async (authOptions?: TRecipientActionAuth) => {
     await completeDocumentWithToken({
       token: recipient.token,
       documentId: document.id,
+      authOptions,
     });
 
     analytics.capture('App: Recipient has completed signing', {

apps/web/src/app/(signing)/sign/[token]/name-field.tsx

@@ -7,7 +7,9 @@ import { useRouter } from 'next/navigation';
 import { Loader } from 'lucide-react';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
-import type { Recipient } from '@documenso/prisma/client';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
+import { type Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
 import { Button } from '@documenso/ui/primitives/button';
@@ -16,6 +18,7 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { useRequiredSigningContext } from './provider';
 import { SigningFieldContainer } from './signing-field-container';
 
@@ -32,6 +35,8 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   const { fullName: providedFullName, setFullName: setProvidedFullName } =
     useRequiredSigningContext();
 
+  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
+
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -47,9 +52,33 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   const [showFullNameModal, setShowFullNameModal] = useState(false);
   const [localFullName, setLocalFullName] = useState('');
 
-  const onSign = async (source: 'local' | 'provider' = 'provider') => {
+  const onPreSign = () => {
+    if (!providedFullName) {
+      setShowFullNameModal(true);
+      return false;
+    }
+
+    return true;
+  };
+
+  /**
+   * When the user clicks the sign button in the dialog where they enter their full name.
+   */
+  const onDialogSignClick = () => {
+    setShowFullNameModal(false);
+    setProvidedFullName(localFullName);
+
+    void executeActionAuthProcedure({
+      onReauthFormSubmit: async (authOptions) => await onSign(authOptions, localFullName),
+      actionTarget: field.type,
+    });
+  };
+
+  const onSign = async (authOptions?: TRecipientActionAuth, name?: string) => {
     try {
-      if (!providedFullName && !localFullName) {
+      const value = name || providedFullName;
+
+      if (!value) {
         setShowFullNameModal(true);
         return;
       }
@@ -57,18 +86,19 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
       await signFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
-        value: source === 'local' && localFullName ? localFullName : providedFullName ?? '',
+        value,
         isBase64: false,
+        authOptions,
       });
 
-      if (source === 'local' && !providedFullName) {
-        setProvidedFullName(localFullName);
-      }
-
-      setLocalFullName('');
-
       startTransition(() => router.refresh());
     } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === AppErrorCode.UNAUTHORIZED) {
+        throw error;
+      }
+
       console.error(err);
 
       toast({
@@ -99,7 +129,13 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Name">
+    <SigningFieldContainer
+      field={field}
+      onPreSign={onPreSign}
+      onSign={onSign}
+      onRemove={onRemove}
+      type="Name"
+    >
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -148,10 +184,7 @@ export const NameField = ({ field, recipient }: NameFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localFullName}
-                onClick={() => {
-                  setShowFullNameModal(false);
-                  void onSign('local');
-                }}
+                onClick={() => onDialogSignClick()}
               >
                 Sign
               </Button>

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

@@ -1,35 +1,24 @@
 import { headers } from 'next/headers';
 import { notFound, redirect } from 'next/navigation';
 
-import { match } from 'ts-pattern';
-
 import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
-import { DEFAULT_DOCUMENT_DATE_FORMAT } 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 { getServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 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 { 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';
 import { symmetricDecrypt } from '@documenso/lib/universal/crypto';
 import { extractNextHeaderRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
-import { DocumentStatus, FieldType, RecipientRole, SigningStatus } 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 { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
+import { DocumentStatus, SigningStatus } from '@documenso/prisma/client';
 
-import { truncateTitle } from '~/helpers/truncate-title';
-
-import { DateField } from './date-field';
-import { EmailField } from './email-field';
-import { SigningForm } from './form';
-import { NameField } from './name-field';
+import { DocumentAuthProvider } from './document-auth-provider';
 import { NoLongerAvailable } from './no-longer-available';
 import { SigningProvider } from './provider';
-import { SignatureField } from './signature-field';
-import { TextField } from './text-field';
+import { SigningAuthPageView } from './signing-auth-page';
+import { SigningPageView } from './signing-page-view';
 
 export type SigningPageProps = {
   params: {
@@ -42,6 +31,8 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
     return notFound();
   }
 
+  const { user } = await getServerComponentSession();
+
   const requestHeaders = Object.fromEntries(headers().entries());
 
   const requestMetadata = extractNextHeaderRequestMetadata(requestHeaders);
@@ -49,21 +40,40 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
   const [document, fields, recipient] = await Promise.all([
     getDocumentAndSenderByToken({
       token,
+      userId: user?.id,
+      requireAccessAuth: false,
     }).catch(() => null),
     getFieldsForToken({ token }),
     getRecipientByToken({ token }).catch(() => null),
-    viewedDocument({ token, requestMetadata }).catch(() => null),
   ]);
 
   if (!document || !document.documentData || !recipient) {
     return notFound();
   }
 
-  const truncatedTitle = truncateTitle(document.title);
+  const { derivedRecipientAccessAuth } = extractDocumentAuthMethods({
+    documentAuth: document.authOptions,
+    recipientAuth: recipient.authOptions,
+  });
 
-  const { documentData, documentMeta } = document;
+  const isDocumentAccessValid = await isRecipientAuthorized({
+    type: 'ACCESS',
+    document,
+    recipient,
+    userId: user?.id,
+  });
 
-  const { user } = await getServerComponentSession();
+  if (!isDocumentAccessValid) {
+    return <SigningAuthPageView email={recipient.email} />;
+  }
+
+  await viewedDocument({
+    token,
+    requestMetadata,
+    recipientAccessAuth: derivedRecipientAccessAuth,
+  }).catch(() => null);
+
+  const { documentMeta } = document;
 
   if (
     document.status === DocumentStatus.COMPLETED ||
@@ -109,73 +119,9 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
       fullName={user?.email === recipient.email ? user.name : recipient.name}
       signature={user?.email === recipient.email ? user.signature : undefined}
     >
-      <div className="mx-auto w-full max-w-screen-xl">
-        <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
-          {truncatedTitle}
-        </h1>
-
-        <div className="mt-2.5 flex items-center gap-x-6">
-          <p className="text-muted-foreground">
-            {document.User.name} ({document.User.email}) has invited you to{' '}
-            {recipient.role === RecipientRole.VIEWER && 'view'}
-            {recipient.role === RecipientRole.SIGNER && 'sign'}
-            {recipient.role === RecipientRole.APPROVER && 'approve'} this document.
-          </p>
-        </div>
-
-        <div className="mt-8 grid grid-cols-12 gap-y-8 lg:gap-x-8 lg:gap-y-0">
-          <Card
-            className="col-span-12 rounded-xl before:rounded-xl lg:col-span-7 xl:col-span-8"
-            gradient
-          >
-            <CardContent className="p-2">
-              <LazyPDFViewer
-                key={documentData.id}
-                documentData={documentData}
-                document={document}
-                password={documentMeta?.password}
-              />
-            </CardContent>
-          </Card>
-
-          <div className="col-span-12 lg:col-span-5 xl:col-span-4">
-            <SigningForm
-              document={document}
-              recipient={recipient}
-              fields={fields}
-              redirectUrl={documentMeta?.redirectUrl}
-            />
-          </div>
-        </div>
-
-        <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
-          {fields.map((field) =>
-            match(field.type)
-              .with(FieldType.SIGNATURE, () => (
-                <SignatureField key={field.id} field={field} recipient={recipient} />
-              ))
-              .with(FieldType.NAME, () => (
-                <NameField key={field.id} field={field} recipient={recipient} />
-              ))
-              .with(FieldType.DATE, () => (
-                <DateField
-                  key={field.id}
-                  field={field}
-                  recipient={recipient}
-                  dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
-                  timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
-                />
-              ))
-              .with(FieldType.EMAIL, () => (
-                <EmailField key={field.id} field={field} recipient={recipient} />
-              ))
-              .with(FieldType.TEXT, () => (
-                <TextField key={field.id} field={field} recipient={recipient} />
-              ))
-              .otherwise(() => null),
-          )}
-        </ElementVisible>
-      </div>
+      <DocumentAuthProvider document={document} recipient={recipient} user={user}>
+        <SigningPageView recipient={recipient} document={document} fields={fields} />
+      </DocumentAuthProvider>
     </SigningProvider>
   );
 }

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

@@ -33,8 +33,28 @@ export const SignDialog = ({
   const truncatedTitle = truncateTitle(document.title);
   const isComplete = fields.every((field) => field.inserted);
 
+  const handleOpenChange = (open: boolean) => {
+    if (isSubmitting || !isComplete) {
+      return;
+    }
+
+    // Reauth is currently not required for signing the document.
+    // if (isAuthRedirectRequired) {
+    //   await executeActionAuthProcedure({
+    //     actionTarget: 'DOCUMENT',
+    //     onReauthFormSubmit: () => {
+    //       // Do nothing since the user should be redirected.
+    //     },
+    //   });
+
+    //   return;
+    // }
+
+    setShowDialog(open);
+  };
+
   return (
-    <Dialog open={showDialog && isComplete} onOpenChange={setShowDialog}>
+    <Dialog open={showDialog} onOpenChange={handleOpenChange}>
       <DialogTrigger asChild>
         <Button
           className="w-full"

apps/web/src/app/(signing)/sign/[token]/signature-field.tsx

@@ -1,13 +1,15 @@
 'use client';
 
-import { useEffect, useMemo, useState, useTransition } from 'react';
+import { useMemo, useState, useTransition } from 'react';
 
 import { useRouter } from 'next/navigation';
 
 import { Loader } from 'lucide-react';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
-import type { Recipient } from '@documenso/prisma/client';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
+import { type Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
 import { Button } from '@documenso/ui/primitives/button';
@@ -16,6 +18,7 @@ import { Label } from '@documenso/ui/primitives/label';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { useRequiredSigningContext } from './provider';
 import { SigningFieldContainer } from './signing-field-container';
 
@@ -30,9 +33,12 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
   const router = useRouter();
 
   const { toast } = useToast();
+
   const { signature: providedSignature, setSignature: setProvidedSignature } =
     useRequiredSigningContext();
 
+  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
+
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -49,7 +55,6 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
 
   const [showSignatureModal, setShowSignatureModal] = useState(false);
   const [localSignature, setLocalSignature] = useState<string | null>(null);
-  const [isLocalSignatureSet, setIsLocalSignatureSet] = useState(false);
 
   const state = useMemo<SignatureFieldState>(() => {
     if (!field.inserted) {
@@ -63,23 +68,38 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
     return 'signed-text';
   }, [field.inserted, signature?.signatureImageAsBase64]);
 
-  useEffect(() => {
-    if (!showSignatureModal && !isLocalSignatureSet) {
-      setLocalSignature(null);
-    }
-  }, [showSignatureModal, isLocalSignatureSet]);
-
-  const onSign = async (source: 'local' | 'provider' = 'provider') => {
-    try {
-      if (!providedSignature && !localSignature) {
-        setIsLocalSignatureSet(false);
+  const onPreSign = () => {
+    if (!providedSignature) {
       setShowSignatureModal(true);
+      return false;
+    }
+
+    return true;
+  };
+
+  /**
+   * When the user clicks the sign button in the dialog where they enter their signature.
+   */
+  const onDialogSignClick = () => {
+    setShowSignatureModal(false);
+    setProvidedSignature(localSignature);
+
+    if (!localSignature) {
       return;
     }
 
-      const value = source === 'local' && localSignature ? localSignature : providedSignature ?? '';
+    void executeActionAuthProcedure({
+      onReauthFormSubmit: async (authOptions) => await onSign(authOptions, localSignature),
+      actionTarget: field.type,
+    });
+  };
+
+  const onSign = async (authOptions?: TRecipientActionAuth, signature?: string) => {
+    try {
+      const value = signature || providedSignature;
 
       if (!value) {
+        setShowSignatureModal(true);
         return;
       }
 
@@ -88,16 +108,17 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
         fieldId: field.id,
         value,
         isBase64: true,
+        authOptions,
       });
 
-      if (source === 'local' && !providedSignature) {
-        setProvidedSignature(localSignature);
-      }
-
-      setLocalSignature(null);
-
       startTransition(() => router.refresh());
     } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === AppErrorCode.UNAUTHORIZED) {
+        throw error;
+      }
+
       console.error(err);
 
       toast({
@@ -128,7 +149,13 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Signature">
+    <SigningFieldContainer
+      field={field}
+      onPreSign={onPreSign}
+      onSign={onSign}
+      onRemove={onRemove}
+      type="Signature"
+    >
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -191,11 +218,7 @@ export const SignatureField = ({ field, recipient }: SignatureFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localSignature}
-                onClick={() => {
-                  setShowSignatureModal(false);
-                  setIsLocalSignatureSet(true);
-                  void onSign('local');
-                }}
+                onClick={() => onDialogSignClick()}
               >
                 Sign
               </Button>

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

@@ -0,0 +1,67 @@
+'use client';
+
+import { useState } from 'react';
+
+import { DateTime } from 'luxon';
+import { signOut } from 'next-auth/react';
+
+import { trpc } from '@documenso/trpc/react';
+import { Button } from '@documenso/ui/primitives/button';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+export type SigningAuthPageViewProps = {
+  email: string;
+};
+
+export const SigningAuthPageView = ({ email }: SigningAuthPageViewProps) => {
+  const { toast } = useToast();
+
+  const [isSigningOut, setIsSigningOut] = useState(false);
+
+  const { mutateAsync: encryptSecondaryData } = trpc.crypto.encryptSecondaryData.useMutation();
+
+  const handleChangeAccount = async (email: string) => {
+    try {
+      setIsSigningOut(true);
+
+      const encryptedEmail = await encryptSecondaryData({
+        data: email,
+        expiresAt: DateTime.now().plus({ days: 1 }).toMillis(),
+      });
+
+      await signOut({
+        callbackUrl: `/signin?email=${encodeURIComponent(encryptedEmail)}`,
+      });
+    } catch {
+      toast({
+        title: 'Something went wrong',
+        description: 'We were unable to log you out at this time.',
+        duration: 10000,
+        variant: 'destructive',
+      });
+    }
+
+    setIsSigningOut(false);
+  };
+
+  return (
+    <div className="mx-auto flex h-[70vh] w-full max-w-md flex-col items-center justify-center">
+      <div>
+        <h1 className="text-3xl font-semibold">Authentication required</h1>
+
+        <p className="text-muted-foreground mt-2 text-sm">
+          You need to be logged in as <strong>{email}</strong> to view this page.
+        </p>
+
+        <Button
+          className="mt-4 w-full"
+          type="submit"
+          onClick={async () => handleChangeAccount(email)}
+          loading={isSigningOut}
+        >
+          Login
+        </Button>
+      </div>
+    </div>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/signing-field-container.tsx

@@ -2,15 +2,38 @@
 
 import React from 'react';
 
+import { type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
+import { FieldType } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { FieldRootContainer } from '@documenso/ui/components/field/field';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
+
 export type SignatureFieldProps = {
   field: FieldWithSignature;
   loading?: boolean;
   children: React.ReactNode;
-  onSign?: () => Promise<void> | void;
+
+  /**
+   * A function that is called before the field requires to be signed, or reauthed.
+   *
+   * Example, you may want to show a dialog prior to signing where they can enter a value.
+   *
+   * Once that action is complete, you will need to call `executeActionAuthProcedure` to proceed
+   * regardless if it requires reauth or not.
+   *
+   * If the function returns true, we will proceed with the signing process. Otherwise if
+   * false is returned we will not proceed.
+   */
+  onPreSign?: () => Promise<boolean> | boolean;
+
+  /**
+   * The function required to be executed to insert the field.
+   *
+   * The auth values will be passed in if available.
+   */
+  onSign?: (documentAuthValue?: TRecipientActionAuth) => Promise<void> | void;
   onRemove?: () => Promise<void> | void;
   type?: 'Date' | 'Email' | 'Name' | 'Signature';
   tooltipText?: string | null;
@@ -19,18 +42,56 @@ export type SignatureFieldProps = {
 export const SigningFieldContainer = ({
   field,
   loading,
+  onPreSign,
   onSign,
   onRemove,
   children,
   type,
   tooltipText,
 }: SignatureFieldProps) => {
-  const onSignFieldClick = async () => {
-    if (field.inserted) {
+  const { executeActionAuthProcedure, isAuthRedirectRequired } = useRequiredDocumentAuthContext();
+
+  const handleInsertField = async () => {
+    if (field.inserted || !onSign) {
       return;
     }
 
-    await onSign?.();
+    // Bypass reauth for non signature fields.
+    if (field.type !== FieldType.SIGNATURE) {
+      const presignResult = await onPreSign?.();
+
+      if (presignResult === false) {
+        return;
+      }
+
+      await onSign();
+      return;
+    }
+
+    if (isAuthRedirectRequired) {
+      await executeActionAuthProcedure({
+        onReauthFormSubmit: () => {
+          // Do nothing since the user should be redirected.
+        },
+        actionTarget: field.type,
+      });
+
+      return;
+    }
+
+    // Handle any presign requirements, and halt if required.
+    if (onPreSign) {
+      const preSignResult = await onPreSign();
+
+      if (preSignResult === false) {
+        return;
+      }
+    }
+
+    await executeActionAuthProcedure({
+      onReauthFormSubmit: onSign,
+      actionTarget: field.type,
+    });
   };
 
   const onRemoveSignedFieldClick = async () => {
@@ -47,7 +108,7 @@ export const SigningFieldContainer = ({
         <button
           type="submit"
           className="absolute inset-0 z-10 h-full w-full"
-          onClick={onSignFieldClick}
+          onClick={async () => handleInsertField()}
         />
       )}
 

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

@@ -0,0 +1,102 @@
+import { match } from 'ts-pattern';
+
+import { DEFAULT_DOCUMENT_DATE_FORMAT } 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 { DocumentAndSender } from '@documenso/lib/server-only/document/get-document-by-token';
+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 { truncateTitle } from '~/helpers/truncate-title';
+
+import { DateField } from './date-field';
+import { EmailField } from './email-field';
+import { SigningForm } from './form';
+import { NameField } from './name-field';
+import { SignatureField } from './signature-field';
+import { TextField } from './text-field';
+
+export type SigningPageViewProps = {
+  document: DocumentAndSender;
+  recipient: Recipient;
+  fields: Field[];
+};
+
+export const SigningPageView = ({ document, recipient, fields }: SigningPageViewProps) => {
+  const truncatedTitle = truncateTitle(document.title);
+
+  const { documentData, documentMeta } = document;
+
+  return (
+    <div className="mx-auto w-full max-w-screen-xl">
+      <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
+        {truncatedTitle}
+      </h1>
+
+      <div className="mt-2.5 flex items-center gap-x-6">
+        <p className="text-muted-foreground">
+          {document.User.name} ({document.User.email}) has invited you to{' '}
+          {recipient.role === RecipientRole.VIEWER && 'view'}
+          {recipient.role === RecipientRole.SIGNER && 'sign'}
+          {recipient.role === RecipientRole.APPROVER && 'approve'} this document.
+        </p>
+      </div>
+
+      <div className="mt-8 grid grid-cols-12 gap-y-8 lg:gap-x-8 lg:gap-y-0">
+        <Card
+          className="col-span-12 rounded-xl before:rounded-xl lg:col-span-7 xl:col-span-8"
+          gradient
+        >
+          <CardContent className="p-2">
+            <LazyPDFViewer
+              key={documentData.id}
+              documentData={documentData}
+              document={document}
+              password={documentMeta?.password}
+            />
+          </CardContent>
+        </Card>
+
+        <div className="col-span-12 lg:col-span-5 xl:col-span-4">
+          <SigningForm
+            document={document}
+            recipient={recipient}
+            fields={fields}
+            redirectUrl={documentMeta?.redirectUrl}
+          />
+        </div>
+      </div>
+
+      <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+        {fields.map((field) =>
+          match(field.type)
+            .with(FieldType.SIGNATURE, () => (
+              <SignatureField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.NAME, () => (
+              <NameField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.DATE, () => (
+              <DateField
+                key={field.id}
+                field={field}
+                recipient={recipient}
+                dateFormat={documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT}
+                timezone={documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE}
+              />
+            ))
+            .with(FieldType.EMAIL, () => (
+              <EmailField key={field.id} field={field} recipient={recipient} />
+            ))
+            .with(FieldType.TEXT, () => (
+              <TextField key={field.id} field={field} recipient={recipient} />
+            ))
+            .otherwise(() => null),
+        )}
+      </ElementVisible>
+    </div>
+  );
+};

apps/web/src/app/(signing)/sign/[token]/text-field.tsx

@@ -7,6 +7,8 @@ import { useRouter } from 'next/navigation';
 import { Loader } from 'lucide-react';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import type { TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import type { Recipient } from '@documenso/prisma/client';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -16,6 +18,7 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
+import { useRequiredDocumentAuthContext } from './document-auth-provider';
 import { SigningFieldContainer } from './signing-field-container';
 
 export type TextFieldProps = {
@@ -28,6 +31,8 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
 
   const { toast } = useToast();
 
+  const { executeActionAuthProcedure } = useRequiredDocumentAuthContext();
+
   const [isPending, startTransition] = useTransition();
 
   const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
@@ -42,22 +47,36 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
 
   const [showCustomTextModal, setShowCustomTextModal] = useState(false);
   const [localText, setLocalCustomText] = useState('');
-  const [isLocalSignatureSet, setIsLocalSignatureSet] = useState(false);
 
   useEffect(() => {
-    if (!showCustomTextModal && !isLocalSignatureSet) {
+    if (!showCustomTextModal) {
       setLocalCustomText('');
     }
-  }, [showCustomTextModal, isLocalSignatureSet]);
+  }, [showCustomTextModal]);
 
-  const onSign = async () => {
-    try {
+  /**
+   * When the user clicks the sign button in the dialog where they enter the text field.
+   */
+  const onDialogSignClick = () => {
+    setShowCustomTextModal(false);
+
+    void executeActionAuthProcedure({
+      onReauthFormSubmit: async (authOptions) => await onSign(authOptions),
+      actionTarget: field.type,
+    });
+  };
+
+  const onPreSign = () => {
     if (!localText) {
-        setIsLocalSignatureSet(false);
       setShowCustomTextModal(true);
-        return;
+      return false;
     }
 
+    return true;
+  };
+
+  const onSign = async (authOptions?: TRecipientActionAuth) => {
+    try {
       if (!localText) {
         return;
       }
@@ -67,12 +86,19 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
         fieldId: field.id,
         value: localText,
         isBase64: true,
+        authOptions,
       });
 
       setLocalCustomText('');
 
       startTransition(() => router.refresh());
     } catch (err) {
+      const error = AppError.parseError(err);
+
+      if (error.code === AppErrorCode.UNAUTHORIZED) {
+        throw error;
+      }
+
       console.error(err);
 
       toast({
@@ -103,7 +129,13 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
   };
 
   return (
-    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Signature">
+    <SigningFieldContainer
+      field={field}
+      onPreSign={onPreSign}
+      onSign={onSign}
+      onRemove={onRemove}
+      type="Signature"
+    >
       {isLoading && (
         <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
           <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
@@ -150,11 +182,7 @@ export const TextField = ({ field, recipient }: TextFieldProps) => {
                 type="button"
                 className="flex-1"
                 disabled={!localText}
-                onClick={() => {
-                  setShowCustomTextModal(false);
-                  setIsLocalSignatureSet(true);
-                  void onSign();
-                }}
+                onClick={() => onDialogSignClick()}
               >
                 Save Text
               </Button>

apps/web/src/app/layout.tsx

@@ -2,7 +2,6 @@ import { Suspense } from 'react';
 
 import { Caveat, Inter } from 'next/font/google';
 
-import { AxiomWebVitals } from 'next-axiom';
 import { PublicEnvScript } from 'next-runtime-env';
 
 import { FeatureFlagProvider } from '@documenso/lib/client-only/providers/feature-flag';
@@ -72,8 +71,6 @@ export default async function RootLayout({ children }: { children: React.ReactNo
         <PublicEnvScript />
       </head>
 
-      <AxiomWebVitals />
-
       <Suspense>
         <PostHogPageview />
       </Suspense>

apps/web/src/components/document/document-history-sheet.tsx

@@ -7,6 +7,7 @@ import { match } from 'ts-pattern';
 import { UAParser } from 'ua-parser-js';
 
 import { DOCUMENT_AUDIT_LOG_EMAIL_FORMAT } from '@documenso/lib/constants/document-audit-logs';
+import { DOCUMENT_AUTH_TYPES } from '@documenso/lib/constants/document-auth';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
 import { formatDocumentAuditLogActionString } from '@documenso/lib/utils/document-audit-logs';
 import { trpc } from '@documenso/trpc/react';
@@ -79,7 +80,11 @@ export const DocumentHistorySheet = ({
    * @param text The text to format
    * @returns The formatted text
    */
-  const formatGenericText = (text: string) => {
+  const formatGenericText = (text?: string | null) => {
+    if (!text) {
+      return '';
+    }
+
     return (text.charAt(0).toUpperCase() + text.slice(1).toLowerCase()).replaceAll('_', ' ');
   };
 
@@ -219,6 +224,24 @@ export const DocumentHistorySheet = ({
                       />
                     ),
                   )
+                  .with(
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED },
+                    ({ data }) => (
+                      <DocumentHistorySheetChanges
+                        values={[
+                          {
+                            key: 'Old',
+                            value: DOCUMENT_AUTH_TYPES[data.from || '']?.value || 'None',
+                          },
+                          {
+                            key: 'New',
+                            value: DOCUMENT_AUTH_TYPES[data.to || '']?.value || 'None',
+                          },
+                        ]}
+                      />
+                    ),
+                  )
                   .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED }, ({ data }) => {
                     if (data.changes.length === 0) {
                       return null;
@@ -281,6 +304,7 @@ export const DocumentHistorySheet = ({
                       ]}
                     />
                   ))
+
                   .exhaustive()}
 
                 {isUserDetailsVisible && (

apps/web/src/components/form/form-error-message.tsx

@@ -1,34 +0,0 @@
-import { AnimatePresence, motion } from 'framer-motion';
-
-import { cn } from '@documenso/ui/lib/utils';
-
-export type FormErrorMessageProps = {
-  className?: string;
-  error: { message?: string } | undefined;
-};
-
-export const FormErrorMessage = ({ error, className }: FormErrorMessageProps) => {
-  return (
-    <AnimatePresence>
-      {error && (
-        <motion.p
-          initial={{
-            opacity: 0,
-            y: -10,
-          }}
-          animate={{
-            opacity: 1,
-            y: 0,
-          }}
-          exit={{
-            opacity: 0,
-            y: 10,
-          }}
-          className={cn('text-xs text-red-500', className)}
-        >
-          {error.message}
-        </motion.p>
-      )}
-    </AnimatePresence>
-  );
-};

apps/web/src/components/forms/2fa/enable-authenticator-app-dialog.tsx

@@ -41,8 +41,13 @@ export const ZEnable2FAForm = z.object({
 
 export type TEnable2FAForm = z.infer<typeof ZEnable2FAForm>;
 
-export const EnableAuthenticatorAppDialog = () => {
+export type EnableAuthenticatorAppDialogProps = {
+  onSuccess?: () => void;
+};
+
+export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorAppDialogProps) => {
   const { toast } = useToast();
+
   const router = useRouter();
 
   const [isOpen, setIsOpen] = useState(false);
@@ -79,6 +84,7 @@ export const EnableAuthenticatorAppDialog = () => {
       const data = await enable2FA({ code: token });
 
       setRecoveryCodes(data.recoveryCodes);
+      onSuccess?.();
 
       toast({
         title: 'Two-factor authentication enabled',
@@ -89,7 +95,7 @@ export const EnableAuthenticatorAppDialog = () => {
       toast({
         title: 'Unable to setup two-factor authentication',
         description:
-          'We were unable to setup two-factor authentication for your account. Please ensure that you have entered your password correctly and try again.',
+          'We were unable to setup two-factor authentication for your account. Please ensure that you have entered your code correctly and try again.',
         variant: 'destructive',
       });
     }

apps/web/src/components/forms/signin.tsx

@@ -124,7 +124,7 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
   };
 
   const onSignInWithPasskey = async () => {
-    if (!browserSupportsWebAuthn) {
+    if (!browserSupportsWebAuthn()) {
       toast({
         title: 'Not supported',
         description: 'Passkeys are not supported on this browser',

docker/README.md

@@ -115,6 +115,7 @@ Here's a markdown table documenting all the provided environment variables:
 | `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`       | The path to the key file, default `/opt/documenso/cert.p12`.                                        |
 | `NEXT_PUBLIC_UPLOAD_TRANSPORT`               | The transport to use for file uploads (database or s3).                                             |
 | `NEXT_PRIVATE_UPLOAD_ENDPOINT`               | The endpoint for the S3 storage transport (for third-party S3-compatible providers).                |
+| `NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE`       | Whether to force path-style URLs for the S3 storage transport.                                      |
 | `NEXT_PRIVATE_UPLOAD_REGION`                 | The region for the S3 storage transport (defaults to us-east-1).                                    |
 | `NEXT_PRIVATE_UPLOAD_BUCKET`                 | The bucket to use for the S3 storage transport.                                                     |
 | `NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID`          | The access key ID for the S3 storage transport.                                                     |

docker/production/compose.yml

@@ -34,6 +34,7 @@ services:
       - NEXT_PRIVATE_DIRECT_DATABASE_URL=${NEXT_PRIVATE_DIRECT_DATABASE_URL:-${NEXT_PRIVATE_DATABASE_URL}}
       - NEXT_PUBLIC_UPLOAD_TRANSPORT=${NEXT_PUBLIC_UPLOAD_TRANSPORT:-database}
       - NEXT_PRIVATE_UPLOAD_ENDPOINT=${NEXT_PRIVATE_UPLOAD_ENDPOINT}
+      - NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE=${NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE}
       - NEXT_PRIVATE_UPLOAD_REGION=${NEXT_PRIVATE_UPLOAD_REGION}
       - NEXT_PRIVATE_UPLOAD_BUCKET=${NEXT_PRIVATE_UPLOAD_BUCKET}
       - NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID=${NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID}

package-lock.json

@@ -111,7 +111,6 @@
         "micro": "^10.0.1",
         "next": "14.0.3",
         "next-auth": "4.24.5",
-        "next-axiom": "^1.1.1",
         "next-plausible": "^3.10.1",
         "next-themes": "^0.2.1",
         "perfect-freehand": "^1.2.0",
@@ -16669,22 +16668,6 @@
         }
       }
     },
-    "node_modules/next-axiom": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/next-axiom/-/next-axiom-1.1.1.tgz",
-      "integrity": "sha512-0r/TJ+/zetD+uDc7B+2E7WpC86hEtQ1U+DuWYrP/JNmUz+ZdPFbrZgzOSqaZ6TwYbXP56VVlPfYwq1YsKHTHYQ==",
-      "dependencies": {
-        "remeda": "^1.29.0",
-        "whatwg-fetch": "^3.6.2"
-      },
-      "engines": {
-        "node": ">=18"
-      },
-      "peerDependencies": {
-        "next": ">=13.4",
-        "react": ">=18.0.0"
-      }
-    },
     "node_modules/next-contentlayer": {
       "version": "0.3.4",
       "resolved": "https://registry.npmjs.org/next-contentlayer/-/next-contentlayer-0.3.4.tgz",
@@ -22953,11 +22936,6 @@
       "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
       "integrity": "sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ=="
     },
-    "node_modules/whatwg-fetch": {
-      "version": "3.6.20",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz",
-      "integrity": "sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg=="
-    },
     "node_modules/whatwg-url": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-5.0.0.tgz",

packages/app-tests/e2e/document-auth/access-auth.spec.ts

@@ -0,0 +1,97 @@
+import { expect, test } from '@playwright/test';
+
+import { createDocumentAuthOptions } from '@documenso/lib/utils/document-auth';
+import { prisma } from '@documenso/prisma';
+import { seedPendingDocument } from '@documenso/prisma/seed/documents';
+import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+
+test.describe.configure({ mode: 'parallel' });
+
+test('[DOCUMENT_AUTH]: should grant access when not required', async ({ page }) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const document = await seedPendingDocument(user, [
+    recipientWithAccount,
+    'recipientwithoutaccount@documenso.com',
+  ]);
+
+  const recipients = await prisma.recipient.findMany({
+    where: {
+      documentId: document.id,
+    },
+  });
+
+  const tokens = recipients.map((recipient) => recipient.token);
+
+  for (const token of tokens) {
+    await page.goto(`/sign/${token}`);
+    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+  }
+
+  await unseedUser(user.id);
+});
+
+test('[DOCUMENT_AUTH]: should allow or deny access when required', async ({ page }) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const document = await seedPendingDocument(
+    user,
+    [recipientWithAccount, 'recipientwithoutaccount@documenso.com'],
+    {
+      createDocumentOptions: {
+        authOptions: createDocumentAuthOptions({
+          globalAccessAuth: 'ACCOUNT',
+          globalActionAuth: null,
+        }),
+      },
+    },
+  );
+
+  const recipients = await prisma.recipient.findMany({
+    where: {
+      documentId: document.id,
+    },
+  });
+
+  // Check that both are denied access.
+  for (const recipient of recipients) {
+    const { email, token } = recipient;
+
+    await page.goto(`/sign/${token}`);
+    await expect(page.getByRole('heading', { name: 'Authentication required' })).toBeVisible();
+    await expect(page.getByRole('paragraph')).toContainText(email);
+  }
+
+  await apiSignin({
+    page,
+    email: recipientWithAccount.email,
+    redirectPath: '/',
+  });
+
+  // Check that the one logged in is granted access.
+  for (const recipient of recipients) {
+    const { email, token } = recipient;
+
+    await page.goto(`/sign/${token}`);
+
+    // Recipient should be granted access.
+    if (recipient.email === recipientWithAccount.email) {
+      await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+    }
+
+    // Recipient should still be denied.
+    if (recipient.email !== recipientWithAccount.email) {
+      await expect(page.getByRole('heading', { name: 'Authentication required' })).toBeVisible();
+      await expect(page.getByRole('paragraph')).toContainText(email);
+    }
+  }
+
+  await unseedUser(user.id);
+  await unseedUser(recipientWithAccount.id);
+});

packages/app-tests/e2e/document-auth/action-auth.spec.ts

@@ -0,0 +1,418 @@
+import { expect, test } from '@playwright/test';
+
+import { ZRecipientAuthOptionsSchema } from '@documenso/lib/types/document-auth';
+import {
+  createDocumentAuthOptions,
+  createRecipientAuthOptions,
+} from '@documenso/lib/utils/document-auth';
+import { FieldType } from '@documenso/prisma/client';
+import {
+  seedPendingDocumentNoFields,
+  seedPendingDocumentWithFullFields,
+} from '@documenso/prisma/seed/documents';
+import { seedTestEmail, seedUser, unseedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin, apiSignout } from '../fixtures/authentication';
+
+test.describe.configure({ mode: 'parallel' });
+
+test('[DOCUMENT_AUTH]: should allow signing when no auth setup', async ({ page }) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: [recipientWithAccount, seedTestEmail()],
+  });
+
+  // Check that both are granted access.
+  for (const recipient of recipients) {
+    const { token, Field } = recipient;
+
+    const signUrl = `/sign/${token}`;
+
+    await page.goto(signUrl);
+    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+    // Add signature.
+    const canvas = page.locator('canvas');
+    const box = await canvas.boundingBox();
+    if (box) {
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
+      await page.mouse.up();
+    }
+
+    for (const field of Field) {
+      await page.locator(`#field-${field.id}`).getByRole('button').click();
+
+      if (field.type === FieldType.TEXT) {
+        await page.getByLabel('Custom Text').fill('TEXT');
+        await page.getByRole('button', { name: 'Save Text' }).click();
+      }
+
+      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
+    }
+
+    await page.getByRole('button', { name: 'Complete' }).click();
+    await page.getByRole('button', { name: 'Sign' }).click();
+    await page.waitForURL(`${signUrl}/complete`);
+  }
+
+  await unseedUser(user.id);
+  await unseedUser(recipientWithAccount.id);
+});
+
+test('[DOCUMENT_AUTH]: should allow signing with valid global auth', async ({ page }) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: [recipientWithAccount],
+    updateDocumentOptions: {
+      authOptions: createDocumentAuthOptions({
+        globalAccessAuth: null,
+        globalActionAuth: 'ACCOUNT',
+      }),
+    },
+  });
+
+  const recipient = recipients[0];
+
+  const { token, Field } = recipient;
+
+  const signUrl = `/sign/${token}`;
+
+  await apiSignin({
+    page,
+    email: recipientWithAccount.email,
+    redirectPath: signUrl,
+  });
+
+  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+  // Add signature.
+  const canvas = page.locator('canvas');
+  const box = await canvas.boundingBox();
+  if (box) {
+    await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+    await page.mouse.down();
+    await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
+    await page.mouse.up();
+  }
+
+  for (const field of Field) {
+    await page.locator(`#field-${field.id}`).getByRole('button').click();
+
+    if (field.type === FieldType.TEXT) {
+      await page.getByLabel('Custom Text').fill('TEXT');
+      await page.getByRole('button', { name: 'Save Text' }).click();
+    }
+
+    await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
+  }
+
+  await page.getByRole('button', { name: 'Complete' }).click();
+  await page.getByRole('button', { name: 'Sign' }).click();
+  await page.waitForURL(`${signUrl}/complete`);
+
+  await unseedUser(user.id);
+  await unseedUser(recipientWithAccount.id);
+});
+
+// Currently document auth for signing/approving/viewing is not required.
+test.skip('[DOCUMENT_AUTH]: should deny signing document when required for global auth', async ({
+  page,
+}) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const { recipients } = await seedPendingDocumentNoFields({
+    owner: user,
+    recipients: [recipientWithAccount],
+    updateDocumentOptions: {
+      authOptions: createDocumentAuthOptions({
+        globalAccessAuth: null,
+        globalActionAuth: 'ACCOUNT',
+      }),
+    },
+  });
+
+  const recipient = recipients[0];
+
+  const { token } = recipient;
+
+  await page.goto(`/sign/${token}`);
+  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+  await page.getByRole('button', { name: 'Complete' }).click();
+  await expect(page.getByRole('paragraph')).toContainText(
+    'Reauthentication is required to sign the document',
+  );
+
+  await unseedUser(user.id);
+  await unseedUser(recipientWithAccount.id);
+});
+
+test('[DOCUMENT_AUTH]: should deny signing fields when required for global auth', async ({
+  page,
+}) => {
+  const user = await seedUser();
+
+  const recipientWithAccount = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: [recipientWithAccount, seedTestEmail()],
+    updateDocumentOptions: {
+      authOptions: createDocumentAuthOptions({
+        globalAccessAuth: null,
+        globalActionAuth: 'ACCOUNT',
+      }),
+    },
+  });
+
+  // Check that both are denied access.
+  for (const recipient of recipients) {
+    const { token, Field } = recipient;
+
+    await page.goto(`/sign/${token}`);
+    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+    for (const field of Field) {
+      if (field.type !== FieldType.SIGNATURE) {
+        continue;
+      }
+
+      await page.locator(`#field-${field.id}`).getByRole('button').click();
+      await expect(page.getByRole('paragraph')).toContainText(
+        'Reauthentication is required to sign this field',
+      );
+      await page.getByRole('button', { name: 'Cancel' }).click();
+    }
+  }
+
+  await unseedUser(user.id);
+  await unseedUser(recipientWithAccount.id);
+});
+
+test('[DOCUMENT_AUTH]: should allow field signing when required for recipient auth', async ({
+  page,
+}) => {
+  const user = await seedUser();
+
+  const recipientWithInheritAuth = await seedUser();
+  const recipientWithExplicitNoneAuth = await seedUser();
+  const recipientWithExplicitAccountAuth = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: [
+      recipientWithInheritAuth,
+      recipientWithExplicitNoneAuth,
+      recipientWithExplicitAccountAuth,
+    ],
+    recipientsCreateOptions: [
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: null,
+        }),
+      },
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: 'EXPLICIT_NONE',
+        }),
+      },
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: 'ACCOUNT',
+        }),
+      },
+    ],
+    fields: [FieldType.DATE],
+  });
+
+  for (const recipient of recipients) {
+    const { token, Field } = recipient;
+    const { actionAuth } = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
+
+    // This document has no global action auth, so only account should require auth.
+    const isAuthRequired = actionAuth === 'ACCOUNT';
+
+    const signUrl = `/sign/${token}`;
+
+    await page.goto(signUrl);
+    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+    if (isAuthRequired) {
+      for (const field of Field) {
+        if (field.type !== FieldType.SIGNATURE) {
+          continue;
+        }
+
+        await page.locator(`#field-${field.id}`).getByRole('button').click();
+        await expect(page.getByRole('paragraph')).toContainText(
+          'Reauthentication is required to sign this field',
+        );
+        await page.getByRole('button', { name: 'Cancel' }).click();
+      }
+
+      // Sign in and it should work.
+      await apiSignin({
+        page,
+        email: recipient.email,
+        redirectPath: signUrl,
+      });
+    }
+
+    // Add signature.
+    const canvas = page.locator('canvas');
+    const box = await canvas.boundingBox();
+    if (box) {
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
+      await page.mouse.up();
+    }
+
+    for (const field of Field) {
+      await page.locator(`#field-${field.id}`).getByRole('button').click();
+
+      if (field.type === FieldType.TEXT) {
+        await page.getByLabel('Custom Text').fill('TEXT');
+        await page.getByRole('button', { name: 'Save Text' }).click();
+      }
+
+      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true', {
+        timeout: 5000,
+      });
+    }
+
+    await page.getByRole('button', { name: 'Complete' }).click();
+    await page.getByRole('button', { name: 'Sign' }).click();
+    await page.waitForURL(`${signUrl}/complete`);
+
+    if (isAuthRequired) {
+      await apiSignout({ page });
+    }
+  }
+});
+
+test('[DOCUMENT_AUTH]: should allow field signing when required for recipient and global auth', async ({
+  page,
+}) => {
+  const user = await seedUser();
+
+  const recipientWithInheritAuth = await seedUser();
+  const recipientWithExplicitNoneAuth = await seedUser();
+  const recipientWithExplicitAccountAuth = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: [
+      recipientWithInheritAuth,
+      recipientWithExplicitNoneAuth,
+      recipientWithExplicitAccountAuth,
+    ],
+    recipientsCreateOptions: [
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: null,
+        }),
+      },
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: 'EXPLICIT_NONE',
+        }),
+      },
+      {
+        authOptions: createRecipientAuthOptions({
+          accessAuth: null,
+          actionAuth: 'ACCOUNT',
+        }),
+      },
+    ],
+    fields: [FieldType.DATE],
+    updateDocumentOptions: {
+      authOptions: createDocumentAuthOptions({
+        globalAccessAuth: null,
+        globalActionAuth: 'ACCOUNT',
+      }),
+    },
+  });
+
+  for (const recipient of recipients) {
+    const { token, Field } = recipient;
+    const { actionAuth } = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
+
+    // This document HAS global action auth, so account and inherit should require auth.
+    const isAuthRequired = actionAuth === 'ACCOUNT' || actionAuth === null;
+
+    const signUrl = `/sign/${token}`;
+
+    await page.goto(signUrl);
+    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
+
+    if (isAuthRequired) {
+      for (const field of Field) {
+        if (field.type !== FieldType.SIGNATURE) {
+          continue;
+        }
+
+        await page.locator(`#field-${field.id}`).getByRole('button').click();
+        await expect(page.getByRole('paragraph')).toContainText(
+          'Reauthentication is required to sign this field',
+        );
+        await page.getByRole('button', { name: 'Cancel' }).click();
+      }
+
+      // Sign in and it should work.
+      await apiSignin({
+        page,
+        email: recipient.email,
+        redirectPath: signUrl,
+      });
+    }
+
+    // Add signature.
+    const canvas = page.locator('canvas');
+    const box = await canvas.boundingBox();
+    if (box) {
+      await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);
+      await page.mouse.down();
+      await page.mouse.move(box.x + box.width / 4, box.y + box.height / 4);
+      await page.mouse.up();
+    }
+
+    for (const field of Field) {
+      await page.locator(`#field-${field.id}`).getByRole('button').click();
+
+      if (field.type === FieldType.TEXT) {
+        await page.getByLabel('Custom Text').fill('TEXT');
+        await page.getByRole('button', { name: 'Save Text' }).click();
+      }
+
+      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true', {
+        timeout: 5000,
+      });
+    }
+
+    await page.getByRole('button', { name: 'Complete' }).click();
+    await page.getByRole('button', { name: 'Sign' }).click();
+    await page.waitForURL(`${signUrl}/complete`);
+
+    if (isAuthRequired) {
+      await apiSignout({ page });
+    }
+  }
+});

packages/app-tests/e2e/document-flow/settings-step.spec.ts

@@ -0,0 +1,200 @@
+import { expect, test } from '@playwright/test';
+
+import {
+  seedBlankDocument,
+  seedDraftDocument,
+  seedPendingDocument,
+} from '@documenso/prisma/seed/documents';
+import { seedUserSubscription } from '@documenso/prisma/seed/subscriptions';
+import { seedTeam, unseedTeam } from '@documenso/prisma/seed/teams';
+import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+
+test.describe.configure({ mode: 'parallel' });
+
+test.describe('[EE_ONLY]', () => {
+  const enterprisePriceId = process.env.NEXT_PUBLIC_STRIPE_ENTERPRISE_PLAN_MONTHLY_PRICE_ID || '';
+
+  test.beforeEach(() => {
+    test.skip(
+      process.env.NEXT_PUBLIC_FEATURE_BILLING_ENABLED !== 'true' || !enterprisePriceId,
+      'Billing required for this test',
+    );
+  });
+
+  test('[DOCUMENT_FLOW] add action auth settings', async ({ page }) => {
+    const user = await seedUser();
+
+    await seedUserSubscription({
+      userId: user.id,
+      priceId: enterprisePriceId,
+    });
+
+    const document = await seedBlankDocument(user);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/documents/${document.id}/edit`,
+    });
+
+    // Set EE action auth.
+    await page.getByTestId('documentActionSelectValue').click();
+    await page.getByLabel('Require account').getByText('Require account').click();
+    await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
+
+    // Save the settings by going to the next step.
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Return to the settings step to check that the results are saved correctly.
+    await page.getByRole('button', { name: 'Go Back' }).click();
+    await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
+
+    // Todo: Verify that the values are correct once we fix the issue where going back
+    // does not show the updated values.
+    // await expect(page.getByLabel('Title')).toContainText('New Title');
+    // await expect(page.getByTestId('documentAccessSelectValue')).toContainText('Require account');
+    // await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
+
+    await unseedUser(user.id);
+  });
+
+  test('[DOCUMENT_FLOW] enterprise team member can add action auth settings', async ({ page }) => {
+    const team = await seedTeam({
+      createTeamMembers: 1,
+    });
+
+    const owner = team.owner;
+    const teamMemberUser = team.members[1].user;
+
+    // Make the team enterprise by giving the owner the enterprise subscription.
+    await seedUserSubscription({
+      userId: team.ownerUserId,
+      priceId: enterprisePriceId,
+    });
+
+    const document = await seedBlankDocument(owner, {
+      createDocumentOptions: {
+        teamId: team.id,
+      },
+    });
+
+    await apiSignin({
+      page,
+      email: teamMemberUser.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Set EE action auth.
+    await page.getByTestId('documentActionSelectValue').click();
+    await page.getByLabel('Require account').getByText('Require account').click();
+    await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
+
+    // Save the settings by going to the next step.
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Advanced settings should be visible.
+    await expect(page.getByLabel('Show advanced settings')).toBeVisible();
+
+    await unseedTeam(team.url);
+  });
+
+  test('[DOCUMENT_FLOW] enterprise team member should not have access to enterprise on personal account', async ({
+    page,
+  }) => {
+    const team = await seedTeam({
+      createTeamMembers: 1,
+    });
+
+    const teamMemberUser = team.members[1].user;
+
+    // Make the team enterprise by giving the owner the enterprise subscription.
+    await seedUserSubscription({
+      userId: team.ownerUserId,
+      priceId: enterprisePriceId,
+    });
+
+    const document = await seedBlankDocument(teamMemberUser);
+
+    await apiSignin({
+      page,
+      email: teamMemberUser.email,
+      redirectPath: `/documents/${document.id}/edit`,
+    });
+
+    // Global action auth should not be visible.
+    await expect(page.getByTestId('documentActionSelectValue')).not.toBeVisible();
+
+    // Next step.
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Advanced settings should not be visible.
+    await expect(page.getByLabel('Show advanced settings')).not.toBeVisible();
+
+    await unseedTeam(team.url);
+  });
+});
+
+test('[DOCUMENT_FLOW]: add settings', async ({ page }) => {
+  const user = await seedUser();
+  const document = await seedBlankDocument(user);
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/documents/${document.id}/edit`,
+  });
+
+  // Set title.
+  await page.getByLabel('Title').fill('New Title');
+
+  // Set access auth.
+  await page.getByTestId('documentAccessSelectValue').click();
+  await page.getByLabel('Require account').getByText('Require account').click();
+  await expect(page.getByTestId('documentAccessSelectValue')).toContainText('Require account');
+
+  // Action auth should NOT be visible.
+  await expect(page.getByTestId('documentActionSelectValue')).not.toBeVisible();
+
+  // Save the settings by going to the next step.
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Return to the settings step to check that the results are saved correctly.
+  await page.getByRole('button', { name: 'Go Back' }).click();
+  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
+
+  // Todo: Verify that the values are correct once we fix the issue where going back
+  // does not show the updated values.
+  // await expect(page.getByLabel('Title')).toContainText('New Title');
+  // await expect(page.getByTestId('documentAccessSelectValue')).toContainText('Require account');
+  // await expect(page.getByTestId('documentActionSelectValue')).toContainText('Require account');
+
+  await unseedUser(user.id);
+});
+
+test('[DOCUMENT_FLOW]: title should be disabled depending on document status', async ({ page }) => {
+  const user = await seedUser();
+
+  const pendingDocument = await seedPendingDocument(user, []);
+  const draftDocument = await seedDraftDocument(user, []);
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/documents/${pendingDocument.id}/edit`,
+  });
+
+  // Should be disabled for pending documents.
+  await expect(page.getByLabel('Title')).toBeDisabled();
+
+  // Should be enabled for draft documents.
+  await page.goto(`/documents/${draftDocument.id}/edit`);
+  await expect(page.getByLabel('Title')).toBeEnabled();
+
+  await unseedUser(user.id);
+});

packages/app-tests/e2e/document-flow/signers-step.spec.ts

@@ -0,0 +1,118 @@
+import { expect, test } from '@playwright/test';
+
+import { seedBlankDocument } from '@documenso/prisma/seed/documents';
+import { seedUserSubscription } from '@documenso/prisma/seed/subscriptions';
+import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+
+test.describe.configure({ mode: 'parallel' });
+
+test.describe('[EE_ONLY]', () => {
+  const enterprisePriceId = process.env.NEXT_PUBLIC_STRIPE_ENTERPRISE_PLAN_MONTHLY_PRICE_ID || '';
+
+  test.beforeEach(() => {
+    test.skip(
+      process.env.NEXT_PUBLIC_FEATURE_BILLING_ENABLED !== 'true' || !enterprisePriceId,
+      'Billing required for this test',
+    );
+  });
+
+  test('[DOCUMENT_FLOW] add EE settings', async ({ page }) => {
+    const user = await seedUser();
+
+    await seedUserSubscription({
+      userId: user.id,
+      priceId: enterprisePriceId,
+    });
+
+    const document = await seedBlankDocument(user);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/documents/${document.id}/edit`,
+    });
+
+    // Save the settings by going to the next step.
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Add 2 signers.
+    await page.getByPlaceholder('Email').fill('recipient1@documenso.com');
+    await page.getByPlaceholder('Name').fill('Recipient 1');
+    await page.getByRole('button', { name: 'Add Signer' }).click();
+    await page
+      .getByRole('textbox', { name: 'Email', exact: true })
+      .fill('recipient2@documenso.com');
+    await page.getByRole('textbox', { name: 'Name', exact: true }).fill('Recipient 2');
+
+    // Display advanced settings.
+    await page.getByLabel('Show advanced settings').click();
+
+    // Navigate to the next step and back.
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+    await page.getByRole('button', { name: 'Go Back' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Todo: Fix stepper component back issue before finishing test.
+
+    await unseedUser(user.id);
+  });
+});
+
+// Note: Not complete yet due to issue with back button.
+test('[DOCUMENT_FLOW]: add signers', async ({ page }) => {
+  const user = await seedUser();
+  const document = await seedBlankDocument(user);
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/documents/${document.id}/edit`,
+  });
+
+  // Save the settings by going to the next step.
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Add 2 signers.
+  await page.getByPlaceholder('Email').fill('recipient1@documenso.com');
+  await page.getByPlaceholder('Name').fill('Recipient 1');
+  await page.getByRole('button', { name: 'Add Signer' }).click();
+  await page.getByRole('textbox', { name: 'Email', exact: true }).fill('recipient2@documenso.com');
+  await page.getByRole('textbox', { name: 'Name', exact: true }).fill('Recipient 2');
+
+  // Advanced settings should not be visible for non EE users.
+  await expect(page.getByLabel('Show advanced settings')).toBeHidden();
+
+  // Navigate to the next step and back.
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+  await page.getByRole('button', { name: 'Go Back' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Todo: Fix stepper component back issue before finishing test.
+
+  // // Expect that the advanced settings is unchecked, since no advanced settings were applied.
+  // await expect(page.getByLabel('Show advanced settings')).toBeChecked({ checked: false });
+
+  // // Add advanced settings for a single recipient.
+  // await page.getByLabel('Show advanced settings').click();
+  // await page.getByRole('combobox').first().click();
+  // await page.getByLabel('Require account').click();
+
+  // // Navigate to the next step and back.
+  // await page.getByRole('button', { name: 'Continue' }).click();
+  // await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+  // await page.getByRole('button', { name: 'Go Back' }).click();
+  // await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Expect that the advanced settings is visible, and the checkbox is hidden. Since advanced
+  // settings were applied.
+
+  // Todo: Fix stepper component back issue before finishing test.
+
+  await unseedUser(user.id);
+});

packages/app-tests/e2e/fixtures/authentication.ts

@@ -1,8 +1,8 @@
-import type { Page } from '@playwright/test';
+import { type Page } from '@playwright/test';
 
 import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 
-type ManualLoginOptions = {
+type LoginOptions = {
   page: Page;
   email?: string;
   password?: string;
@@ -18,7 +18,7 @@ export const manualLogin = async ({
   email = 'example@documenso.com',
   password = 'password',
   redirectPath,
-}: ManualLoginOptions) => {
+}: LoginOptions) => {
   await page.goto(`${WEBAPP_BASE_URL}/signin`);
 
   await page.getByLabel('Email').click();
@@ -33,9 +33,63 @@ export const manualLogin = async ({
   }
 };
 
-export const manualSignout = async ({ page }: ManualLoginOptions) => {
+export const manualSignout = async ({ page }: LoginOptions) => {
   await page.waitForTimeout(1000);
   await page.getByTestId('menu-switcher').click();
   await page.getByRole('menuitem', { name: 'Sign Out' }).click();
   await page.waitForURL(`${WEBAPP_BASE_URL}/signin`);
 };
+
+export const apiSignin = async ({
+  page,
+  email = 'example@documenso.com',
+  password = 'password',
+  redirectPath = '/',
+}: LoginOptions) => {
+  const { request } = page.context();
+
+  const csrfToken = await getCsrfToken(page);
+
+  await request.post(`${WEBAPP_BASE_URL}/api/auth/callback/credentials`, {
+    form: {
+      email,
+      password,
+      json: true,
+      csrfToken,
+    },
+  });
+
+  if (redirectPath) {
+    await page.goto(`${WEBAPP_BASE_URL}${redirectPath}`);
+  }
+};
+
+export const apiSignout = async ({ page }: { page: Page }) => {
+  const { request } = page.context();
+
+  const csrfToken = await getCsrfToken(page);
+
+  await request.post(`${WEBAPP_BASE_URL}/api/auth/signout`, {
+    form: {
+      csrfToken,
+      json: true,
+    },
+  });
+
+  await page.goto(`${WEBAPP_BASE_URL}/signin`);
+};
+
+const getCsrfToken = async (page: Page) => {
+  const { request } = page.context();
+
+  const response = await request.fetch(`${WEBAPP_BASE_URL}/api/auth/csrf`, {
+    method: 'get',
+  });
+
+  const { csrfToken } = await response.json();
+  if (!csrfToken) {
+    throw new Error('Invalid session');
+  }
+
+  return csrfToken;
+};

packages/app-tests/e2e/pr-718-add-stepper-component.spec.ts

@@ -4,17 +4,21 @@ import path from 'node:path';
 import { getDocumentByToken } from '@documenso/lib/server-only/document/get-document-by-token';
 import { getRecipientByEmail } from '@documenso/lib/server-only/recipient/get-recipient-by-email';
 import { DocumentStatus } from '@documenso/prisma/client';
-import { TEST_USER } from '@documenso/prisma/seed/pr-718-add-stepper-component';
+import { seedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from './fixtures/authentication';
 
 test(`[PR-718]: should be able to create a document`, async ({ page }) => {
   await page.goto('/signin');
 
   const documentTitle = `example-${Date.now()}.pdf`;
 
-  // Sign in
-  await page.getByLabel('Email').fill(TEST_USER.email);
-  await page.getByLabel('Password', { exact: true }).fill(TEST_USER.password);
-  await page.getByRole('button', { name: 'Sign In' }).click();
+  const user = await seedUser();
+
+  await apiSignin({
+    page,
+    email: user.email,
+  });
 
   // Upload document
   const [fileChooser] = await Promise.all([
@@ -31,8 +35,8 @@ test(`[PR-718]: should be able to create a document`, async ({ page }) => {
   // Wait to be redirected to the edit page
   await page.waitForURL(/\/documents\/\d+/);
 
-  // Set title
-  await expect(page.getByRole('heading', { name: 'Add Title' })).toBeVisible();
+  // Set general settings
+  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
 
   await page.getByLabel('Title').fill(documentTitle);
 
@@ -82,10 +86,12 @@ test('should be able to create a document with multiple recipients', async ({ pa
 
   const documentTitle = `example-${Date.now()}.pdf`;
 
-  // Sign in
-  await page.getByLabel('Email').fill(TEST_USER.email);
-  await page.getByLabel('Password', { exact: true }).fill(TEST_USER.password);
-  await page.getByRole('button', { name: 'Sign In' }).click();
+  const user = await seedUser();
+
+  await apiSignin({
+    page,
+    email: user.email,
+  });
 
   // Upload document
   const [fileChooser] = await Promise.all([
@@ -103,7 +109,7 @@ test('should be able to create a document with multiple recipients', async ({ pa
   await page.waitForURL(/\/documents\/\d+/);
 
   // Set title
-  await expect(page.getByRole('heading', { name: 'Add Title' })).toBeVisible();
+  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
 
   await page.getByLabel('Title').fill(documentTitle);
 
@@ -112,13 +118,12 @@ test('should be able to create a document with multiple recipients', async ({ pa
   // Add signers
   await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
 
-  await page.getByLabel('Email*').fill('user1@example.com');
-  await page.getByLabel('Name').fill('User 1');
-
+  // Add 2 signers.
+  await page.getByPlaceholder('Email').fill('user1@example.com');
+  await page.getByPlaceholder('Name').fill('User 1');
   await page.getByRole('button', { name: 'Add Signer' }).click();
-
-  await page.getByLabel('Email*').nth(1).fill('user2@example.com');
-  await page.getByLabel('Name').nth(1).fill('User 2');
+  await page.getByRole('textbox', { name: 'Email', exact: true }).fill('user2@example.com');
+  await page.getByRole('textbox', { name: 'Name', exact: true }).fill('User 2');
 
   await page.getByRole('button', { name: 'Continue' }).click();
 
@@ -177,10 +182,12 @@ test('should be able to create, send and sign a document', async ({ page }) => {
 
   const documentTitle = `example-${Date.now()}.pdf`;
 
-  // Sign in
-  await page.getByLabel('Email').fill(TEST_USER.email);
-  await page.getByLabel('Password', { exact: true }).fill(TEST_USER.password);
-  await page.getByRole('button', { name: 'Sign In' }).click();
+  const user = await seedUser();
+
+  await apiSignin({
+    page,
+    email: user.email,
+  });
 
   // Upload document
   const [fileChooser] = await Promise.all([
@@ -198,7 +205,7 @@ test('should be able to create, send and sign a document', async ({ page }) => {
   await page.waitForURL(/\/documents\/\d+/);
 
   // Set title
-  await expect(page.getByRole('heading', { name: 'Add Title' })).toBeVisible();
+  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
 
   await page.getByLabel('Title').fill(documentTitle);
 
@@ -207,8 +214,8 @@ test('should be able to create, send and sign a document', async ({ page }) => {
   // Add signers
   await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
 
-  await page.getByLabel('Email*').fill('user1@example.com');
-  await page.getByLabel('Name').fill('User 1');
+  await page.getByPlaceholder('Email').fill('user1@example.com');
+  await page.getByPlaceholder('Name').fill('User 1');
 
   await page.getByRole('button', { name: 'Continue' }).click();
 
@@ -225,8 +232,9 @@ test('should be able to create, send and sign a document', async ({ page }) => {
   // Assert document was created
   await expect(page.getByRole('link', { name: documentTitle })).toBeVisible();
   await page.getByRole('link', { name: documentTitle }).click();
+  await page.waitForURL(/\/documents\/\d+/);
 
-  const url = await page.url().split('/');
+  const url = page.url().split('/');
   const documentId = url[url.length - 1];
 
   const { token } = await getRecipientByEmail({
@@ -260,10 +268,12 @@ test('should be able to create, send with redirect url, sign a document and redi
 
   const documentTitle = `example-${Date.now()}.pdf`;
 
-  // Sign in
-  await page.getByLabel('Email').fill(TEST_USER.email);
-  await page.getByLabel('Password', { exact: true }).fill(TEST_USER.password);
-  await page.getByRole('button', { name: 'Sign In' }).click();
+  const user = await seedUser();
+
+  await apiSignin({
+    page,
+    email: user.email,
+  });
 
   // Upload document
   const [fileChooser] = await Promise.all([
@@ -280,18 +290,19 @@ test('should be able to create, send with redirect url, sign a document and redi
   // Wait to be redirected to the edit page
   await page.waitForURL(/\/documents\/\d+/);
 
-  // Set title
-  await expect(page.getByRole('heading', { name: 'Add Title' })).toBeVisible();
-
+  // Set title & advanced redirect
+  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
   await page.getByLabel('Title').fill(documentTitle);
+  await page.getByRole('button', { name: 'Advanced Options' }).click();
+  await page.getByLabel('Redirect URL').fill('https://documenso.com');
 
   await page.getByRole('button', { name: 'Continue' }).click();
 
   // Add signers
   await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
 
-  await page.getByLabel('Email*').fill('user1@example.com');
-  await page.getByLabel('Name').fill('User 1');
+  await page.getByPlaceholder('Email').fill('user1@example.com');
+  await page.getByPlaceholder('Name').fill('User 1');
 
   await page.getByRole('button', { name: 'Continue' }).click();
 
@@ -299,11 +310,6 @@ test('should be able to create, send with redirect url, sign a document and redi
   await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
   await page.getByRole('button', { name: 'Continue' }).click();
 
-  // Add subject and send
-  await expect(page.getByRole('heading', { name: 'Add Subject' })).toBeVisible();
-  await page.getByRole('button', { name: 'Advanced Options' }).click();
-  await page.getByLabel('Redirect URL').fill('https://documenso.com');
-
   await page.getByRole('button', { name: 'Send' }).click();
 
   await page.waitForURL('/documents');
@@ -311,8 +317,9 @@ test('should be able to create, send with redirect url, sign a document and redi
   // Assert document was created
   await expect(page.getByRole('link', { name: documentTitle })).toBeVisible();
   await page.getByRole('link', { name: documentTitle }).click();
+  await page.waitForURL(/\/documents\/\d+/);
 
-  const url = await page.url().split('/');
+  const url = page.url().split('/');
   const documentId = url[url.length - 1];
 
   const { token } = await getRecipientByEmail({

packages/app-tests/e2e/teams/manage-team.spec.ts

@@ -4,14 +4,14 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { manualLogin } from '../fixtures/authentication';
+import { apiSignin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
 test('[TEAMS]: create team', async ({ page }) => {
   const user = await seedUser();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: user.email,
     redirectPath: '/settings/teams',
@@ -38,7 +38,7 @@ test('[TEAMS]: create team', async ({ page }) => {
 test('[TEAMS]: delete team', async ({ page }) => {
   const team = await seedTeam();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     redirectPath: `/t/${team.url}/settings`,
@@ -56,7 +56,7 @@ test('[TEAMS]: delete team', async ({ page }) => {
 test('[TEAMS]: update team', async ({ page }) => {
   const team = await seedTeam();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
   });

packages/app-tests/e2e/teams/team-documents.spec.ts

@@ -6,7 +6,7 @@ import { seedDocuments, seedTeamDocuments } from '@documenso/prisma/seed/documen
 import { seedTeamEmail, unseedTeam, unseedTeamEmail } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { manualLogin, manualSignout } from '../fixtures/authentication';
+import { apiSignin, apiSignout } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -30,7 +30,7 @@ test('[TEAMS]: check team documents count', async ({ page }) => {
 
   // Run the test twice, once with the team owner and once with a team member to ensure the counts are the same.
   for (const user of [team.owner, teamMember2]) {
-    await manualLogin({
+    await apiSignin({
       page,
       email: user.email,
       redirectPath: `/t/${team.url}/documents`,
@@ -55,7 +55,7 @@ test('[TEAMS]: check team documents count', async ({ page }) => {
     await checkDocumentTabCount(page, 'Draft', 1);
     await checkDocumentTabCount(page, 'All', 3);
 
-    await manualSignout({ page });
+    await apiSignout({ page });
   }
 
   await unseedTeam(team.url);
@@ -126,7 +126,7 @@ test('[TEAMS]: check team documents count with internal team email', async ({ pa
 
   // Run the test twice, one with the team owner and once with the team member email to ensure the counts are the same.
   for (const user of [team.owner, teamEmailMember]) {
-    await manualLogin({
+    await apiSignin({
       page,
       email: user.email,
       redirectPath: `/t/${team.url}/documents`,
@@ -151,7 +151,7 @@ test('[TEAMS]: check team documents count with internal team email', async ({ pa
     await checkDocumentTabCount(page, 'Draft', 1);
     await checkDocumentTabCount(page, 'All', 3);
 
-    await manualSignout({ page });
+    await apiSignout({ page });
   }
 
   await unseedTeamEmail({ teamId: team.id });
@@ -216,7 +216,7 @@ test('[TEAMS]: check team documents count with external team email', async ({ pa
     },
   ]);
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: teamMember2.email,
     redirectPath: `/t/${team.url}/documents`,
@@ -248,7 +248,7 @@ test('[TEAMS]: check team documents count with external team email', async ({ pa
 test('[TEAMS]: delete pending team document', async ({ page }) => {
   const { team, teamMember2: currentUser } = await seedTeamDocuments();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: currentUser.email,
     redirectPath: `/t/${team.url}/documents?status=PENDING`,
@@ -266,7 +266,7 @@ test('[TEAMS]: delete pending team document', async ({ page }) => {
 test('[TEAMS]: resend pending team document', async ({ page }) => {
   const { team, teamMember2: currentUser } = await seedTeamDocuments();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: currentUser.email,
     redirectPath: `/t/${team.url}/documents?status=PENDING`,

packages/app-tests/e2e/teams/team-email.spec.ts

@@ -4,14 +4,14 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamEmailVerification, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser, unseedUser } from '@documenso/prisma/seed/users';
 
-import { manualLogin } from '../fixtures/authentication';
+import { apiSignin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
 test('[TEAMS]: send team email request', async ({ page }) => {
   const team = await seedTeam();
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     password: 'password',
@@ -57,7 +57,7 @@ test('[TEAMS]: delete team email', async ({ page }) => {
     createTeamEmail: true,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     redirectPath: `/t/${team.url}/settings`,
@@ -86,7 +86,7 @@ test('[TEAMS]: team email owner removes access', async ({ page }) => {
     email: team.teamEmail.email,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: teamEmailOwner.email,
     redirectPath: `/settings/teams`,

packages/app-tests/e2e/teams/team-members.spec.ts

@@ -4,7 +4,7 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamInvite, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 
-import { manualLogin } from '../fixtures/authentication';
+import { apiSignin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -13,7 +13,7 @@ test('[TEAMS]: update team member role', async ({ page }) => {
     createTeamMembers: 1,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     password: 'password',
@@ -75,7 +75,7 @@ test('[TEAMS]: member can leave team', async ({ page }) => {
 
   const teamMember = team.members[1];
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: teamMember.user.email,
     password: 'password',
@@ -97,7 +97,7 @@ test('[TEAMS]: owner cannot leave team', async ({ page }) => {
     createTeamMembers: 1,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     password: 'password',

packages/app-tests/e2e/teams/transfer-team.spec.ts

@@ -3,7 +3,7 @@ import { expect, test } from '@playwright/test';
 import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, seedTeamTransfer, unseedTeam } from '@documenso/prisma/seed/teams';
 
-import { manualLogin } from '../fixtures/authentication';
+import { apiSignin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -14,7 +14,7 @@ test('[TEAMS]: initiate and cancel team transfer', async ({ page }) => {
 
   const teamMember = team.members[1];
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: team.owner.email,
     password: 'password',

packages/app-tests/e2e/templates/manage-templates.spec.ts

@@ -4,7 +4,7 @@ import { WEBAPP_BASE_URL } from '@documenso/lib/constants/app';
 import { seedTeam, unseedTeam } from '@documenso/prisma/seed/teams';
 import { seedTemplate } from '@documenso/prisma/seed/templates';
 
-import { manualLogin } from '../fixtures/authentication';
+import { apiSignin } from '../fixtures/authentication';
 
 test.describe.configure({ mode: 'parallel' });
 
@@ -36,7 +36,7 @@ test('[TEMPLATES]: view templates', async ({ page }) => {
     teamId: team.id,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -81,7 +81,7 @@ test('[TEMPLATES]: delete template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -135,7 +135,7 @@ test('[TEMPLATES]: duplicate template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: owner.email,
     redirectPath: '/templates',
@@ -181,7 +181,7 @@ test('[TEMPLATES]: use template', async ({ page }) => {
     teamId: team.id,
   });
 
-  await manualLogin({
+  await apiSignin({
     page,
     email: owner.email,
     redirectPath: '/templates',

packages/app-tests/playwright.config.ts

@@ -1,10 +1,14 @@
 import { defineConfig, devices } from '@playwright/test';
+import dotenv from 'dotenv';
+import path from 'path';
 
-/**
- * Read environment variables from file.
- * https://github.com/motdotla/dotenv
- */
-// require('dotenv').config();
+const ENV_FILES = ['.env', '.env.local', `.env.${process.env.NODE_ENV || 'development'}`];
+
+ENV_FILES.forEach((file) => {
+  dotenv.config({
+    path: path.join(__dirname, `../../${file}`),
+  });
+});
 
 /**
  * See https://playwright.dev/docs/test-configuration.

packages/ee/server-only/util/is-document-enterprise.ts

@@ -0,0 +1,56 @@
+import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
+import { subscriptionsContainActiveEnterprisePlan } from '@documenso/lib/utils/billing';
+import { prisma } from '@documenso/prisma';
+import type { Subscription } from '@documenso/prisma/client';
+
+export type IsUserEnterpriseOptions = {
+  userId: number;
+  teamId?: number;
+};
+
+/**
+ * Whether the user is enterprise, or has permission to use enterprise features on
+ * behalf of their team.
+ *
+ * It is assumed that the provided user is part of the provided team.
+ */
+export const isUserEnterprise = async ({
+  userId,
+  teamId,
+}: IsUserEnterpriseOptions): Promise<boolean> => {
+  let subscriptions: Subscription[] = [];
+
+  if (!IS_BILLING_ENABLED()) {
+    return false;
+  }
+
+  if (teamId) {
+    subscriptions = await prisma.team
+      .findFirstOrThrow({
+        where: {
+          id: teamId,
+        },
+        select: {
+          owner: {
+            include: {
+              Subscription: true,
+            },
+          },
+        },
+      })
+      .then((team) => team.owner.Subscription);
+  } else {
+    subscriptions = await prisma.user
+      .findFirstOrThrow({
+        where: {
+          id: userId,
+        },
+        select: {
+          Subscription: true,
+        },
+      })
+      .then((user) => user.Subscription);
+  }
+
+  return subscriptionsContainActiveEnterprisePlan(subscriptions);
+};

packages/lib/constants/document-auth.ts

@@ -0,0 +1,26 @@
+import type { TDocumentAuth } from '../types/document-auth';
+import { DocumentAuth } from '../types/document-auth';
+
+type DocumentAuthTypeData = {
+  key: TDocumentAuth;
+  value: string;
+};
+
+export const DOCUMENT_AUTH_TYPES: Record<string, DocumentAuthTypeData> = {
+  [DocumentAuth.ACCOUNT]: {
+    key: DocumentAuth.ACCOUNT,
+    value: 'Require account',
+  },
+  [DocumentAuth.PASSKEY]: {
+    key: DocumentAuth.PASSKEY,
+    value: 'Require passkey',
+  },
+  [DocumentAuth.TWO_FACTOR_AUTH]: {
+    key: DocumentAuth.TWO_FACTOR_AUTH,
+    value: 'Require 2FA',
+  },
+  [DocumentAuth.EXPLICIT_NONE]: {
+    key: DocumentAuth.EXPLICIT_NONE,
+    value: 'None (Overrides global settings)',
+  },
+} satisfies Record<TDocumentAuth, DocumentAuthTypeData>;

packages/lib/errors/app-error.ts

@@ -137,6 +137,7 @@ export class AppError extends Error {
   }
 
   static parseFromJSONString(jsonString: string): AppError | null {
+    try {
       const parsed = ZAppErrorJsonSchema.safeParse(JSON.parse(jsonString));
 
       if (!parsed.success) {
@@ -144,5 +145,8 @@ export class AppError extends Error {
       }
 
       return new AppError(parsed.data.code, parsed.data.message, parsed.data.userMessage);
+    } catch {
+      return null;
+    }
   }
 }

packages/lib/next-auth/auth-options.ts

@@ -22,7 +22,7 @@ import { sendConfirmationToken } from '../server-only/user/send-confirmation-tok
 import type { TAuthenticationResponseJSONSchema } from '../types/webauthn';
 import { ZAuthenticationResponseJSONSchema } from '../types/webauthn';
 import { extractNextAuthRequestMetadata } from '../universal/extract-request-metadata';
-import { getAuthenticatorRegistrationOptions } from '../utils/authenticator';
+import { getAuthenticatorOptions } from '../utils/authenticator';
 import { ErrorCode } from './error-codes';
 
 export const NEXT_AUTH_OPTIONS: AuthOptions = {
@@ -196,7 +196,7 @@ export const NEXT_AUTH_OPTIONS: AuthOptions = {
 
         const user = passkey.User;
 
-        const { rpId, origin } = getAuthenticatorRegistrationOptions();
+        const { rpId, origin } = getAuthenticatorOptions();
 
         const verification = await verifyAuthenticationResponse({
           response: requestBodyCrediential,

packages/lib/server-only/auth/create-passkey-authentication-options.ts

@@ -0,0 +1,76 @@
+import { generateAuthenticationOptions } from '@simplewebauthn/server';
+import type { AuthenticatorTransportFuture } from '@simplewebauthn/types';
+import { DateTime } from 'luxon';
+
+import { prisma } from '@documenso/prisma';
+import type { Passkey } from '@documenso/prisma/client';
+
+import { AppError, AppErrorCode } from '../../errors/app-error';
+import { getAuthenticatorOptions } from '../../utils/authenticator';
+
+type CreatePasskeyAuthenticationOptions = {
+  userId: number;
+
+  /**
+   * The ID of the passkey to request authentication for.
+   *
+   * If not set, we allow the browser client to handle choosing.
+   */
+  preferredPasskeyId?: string;
+};
+
+export const createPasskeyAuthenticationOptions = async ({
+  userId,
+  preferredPasskeyId,
+}: CreatePasskeyAuthenticationOptions) => {
+  const { rpId, timeout } = getAuthenticatorOptions();
+
+  let preferredPasskey: Pick<Passkey, 'credentialId' | 'transports'> | null = null;
+
+  if (preferredPasskeyId) {
+    preferredPasskey = await prisma.passkey.findFirst({
+      where: {
+        userId,
+        id: preferredPasskeyId,
+      },
+      select: {
+        credentialId: true,
+        transports: true,
+      },
+    });
+
+    if (!preferredPasskey) {
+      throw new AppError(AppErrorCode.NOT_FOUND, 'Requested passkey not found');
+    }
+  }
+
+  const options = await generateAuthenticationOptions({
+    rpID: rpId,
+    userVerification: 'preferred',
+    timeout,
+    allowCredentials: preferredPasskey
+      ? [
+          {
+            id: preferredPasskey.credentialId,
+            type: 'public-key',
+            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+            transports: preferredPasskey.transports as AuthenticatorTransportFuture[],
+          },
+        ]
+      : undefined,
+  });
+
+  const { secondaryId } = await prisma.verificationToken.create({
+    data: {
+      userId,
+      token: options.challenge,
+      expires: DateTime.now().plus({ minutes: 2 }).toJSDate(),
+      identifier: 'PASSKEY_CHALLENGE',
+    },
+  });
+
+  return {
+    tokenReference: secondaryId,
+    options,
+  };
+};

packages/lib/server-only/auth/create-passkey-registration-options.ts

@@ -5,7 +5,7 @@ import { DateTime } from 'luxon';
 import { prisma } from '@documenso/prisma';
 
 import { PASSKEY_TIMEOUT } from '../../constants/auth';
-import { getAuthenticatorRegistrationOptions } from '../../utils/authenticator';
+import { getAuthenticatorOptions } from '../../utils/authenticator';
 
 type CreatePasskeyRegistrationOptions = {
   userId: number;
@@ -27,7 +27,7 @@ export const createPasskeyRegistrationOptions = async ({
 
   const { passkeys } = user;
 
-  const { rpName, rpId: rpID } = getAuthenticatorRegistrationOptions();
+  const { rpName, rpId: rpID } = getAuthenticatorOptions();
 
   const options = await generateRegistrationOptions({
     rpName,

packages/lib/server-only/auth/create-passkey-signin-options.ts

@@ -3,14 +3,14 @@ import { DateTime } from 'luxon';
 
 import { prisma } from '@documenso/prisma';
 
-import { getAuthenticatorRegistrationOptions } from '../../utils/authenticator';
+import { getAuthenticatorOptions } from '../../utils/authenticator';
 
 type CreatePasskeySigninOptions = {
   sessionId: string;
 };
 
 export const createPasskeySigninOptions = async ({ sessionId }: CreatePasskeySigninOptions) => {
-  const { rpId, timeout } = getAuthenticatorRegistrationOptions();
+  const { rpId, timeout } = getAuthenticatorOptions();
 
   const options = await generateAuthenticationOptions({
     rpID: rpId,

packages/lib/server-only/auth/create-passkey.ts

@@ -7,7 +7,7 @@ import { UserSecurityAuditLogType } from '@documenso/prisma/client';
 import { MAXIMUM_PASSKEYS } from '../../constants/auth';
 import { AppError, AppErrorCode } from '../../errors/app-error';
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
-import { getAuthenticatorRegistrationOptions } from '../../utils/authenticator';
+import { getAuthenticatorOptions } from '../../utils/authenticator';
 
 type CreatePasskeyOptions = {
   userId: number;
@@ -64,7 +64,7 @@ export const createPasskey = async ({
     throw new AppError(AppErrorCode.EXPIRED_CODE, 'Challenge token expired');
   }
 
-  const { rpId: expectedRPID, origin: expectedOrigin } = getAuthenticatorRegistrationOptions();
+  const { rpId: expectedRPID, origin: expectedOrigin } = getAuthenticatorOptions();
 
   const verification = await verifyRegistrationResponse({
     response: verificationResponse,

packages/lib/server-only/auth/find-passkeys.ts

@@ -11,6 +11,7 @@ export interface FindPasskeysOptions {
   orderBy?: {
     column: keyof Passkey;
     direction: 'asc' | 'desc';
+    nulls?: Prisma.NullsOrder;
   };
 }
 
@@ -21,8 +22,9 @@ export const findPasskeys = async ({
   perPage = 10,
   orderBy,
 }: FindPasskeysOptions) => {
-  const orderByColumn = orderBy?.column ?? 'name';
+  const orderByColumn = orderBy?.column ?? 'lastUsedAt';
   const orderByDirection = orderBy?.direction ?? 'desc';
+  const orderByNulls: Prisma.NullsOrder | undefined = orderBy?.nulls ?? 'last';
 
   const whereClause: Prisma.PasskeyWhereInput = {
     userId,
@@ -41,7 +43,10 @@ export const findPasskeys = async ({
       skip: Math.max(page - 1, 0) * perPage,
       take: perPage,
       orderBy: {
-        [orderByColumn]: orderByDirection,
+        [orderByColumn]: {
+          sort: orderByDirection,
+          nulls: orderByNulls,
+        },
       },
       select: {
         id: true,

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

@@ -7,6 +7,7 @@ import { prisma } from '@documenso/prisma';
 import { DocumentStatus, SigningStatus } from '@documenso/prisma/client';
 import { WebhookTriggerEvents } from '@documenso/prisma/client';
 
+import type { TRecipientActionAuth } from '../../types/document-auth';
 import { triggerWebhook } from '../webhooks/trigger/trigger-webhook';
 import { sealDocument } from './seal-document';
 import { sendPendingEmail } from './send-pending-email';
@@ -14,6 +15,8 @@ import { sendPendingEmail } from './send-pending-email';
 export type CompleteDocumentWithTokenOptions = {
   token: string;
   documentId: number;
+  userId?: number;
+  authOptions?: TRecipientActionAuth;
   requestMetadata?: RequestMetadata;
 };
 
@@ -71,7 +74,27 @@ export const completeDocumentWithToken = async ({
     throw new Error(`Recipient ${recipient.id} has unsigned fields`);
   }
 
-  await prisma.recipient.update({
+  // Document reauth for completing documents is currently not required.
+
+  // const { derivedRecipientActionAuth } = extractDocumentAuthMethods({
+  //   documentAuth: document.authOptions,
+  //   recipientAuth: recipient.authOptions,
+  // });
+
+  // const isValid = await isRecipientAuthorized({
+  //   type: 'ACTION',
+  //   document: document,
+  //   recipient: recipient,
+  //   userId,
+  //   authOptions,
+  // });
+
+  // if (!isValid) {
+  //   throw new AppError(AppErrorCode.UNAUTHORIZED, 'Invalid authentication values');
+  // }
+
+  await prisma.$transaction(async (tx) => {
+    await tx.recipient.update({
       where: {
         id: recipient.id,
       },
@@ -81,7 +104,7 @@ export const completeDocumentWithToken = async ({
       },
     });
 
-  await prisma.documentAuditLog.create({
+    await tx.documentAuditLog.create({
       data: createDocumentAuditLogData({
         type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED,
         documentId: document.id,
@@ -95,9 +118,11 @@ export const completeDocumentWithToken = async ({
           recipientName: recipient.name,
           recipientId: recipient.id,
           recipientRole: recipient.role,
+          // actionAuth: derivedRecipientActionAuth || undefined,
         },
       }),
     });
+  });
 
   const pendingRecipients = await prisma.recipient.count({
     where: {

packages/lib/server-only/document/find-document-audit-logs.ts

@@ -3,11 +3,8 @@ import { prisma } from '@documenso/prisma';
 import type { DocumentAuditLog } from '@documenso/prisma/client';
 import type { Prisma } from '@documenso/prisma/client';
 
-import { AppError } from '../../errors/app-error';
-import type { TDocumentAuditLog } from '../../types/document-audit-logs';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
 import { parseDocumentAuditLogData } from '../../utils/document-audit-logs';
-import { buildServerLogger } from '../../utils/logger';
 
 export interface FindDocumentAuditLogsOptions {
   userId: number;
@@ -100,26 +97,7 @@ export const findDocumentAuditLogs = async ({
 
   let nextCursor: string | undefined = undefined;
 
-  let parsedData: TDocumentAuditLog[] = [];
-
-  try {
-    parsedData = data.map((auditLog) => parseDocumentAuditLogData(auditLog));
-  } catch (err) {
-    const error = AppError.parseError(err);
-
-    if (error.code === 'MIGRATION_REQUIRED') {
-      const logger = buildServerLogger();
-
-      logger.error('findDocumentAuditLogs', {
-        level: 'ALERT',
-        error,
-      });
-
-      void logger.flush();
-    }
-
-    throw error;
-  }
+  const parsedData = data.map((auditLog) => parseDocumentAuditLogData(auditLog));
 
   if (parsedData.length > perPage) {
     const nextItem = parsedData.pop();

packages/lib/server-only/document/get-document-by-token.ts

@@ -1,13 +1,39 @@
 import { prisma } from '@documenso/prisma';
 import type { DocumentWithRecipient } from '@documenso/prisma/types/document-with-recipient';
 
+import { AppError, AppErrorCode } from '../../errors/app-error';
+import type { TDocumentAuthMethods } from '../../types/document-auth';
+import { isRecipientAuthorized } from './is-recipient-authorized';
+
+export interface GetDocumentAndSenderByTokenOptions {
+  token: string;
+  userId?: number;
+  accessAuth?: TDocumentAuthMethods;
+
+  /**
+   * Whether we enforce the access requirement.
+   *
+   * Defaults to true.
+   */
+  requireAccessAuth?: boolean;
+}
+
+export interface GetDocumentAndRecipientByTokenOptions {
+  token: string;
+  userId?: number;
+  accessAuth?: TDocumentAuthMethods;
+
+  /**
+   * Whether we enforce the access requirement.
+   *
+   * Defaults to true.
+   */
+  requireAccessAuth?: boolean;
+}
 export type GetDocumentByTokenOptions = {
   token: string;
 };
 
-export type GetDocumentAndSenderByTokenOptions = GetDocumentByTokenOptions;
-export type GetDocumentAndRecipientByTokenOptions = GetDocumentByTokenOptions;
-
 export const getDocumentByToken = async ({ token }: GetDocumentByTokenOptions) => {
   if (!token) {
     throw new Error('Missing token');
@@ -26,8 +52,13 @@ export const getDocumentByToken = async ({ token }: GetDocumentByTokenOptions) =
   return result;
 };
 
+export type DocumentAndSender = Awaited<ReturnType<typeof getDocumentAndSenderByToken>>;
+
 export const getDocumentAndSenderByToken = async ({
   token,
+  userId,
+  accessAuth,
+  requireAccessAuth = true,
 }: GetDocumentAndSenderByTokenOptions) => {
   if (!token) {
     throw new Error('Missing token');
@@ -45,12 +76,40 @@ export const getDocumentAndSenderByToken = async ({
       User: true,
       documentData: true,
       documentMeta: true,
+      Recipient: {
+        where: {
+          token,
+        },
+      },
     },
   });
 
   // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
   const { password: _password, ...User } = result.User;
 
+  const recipient = result.Recipient[0];
+
+  // Sanity check, should not be possible.
+  if (!recipient) {
+    throw new Error('Missing recipient');
+  }
+
+  let documentAccessValid = true;
+
+  if (requireAccessAuth) {
+    documentAccessValid = await isRecipientAuthorized({
+      type: 'ACCESS',
+      document: result,
+      recipient,
+      userId,
+      authOptions: accessAuth,
+    });
+  }
+
+  if (!documentAccessValid) {
+    throw new AppError(AppErrorCode.UNAUTHORIZED, 'Invalid access values');
+  }
+
   return {
     ...result,
     User,
@@ -62,6 +121,9 @@ export const getDocumentAndSenderByToken = async ({
  */
 export const getDocumentAndRecipientByToken = async ({
   token,
+  userId,
+  accessAuth,
+  requireAccessAuth = true,
 }: GetDocumentAndRecipientByTokenOptions): Promise<DocumentWithRecipient> => {
   if (!token) {
     throw new Error('Missing token');
@@ -85,6 +147,29 @@ export const getDocumentAndRecipientByToken = async ({
     },
   });
 
+  const recipient = result.Recipient[0];
+
+  // Sanity check, should not be possible.
+  if (!recipient) {
+    throw new Error('Missing recipient');
+  }
+
+  let documentAccessValid = true;
+
+  if (requireAccessAuth) {
+    documentAccessValid = await isRecipientAuthorized({
+      type: 'ACCESS',
+      document: result,
+      recipient,
+      userId,
+      authOptions: accessAuth,
+    });
+  }
+
+  if (!documentAccessValid) {
+    throw new AppError(AppErrorCode.UNAUTHORIZED, 'Invalid access values');
+  }
+
   return {
     ...result,
     Recipient: result.Recipient,

packages/lib/server-only/document/is-recipient-authorized.ts

@@ -0,0 +1,213 @@
+import { verifyAuthenticationResponse } from '@simplewebauthn/server';
+import { match } from 'ts-pattern';
+
+import { prisma } from '@documenso/prisma';
+import type { Document, Recipient } from '@documenso/prisma/client';
+
+import { verifyTwoFactorAuthenticationToken } from '../2fa/verify-2fa-token';
+import { AppError, AppErrorCode } from '../../errors/app-error';
+import type { TDocumentAuth, TDocumentAuthMethods } from '../../types/document-auth';
+import { DocumentAuth } from '../../types/document-auth';
+import type { TAuthenticationResponseJSONSchema } from '../../types/webauthn';
+import { getAuthenticatorOptions } from '../../utils/authenticator';
+import { extractDocumentAuthMethods } from '../../utils/document-auth';
+
+type IsRecipientAuthorizedOptions = {
+  type: 'ACCESS' | 'ACTION';
+  document: Document;
+  recipient: Recipient;
+
+  /**
+   * The ID of the user who initiated the request.
+   */
+  userId?: number;
+
+  /**
+   * The auth details to check.
+   *
+   * Optional because there are scenarios where no auth options are required such as
+   * using the user ID.
+   */
+  authOptions?: TDocumentAuthMethods;
+};
+
+const getUserByEmail = async (email: string) => {
+  return await prisma.user.findFirst({
+    where: {
+      email,
+    },
+    select: {
+      id: true,
+    },
+  });
+};
+
+/**
+ * Whether the recipient is authorized to perform the requested operation on a
+ * document, given the provided auth options.
+ *
+ * @returns True if the recipient can perform the requested operation.
+ */
+export const isRecipientAuthorized = async ({
+  type,
+  document,
+  recipient,
+  userId,
+  authOptions,
+}: IsRecipientAuthorizedOptions): Promise<boolean> => {
+  const { derivedRecipientAccessAuth, derivedRecipientActionAuth } = extractDocumentAuthMethods({
+    documentAuth: document.authOptions,
+    recipientAuth: recipient.authOptions,
+  });
+
+  const authMethod: TDocumentAuth | null =
+    type === 'ACCESS' ? derivedRecipientAccessAuth : derivedRecipientActionAuth;
+
+  // Early true return when auth is not required.
+  if (!authMethod || authMethod === DocumentAuth.EXPLICIT_NONE) {
+    return true;
+  }
+
+  // Create auth options when none are passed for account.
+  if (!authOptions && authMethod === DocumentAuth.ACCOUNT) {
+    authOptions = {
+      type: DocumentAuth.ACCOUNT,
+    };
+  }
+
+  // Authentication required does not match provided method.
+  if (!authOptions || authOptions.type !== authMethod || !userId) {
+    return false;
+  }
+
+  return await match(authOptions)
+    .with({ type: DocumentAuth.ACCOUNT }, async () => {
+      const recipientUser = await getUserByEmail(recipient.email);
+
+      if (!recipientUser) {
+        return false;
+      }
+
+      return recipientUser.id === userId;
+    })
+    .with({ type: DocumentAuth.PASSKEY }, async ({ authenticationResponse, tokenReference }) => {
+      return await isPasskeyAuthValid({
+        userId,
+        authenticationResponse,
+        tokenReference,
+      });
+    })
+    .with({ type: DocumentAuth.TWO_FACTOR_AUTH }, async ({ token }) => {
+      const user = await prisma.user.findFirst({
+        where: {
+          id: userId,
+        },
+      });
+
+      // Should not be possible.
+      if (!user) {
+        throw new AppError(AppErrorCode.NOT_FOUND, 'User not found');
+      }
+
+      return await verifyTwoFactorAuthenticationToken({
+        user,
+        totpCode: token,
+      });
+    })
+    .exhaustive();
+};
+
+type VerifyPasskeyOptions = {
+  /**
+   * The ID of the user who initiated the request.
+   */
+  userId: number;
+
+  /**
+   * The secondary ID of the verification token.
+   */
+  tokenReference: string;
+
+  /**
+   * The response from the passkey authenticator.
+   */
+  authenticationResponse: TAuthenticationResponseJSONSchema;
+};
+
+/**
+ * Whether the provided passkey authenticator response is valid and the user is
+ * authenticated.
+ */
+const isPasskeyAuthValid = async (options: VerifyPasskeyOptions): Promise<boolean> => {
+  return verifyPasskey(options)
+    .then(() => true)
+    .catch(() => false);
+};
+
+/**
+ * Verifies whether the provided passkey authenticator is valid and the user is
+ * authenticated.
+ *
+ * Will throw an error if the user should not be authenticated.
+ */
+const verifyPasskey = async ({
+  userId,
+  tokenReference,
+  authenticationResponse,
+}: VerifyPasskeyOptions): Promise<void> => {
+  const passkey = await prisma.passkey.findFirst({
+    where: {
+      credentialId: Buffer.from(authenticationResponse.id, 'base64'),
+      userId,
+    },
+  });
+
+  if (!passkey) {
+    throw new AppError(AppErrorCode.NOT_FOUND, 'Passkey not found');
+  }
+
+  const verificationToken = await prisma.verificationToken
+    .delete({
+      where: {
+        userId,
+        secondaryId: tokenReference,
+      },
+    })
+    .catch(() => null);
+
+  if (!verificationToken) {
+    throw new AppError(AppErrorCode.NOT_FOUND, 'Token not found');
+  }
+
+  if (verificationToken.expires < new Date()) {
+    throw new AppError(AppErrorCode.EXPIRED_CODE, 'Token expired');
+  }
+
+  const { rpId, origin } = getAuthenticatorOptions();
+
+  const verification = await verifyAuthenticationResponse({
+    response: authenticationResponse,
+    expectedChallenge: verificationToken.token,
+    expectedOrigin: origin,
+    expectedRPID: rpId,
+    authenticator: {
+      credentialID: new Uint8Array(Array.from(passkey.credentialId)),
+      credentialPublicKey: new Uint8Array(passkey.credentialPublicKey),
+      counter: Number(passkey.counter),
+    },
+  }).catch(() => null); // May want to log this for insights.
+
+  if (verification?.verified !== true) {
+    throw new AppError(AppErrorCode.UNAUTHORIZED, 'User is not authorized');
+  }
+
+  await prisma.passkey.update({
+    where: {
+      id: passkey.id,
+    },
+    data: {
+      lastUsedAt: new Date(),
+      counter: verification.authenticationInfo.newCounter,
+    },
+  });
+};

packages/lib/server-only/document/send-completed-email.ts

@@ -95,7 +95,7 @@ export const sendCompletedEmail = async ({ documentId, requestMetadata }: SendDo
         data: {
           emailType: 'DOCUMENT_COMPLETED',
           recipientEmail: owner.email,
-          recipientName: owner.name,
+          recipientName: owner.name ?? '',
           recipientId: owner.id,
           recipientRole: 'OWNER',
           isResending: false,

packages/lib/server-only/document/update-document-settings.ts

@@ -0,0 +1,178 @@
+'use server';
+
+import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
+import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
+import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
+import type { CreateDocumentAuditLogDataResponse } from '@documenso/lib/utils/document-audit-logs';
+import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
+import { prisma } from '@documenso/prisma';
+import { DocumentStatus } from '@documenso/prisma/client';
+
+import { AppError, AppErrorCode } from '../../errors/app-error';
+import type { TDocumentAccessAuthTypes, TDocumentActionAuthTypes } from '../../types/document-auth';
+import { createDocumentAuthOptions, extractDocumentAuthMethods } from '../../utils/document-auth';
+
+export type UpdateDocumentSettingsOptions = {
+  userId: number;
+  teamId?: number;
+  documentId: number;
+  data: {
+    title?: string;
+    globalAccessAuth?: TDocumentAccessAuthTypes | null;
+    globalActionAuth?: TDocumentActionAuthTypes | null;
+  };
+  requestMetadata?: RequestMetadata;
+};
+
+export const updateDocumentSettings = async ({
+  userId,
+  teamId,
+  documentId,
+  data,
+  requestMetadata,
+}: UpdateDocumentSettingsOptions) => {
+  if (!data.title && !data.globalAccessAuth && !data.globalActionAuth) {
+    throw new AppError(AppErrorCode.INVALID_BODY, 'Missing data to update');
+  }
+
+  const user = await prisma.user.findFirstOrThrow({
+    where: {
+      id: userId,
+    },
+  });
+
+  const document = await prisma.document.findFirstOrThrow({
+    where: {
+      id: documentId,
+      ...(teamId
+        ? {
+            team: {
+              id: teamId,
+              members: {
+                some: {
+                  userId,
+                },
+              },
+            },
+          }
+        : {
+            userId,
+            teamId: null,
+          }),
+    },
+  });
+
+  const { documentAuthOption } = extractDocumentAuthMethods({
+    documentAuth: document.authOptions,
+  });
+
+  const documentGlobalAccessAuth = documentAuthOption?.globalAccessAuth ?? null;
+  const documentGlobalActionAuth = documentAuthOption?.globalActionAuth ?? null;
+
+  // If the new global auth values aren't passed in, fallback to the current document values.
+  const newGlobalAccessAuth =
+    data?.globalAccessAuth === undefined ? documentGlobalAccessAuth : data.globalAccessAuth;
+  const newGlobalActionAuth =
+    data?.globalActionAuth === undefined ? documentGlobalActionAuth : data.globalActionAuth;
+
+  // Check if user has permission to set the global action auth.
+  if (newGlobalActionAuth) {
+    const isDocumentEnterprise = await isUserEnterprise({
+      userId,
+      teamId,
+    });
+
+    if (!isDocumentEnterprise) {
+      throw new AppError(
+        AppErrorCode.UNAUTHORIZED,
+        'You do not have permission to set the action auth',
+      );
+    }
+  }
+
+  const isTitleSame = data.title === document.title;
+  const isGlobalAccessSame = documentGlobalAccessAuth === newGlobalAccessAuth;
+  const isGlobalActionSame = documentGlobalActionAuth === newGlobalActionAuth;
+
+  const auditLogs: CreateDocumentAuditLogDataResponse[] = [];
+
+  if (!isTitleSame && document.status !== DocumentStatus.DRAFT) {
+    throw new AppError(
+      AppErrorCode.INVALID_BODY,
+      'You cannot update the title if the document has been sent',
+    );
+  }
+
+  if (!isTitleSame) {
+    auditLogs.push(
+      createDocumentAuditLogData({
+        type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_TITLE_UPDATED,
+        documentId,
+        user,
+        requestMetadata,
+        data: {
+          from: document.title,
+          to: data.title || '',
+        },
+      }),
+    );
+  }
+
+  if (!isGlobalAccessSame) {
+    auditLogs.push(
+      createDocumentAuditLogData({
+        type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED,
+        documentId,
+        user,
+        requestMetadata,
+        data: {
+          from: documentGlobalAccessAuth,
+          to: newGlobalAccessAuth,
+        },
+      }),
+    );
+  }
+
+  if (!isGlobalActionSame) {
+    auditLogs.push(
+      createDocumentAuditLogData({
+        type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED,
+        documentId,
+        user,
+        requestMetadata,
+        data: {
+          from: documentGlobalActionAuth,
+          to: newGlobalActionAuth,
+        },
+      }),
+    );
+  }
+
+  // Early return if nothing is required.
+  if (auditLogs.length === 0) {
+    return document;
+  }
+
+  return await prisma.$transaction(async (tx) => {
+    const authOptions = createDocumentAuthOptions({
+      globalAccessAuth: newGlobalAccessAuth,
+      globalActionAuth: newGlobalActionAuth,
+    });
+
+    const updatedDocument = await tx.document.update({
+      where: {
+        id: documentId,
+      },
+      data: {
+        title: data.title,
+        authOptions,
+      },
+    });
+
+    await tx.documentAuditLog.createMany({
+      data: auditLogs,
+    });
+
+    return updatedDocument;
+  });
+};

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

@@ -5,15 +5,21 @@ import { prisma } from '@documenso/prisma';
 import { ReadStatus } from '@documenso/prisma/client';
 import { WebhookTriggerEvents } from '@documenso/prisma/client';
 
+import type { TDocumentAccessAuthTypes } from '../../types/document-auth';
 import { triggerWebhook } from '../webhooks/trigger/trigger-webhook';
 import { getDocumentAndRecipientByToken } from './get-document-by-token';
 
 export type ViewedDocumentOptions = {
   token: string;
+  recipientAccessAuth?: TDocumentAccessAuthTypes | null;
   requestMetadata?: RequestMetadata;
 };
 
-export const viewedDocument = async ({ token, requestMetadata }: ViewedDocumentOptions) => {
+export const viewedDocument = async ({
+  token,
+  recipientAccessAuth,
+  requestMetadata,
+}: ViewedDocumentOptions) => {
   const recipient = await prisma.recipient.findFirst({
     where: {
       token,
@@ -51,12 +57,13 @@ export const viewedDocument = async ({ token, requestMetadata }: ViewedDocumentO
           recipientId: recipient.id,
           recipientName: recipient.name,
           recipientRole: recipient.role,
+          accessAuth: recipientAccessAuth || undefined,
         },
       }),
     });
   });
 
-  const document = await getDocumentAndRecipientByToken({ token });
+  const document = await getDocumentAndRecipientByToken({ token, requireAccessAuth: false });
 
   await triggerWebhook({
     event: WebhookTriggerEvents.DOCUMENT_OPENED,

packages/lib/server-only/field/sign-field-with-token.ts

@@ -8,15 +8,21 @@ import { DocumentStatus, FieldType, SigningStatus } from '@documenso/prisma/clie
 
 import { DEFAULT_DOCUMENT_DATE_FORMAT } from '../../constants/date-formats';
 import { DEFAULT_DOCUMENT_TIME_ZONE } from '../../constants/time-zones';
+import { AppError, AppErrorCode } from '../../errors/app-error';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
+import type { TRecipientActionAuth } from '../../types/document-auth';
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
 import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
+import { extractDocumentAuthMethods } from '../../utils/document-auth';
+import { isRecipientAuthorized } from '../document/is-recipient-authorized';
 
 export type SignFieldWithTokenOptions = {
   token: string;
   fieldId: number;
   value: string;
   isBase64?: boolean;
+  userId?: number;
+  authOptions?: TRecipientActionAuth;
   requestMetadata?: RequestMetadata;
 };
 
@@ -25,6 +31,8 @@ export const signFieldWithToken = async ({
   fieldId,
   value,
   isBase64,
+  userId,
+  authOptions,
   requestMetadata,
 }: SignFieldWithTokenOptions) => {
   const field = await prisma.field.findFirstOrThrow({
@@ -71,6 +79,33 @@ export const signFieldWithToken = async ({
     throw new Error(`Field ${fieldId} has no recipientId`);
   }
 
+  let { derivedRecipientActionAuth } = extractDocumentAuthMethods({
+    documentAuth: document.authOptions,
+    recipientAuth: recipient.authOptions,
+  });
+
+  // Override all non-signature fields to not require any auth.
+  if (field.type !== FieldType.SIGNATURE) {
+    derivedRecipientActionAuth = null;
+  }
+
+  let isValid = true;
+
+  // Only require auth on signature fields for now.
+  if (field.type === FieldType.SIGNATURE) {
+    isValid = await isRecipientAuthorized({
+      type: 'ACTION',
+      document: document,
+      recipient: recipient,
+      userId,
+      authOptions,
+    });
+  }
+
+  if (!isValid) {
+    throw new AppError(AppErrorCode.UNAUTHORIZED, 'Invalid authentication values');
+  }
+
   const documentMeta = await prisma.documentMeta.findFirst({
     where: {
       documentId: document.id,
@@ -158,9 +193,11 @@ export const signFieldWithToken = async ({
               data: updatedField.customText,
             }))
             .exhaustive(),
-          fieldSecurity: {
-            type: 'NONE',
-          },
+          fieldSecurity: derivedRecipientActionAuth
+            ? {
+                type: derivedRecipientActionAuth,
+              }
+            : undefined,
         },
       }),
     });

packages/lib/server-only/field/update-field.ts

@@ -1,8 +1,9 @@
 import { prisma } from '@documenso/prisma';
 import type { FieldType, Team } from '@documenso/prisma/client';
 
+import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
-import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
+import { createDocumentAuditLogData, diffFieldChanges } from '../../utils/document-audit-logs';
 
 export type UpdateFieldOptions = {
   fieldId: number;
@@ -33,7 +34,7 @@ export const updateField = async ({
   pageHeight,
   requestMetadata,
 }: UpdateFieldOptions) => {
-  const field = await prisma.field.update({
+  const oldField = await prisma.field.findFirstOrThrow({
     where: {
       id: fieldId,
       Document: {
@@ -55,6 +56,13 @@ export const updateField = async ({
             }),
       },
     },
+  });
+
+  const field = prisma.$transaction(async (tx) => {
+    const updatedField = await tx.field.update({
+      where: {
+        id: fieldId,
+      },
       data: {
         recipientId,
         type,
@@ -69,9 +77,28 @@ export const updateField = async ({
       },
     });
 
-  if (!field) {
-    throw new Error('Field not found');
-  }
+    await tx.documentAuditLog.create({
+      data: createDocumentAuditLogData({
+        type: DOCUMENT_AUDIT_LOG_TYPE.FIELD_UPDATED,
+        documentId,
+        user: {
+          id: team?.id ?? user.id,
+          email: team?.name ?? user.email,
+          name: team ? '' : user.name,
+        },
+        data: {
+          fieldId: updatedField.secondaryId,
+          fieldRecipientEmail: updatedField.Recipient?.email ?? '',
+          fieldRecipientId: recipientId ?? -1,
+          fieldType: updatedField.type,
+          changes: diffFieldChanges(oldField, updatedField),
+        },
+        requestMetadata,
+      }),
+    });
+
+    return updatedField;
+  });
 
   const user = await prisma.user.findFirstOrThrow({
     where: {
@@ -99,24 +126,5 @@ export const updateField = async ({
     });
   }
 
-  await prisma.documentAuditLog.create({
-    data: createDocumentAuditLogData({
-      type: 'FIELD_UPDATED',
-      documentId,
-      user: {
-        id: team?.id ?? user.id,
-        email: team?.name ?? user.email,
-        name: team ? '' : user.name,
-      },
-      data: {
-        fieldId: field.secondaryId,
-        fieldRecipientEmail: field.Recipient?.email ?? '',
-        fieldRecipientId: recipientId ?? -1,
-        fieldType: field.type,
-      },
-      requestMetadata,
-    }),
-  });
-
   return field;
 };

packages/lib/server-only/recipient/set-recipients-for-document.ts

@@ -1,15 +1,23 @@
+import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-enterprise';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
+import {
+  type TRecipientActionAuthTypes,
+  ZRecipientAuthOptionsSchema,
+} from '@documenso/lib/types/document-auth';
 import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { nanoid } from '@documenso/lib/universal/id';
 import {
   createDocumentAuditLogData,
   diffRecipientChanges,
 } from '@documenso/lib/utils/document-audit-logs';
+import { createRecipientAuthOptions } from '@documenso/lib/utils/document-auth';
 import { prisma } from '@documenso/prisma';
 import type { Recipient } from '@documenso/prisma/client';
 import { RecipientRole } from '@documenso/prisma/client';
 import { SendStatus, SigningStatus } from '@documenso/prisma/client';
 
+import { AppError, AppErrorCode } from '../../errors/app-error';
+
 export interface SetRecipientsForDocumentOptions {
   userId: number;
   teamId?: number;
@@ -19,6 +27,7 @@ export interface SetRecipientsForDocumentOptions {
     email: string;
     name: string;
     role: RecipientRole;
+    actionAuth?: TRecipientActionAuthTypes | null;
   }[];
   requestMetadata?: RequestMetadata;
 }
@@ -70,6 +79,23 @@ export const setRecipientsForDocument = async ({
     throw new Error('Document already complete');
   }
 
+  const recipientsHaveActionAuth = recipients.some((recipient) => recipient.actionAuth);
+
+  // Check if user has permission to set the global action auth.
+  if (recipientsHaveActionAuth) {
+    const isDocumentEnterprise = await isUserEnterprise({
+      userId,
+      teamId,
+    });
+
+    if (!isDocumentEnterprise) {
+      throw new AppError(
+        AppErrorCode.UNAUTHORIZED,
+        'You do not have permission to set the action auth',
+      );
+    }
+  }
+
   const normalizedRecipients = recipients.map((recipient) => ({
     ...recipient,
     email: recipient.email.toLowerCase(),
@@ -112,6 +138,15 @@ export const setRecipientsForDocument = async ({
   const persistedRecipients = await prisma.$transaction(async (tx) => {
     return await Promise.all(
       linkedRecipients.map(async (recipient) => {
+        let authOptions = ZRecipientAuthOptionsSchema.parse(recipient._persisted?.authOptions);
+
+        if (recipient.actionAuth !== undefined) {
+          authOptions = createRecipientAuthOptions({
+            accessAuth: authOptions.accessAuth,
+            actionAuth: recipient.actionAuth,
+          });
+        }
+
         const upsertedRecipient = await tx.recipient.upsert({
           where: {
             id: recipient._persisted?.id ?? -1,
@@ -125,6 +160,7 @@ export const setRecipientsForDocument = async ({
             sendStatus: recipient.role === RecipientRole.CC ? SendStatus.SENT : SendStatus.NOT_SENT,
             signingStatus:
               recipient.role === RecipientRole.CC ? SigningStatus.SIGNED : SigningStatus.NOT_SIGNED,
+            authOptions,
           },
           create: {
             name: recipient.name,
@@ -135,6 +171,7 @@ export const setRecipientsForDocument = async ({
             sendStatus: recipient.role === RecipientRole.CC ? SendStatus.SENT : SendStatus.NOT_SENT,
             signingStatus:
               recipient.role === RecipientRole.CC ? SigningStatus.SIGNED : SigningStatus.NOT_SIGNED,
+            authOptions,
           },
         });
 
@@ -188,7 +225,10 @@ export const setRecipientsForDocument = async ({
               documentId: documentId,
               user,
               requestMetadata,
-              data: baseAuditLog,
+              data: {
+                ...baseAuditLog,
+                actionAuth: recipient.actionAuth || undefined,
+              },
             }),
           });
         }

packages/lib/types/document-audit-logs.ts

@@ -8,6 +8,8 @@ import { z } from 'zod';
 
 import { FieldType } from '@documenso/prisma/client';
 
+import { ZRecipientActionAuthTypesSchema } from './document-auth';
+
 export const ZDocumentAuditLogTypeSchema = z.enum([
   // Document actions.
   'EMAIL_SENT',
@@ -26,6 +28,8 @@ export const ZDocumentAuditLogTypeSchema = z.enum([
   'DOCUMENT_DELETED', // When the document is soft deleted.
   'DOCUMENT_FIELD_INSERTED', // When a field is inserted (signed/approved/etc) by a recipient.
   'DOCUMENT_FIELD_UNINSERTED', // When a field is uninserted by a recipient.
+  'DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED', // When the global access authentication is updated.
+  'DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED', // When the global action authentication is updated.
   'DOCUMENT_META_UPDATED', // When the document meta data is updated.
   'DOCUMENT_OPENED', // When the document is opened by a recipient.
   'DOCUMENT_RECIPIENT_COMPLETED', // When a recipient completes all their required tasks for the document.
@@ -51,7 +55,13 @@ export const ZDocumentMetaDiffTypeSchema = z.enum([
 ]);
 
 export const ZFieldDiffTypeSchema = z.enum(['DIMENSION', 'POSITION']);
-export const ZRecipientDiffTypeSchema = z.enum(['NAME', 'ROLE', 'EMAIL']);
+export const ZRecipientDiffTypeSchema = z.enum([
+  'NAME',
+  'ROLE',
+  'EMAIL',
+  'ACCESS_AUTH',
+  'ACTION_AUTH',
+]);
 
 export const DOCUMENT_AUDIT_LOG_TYPE = ZDocumentAuditLogTypeSchema.Enum;
 export const DOCUMENT_EMAIL_TYPE = ZDocumentAuditLogEmailTypeSchema.Enum;
@@ -107,25 +117,34 @@ export const ZDocumentAuditLogFieldDiffSchema = z.union([
   ZFieldDiffPositionSchema,
 ]);
 
-export const ZRecipientDiffNameSchema = z.object({
+export const ZGenericFromToSchema = z.object({
+  from: z.string().nullable(),
+  to: z.string().nullable(),
+});
+
+export const ZRecipientDiffActionAuthSchema = ZGenericFromToSchema.extend({
+  type: z.literal(RECIPIENT_DIFF_TYPE.ACCESS_AUTH),
+});
+
+export const ZRecipientDiffAccessAuthSchema = ZGenericFromToSchema.extend({
+  type: z.literal(RECIPIENT_DIFF_TYPE.ACTION_AUTH),
+});
+
+export const ZRecipientDiffNameSchema = ZGenericFromToSchema.extend({
   type: z.literal(RECIPIENT_DIFF_TYPE.NAME),
-  from: z.string(),
-  to: z.string(),
 });
 
-export const ZRecipientDiffRoleSchema = z.object({
+export const ZRecipientDiffRoleSchema = ZGenericFromToSchema.extend({
   type: z.literal(RECIPIENT_DIFF_TYPE.ROLE),
-  from: z.string(),
-  to: z.string(),
 });
 
-export const ZRecipientDiffEmailSchema = z.object({
+export const ZRecipientDiffEmailSchema = ZGenericFromToSchema.extend({
   type: z.literal(RECIPIENT_DIFF_TYPE.EMAIL),
-  from: z.string(),
-  to: z.string(),
 });
 
-export const ZDocumentAuditLogRecipientDiffSchema = z.union([
+export const ZDocumentAuditLogRecipientDiffSchema = z.discriminatedUnion('type', [
+  ZRecipientDiffActionAuthSchema,
+  ZRecipientDiffAccessAuthSchema,
   ZRecipientDiffNameSchema,
   ZRecipientDiffRoleSchema,
   ZRecipientDiffEmailSchema,
@@ -217,11 +236,11 @@ export const ZDocumentAuditLogEventDocumentFieldInsertedSchema = z.object({
         data: z.string(),
       }),
     ]),
-
-    // Todo: Replace with union once we have more field security types.
-    fieldSecurity: z.object({
-      type: z.literal('NONE'),
-    }),
+    fieldSecurity: z
+      .object({
+        type: ZRecipientActionAuthTypesSchema,
+      })
+      .optional(),
   }),
 });
 
@@ -236,6 +255,22 @@ export const ZDocumentAuditLogEventDocumentFieldUninsertedSchema = z.object({
   }),
 });
 
+/**
+ * Event: Document global authentication access updated.
+ */
+export const ZDocumentAuditLogEventDocumentGlobalAuthAccessUpdatedSchema = z.object({
+  type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED),
+  data: ZGenericFromToSchema,
+});
+
+/**
+ * Event: Document global authentication action updated.
+ */
+export const ZDocumentAuditLogEventDocumentGlobalAuthActionUpdatedSchema = z.object({
+  type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED),
+  data: ZGenericFromToSchema,
+});
+
 /**
  * Event: Document meta updated.
  */
@@ -251,7 +286,9 @@ export const ZDocumentAuditLogEventDocumentMetaUpdatedSchema = z.object({
  */
 export const ZDocumentAuditLogEventDocumentOpenedSchema = z.object({
   type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_OPENED),
-  data: ZBaseRecipientDataSchema,
+  data: ZBaseRecipientDataSchema.extend({
+    accessAuth: z.string().optional(),
+  }),
 });
 
 /**
@@ -259,7 +296,9 @@ export const ZDocumentAuditLogEventDocumentOpenedSchema = z.object({
  */
 export const ZDocumentAuditLogEventDocumentRecipientCompleteSchema = z.object({
   type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED),
-  data: ZBaseRecipientDataSchema,
+  data: ZBaseRecipientDataSchema.extend({
+    actionAuth: z.string().optional(),
+  }),
 });
 
 /**
@@ -303,7 +342,9 @@ export const ZDocumentAuditLogEventFieldRemovedSchema = z.object({
 export const ZDocumentAuditLogEventFieldUpdatedSchema = z.object({
   type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.FIELD_UPDATED),
   data: ZBaseFieldEventDataSchema.extend({
-    changes: z.array(ZDocumentAuditLogFieldDiffSchema),
+    // Provide an empty array as a migration workaround due to a mistake where we were
+    // not passing through any changes via API/v1 due to a type error.
+    changes: z.preprocess((x) => x || [], z.array(ZDocumentAuditLogFieldDiffSchema)),
   }),
 });
 
@@ -312,7 +353,9 @@ export const ZDocumentAuditLogEventFieldUpdatedSchema = z.object({
  */
 export const ZDocumentAuditLogEventRecipientAddedSchema = z.object({
   type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.RECIPIENT_CREATED),
-  data: ZBaseRecipientDataSchema,
+  data: ZBaseRecipientDataSchema.extend({
+    actionAuth: ZRecipientActionAuthTypesSchema.optional(),
+  }),
 });
 
 /**
@@ -352,6 +395,8 @@ export const ZDocumentAuditLogSchema = ZDocumentAuditLogBaseSchema.and(
     ZDocumentAuditLogEventDocumentDeletedSchema,
     ZDocumentAuditLogEventDocumentFieldInsertedSchema,
     ZDocumentAuditLogEventDocumentFieldUninsertedSchema,
+    ZDocumentAuditLogEventDocumentGlobalAuthAccessUpdatedSchema,
+    ZDocumentAuditLogEventDocumentGlobalAuthActionUpdatedSchema,
     ZDocumentAuditLogEventDocumentMetaUpdatedSchema,
     ZDocumentAuditLogEventDocumentOpenedSchema,
     ZDocumentAuditLogEventDocumentRecipientCompleteSchema,

packages/lib/types/document-auth.ts

@@ -0,0 +1,153 @@
+import { z } from 'zod';
+
+import { ZAuthenticationResponseJSONSchema } from './webauthn';
+
+/**
+ * All the available types of document authentication options for both access and action.
+ */
+export const ZDocumentAuthTypesSchema = z.enum([
+  'ACCOUNT',
+  'PASSKEY',
+  'TWO_FACTOR_AUTH',
+  'EXPLICIT_NONE',
+]);
+export const DocumentAuth = ZDocumentAuthTypesSchema.Enum;
+
+const ZDocumentAuthAccountSchema = z.object({
+  type: z.literal(DocumentAuth.ACCOUNT),
+});
+
+const ZDocumentAuthExplicitNoneSchema = z.object({
+  type: z.literal(DocumentAuth.EXPLICIT_NONE),
+});
+
+const ZDocumentAuthPasskeySchema = z.object({
+  type: z.literal(DocumentAuth.PASSKEY),
+  authenticationResponse: ZAuthenticationResponseJSONSchema,
+  tokenReference: z.string().min(1),
+});
+
+const ZDocumentAuth2FASchema = z.object({
+  type: z.literal(DocumentAuth.TWO_FACTOR_AUTH),
+  token: z.string().min(4).max(10),
+});
+
+/**
+ * All the document auth methods for both accessing and actioning.
+ */
+export const ZDocumentAuthMethodsSchema = z.discriminatedUnion('type', [
+  ZDocumentAuthAccountSchema,
+  ZDocumentAuthExplicitNoneSchema,
+  ZDocumentAuthPasskeySchema,
+  ZDocumentAuth2FASchema,
+]);
+
+/**
+ * The global document access auth methods.
+ *
+ * Must keep these two in sync.
+ */
+export const ZDocumentAccessAuthSchema = z.discriminatedUnion('type', [ZDocumentAuthAccountSchema]);
+export const ZDocumentAccessAuthTypesSchema = z.enum([DocumentAuth.ACCOUNT]);
+
+/**
+ * The global document action auth methods.
+ *
+ * Must keep these two in sync.
+ */
+export const ZDocumentActionAuthSchema = z.discriminatedUnion('type', [
+  ZDocumentAuthAccountSchema,
+  ZDocumentAuthPasskeySchema,
+  ZDocumentAuth2FASchema,
+]);
+export const ZDocumentActionAuthTypesSchema = z.enum([
+  DocumentAuth.ACCOUNT,
+  DocumentAuth.PASSKEY,
+  DocumentAuth.TWO_FACTOR_AUTH,
+]);
+
+/**
+ * The recipient access auth methods.
+ *
+ * Must keep these two in sync.
+ */
+export const ZRecipientAccessAuthSchema = z.discriminatedUnion('type', [
+  ZDocumentAuthAccountSchema,
+]);
+export const ZRecipientAccessAuthTypesSchema = z.enum([DocumentAuth.ACCOUNT]);
+
+/**
+ * The recipient action auth methods.
+ *
+ * Must keep these two in sync.
+ */
+export const ZRecipientActionAuthSchema = z.discriminatedUnion('type', [
+  ZDocumentAuthAccountSchema,
+  ZDocumentAuthPasskeySchema,
+  ZDocumentAuth2FASchema,
+  ZDocumentAuthExplicitNoneSchema,
+]);
+export const ZRecipientActionAuthTypesSchema = z.enum([
+  DocumentAuth.ACCOUNT,
+  DocumentAuth.PASSKEY,
+  DocumentAuth.TWO_FACTOR_AUTH,
+  DocumentAuth.EXPLICIT_NONE,
+]);
+
+export const DocumentAccessAuth = ZDocumentAccessAuthTypesSchema.Enum;
+export const DocumentActionAuth = ZDocumentActionAuthTypesSchema.Enum;
+export const RecipientAccessAuth = ZRecipientAccessAuthTypesSchema.Enum;
+export const RecipientActionAuth = ZRecipientActionAuthTypesSchema.Enum;
+
+/**
+ * Authentication options attached to the document.
+ */
+export const ZDocumentAuthOptionsSchema = z.preprocess(
+  (unknownValue) => {
+    if (unknownValue) {
+      return unknownValue;
+    }
+
+    return {
+      globalAccessAuth: null,
+      globalActionAuth: null,
+    };
+  },
+  z.object({
+    globalAccessAuth: ZDocumentAccessAuthTypesSchema.nullable(),
+    globalActionAuth: ZDocumentActionAuthTypesSchema.nullable(),
+  }),
+);
+
+/**
+ * Authentication options attached to the recipient.
+ */
+export const ZRecipientAuthOptionsSchema = z.preprocess(
+  (unknownValue) => {
+    if (unknownValue) {
+      return unknownValue;
+    }
+
+    return {
+      accessAuth: null,
+      actionAuth: null,
+    };
+  },
+  z.object({
+    accessAuth: ZRecipientAccessAuthTypesSchema.nullable(),
+    actionAuth: ZRecipientActionAuthTypesSchema.nullable(),
+  }),
+);
+
+export type TDocumentAuth = z.infer<typeof ZDocumentAuthTypesSchema>;
+export type TDocumentAuthMethods = z.infer<typeof ZDocumentAuthMethodsSchema>;
+export type TDocumentAuthOptions = z.infer<typeof ZDocumentAuthOptionsSchema>;
+export type TDocumentAccessAuth = z.infer<typeof ZDocumentAccessAuthSchema>;
+export type TDocumentAccessAuthTypes = z.infer<typeof ZDocumentAccessAuthTypesSchema>;
+export type TDocumentActionAuth = z.infer<typeof ZDocumentActionAuthSchema>;
+export type TDocumentActionAuthTypes = z.infer<typeof ZDocumentActionAuthTypesSchema>;
+export type TRecipientAccessAuth = z.infer<typeof ZRecipientAccessAuthSchema>;
+export type TRecipientAccessAuthTypes = z.infer<typeof ZRecipientAccessAuthTypesSchema>;
+export type TRecipientActionAuth = z.infer<typeof ZRecipientActionAuthSchema>;
+export type TRecipientActionAuthTypes = z.infer<typeof ZRecipientActionAuthTypesSchema>;
+export type TRecipientAuthOptions = z.infer<typeof ZRecipientAuthOptionsSchema>;

packages/lib/universal/upload/server-actions.ts

@@ -132,6 +132,7 @@ const getS3Client = () => {
 
   return new S3Client({
     endpoint: process.env.NEXT_PRIVATE_UPLOAD_ENDPOINT || undefined,
+    forcePathStyle: process.env.NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE === 'true',
     region: process.env.NEXT_PRIVATE_UPLOAD_REGION || 'us-east-1',
     credentials: hasCredentials
       ? {

packages/lib/utils/authenticator.ts

@@ -4,7 +4,7 @@ import { PASSKEY_TIMEOUT } from '../constants/auth';
 /**
  * Extracts common fields to identify the RP (relying party)
  */
-export const getAuthenticatorRegistrationOptions = () => {
+export const getAuthenticatorOptions = () => {
   const webAppBaseUrl = new URL(WEBAPP_BASE_URL);
   const rpId = webAppBaseUrl.hostname;
 

packages/lib/utils/billing.ts

@@ -1,3 +1,6 @@
+import { env } from 'next-runtime-env';
+
+import { IS_BILLING_ENABLED } from '../constants/app';
 import type { Subscription } from '.prisma/client';
 import { SubscriptionStatus } from '.prisma/client';
 
@@ -13,3 +16,15 @@ export const subscriptionsContainsActivePlan = (
       subscription.status === SubscriptionStatus.ACTIVE && priceIds.includes(subscription.priceId),
   );
 };
+
+export const subscriptionsContainActiveEnterprisePlan = (
+  subscriptions?: Subscription[],
+): boolean => {
+  const enterprisePlanId = env('NEXT_PUBLIC_STRIPE_ENTERPRISE_PLAN_MONTHLY_PRICE_ID');
+
+  if (!enterprisePlanId || !subscriptions || !IS_BILLING_ENABLED()) {
+    return false;
+  }
+
+  return subscriptionsContainsActivePlan(subscriptions, [enterprisePlanId]);
+};

packages/lib/utils/document-audit-logs.ts

@@ -9,7 +9,6 @@ import type {
 } from '@documenso/prisma/client';
 
 import { RECIPIENT_ROLES_DESCRIPTION } from '../constants/recipient-roles';
-import { AppError } from '../errors/app-error';
 import type {
   TDocumentAuditLog,
   TDocumentAuditLogDocumentMetaDiffSchema,
@@ -23,6 +22,7 @@ import {
   RECIPIENT_DIFF_TYPE,
   ZDocumentAuditLogSchema,
 } from '../types/document-audit-logs';
+import { ZRecipientAuthOptionsSchema } from '../types/document-auth';
 import type { RequestMetadata } from '../universal/extract-request-metadata';
 
 type CreateDocumentAuditLogDataOptions<T = TDocumentAuditLog['type']> = {
@@ -33,20 +33,20 @@ type CreateDocumentAuditLogDataOptions<T = TDocumentAuditLog['type']> = {
   requestMetadata?: RequestMetadata;
 };
 
-type CreateDocumentAuditLogDataResponse = Pick<
+export type CreateDocumentAuditLogDataResponse = Pick<
   DocumentAuditLog,
   'type' | 'ipAddress' | 'userAgent' | 'email' | 'userId' | 'name' | 'documentId'
 > & {
   data: TDocumentAuditLog['data'];
 };
 
-export const createDocumentAuditLogData = ({
+export const createDocumentAuditLogData = <T extends TDocumentAuditLog['type']>({
   documentId,
   type,
   data,
   user,
   requestMetadata,
-}: CreateDocumentAuditLogDataOptions): CreateDocumentAuditLogDataResponse => {
+}: CreateDocumentAuditLogDataOptions<T>): CreateDocumentAuditLogDataResponse => {
   return {
     type,
     data,
@@ -69,14 +69,15 @@ export const parseDocumentAuditLogData = (auditLog: DocumentAuditLog): TDocument
 
   // Handle any required migrations here.
   if (!data.success) {
+    // Todo: Alert us.
     console.error(data.error);
-    throw new AppError('MIGRATION_REQUIRED');
+    throw new Error('Migration required');
   }
 
   return data.data;
 };
 
-type PartialRecipient = Pick<Recipient, 'email' | 'name' | 'role'>;
+type PartialRecipient = Pick<Recipient, 'email' | 'name' | 'role' | 'authOptions'>;
 
 export const diffRecipientChanges = (
   oldRecipient: PartialRecipient,
@@ -84,6 +85,32 @@ export const diffRecipientChanges = (
 ): TDocumentAuditLogRecipientDiffSchema[] => {
   const diffs: TDocumentAuditLogRecipientDiffSchema[] = [];
 
+  const oldAuthOptions = ZRecipientAuthOptionsSchema.parse(oldRecipient.authOptions);
+  const oldAccessAuth = oldAuthOptions.accessAuth;
+  const oldActionAuth = oldAuthOptions.actionAuth;
+
+  const newAuthOptions = ZRecipientAuthOptionsSchema.parse(newRecipient.authOptions);
+  const newAccessAuth =
+    newAuthOptions?.accessAuth === undefined ? oldAccessAuth : newAuthOptions.accessAuth;
+  const newActionAuth =
+    newAuthOptions?.actionAuth === undefined ? oldActionAuth : newAuthOptions.actionAuth;
+
+  if (oldAccessAuth !== newAccessAuth) {
+    diffs.push({
+      type: RECIPIENT_DIFF_TYPE.ACCESS_AUTH,
+      from: oldAccessAuth ?? '',
+      to: newAccessAuth ?? '',
+    });
+  }
+
+  if (oldActionAuth !== newActionAuth) {
+    diffs.push({
+      type: RECIPIENT_DIFF_TYPE.ACTION_AUTH,
+      from: oldActionAuth ?? '',
+      to: newActionAuth ?? '',
+    });
+  }
+
   if (oldRecipient.email !== newRecipient.email) {
     diffs.push({
       type: RECIPIENT_DIFF_TYPE.EMAIL,
@@ -167,7 +194,13 @@ export const diffDocumentMetaChanges = (
   const oldPassword = oldData?.password ?? null;
   const oldRedirectUrl = oldData?.redirectUrl ?? '';
 
-  if (oldDateFormat !== newData.dateFormat) {
+  const newDateFormat = newData?.dateFormat ?? '';
+  const newMessage = newData?.message ?? '';
+  const newSubject = newData?.subject ?? '';
+  const newTimezone = newData?.timezone ?? '';
+  const newRedirectUrl = newData?.redirectUrl ?? '';
+
+  if (oldDateFormat !== newDateFormat) {
     diffs.push({
       type: DOCUMENT_META_DIFF_TYPE.DATE_FORMAT,
       from: oldData?.dateFormat ?? '',
@@ -175,35 +208,35 @@ export const diffDocumentMetaChanges = (
     });
   }
 
-  if (oldMessage !== newData.message) {
+  if (oldMessage !== newMessage) {
     diffs.push({
       type: DOCUMENT_META_DIFF_TYPE.MESSAGE,
       from: oldMessage,
-      to: newData.message,
+      to: newMessage,
     });
   }
 
-  if (oldSubject !== newData.subject) {
+  if (oldSubject !== newSubject) {
     diffs.push({
       type: DOCUMENT_META_DIFF_TYPE.SUBJECT,
       from: oldSubject,
-      to: newData.subject,
+      to: newSubject,
     });
   }
 
-  if (oldTimezone !== newData.timezone) {
+  if (oldTimezone !== newTimezone) {
     diffs.push({
       type: DOCUMENT_META_DIFF_TYPE.TIMEZONE,
       from: oldTimezone,
-      to: newData.timezone,
+      to: newTimezone,
     });
   }
 
-  if (oldRedirectUrl !== newData.redirectUrl) {
+  if (oldRedirectUrl !== newRedirectUrl) {
     diffs.push({
       type: DOCUMENT_META_DIFF_TYPE.REDIRECT_URL,
       from: oldRedirectUrl,
-      to: newData.redirectUrl,
+      to: newRedirectUrl,
     });
   }
 
@@ -279,6 +312,14 @@ export const formatDocumentAuditLogAction = (auditLog: TDocumentAuditLog, userId
       anonymous: 'Field unsigned',
       identified: 'unsigned a field',
     }))
+    .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACCESS_UPDATED }, () => ({
+      anonymous: 'Document access auth updated',
+      identified: 'updated the document access auth requirements',
+    }))
+    .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_GLOBAL_AUTH_ACTION_UPDATED }, () => ({
+      anonymous: 'Document signing auth updated',
+      identified: 'updated the document signing auth requirements',
+    }))
     .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED }, () => ({
       anonymous: 'Document updated',
       identified: 'updated the document',

packages/lib/utils/document-auth.ts

@@ -0,0 +1,72 @@
+import type { Document, Recipient } from '@documenso/prisma/client';
+
+import type {
+  TDocumentAuthOptions,
+  TRecipientAccessAuthTypes,
+  TRecipientActionAuthTypes,
+  TRecipientAuthOptions,
+} from '../types/document-auth';
+import { DocumentAuth } from '../types/document-auth';
+import { ZDocumentAuthOptionsSchema, ZRecipientAuthOptionsSchema } from '../types/document-auth';
+
+type ExtractDocumentAuthMethodsOptions = {
+  documentAuth: Document['authOptions'];
+  recipientAuth?: Recipient['authOptions'];
+};
+
+/**
+ * Parses and extracts the document and recipient authentication values.
+ *
+ * Will combine the recipient and document auth values to derive the final
+ * auth values for a recipient if possible.
+ */
+export const extractDocumentAuthMethods = ({
+  documentAuth,
+  recipientAuth,
+}: ExtractDocumentAuthMethodsOptions) => {
+  const documentAuthOption = ZDocumentAuthOptionsSchema.parse(documentAuth);
+  const recipientAuthOption = ZRecipientAuthOptionsSchema.parse(recipientAuth);
+
+  const derivedRecipientAccessAuth: TRecipientAccessAuthTypes | null =
+    recipientAuthOption.accessAuth || documentAuthOption.globalAccessAuth;
+
+  const derivedRecipientActionAuth: TRecipientActionAuthTypes | null =
+    recipientAuthOption.actionAuth || documentAuthOption.globalActionAuth;
+
+  const recipientAccessAuthRequired = derivedRecipientAccessAuth !== null;
+
+  const recipientActionAuthRequired =
+    derivedRecipientActionAuth !== DocumentAuth.EXPLICIT_NONE &&
+    derivedRecipientActionAuth !== null;
+
+  return {
+    derivedRecipientAccessAuth,
+    derivedRecipientActionAuth,
+    recipientAccessAuthRequired,
+    recipientActionAuthRequired,
+    documentAuthOption,
+    recipientAuthOption,
+  };
+};
+
+/**
+ * Create document auth options in a type safe way.
+ */
+export const createDocumentAuthOptions = (options: TDocumentAuthOptions): TDocumentAuthOptions => {
+  return {
+    globalAccessAuth: options?.globalAccessAuth ?? null,
+    globalActionAuth: options?.globalActionAuth ?? null,
+  };
+};
+
+/**
+ * Create recipient auth options in a type safe way.
+ */
+export const createRecipientAuthOptions = (
+  options: TRecipientAuthOptions,
+): TRecipientAuthOptions => {
+  return {
+    accessAuth: options?.accessAuth ?? null,
+    actionAuth: options?.actionAuth ?? null,
+  };
+};

packages/lib/utils/logger.ts

@@ -1,16 +0,0 @@
-import type { LoggerConfig } from 'next-axiom';
-import { Logger } from 'next-axiom';
-
-/**
- * For usage in server-side code.
- *
- * When used in a server component, you must flush the logs.
- *
- * https://github.com/axiomhq/next-axiom?tab=readme-ov-file#server-components
- */
-export const buildServerLogger = (config?: LoggerConfig) => {
-  return new Logger({
-    source: 'server',
-    ...config,
-  });
-};

packages/prisma/migrations/20240311113243_add_document_auth/migration.sql

@@ -0,0 +1,5 @@
+-- AlterTable
+ALTER TABLE "Document" ADD COLUMN     "authOptions" JSONB;
+
+-- AlterTable
+ALTER TABLE "Recipient" ADD COLUMN     "authOptions" JSONB;

packages/prisma/migrations/20240327074701_add_secondary_verification_id/migration.sql

@@ -0,0 +1,12 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[secondaryId]` on the table `VerificationToken` will be added. If there are existing duplicate values, this will fail.
+  - The required column `secondaryId` was added to the `VerificationToken` table with a prisma-level default value. This is not possible if the table is not empty. Please add this column as optional, then populate it before making it required.
+
+*/
+-- AlterTable
+ALTER TABLE "VerificationToken" ADD COLUMN     "secondaryId" TEXT NOT NULL;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "VerificationToken_secondaryId_key" ON "VerificationToken"("secondaryId");

packages/prisma/schema.prisma

@@ -127,6 +127,7 @@ model AnonymousVerificationToken {
 
 model VerificationToken {
   id          Int      @id @default(autoincrement())
+  secondaryId String   @unique @default(cuid())
   identifier  String
   token       String   @unique
   expires     DateTime
@@ -255,6 +256,7 @@ model Document {
   id             Int                 @id @default(autoincrement())
   userId         Int
   User           User                @relation(fields: [userId], references: [id], onDelete: Cascade)
+  authOptions    Json?
   title          String
   status         DocumentStatus      @default(DRAFT)
   Recipient      Recipient[]
@@ -352,6 +354,7 @@ model Recipient {
   token         String
   expired       DateTime?
   signedAt      DateTime?
+  authOptions   Json?
   role          RecipientRole @default(SIGNER)
   readStatus    ReadStatus    @default(NOT_OPENED)
   signingStatus SigningStatus @default(NOT_SIGNED)

packages/prisma/seed/documents.ts

@@ -1,4 +1,4 @@
-import type { User } from '@prisma/client';
+import type { Document, User } from '@prisma/client';
 import { nanoid } from 'nanoid';
 import fs from 'node:fs';
 import path from 'node:path';
@@ -33,19 +33,19 @@ export const seedDocuments = async (documents: DocumentToSeed[]) => {
     documents.map(async (document, i) =>
       match(document.type)
         .with(DocumentStatus.DRAFT, async () =>
-          createDraftDocument(document.sender, document.recipients, {
+          seedDraftDocument(document.sender, document.recipients, {
             key: i,
             createDocumentOptions: document.documentOptions,
           }),
         )
         .with(DocumentStatus.PENDING, async () =>
-          createPendingDocument(document.sender, document.recipients, {
+          seedPendingDocument(document.sender, document.recipients, {
             key: i,
             createDocumentOptions: document.documentOptions,
           }),
         )
         .with(DocumentStatus.COMPLETED, async () =>
-          createCompletedDocument(document.sender, document.recipients, {
+          seedCompletedDocument(document.sender, document.recipients, {
             key: i,
             createDocumentOptions: document.documentOptions,
           }),
@@ -55,7 +55,37 @@ export const seedDocuments = async (documents: DocumentToSeed[]) => {
   );
 };
 
-const createDraftDocument = async (
+export const seedBlankDocument = async (owner: User, options: CreateDocumentOptions = {}) => {
+  const { key, createDocumentOptions = {} } = options;
+
+  const documentData = await prisma.documentData.create({
+    data: {
+      type: DocumentDataType.BYTES_64,
+      data: examplePdf,
+      initialData: examplePdf,
+    },
+  });
+
+  return await prisma.document.create({
+    data: {
+      title: `[TEST] Document ${key} - Draft`,
+      status: DocumentStatus.DRAFT,
+      documentDataId: documentData.id,
+      userId: owner.id,
+      ...createDocumentOptions,
+    },
+  });
+};
+
+export const unseedDocument = async (documentId: number) => {
+  await prisma.document.delete({
+    where: {
+      id: documentId,
+    },
+  });
+};
+
+export const seedDraftDocument = async (
   sender: User,
   recipients: (User | string)[],
   options: CreateDocumentOptions = {},
@@ -114,6 +144,8 @@ const createDraftDocument = async (
       },
     });
   }
+
+  return document;
 };
 
 type CreateDocumentOptions = {
@@ -121,7 +153,7 @@ type CreateDocumentOptions = {
   createDocumentOptions?: Partial<Prisma.DocumentUncheckedCreateInput>;
 };
 
-const createPendingDocument = async (
+export const seedPendingDocument = async (
   sender: User,
   recipients: (User | string)[],
   options: CreateDocumentOptions = {},
@@ -180,9 +212,145 @@ const createPendingDocument = async (
       },
     });
   }
+
+  return document;
 };
 
-const createCompletedDocument = async (
+export const seedPendingDocumentNoFields = async ({
+  owner,
+  recipients,
+  updateDocumentOptions,
+}: {
+  owner: User;
+  recipients: (User | string)[];
+  updateDocumentOptions?: Partial<Prisma.DocumentUncheckedUpdateInput>;
+}) => {
+  const document: Document = await seedBlankDocument(owner);
+
+  for (const recipient of recipients) {
+    const email = typeof recipient === 'string' ? recipient : recipient.email;
+    const name = typeof recipient === 'string' ? recipient : recipient.name ?? '';
+
+    await prisma.recipient.create({
+      data: {
+        email,
+        name,
+        token: nanoid(),
+        readStatus: ReadStatus.OPENED,
+        sendStatus: SendStatus.SENT,
+        signingStatus: SigningStatus.NOT_SIGNED,
+        signedAt: new Date(),
+        Document: {
+          connect: {
+            id: document.id,
+          },
+        },
+      },
+    });
+  }
+
+  const createdRecipients = await prisma.recipient.findMany({
+    where: {
+      documentId: document.id,
+    },
+    include: {
+      Field: true,
+    },
+  });
+
+  const latestDocument = updateDocumentOptions
+    ? await prisma.document.update({
+        where: {
+          id: document.id,
+        },
+        data: updateDocumentOptions,
+      })
+    : document;
+
+  return {
+    document: latestDocument,
+    recipients: createdRecipients,
+  };
+};
+
+export const seedPendingDocumentWithFullFields = async ({
+  owner,
+  recipients,
+  recipientsCreateOptions,
+  updateDocumentOptions,
+  fields = [FieldType.DATE, FieldType.EMAIL, FieldType.NAME, FieldType.SIGNATURE, FieldType.TEXT],
+}: {
+  owner: User;
+  recipients: (User | string)[];
+  recipientsCreateOptions?: Partial<Prisma.RecipientCreateInput>[];
+  updateDocumentOptions?: Partial<Prisma.DocumentUncheckedUpdateInput>;
+  fields?: FieldType[];
+}) => {
+  const document: Document = await seedBlankDocument(owner);
+
+  for (const [recipientIndex, recipient] of recipients.entries()) {
+    const email = typeof recipient === 'string' ? recipient : recipient.email;
+    const name = typeof recipient === 'string' ? recipient : recipient.name ?? '';
+
+    await prisma.recipient.create({
+      data: {
+        email,
+        name,
+        token: nanoid(),
+        readStatus: ReadStatus.OPENED,
+        sendStatus: SendStatus.SENT,
+        signingStatus: SigningStatus.NOT_SIGNED,
+        signedAt: new Date(),
+        Document: {
+          connect: {
+            id: document.id,
+          },
+        },
+        Field: {
+          createMany: {
+            data: fields.map((fieldType, fieldIndex) => ({
+              page: 1,
+              type: fieldType,
+              inserted: false,
+              customText: name,
+              positionX: new Prisma.Decimal((recipientIndex + 1) * 5),
+              positionY: new Prisma.Decimal((fieldIndex + 1) * 5),
+              width: new Prisma.Decimal(5),
+              height: new Prisma.Decimal(5),
+              documentId: document.id,
+            })),
+          },
+        },
+        ...(recipientsCreateOptions?.[recipientIndex] ?? {}),
+      },
+    });
+  }
+
+  const createdRecipients = await prisma.recipient.findMany({
+    where: {
+      documentId: document.id,
+    },
+    include: {
+      Field: true,
+    },
+  });
+
+  const latestDocument = updateDocumentOptions
+    ? await prisma.document.update({
+        where: {
+          id: document.id,
+        },
+        data: updateDocumentOptions,
+      })
+    : document;
+
+  return {
+    document: latestDocument,
+    recipients: createdRecipients,
+  };
+};
+
+export const seedCompletedDocument = async (
   sender: User,
   recipients: (User | string)[],
   options: CreateDocumentOptions = {},
@@ -241,6 +409,8 @@ const createCompletedDocument = async (
       },
     });
   }
+
+  return document;
 };
 
 /**

packages/prisma/seed/pr-718-add-stepper-component.ts

@@ -1,29 +0,0 @@
-import { hashSync } from '@documenso/lib/server-only/auth/hash';
-
-import { prisma } from '..';
-
-//
-// https://github.com/documenso/documenso/pull/713
-//
-
-const PULL_REQUEST_NUMBER = 718;
-
-const EMAIL_DOMAIN = `pr-${PULL_REQUEST_NUMBER}.documenso.com`;
-
-export const TEST_USER = {
-  name: 'User 1',
-  email: `user1@${EMAIL_DOMAIN}`,
-  password: 'Password123',
-} as const;
-
-export const seedDatabase = async () => {
-  await prisma.user.create({
-    data: {
-      name: TEST_USER.name,
-      email: TEST_USER.email,
-      password: hashSync(TEST_USER.password),
-      emailVerified: new Date(),
-      url: TEST_USER.email,
-    },
-  });
-};

packages/prisma/seed/subscriptions.ts

@@ -0,0 +1,19 @@
+import { prisma } from '..';
+
+export const seedTestEmail = () => `user-${Date.now()}@test.documenso.com`;
+
+type SeedSubscriptionOptions = {
+  userId: number;
+  priceId: string;
+};
+
+export const seedUserSubscription = async ({ userId, priceId }: SeedSubscriptionOptions) => {
+  return await prisma.subscription.create({
+    data: {
+      userId,
+      planId: Date.now().toString(),
+      priceId,
+      status: 'ACTIVE',
+    },
+  });
+};

packages/prisma/seed/users.ts

@@ -2,6 +2,8 @@ import { hashSync } from '@documenso/lib/server-only/auth/hash';
 
 import { prisma } from '..';
 
+export const seedTestEmail = () => `user-${Date.now()}@test.documenso.com`;
+
 type SeedUserOptions = {
   name?: string;
   email?: string;

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

@@ -7,6 +7,7 @@ import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { ErrorCode } from '@documenso/lib/next-auth/error-codes';
 import { createPasskey } from '@documenso/lib/server-only/auth/create-passkey';
+import { createPasskeyAuthenticationOptions } from '@documenso/lib/server-only/auth/create-passkey-authentication-options';
 import { createPasskeyRegistrationOptions } from '@documenso/lib/server-only/auth/create-passkey-registration-options';
 import { createPasskeySigninOptions } from '@documenso/lib/server-only/auth/create-passkey-signin-options';
 import { deletePasskey } from '@documenso/lib/server-only/auth/delete-passkey';
@@ -19,6 +20,7 @@ import { extractNextApiRequestMetadata } from '@documenso/lib/universal/extract-
 
 import { authenticatedProcedure, procedure, router } from '../trpc';
 import {
+  ZCreatePasskeyAuthenticationOptionsMutationSchema,
   ZCreatePasskeyMutationSchema,
   ZDeletePasskeyMutationSchema,
   ZFindPasskeysQuerySchema,
@@ -115,6 +117,25 @@ export const authRouter = router({
       }
     }),
 
+  createPasskeyAuthenticationOptions: authenticatedProcedure
+    .input(ZCreatePasskeyAuthenticationOptionsMutationSchema)
+    .mutation(async ({ ctx, input }) => {
+      try {
+        return await createPasskeyAuthenticationOptions({
+          userId: ctx.user.id,
+          preferredPasskeyId: input?.preferredPasskeyId,
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message:
+            'We were unable to create the authentication options for the passkey. Please try again later.',
+        });
+      }
+    }),
+
   createPasskeyRegistrationOptions: authenticatedProcedure.mutation(async ({ ctx }) => {
     try {
       return await createPasskeyRegistrationOptions({

packages/trpc/server/auth-router/schema.ts

@@ -40,6 +40,12 @@ export const ZCreatePasskeyMutationSchema = z.object({
   verificationResponse: ZRegistrationResponseJSONSchema,
 });
 
+export const ZCreatePasskeyAuthenticationOptionsMutationSchema = z
+  .object({
+    preferredPasskeyId: z.string().optional(),
+  })
+  .optional();
+
 export const ZDeletePasskeyMutationSchema = z.object({
   passkeyId: z.string().trim().min(1),
 });

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

@@ -13,10 +13,10 @@ import { getDocumentWithDetailsById } from '@documenso/lib/server-only/document/
 import { resendDocument } from '@documenso/lib/server-only/document/resend-document';
 import { searchDocumentsWithKeyword } from '@documenso/lib/server-only/document/search-documents-with-keyword';
 import { sendDocument } from '@documenso/lib/server-only/document/send-document';
+import { updateDocumentSettings } from '@documenso/lib/server-only/document/update-document-settings';
 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 { buildServerLogger } from '@documenso/lib/utils/logger';
 
 import { authenticatedProcedure, procedure, router } from '../trpc';
 import {
@@ -30,15 +30,10 @@ import {
   ZSearchDocumentsMutationSchema,
   ZSendDocumentMutationSchema,
   ZSetPasswordForDocumentMutationSchema,
+  ZSetSettingsForDocumentMutationSchema,
   ZSetTitleForDocumentMutationSchema,
 } from './schema';
 
-const logger = buildServerLogger({
-  args: {
-    context: 'trpcDocumentRouter',
-  },
-});
-
 export const documentRouter = router({
   getDocumentById: authenticatedProcedure
     .input(ZGetDocumentByIdQuerySchema)
@@ -49,10 +44,6 @@ export const documentRouter = router({
           userId: ctx.user.id,
         });
       } catch (err) {
-        logger.error('getDocumentById', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -62,18 +53,17 @@ export const documentRouter = router({
       }
     }),
 
-  getDocumentByToken: procedure.input(ZGetDocumentByTokenQuerySchema).query(async ({ input }) => {
+  getDocumentByToken: procedure
+    .input(ZGetDocumentByTokenQuerySchema)
+    .query(async ({ input, ctx }) => {
       try {
         const { token } = input;
 
         return await getDocumentAndSenderByToken({
           token,
+          userId: ctx.user?.id,
         });
       } catch (err) {
-      logger.error('getDocumentByToken', {
-        error: err,
-      });
-
         console.error(err);
 
         throw new TRPCError({
@@ -92,10 +82,6 @@ export const documentRouter = router({
           userId: ctx.user.id,
         });
       } catch (err) {
-        logger.error('getDocumentWithDetailsById', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -129,10 +115,6 @@ export const documentRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        logger.error('createDocument', {
-          error: err,
-        });
-
         if (err instanceof TRPCError) {
           throw err;
         }
@@ -159,10 +141,6 @@ export const documentRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        logger.error('deleteDocument', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -188,10 +166,6 @@ export const documentRouter = router({
           userId: ctx.user.id,
         });
       } catch (err) {
-        logger.error('findDocumentAuditLogs', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -201,6 +175,46 @@ export const documentRouter = router({
       }
     }),
 
+  // Todo: Add API
+  setSettingsForDocument: authenticatedProcedure
+    .input(ZSetSettingsForDocumentMutationSchema)
+    .mutation(async ({ input, ctx }) => {
+      try {
+        const { documentId, teamId, data, meta } = input;
+
+        const userId = ctx.user.id;
+
+        const requestMetadata = extractNextApiRequestMetadata(ctx.req);
+
+        if (meta.timezone || meta.dateFormat || meta.redirectUrl) {
+          await upsertDocumentMeta({
+            documentId,
+            dateFormat: meta.dateFormat,
+            timezone: meta.timezone,
+            redirectUrl: meta.redirectUrl,
+            userId: ctx.user.id,
+            requestMetadata,
+          });
+        }
+
+        return await updateDocumentSettings({
+          userId,
+          teamId,
+          documentId,
+          data,
+          requestMetadata,
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message:
+            'We were unable to update the settings for this document. Please try again later.',
+        });
+      }
+    }),
+
   setTitleForDocument: authenticatedProcedure
     .input(ZSetTitleForDocumentMutationSchema)
     .mutation(async ({ input, ctx }) => {
@@ -208,7 +222,6 @@ export const documentRouter = router({
 
       const userId = ctx.user.id;
 
-      try {
       return await updateTitle({
         title,
         userId,
@@ -216,13 +229,6 @@ export const documentRouter = router({
         documentId,
         requestMetadata: extractNextApiRequestMetadata(ctx.req),
       });
-      } catch (err) {
-        logger.error('setTitleForDocument', {
-          error: err,
-        });
-
-        console.error(err);
-      }
     }),
 
   setPasswordForDocument: authenticatedProcedure
@@ -249,10 +255,6 @@ export const documentRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        logger.error('setPasswordForDocument', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -288,10 +290,6 @@ export const documentRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        logger.error('sendDocument', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -311,10 +309,6 @@ export const documentRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        logger.error('resendDocument', {
-          error: err,
-        });
-
         console.error(err);
 
         throw new TRPCError({
@@ -333,10 +327,6 @@ export const documentRouter = router({
           ...input,
         });
       } catch (err) {
-        logger.error('duplicateDocument', {
-          error: err,
-        });
-
         console.log(err);
 
         throw new TRPCError({
@@ -357,11 +347,7 @@ export const documentRouter = router({
           userId: ctx.user.id,
         });
         return documents;
-      } catch (err) {
-        logger.error('searchDocuments', {
-          error: err,
-        });
-
+      } catch (error) {
         throw new TRPCError({
           code: 'BAD_REQUEST',
           message: 'We are unable to search for documents. Please try again later.',

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

@@ -1,6 +1,10 @@
 import { z } from 'zod';
 
 import { URL_REGEX } from '@documenso/lib/constants/url-regex';
+import {
+  ZDocumentAccessAuthTypesSchema,
+  ZDocumentActionAuthTypesSchema,
+} from '@documenso/lib/types/document-auth';
 import { ZBaseTableSearchParamsSchema } from '@documenso/lib/types/search-params';
 import { FieldType, RecipientRole } from '@documenso/prisma/client';
 
@@ -46,6 +50,30 @@ export const ZCreateDocumentMutationSchema = z.object({
 
 export type TCreateDocumentMutationSchema = z.infer<typeof ZCreateDocumentMutationSchema>;
 
+export const ZSetSettingsForDocumentMutationSchema = z.object({
+  documentId: z.number(),
+  teamId: z.number().min(1).optional(),
+  data: z.object({
+    title: z.string().min(1).optional(),
+    globalAccessAuth: ZDocumentAccessAuthTypesSchema.nullable().optional(),
+    globalActionAuth: ZDocumentActionAuthTypesSchema.nullable().optional(),
+  }),
+  meta: z.object({
+    timezone: z.string(),
+    dateFormat: z.string(),
+    redirectUrl: z
+      .string()
+      .optional()
+      .refine((value) => value === undefined || value === '' || URL_REGEX.test(value), {
+        message: 'Please enter a valid URL',
+      }),
+  }),
+});
+
+export type TSetGeneralSettingsForDocumentMutationSchema = z.infer<
+  typeof ZSetSettingsForDocumentMutationSchema
+>;
+
 export const ZSetTitleForDocumentMutationSchema = z.object({
   documentId: z.number(),
   teamId: z.number().min(1).optional(),
@@ -97,8 +125,8 @@ export const ZSendDocumentMutationSchema = z.object({
   meta: z.object({
     subject: z.string(),
     message: z.string(),
-    timezone: z.string(),
-    dateFormat: z.string(),
+    timezone: z.string().optional(),
+    dateFormat: z.string().optional(),
     redirectUrl: z
       .string()
       .optional()

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

@@ -1,5 +1,6 @@
 import { TRPCError } from '@trpc/server';
 
+import { AppError } from '@documenso/lib/errors/app-error';
 import { removeSignedFieldWithToken } from '@documenso/lib/server-only/field/remove-signed-field-with-token';
 import { setFieldsForDocument } from '@documenso/lib/server-only/field/set-fields-for-document';
 import { setFieldsForTemplate } from '@documenso/lib/server-only/field/set-fields-for-template';
@@ -21,10 +22,6 @@ export const fieldRouter = router({
       try {
         const { documentId, fields } = input;
 
-        if (Date.now() > 0) {
-          throw new Error('Some demo error');
-        }
-
         return await setFieldsForDocument({
           documentId,
           userId: ctx.user.id,
@@ -41,10 +38,7 @@ export const fieldRouter = router({
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
-        console.error(err, {
-          level: 'CRITICAL',
-          context: 'fieldRouter.addFields',
-        });
+        console.error(err);
 
         throw new TRPCError({
           code: 'BAD_REQUEST',
@@ -78,22 +72,21 @@ export const fieldRouter = router({
     .input(ZSignFieldWithTokenMutationSchema)
     .mutation(async ({ input, ctx }) => {
       try {
-        const { token, fieldId, value, isBase64 } = input;
+        const { token, fieldId, value, isBase64, authOptions } = input;
 
         return await signFieldWithToken({
           token,
           fieldId,
           value,
           isBase64,
+          userId: ctx.user?.id,
+          authOptions,
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {
         console.error(err);
 
-        throw new TRPCError({
-          code: 'BAD_REQUEST',
-          message: 'We were unable to sign this field. Please try again later.',
-        });
+        throw AppError.parseErrorToTRPCError(err);
       }
     }),
 

packages/trpc/server/field-router/schema.ts

@@ -1,5 +1,6 @@
 import { z } from 'zod';
 
+import { ZRecipientActionAuthSchema } from '@documenso/lib/types/document-auth';
 import { FieldType } from '@documenso/prisma/client';
 
 export const ZAddFieldsMutationSchema = z.object({
@@ -45,6 +46,7 @@ export const ZSignFieldWithTokenMutationSchema = z.object({
   fieldId: z.number(),
   value: z.string().trim(),
   isBase64: z.boolean().optional(),
+  authOptions: ZRecipientActionAuthSchema.optional(),
 });
 
 export type TSignFieldWithTokenMutationSchema = z.infer<typeof ZSignFieldWithTokenMutationSchema>;

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

@@ -28,6 +28,7 @@ export const recipientRouter = router({
             email: signer.email,
             name: signer.name,
             role: signer.role,
+            actionAuth: signer.actionAuth,
           })),
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
@@ -71,11 +72,13 @@ export const recipientRouter = router({
     .input(ZCompleteDocumentWithTokenMutationSchema)
     .mutation(async ({ input, ctx }) => {
       try {
-        const { token, documentId } = input;
+        const { token, documentId, authOptions } = input;
 
         return await completeDocumentWithToken({
           token,
           documentId,
+          authOptions,
+          userId: ctx.user?.id,
           requestMetadata: extractNextApiRequestMetadata(ctx.req),
         });
       } catch (err) {

packages/trpc/server/recipient-router/schema.ts

@@ -1,5 +1,9 @@
 import { z } from 'zod';
 
+import {
+  ZRecipientActionAuthSchema,
+  ZRecipientActionAuthTypesSchema,
+} from '@documenso/lib/types/document-auth';
 import { RecipientRole } from '@documenso/prisma/client';
 
 export const ZAddSignersMutationSchema = z
@@ -12,6 +16,7 @@ export const ZAddSignersMutationSchema = z
         email: z.string().email().min(1),
         name: z.string(),
         role: z.nativeEnum(RecipientRole),
+        actionAuth: ZRecipientActionAuthTypesSchema.optional().nullable(),
       }),
     ),
   })
@@ -54,6 +59,7 @@ export type TAddTemplateSignersMutationSchema = z.infer<typeof ZAddTemplateSigne
 export const ZCompleteDocumentWithTokenMutationSchema = z.object({
   token: z.string(),
   documentId: z.number(),
+  authOptions: ZRecipientActionAuthSchema.optional(),
 });
 
 export type TCompleteDocumentWithTokenMutationSchema = z.infer<

packages/trpc/server/trpc.ts

@@ -23,7 +23,6 @@ export const authenticatedMiddleware = t.middleware(async ({ ctx, next }) => {
   return await next({
     ctx: {
       ...ctx,
-
       user: ctx.user,
       session: ctx.session,
     },

packages/tsconfig/process-env.d.ts

@@ -17,6 +17,7 @@ declare namespace NodeJS {
 
     NEXT_PUBLIC_UPLOAD_TRANSPORT?: 'database' | 's3';
     NEXT_PRIVATE_UPLOAD_ENDPOINT?: string;
+    NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE?: string;
     NEXT_PRIVATE_UPLOAD_REGION?: string;
     NEXT_PRIVATE_UPLOAD_BUCKET?: string;
     NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID?: string;

packages/ui/components/animate/animate-generic-fade-in-out.tsx

@@ -5,11 +5,17 @@ import { motion } from 'framer-motion';
 type AnimateGenericFadeInOutProps = {
   children: React.ReactNode;
   className?: string;
+  motionKey?: string;
 };
 
-export const AnimateGenericFadeInOut = ({ children, className }: AnimateGenericFadeInOutProps) => {
+export const AnimateGenericFadeInOut = ({
+  children,
+  className,
+  motionKey,
+}: AnimateGenericFadeInOutProps) => {
   return (
     <motion.section
+      key={motionKey}
       initial={{
         opacity: 0,
       }}

packages/ui/components/document/document-download-button.tsx

@@ -60,7 +60,7 @@ export const DocumentDownloadButton = ({
       loading={isLoading}
       {...props}
     >
-      <Download className="mr-2 h-5 w-5" />
+      {!isLoading && <Download className="mr-2 h-5 w-5" />}
       Download
     </Button>
   );

packages/ui/primitives/checkbox.tsx

@@ -16,7 +16,7 @@ const Checkbox = React.forwardRef<
   <CheckboxPrimitive.Root
     ref={ref}
     className={cn(
-      'border-input ring-offset-background focus-visible:ring-ring data-[state=checked]:border-primary peer h-4 w-4 shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+      'border-input bg-background ring-offset-background focus-visible:ring-ring data-[state=checked]:border-primary peer h-4 w-4 shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
       className,
     )}
     {...props}

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

@@ -53,6 +53,7 @@ export type AddFieldsFormProps = {
   recipients: Recipient[];
   fields: Field[];
   onSubmit: (_data: TAddFieldsFormSchema) => void;
+  isDocumentPdfLoaded: boolean;
 };
 
 export const AddFieldsFormPartial = ({
@@ -61,6 +62,7 @@ export const AddFieldsFormPartial = ({
   recipients,
   fields,
   onSubmit,
+  isDocumentPdfLoaded,
 }: AddFieldsFormProps) => {
   const { isWithinPageBounds, getFieldPosition, getPage } = useDocumentElement();
   const { currentStep, totalSteps, previousStep } = useStep();
@@ -342,7 +344,8 @@ export const AddFieldsFormPartial = ({
             </Card>
           )}
 
-          {localFields.map((field, index) => (
+          {isDocumentPdfLoaded &&
+            localFields.map((field, index) => (
               <FieldItem
                 key={index}
                 field={field}

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

@@ -0,0 +1,370 @@
+'use client';
+
+import { useEffect } from 'react';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { InfoIcon } from 'lucide-react';
+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 { 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';
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from '@documenso/ui/primitives/accordion';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+
+import { Combobox } from '../combobox';
+import { Input } from '../input';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../select';
+import { useStep } from '../stepper';
+import { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip';
+import type { TAddSettingsFormSchema } from './add-settings.types';
+import { ZAddSettingsFormSchema } from './add-settings.types';
+import {
+  DocumentFlowFormContainerActions,
+  DocumentFlowFormContainerContent,
+  DocumentFlowFormContainerFooter,
+  DocumentFlowFormContainerHeader,
+  DocumentFlowFormContainerStep,
+} from './document-flow-root';
+import { ShowFieldItem } from './show-field-item';
+import type { DocumentFlowStep } from './types';
+
+export type AddSettingsFormProps = {
+  documentFlow: DocumentFlowStep;
+  recipients: Recipient[];
+  fields: Field[];
+  isDocumentEnterprise: boolean;
+  isDocumentPdfLoaded: boolean;
+  document: DocumentWithData;
+  onSubmit: (_data: TAddSettingsFormSchema) => void;
+};
+
+export const AddSettingsFormPartial = ({
+  documentFlow,
+  recipients,
+  fields,
+  isDocumentEnterprise,
+  isDocumentPdfLoaded,
+  document,
+  onSubmit,
+}: AddSettingsFormProps) => {
+  const { documentAuthOption } = extractDocumentAuthMethods({
+    documentAuth: document.authOptions,
+  });
+
+  const form = useForm<TAddSettingsFormSchema>({
+    resolver: zodResolver(ZAddSettingsFormSchema),
+    defaultValues: {
+      title: document.title,
+      globalAccessAuth: documentAuthOption?.globalAccessAuth || undefined,
+      globalActionAuth: documentAuthOption?.globalActionAuth || undefined,
+      meta: {
+        timezone: document.documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE,
+        dateFormat: document.documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
+        redirectUrl: document.documentMeta?.redirectUrl ?? '',
+      },
+    },
+  });
+
+  const { stepIndex, currentStep, totalSteps, previousStep } = useStep();
+
+  const documentHasBeenSent = recipients.some(
+    (recipient) => recipient.sendStatus === SendStatus.SENT,
+  );
+
+  // We almost always want to set the timezone to the user's local timezone to avoid confusion
+  // when the document is signed.
+  useEffect(() => {
+    if (!form.formState.touchedFields.meta?.timezone && !documentHasBeenSent) {
+      form.setValue('meta.timezone', Intl.DateTimeFormat().resolvedOptions().timeZone);
+    }
+  }, [documentHasBeenSent, form, form.setValue, form.formState.touchedFields.meta?.timezone]);
+
+  return (
+    <>
+      <DocumentFlowFormContainerHeader
+        title={documentFlow.title}
+        description={documentFlow.description}
+      />
+
+      <DocumentFlowFormContainerContent>
+        {isDocumentPdfLoaded &&
+          fields.map((field, index) => (
+            <ShowFieldItem key={index} field={field} recipients={recipients} />
+          ))}
+
+        <Form {...form}>
+          <fieldset
+            className="flex h-full flex-col space-y-6"
+            disabled={form.formState.isSubmitting}
+          >
+            <FormField
+              control={form.control}
+              name="title"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel required>Title</FormLabel>
+
+                  <FormControl>
+                    <Input
+                      className="bg-background"
+                      {...field}
+                      disabled={document.status !== DocumentStatus.DRAFT || field.disabled}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="globalAccessAuth"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel className="flex flex-row items-center">
+                    Document access
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <InfoIcon className="mx-2 h-4 w-4" />
+                      </TooltipTrigger>
+
+                      <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
+                        <h2>
+                          <strong>Document access</strong>
+                        </h2>
+
+                        <p>The authentication required for recipients to view the document.</p>
+
+                        <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
+                          <li>
+                            <strong>Require account</strong> - The recipient must be signed in to
+                            view the document
+                          </li>
+                          <li>
+                            <strong>None</strong> - The document can be accessed directly by the URL
+                            sent to the recipient
+                          </li>
+                        </ul>
+                      </TooltipContent>
+                    </Tooltip>
+                  </FormLabel>
+
+                  <FormControl>
+                    <Select {...field} onValueChange={field.onChange}>
+                      <SelectTrigger className="bg-background text-muted-foreground">
+                        <SelectValue data-testid="documentAccessSelectValue" placeholder="None" />
+                      </SelectTrigger>
+
+                      <SelectContent position="popper">
+                        {Object.values(DocumentAccessAuth).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>
+                      </SelectContent>
+                    </Select>
+                  </FormControl>
+                </FormItem>
+              )}
+            />
+
+            {isDocumentEnterprise && (
+              <FormField
+                control={form.control}
+                name="globalActionAuth"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel className="flex flex-row items-center">
+                      Recipient action authentication
+                      <Tooltip>
+                        <TooltipTrigger>
+                          <InfoIcon className="mx-2 h-4 w-4" />
+                        </TooltipTrigger>
+
+                        <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
+                          <h2>
+                            <strong>Global recipient action authentication</strong>
+                          </h2>
+
+                          <p>
+                            The authentication required for recipients to sign the signature field.
+                          </p>
+
+                          <p>
+                            This can be overriden by setting the authentication requirements
+                            directly on each recipient in the next step.
+                          </p>
+
+                          <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
+                            <li>
+                              <strong>Require account</strong> - The recipient must be signed in
+                            </li>
+                            <li>
+                              <strong>Require passkey</strong> - The recipient must have an account
+                              and passkey configured via their settings
+                            </li>
+                            <li>
+                              <strong>None</strong> - No authentication required
+                            </li>
+                          </ul>
+                        </TooltipContent>
+                      </Tooltip>
+                    </FormLabel>
+
+                    <FormControl>
+                      <Select {...field} onValueChange={field.onChange}>
+                        <SelectTrigger className="bg-background text-muted-foreground">
+                          <SelectValue data-testid="documentActionSelectValue" placeholder="None" />
+                        </SelectTrigger>
+
+                        <SelectContent position="popper">
+                          {Object.values(DocumentActionAuth).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>
+                        </SelectContent>
+                      </Select>
+                    </FormControl>
+                  </FormItem>
+                )}
+              />
+            )}
+
+            <Accordion type="multiple" className="mt-6">
+              <AccordionItem value="advanced-options" className="border-none">
+                <AccordionTrigger className="text-foreground mb-2 rounded border px-3 py-2 text-left hover:bg-neutral-200/30 hover:no-underline">
+                  Advanced Options
+                </AccordionTrigger>
+
+                <AccordionContent className="text-muted-foreground -mx-1 px-1 pt-2 text-sm leading-relaxed">
+                  <div className="flex flex-col space-y-6 ">
+                    <FormField
+                      control={form.control}
+                      name="meta.dateFormat"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormLabel>Date Format</FormLabel>
+
+                          <FormControl>
+                            <Select
+                              {...field}
+                              onValueChange={field.onChange}
+                              disabled={documentHasBeenSent}
+                            >
+                              <SelectTrigger className="bg-background">
+                                <SelectValue />
+                              </SelectTrigger>
+
+                              <SelectContent>
+                                {DATE_FORMATS.map((format) => (
+                                  <SelectItem key={format.key} value={format.value}>
+                                    {format.label}
+                                  </SelectItem>
+                                ))}
+                              </SelectContent>
+                            </Select>
+                          </FormControl>
+
+                          <FormMessage />
+                        </FormItem>
+                      )}
+                    />
+
+                    <FormField
+                      control={form.control}
+                      name="meta.timezone"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormLabel>Time Zone</FormLabel>
+
+                          <FormControl>
+                            <Combobox
+                              className="bg-background"
+                              options={TIME_ZONES}
+                              {...field}
+                              onChange={(value) => value && field.onChange(value)}
+                              disabled={documentHasBeenSent}
+                            />
+                          </FormControl>
+
+                          <FormMessage />
+                        </FormItem>
+                      )}
+                    />
+
+                    <FormField
+                      control={form.control}
+                      name="meta.redirectUrl"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormLabel className="flex flex-row items-center">
+                            Redirect URL{' '}
+                            <Tooltip>
+                              <TooltipTrigger>
+                                <InfoIcon className="mx-2 h-4 w-4" />
+                              </TooltipTrigger>
+
+                              <TooltipContent className="text-muted-foreground max-w-xs">
+                                Add a URL to redirect the user to once the document is signed
+                              </TooltipContent>
+                            </Tooltip>
+                          </FormLabel>
+
+                          <FormControl>
+                            <Input className="bg-background" {...field} />
+                          </FormControl>
+
+                          <FormMessage />
+                        </FormItem>
+                      )}
+                    />
+                  </div>
+                </AccordionContent>
+              </AccordionItem>
+            </Accordion>
+          </fieldset>
+        </Form>
+      </DocumentFlowFormContainerContent>
+
+      <DocumentFlowFormContainerFooter>
+        <DocumentFlowFormContainerStep
+          title={documentFlow.title}
+          step={currentStep}
+          maxStep={totalSteps}
+        />
+
+        <DocumentFlowFormContainerActions
+          loading={form.formState.isSubmitting}
+          disabled={form.formState.isSubmitting}
+          canGoBack={stepIndex !== 0}
+          onGoBackClick={previousStep}
+          onGoNextClick={form.handleSubmit(onSubmit)}
+        />
+      </DocumentFlowFormContainerFooter>
+    </>
+  );
+};

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

@@ -0,0 +1,42 @@
+import { z } from 'zod';
+
+import { DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
+import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
+import { URL_REGEX } from '@documenso/lib/constants/url-regex';
+import {
+  ZDocumentAccessAuthTypesSchema,
+  ZDocumentActionAuthTypesSchema,
+} from '@documenso/lib/types/document-auth';
+
+export const ZMapNegativeOneToUndefinedSchema = z
+  .string()
+  .optional()
+  .transform((val) => {
+    if (val === '-1') {
+      return undefined;
+    }
+
+    return val;
+  });
+
+export const ZAddSettingsFormSchema = z.object({
+  title: z.string().trim().min(1, { message: "Title can't be empty" }),
+  globalAccessAuth: ZMapNegativeOneToUndefinedSchema.pipe(
+    ZDocumentAccessAuthTypesSchema.optional(),
+  ),
+  globalActionAuth: ZMapNegativeOneToUndefinedSchema.pipe(
+    ZDocumentActionAuthTypesSchema.optional(),
+  ),
+  meta: z.object({
+    timezone: z.string().optional().default(DEFAULT_DOCUMENT_TIME_ZONE),
+    dateFormat: z.string().optional().default(DEFAULT_DOCUMENT_DATE_FORMAT),
+    redirectUrl: z
+      .string()
+      .optional()
+      .refine((value) => value === undefined || value === '' || URL_REGEX.test(value), {
+        message: 'Please enter a valid URL',
+      }),
+  }),
+});
+
+export type TAddSettingsFormSchema = z.infer<typeof ZAddSettingsFormSchema>;

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

@@ -1,25 +1,33 @@
 'use client';
 
-import React, { useId } from 'react';
+import React, { useId, useMemo, useState } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
-import { AnimatePresence, motion } from 'framer-motion';
-import { Plus, Trash } from 'lucide-react';
-import { Controller, useFieldArray, useForm } from 'react-hook-form';
+import { motion } from 'framer-motion';
+import { InfoIcon, Plus, Trash } from 'lucide-react';
+import { useFieldArray, useForm } from 'react-hook-form';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
+import { DOCUMENT_AUTH_TYPES } from '@documenso/lib/constants/document-auth';
+import {
+  RecipientActionAuth,
+  ZRecipientAuthOptionsSchema,
+} from '@documenso/lib/types/document-auth';
 import { nanoid } from '@documenso/lib/universal/id';
 import type { Field, Recipient } from '@documenso/prisma/client';
-import { DocumentStatus, RecipientRole, SendStatus } from '@documenso/prisma/client';
-import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
+import { RecipientRole, SendStatus } from '@documenso/prisma/client';
+import { AnimateGenericFadeInOut } from '@documenso/ui/components/animate/animate-generic-fade-in-out';
+import { cn } from '@documenso/ui/lib/utils';
 
 import { Button } from '../button';
+import { Checkbox } from '../checkbox';
+import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from '../form/form';
 import { FormErrorMessage } from '../form/form-error-message';
 import { Input } from '../input';
-import { Label } from '../label';
 import { ROLE_ICONS } from '../recipient-role-icons';
-import { Select, SelectContent, SelectItem, SelectTrigger } from '../select';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../select';
 import { useStep } from '../stepper';
+import { Tooltip, TooltipContent, TooltipTrigger } from '../tooltip';
 import { useToast } from '../use-toast';
 import type { TAddSignersFormSchema } from './add-signers.types';
 import { ZAddSignersFormSchema } from './add-signers.types';
@@ -37,16 +45,18 @@ export type AddSignersFormProps = {
   documentFlow: DocumentFlowStep;
   recipients: Recipient[];
   fields: Field[];
-  document: DocumentWithData;
+  isDocumentEnterprise: boolean;
   onSubmit: (_data: TAddSignersFormSchema) => void;
+  isDocumentPdfLoaded: boolean;
 };
 
 export const AddSignersFormPartial = ({
   documentFlow,
   recipients,
-  document,
   fields,
+  isDocumentEnterprise,
   onSubmit,
+  isDocumentPdfLoaded,
 }: AddSignersFormProps) => {
   const { toast } = useToast();
   const { remaining } = useLimits();
@@ -55,11 +65,7 @@ export const AddSignersFormPartial = ({
 
   const { currentStep, totalSteps, previousStep } = useStep();
 
-  const {
-    control,
-    handleSubmit,
-    formState: { errors, isSubmitting },
-  } = useForm<TAddSignersFormSchema>({
+  const form = useForm<TAddSignersFormSchema>({
     resolver: zodResolver(ZAddSignersFormSchema),
     defaultValues: {
       signers:
@@ -70,6 +76,8 @@ export const AddSignersFormPartial = ({
               name: recipient.name,
               email: recipient.email,
               role: recipient.role,
+              actionAuth:
+                ZRecipientAuthOptionsSchema.parse(recipient.authOptions)?.actionAuth ?? undefined,
             }))
           : [
               {
@@ -77,12 +85,33 @@ export const AddSignersFormPartial = ({
                 name: '',
                 email: '',
                 role: RecipientRole.SIGNER,
+                actionAuth: undefined,
               },
             ],
     },
   });
 
-  const onFormSubmit = handleSubmit(onSubmit);
+  // Always show advanced settings if any recipient has auth options.
+  const alwaysShowAdvancedSettings = useMemo(() => {
+    const recipientHasAuthOptions = recipients.find((recipient) => {
+      const recipientAuthOptions = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
+
+      return recipientAuthOptions?.accessAuth || recipientAuthOptions?.actionAuth;
+    });
+
+    const formHasActionAuth = form.getValues('signers').find((signer) => signer.actionAuth);
+
+    return recipientHasAuthOptions !== undefined || formHasActionAuth !== undefined;
+  }, [recipients, form]);
+
+  const [showAdvancedSettings, setShowAdvancedSettings] = useState(alwaysShowAdvancedSettings);
+
+  const {
+    formState: { errors, isSubmitting },
+    control,
+  } = form;
+
+  const onFormSubmit = form.handleSubmit(onSubmit);
 
   const {
     append: appendSigner,
@@ -112,6 +141,7 @@ export const AddSignersFormPartial = ({
       name: '',
       email: '',
       role: RecipientRole.SIGNER,
+      actionAuth: undefined,
     });
   };
 
@@ -144,73 +174,166 @@ export const AddSignersFormPartial = ({
         description={documentFlow.description}
       />
       <DocumentFlowFormContainerContent>
-        <div className="flex w-full flex-col gap-y-4">
-          {fields.map((field, index) => (
+        {isDocumentPdfLoaded &&
+          fields.map((field, index) => (
             <ShowFieldItem key={index} field={field} recipients={recipients} />
           ))}
 
-          <AnimatePresence>
+        <AnimateGenericFadeInOut motionKey={showAdvancedSettings ? 'Show' : 'Hide'}>
+          <Form {...form}>
+            <div className="flex w-full flex-col gap-y-2">
               {signers.map((signer, index) => (
                 <motion.fieldset
                   key={signer.id}
                   data-native-id={signer.nativeId}
                   disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
-                className="flex flex-wrap items-end gap-x-4"
+                  className={cn('grid grid-cols-8 gap-4 pb-4', {
+                    'border-b pt-2': showAdvancedSettings,
+                  })}
                 >
-                <div className="flex-1">
-                  <Label htmlFor={`signer-${signer.id}-email`}>
-                    Email
-                    <span className="text-destructive ml-1 inline-block font-medium">*</span>
-                  </Label>
-
-                  <Controller
-                    control={control}
+                  <FormField
+                    control={form.control}
                     name={`signers.${index}.email`}
                     render={({ field }) => (
+                      <FormItem
+                        className={cn('relative', {
+                          'col-span-3': !showAdvancedSettings,
+                          'col-span-4': showAdvancedSettings,
+                        })}
+                      >
+                        {!showAdvancedSettings && index === 0 && (
+                          <FormLabel required>Email</FormLabel>
+                        )}
+
+                        <FormControl>
                           <Input
-                        id={`signer-${signer.id}-email`}
                             type="email"
-                        className="bg-background mt-2"
+                            placeholder="Email"
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
-                        onKeyDown={onKeyDown}
                             {...field}
+                            onKeyDown={onKeyDown}
                           />
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
                     )}
                   />
-                </div>
 
-                <div className="flex-1">
-                  <Label htmlFor={`signer-${signer.id}-name`}>Name</Label>
-
-                  <Controller
-                    control={control}
+                  <FormField
+                    control={form.control}
                     name={`signers.${index}.name`}
                     render={({ field }) => (
+                      <FormItem
+                        className={cn({
+                          'col-span-3': !showAdvancedSettings,
+                          'col-span-4': showAdvancedSettings,
+                        })}
+                      >
+                        {!showAdvancedSettings && index === 0 && (
+                          <FormLabel required>Name</FormLabel>
+                        )}
+
+                        <FormControl>
                           <Input
-                        id={`signer-${signer.id}-name`}
-                        type="text"
-                        className="bg-background mt-2"
+                            placeholder="Name"
                             disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
-                        onKeyDown={onKeyDown}
                             {...field}
+                            onKeyDown={onKeyDown}
                           />
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
                     )}
                   />
-                </div>
 
-                <div className="w-[60px]">
-                  <Controller
-                    control={control}
-                    name={`signers.${index}.role`}
-                    render={({ field: { value, onChange } }) => (
+                  {showAdvancedSettings && isDocumentEnterprise && (
+                    <FormField
+                      control={form.control}
+                      name={`signers.${index}.actionAuth`}
+                      render={({ field }) => (
+                        <FormItem className="col-span-6">
+                          <FormControl>
                             <Select
-                        value={value}
-                        onValueChange={(x) => onChange(x)}
+                              {...field}
+                              onValueChange={field.onChange}
                               disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
                             >
-                        <SelectTrigger className="bg-background">{ROLE_ICONS[value]}</SelectTrigger>
+                              <SelectTrigger className="bg-background text-muted-foreground">
+                                <SelectValue placeholder="Inherit authentication method" />
 
-                        <SelectContent className="" align="end">
+                                <Tooltip>
+                                  <TooltipTrigger className="-mr-1 ml-auto">
+                                    <InfoIcon className="mx-2 h-4 w-4" />
+                                  </TooltipTrigger>
+
+                                  <TooltipContent className="text-foreground max-w-md p-4">
+                                    <h2>
+                                      <strong>Recipient action authentication</strong>
+                                    </h2>
+
+                                    <p>The authentication required for recipients to sign fields</p>
+
+                                    <p className="mt-2">This will override any global settings.</p>
+
+                                    <ul className="ml-3.5 list-outside list-disc space-y-0.5 py-2">
+                                      <li>
+                                        <strong>Inherit authentication method</strong> - Use the
+                                        global action signing authentication method configured in
+                                        the "General Settings" step
+                                      </li>
+                                      <li>
+                                        <strong>Require account</strong> - The recipient must be
+                                        signed in
+                                      </li>
+                                      <li>
+                                        <strong>Require passkey</strong> - The recipient must have
+                                        an account and passkey configured via their settings
+                                      </li>
+                                      <li>
+                                        <strong>None</strong> - No authentication required
+                                      </li>
+                                    </ul>
+                                  </TooltipContent>
+                                </Tooltip>
+                              </SelectTrigger>
+
+                              <SelectContent position="popper">
+                                {/* 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>
+                                ))}
+                              </SelectContent>
+                            </Select>
+                          </FormControl>
+
+                          <FormMessage />
+                        </FormItem>
+                      )}
+                    />
+                  )}
+
+                  <FormField
+                    name={`signers.${index}.role`}
+                    render={({ field }) => (
+                      <FormItem className="col-span-1 mt-auto">
+                        <FormControl>
+                          <Select
+                            {...field}
+                            onValueChange={field.onChange}
+                            disabled={isSubmitting || hasBeenSentToRecipientId(signer.nativeId)}
+                          >
+                            <SelectTrigger className="bg-background w-[60px]">
+                              {/* eslint-disable-next-line @typescript-eslint/consistent-type-assertions */}
+                              {ROLE_ICONS[field.value as RecipientRole]}
+                            </SelectTrigger>
+
+                            <SelectContent align="end">
                               <SelectItem value={RecipientRole.SIGNER}>
                                 <div className="flex items-center">
                                   <span className="mr-2">{ROLE_ICONS[RecipientRole.SIGNER]}</span>
@@ -240,14 +363,16 @@ export const AddSignersFormPartial = ({
                               </SelectItem>
                             </SelectContent>
                           </Select>
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
                     )}
                   />
-                </div>
 
-                <div>
                   <button
                     type="button"
-                    className="justify-left inline-flex h-10 w-10 items-center text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50"
+                    className="col-span-1 mt-auto inline-flex h-10 w-10 items-center justify-center text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50"
                     disabled={
                       isSubmitting ||
                       hasBeenSentToRecipientId(signer.nativeId) ||
@@ -257,15 +382,8 @@ export const AddSignersFormPartial = ({
                   >
                     <Trash className="h-5 w-5" />
                   </button>
-                </div>
-
-                <div className="w-full">
-                  <FormErrorMessage className="mt-2" error={errors.signers?.[index]?.email} />
-                  <FormErrorMessage className="mt-2" error={errors.signers?.[index]?.name} />
-                </div>
                 </motion.fieldset>
               ))}
-          </AnimatePresence>
             </div>
 
             <FormErrorMessage
@@ -274,7 +392,11 @@ export const AddSignersFormPartial = ({
               error={'signers__root' in errors && errors['signers__root']}
             />
 
-        <div className="mt-4">
+            <div
+              className={cn('mt-2 flex flex-row items-center space-x-4', {
+                'mt-4': showAdvancedSettings,
+              })}
+            >
               <Button
                 type="button"
                 disabled={isSubmitting || signers.length >= remaining.recipients}
@@ -283,7 +405,28 @@ export const AddSignersFormPartial = ({
                 <Plus className="-ml-1 mr-2 h-5 w-5" />
                 Add Signer
               </Button>
+
+              {!alwaysShowAdvancedSettings && isDocumentEnterprise && (
+                <div className="flex flex-row items-center">
+                  <Checkbox
+                    id="showAdvancedRecipientSettings"
+                    className="h-5 w-5"
+                    checkClassName="dark:text-white text-primary"
+                    checked={showAdvancedSettings}
+                    onCheckedChange={(value) => setShowAdvancedSettings(Boolean(value))}
+                  />
+
+                  <label
+                    className="text-muted-foreground ml-2 text-sm"
+                    htmlFor="showAdvancedRecipientSettings"
+                  >
+                    Show advanced settings
+                  </label>
                 </div>
+              )}
+            </div>
+          </Form>
+        </AnimateGenericFadeInOut>
       </DocumentFlowFormContainerContent>
 
       <DocumentFlowFormContainerFooter>
@@ -294,7 +437,6 @@ export const AddSignersFormPartial = ({
         />
 
         <DocumentFlowFormContainerActions
-          canGoBack={document.status === DocumentStatus.DRAFT}
           loading={isSubmitting}
           disabled={isSubmitting}
           onGoBackClick={previousStep}

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

@@ -1,5 +1,8 @@
 import { z } from 'zod';
 
+import { ZRecipientActionAuthTypesSchema } from '@documenso/lib/types/document-auth';
+
+import { ZMapNegativeOneToUndefinedSchema } from './add-settings.types';
 import { RecipientRole } from '.prisma/client';
 
 export const ZAddSignersFormSchema = z
@@ -11,6 +14,9 @@ export const ZAddSignersFormSchema = z
         email: z.string().email().min(1),
         name: z.string(),
         role: z.nativeEnum(RecipientRole),
+        actionAuth: ZMapNegativeOneToUndefinedSchema.pipe(
+          ZRecipientActionAuthTypesSchema.optional(),
+        ),
       }),
     ),
   })

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

@@ -1,33 +1,12 @@
 'use client';
 
-import { useEffect } from 'react';
-
 import { zodResolver } from '@hookform/resolvers/zod';
-import { Info } from 'lucide-react';
-import { Controller, useForm } from 'react-hook-form';
+import { useForm } from 'react-hook-form';
 
-import { DATE_FORMATS, DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
-import { DEFAULT_DOCUMENT_TIME_ZONE, TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import type { Field, Recipient } from '@documenso/prisma/client';
 import { DocumentStatus } from '@documenso/prisma/client';
-import { SendStatus } from '@documenso/prisma/client';
 import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
-import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from '@documenso/ui/primitives/accordion';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '@documenso/ui/primitives/select';
-import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
-import { Combobox } from '../combobox';
 import { FormErrorMessage } from '../form/form-error-message';
 import { Input } from '../input';
 import { Label } from '../label';
@@ -50,6 +29,7 @@ export type AddSubjectFormProps = {
   fields: Field[];
   document: DocumentWithData;
   onSubmit: (_data: TAddSubjectFormSchema) => void;
+  isDocumentPdfLoaded: boolean;
 };
 
 export const AddSubjectFormPartial = ({
@@ -58,21 +38,17 @@ export const AddSubjectFormPartial = ({
   fields: fields,
   document,
   onSubmit,
+  isDocumentPdfLoaded,
 }: AddSubjectFormProps) => {
   const {
-    control,
     register,
     handleSubmit,
-    formState: { errors, isSubmitting, touchedFields },
-    setValue,
+    formState: { errors, isSubmitting },
   } = useForm<TAddSubjectFormSchema>({
     defaultValues: {
       meta: {
         subject: document.documentMeta?.subject ?? '',
         message: document.documentMeta?.message ?? '',
-        timezone: document.documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE,
-        dateFormat: document.documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
-        redirectUrl: document.documentMeta?.redirectUrl ?? '',
       },
     },
     resolver: zodResolver(ZAddSubjectFormSchema),
@@ -81,20 +57,6 @@ export const AddSubjectFormPartial = ({
   const onFormSubmit = handleSubmit(onSubmit);
   const { currentStep, totalSteps, previousStep } = useStep();
 
-  const hasDateField = fields.find((field) => field.type === 'DATE');
-
-  const documentHasBeenSent = recipients.some(
-    (recipient) => recipient.sendStatus === SendStatus.SENT,
-  );
-
-  // We almost always want to set the timezone to the user's local timezone to avoid confusion
-  // when the document is signed.
-  useEffect(() => {
-    if (!touchedFields.meta?.timezone && !documentHasBeenSent) {
-      setValue('meta.timezone', Intl.DateTimeFormat().resolvedOptions().timeZone);
-    }
-  }, [documentHasBeenSent, setValue, touchedFields.meta?.timezone]);
-
   return (
     <>
       <DocumentFlowFormContainerHeader
@@ -103,7 +65,8 @@ export const AddSubjectFormPartial = ({
       />
       <DocumentFlowFormContainerContent>
         <div className="flex flex-col">
-          {fields.map((field, index) => (
+          {isDocumentPdfLoaded &&
+            fields.map((field, index) => (
               <ShowFieldItem key={index} field={field} recipients={recipients} />
             ))}
 
@@ -167,95 +130,6 @@ export const AddSubjectFormPartial = ({
                 </li>
               </ul>
             </div>
-
-            <Accordion type="multiple" className="mt-8 border-none">
-              <AccordionItem value="advanced-options" className="border-none">
-                <AccordionTrigger className="mb-2 border-b text-left hover:no-underline">
-                  Advanced Options
-                </AccordionTrigger>
-
-                <AccordionContent className="text-muted-foreground -mx-1 flex max-w-prose flex-col px-1 pt-2 text-sm leading-relaxed">
-                  {hasDateField && (
-                    <>
-                      <div className="flex flex-col">
-                        <Label htmlFor="date-format">
-                          Date Format <span className="text-muted-foreground">(Optional)</span>
-                        </Label>
-
-                        <Controller
-                          control={control}
-                          name={`meta.dateFormat`}
-                          disabled={documentHasBeenSent}
-                          render={({ field: { value, onChange, disabled } }) => (
-                            <Select value={value} onValueChange={onChange} disabled={disabled}>
-                              <SelectTrigger className="bg-background mt-2">
-                                <SelectValue />
-                              </SelectTrigger>
-
-                              <SelectContent>
-                                {DATE_FORMATS.map((format) => (
-                                  <SelectItem key={format.key} value={format.value}>
-                                    {format.label}
-                                  </SelectItem>
-                                ))}
-                              </SelectContent>
-                            </Select>
-                          )}
-                        />
-                      </div>
-
-                      <div className="mt-4 flex flex-col">
-                        <Label htmlFor="time-zone">
-                          Time Zone <span className="text-muted-foreground">(Optional)</span>
-                        </Label>
-
-                        <Controller
-                          control={control}
-                          name={`meta.timezone`}
-                          render={({ field: { value, onChange } }) => (
-                            <Combobox
-                              className="bg-background"
-                              options={TIME_ZONES}
-                              value={value}
-                              onChange={(value) => value && onChange(value)}
-                              disabled={documentHasBeenSent}
-                            />
-                          )}
-                        />
-                      </div>
-                    </>
-                  )}
-
-                  <div className="mt-2 flex flex-col">
-                    <div className="flex flex-col gap-y-4">
-                      <div>
-                        <Label htmlFor="redirectUrl" className="flex items-center">
-                          Redirect URL
-                          <Tooltip>
-                            <TooltipTrigger>
-                              <Info className="mx-2 h-4 w-4" />
-                            </TooltipTrigger>
-
-                            <TooltipContent className="text-muted-foreground max-w-xs">
-                              Add a URL to redirect the user to once the document is signed
-                            </TooltipContent>
-                          </Tooltip>
-                        </Label>
-
-                        <Input
-                          id="redirectUrl"
-                          type="url"
-                          className="bg-background my-2"
-                          {...register('meta.redirectUrl')}
-                        />
-
-                        <FormErrorMessage className="mt-2" error={errors.meta?.redirectUrl} />
-                      </div>
-                    </div>
-                  </div>
-                </AccordionContent>
-              </AccordionItem>
-            </Accordion>
           </div>
         </div>
       </DocumentFlowFormContainerContent>

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

@@ -1,21 +1,9 @@
 import { z } from 'zod';
 
-import { DEFAULT_DOCUMENT_DATE_FORMAT } from '@documenso/lib/constants/date-formats';
-import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
-import { URL_REGEX } from '@documenso/lib/constants/url-regex';
-
 export const ZAddSubjectFormSchema = z.object({
   meta: z.object({
     subject: z.string(),
     message: z.string(),
-    timezone: z.string().optional().default(DEFAULT_DOCUMENT_TIME_ZONE),
-    dateFormat: z.string().optional().default(DEFAULT_DOCUMENT_DATE_FORMAT),
-    redirectUrl: z
-      .string()
-      .optional()
-      .refine((value) => value === undefined || value === '' || URL_REGEX.test(value), {
-        message: 'Please enter a valid URL',
-      }),
   }),
 });
 

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

@@ -1,103 +0,0 @@
-'use client';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-
-import type { Field, Recipient } from '@documenso/prisma/client';
-import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
-
-import { FormErrorMessage } from '../form/form-error-message';
-import { Input } from '../input';
-import { Label } from '../label';
-import { useStep } from '../stepper';
-import type { TAddTitleFormSchema } from './add-title.types';
-import { ZAddTitleFormSchema } from './add-title.types';
-import {
-  DocumentFlowFormContainerActions,
-  DocumentFlowFormContainerContent,
-  DocumentFlowFormContainerFooter,
-  DocumentFlowFormContainerHeader,
-  DocumentFlowFormContainerStep,
-} from './document-flow-root';
-import { ShowFieldItem } from './show-field-item';
-import type { DocumentFlowStep } from './types';
-
-export type AddTitleFormProps = {
-  documentFlow: DocumentFlowStep;
-  recipients: Recipient[];
-  fields: Field[];
-  document: DocumentWithData;
-  onSubmit: (_data: TAddTitleFormSchema) => void;
-};
-
-export const AddTitleFormPartial = ({
-  documentFlow,
-  recipients,
-  fields,
-  document,
-  onSubmit,
-}: AddTitleFormProps) => {
-  const {
-    register,
-    handleSubmit,
-    formState: { errors, isSubmitting },
-  } = useForm<TAddTitleFormSchema>({
-    resolver: zodResolver(ZAddTitleFormSchema),
-    defaultValues: {
-      title: document.title,
-    },
-  });
-
-  const onFormSubmit = handleSubmit(onSubmit);
-
-  const { stepIndex, currentStep, totalSteps, previousStep } = useStep();
-
-  return (
-    <>
-      <DocumentFlowFormContainerHeader
-        title={documentFlow.title}
-        description={documentFlow.description}
-      />
-      <DocumentFlowFormContainerContent>
-        {fields.map((field, index) => (
-          <ShowFieldItem key={index} field={field} recipients={recipients} />
-        ))}
-
-        <div className="flex flex-col">
-          <div className="flex flex-col gap-y-4">
-            <div>
-              <Label htmlFor="title">
-                Title<span className="text-destructive ml-1 inline-block font-medium">*</span>
-              </Label>
-
-              <Input
-                id="title"
-                className="bg-background my-2"
-                disabled={isSubmitting}
-                {...register('title')}
-              />
-
-              <FormErrorMessage className="mt-2" error={errors.title} />
-            </div>
-          </div>
-        </div>
-      </DocumentFlowFormContainerContent>
-
-      <DocumentFlowFormContainerFooter>
-        <DocumentFlowFormContainerStep
-          title={documentFlow.title}
-          step={currentStep}
-          maxStep={totalSteps}
-        />
-
-        <DocumentFlowFormContainerActions
-          loading={isSubmitting}
-          disabled={isSubmitting}
-          canGoBack={stepIndex !== 0}
-          onGoBackClick={previousStep}
-          onGoNextClick={() => void onFormSubmit()}
-        />
-      </DocumentFlowFormContainerFooter>
-    </>
-  );
-};