Merge branch 'feat/rr7' into feat/bulk-add-fields

apps/documentation/pages/developers/embedding/index.mdx

@@ -52,9 +52,9 @@ Platform customers have access to advanced styling options to customize the embe
 <EmbedDirectTemplate
   token={token}
   cssVars={{
-    primary: '#0000FF',
+    colorPrimary: '#0000FF',
-    background: '#F5F5F5',
+    colorBackground: '#F5F5F5',
-    radius: '8px',
+    borderRadius: '8px',
   }}
 />
 ```

apps/documentation/pages/developers/embedding/preact.mdx

@@ -95,9 +95,9 @@ const MyEmbeddingComponent = () => {
     }
   `;
   const cssVars = {
-    primary: '#0000FF',
+    colorPrimary: '#0000FF',
-    background: '#F5F5F5',
+    colorBackground: '#F5F5F5',
-    radius: '8px',
+    borderRadius: '8px',
   };
 
   return (

apps/documentation/pages/developers/embedding/react.mdx

@@ -99,9 +99,9 @@ const MyEmbeddingComponent = () => {
       `}
       // CSS Variables
       cssVars={{
-        primary: '#0000FF',
+        colorPrimary: '#0000FF',
-        background: '#F5F5F5',
+        colorBackground: '#F5F5F5',
-        radius: '8px',
+        borderRadius: '8px',
       }}
       // Dark Mode Control
       darkModeDisabled={true}

apps/documentation/pages/developers/embedding/solid.mdx

@@ -95,9 +95,9 @@ const MyEmbeddingComponent = () => {
     }
   `;
   const cssVars = {
-    primary: '#0000FF',
+    colorPrimary: '#0000FF',
-    background: '#F5F5F5',
+    colorBackground: '#F5F5F5',
-    radius: '8px',
+    borderRadius: '8px',
   };
 
   return (

apps/documentation/pages/developers/embedding/svelte.mdx

@@ -97,9 +97,9 @@ Platform customers have access to advanced styling options:
     }
   `;
   const cssVars = {
-    primary: '#0000FF',
+    colorPrimary: '#0000FF',
-    background: '#F5F5F5',
+    colorBackground: '#F5F5F5',
-    radius: '8px',
+    borderRadius: '8px',
   };
 </script>
 

apps/documentation/pages/developers/embedding/vue.mdx

@@ -97,9 +97,9 @@ Platform customers have access to advanced styling options:
   }
 `;
   const cssVars = {
-    primary: '#0000FF',
+    colorPrimary: '#0000FF',
-    background: '#F5F5F5',
+    colorBackground: '#F5F5F5',
-    radius: '8px',
+    borderRadius: '8px',
   };
 </script>
 

apps/remix/app/components/dialogs/assistant-confirmation-dialog.tsx

@@ -1,9 +1,4 @@
-import { useState } from 'react';
-
-import { zodResolver } from '@hookform/resolvers/zod';
 import { Trans } from '@lingui/react/macro';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
 
 import { Button } from '@documenso/ui/primitives/button';
 import {
@@ -14,208 +9,64 @@ import {
   DialogHeader,
   DialogTitle,
 } 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 { DocumentSigningDisclosure } from '../general/document-signing/document-signing-disclosure';
 
-export type NextSigner = {
-  name: string;
-  email: string;
-};
-
 type ConfirmationDialogProps = {
   isOpen: boolean;
   onClose: () => void;
-  onConfirm: (nextSigner?: NextSigner) => void;
+  onConfirm: () => void;
   hasUninsertedFields: boolean;
   isSubmitting: boolean;
-  allowDictateNextSigner?: boolean;
-  defaultNextSigner?: NextSigner;
 };
 
-const ZNextSignerFormSchema = z.object({
-  name: z.string().min(1, 'Name is required'),
-  email: z.string().email('Invalid email address'),
-});
-
-type TNextSignerFormSchema = z.infer<typeof ZNextSignerFormSchema>;
-
 export function AssistantConfirmationDialog({
   isOpen,
   onClose,
   onConfirm,
   hasUninsertedFields,
   isSubmitting,
-  allowDictateNextSigner = false,
-  defaultNextSigner,
 }: ConfirmationDialogProps) {
-  const [isEditingNextSigner, setIsEditingNextSigner] = useState(false);
-
-  const form = useForm<TNextSignerFormSchema>({
-    resolver: zodResolver(ZNextSignerFormSchema),
-    defaultValues: {
-      name: defaultNextSigner?.name ?? '',
-      email: defaultNextSigner?.email ?? '',
-    },
-  });
-
   const onOpenChange = () => {
-    if (form.formState.isSubmitting) {
+    if (isSubmitting) {
       return;
     }
 
-    form.reset({
-      name: defaultNextSigner?.name ?? '',
-      email: defaultNextSigner?.email ?? '',
-    });
-
-    setIsEditingNextSigner(false);
     onClose();
   };
 
-  const onFormSubmit = async (data: TNextSignerFormSchema) => {
-    if (allowDictateNextSigner && data.name && data.email) {
-      await onConfirm({
-        name: data.name,
-        email: data.email,
-      });
-    } else {
-      await onConfirm();
-    }
-  };
-
-  const isNextSignerValid = !allowDictateNextSigner || (form.watch('name') && form.watch('email'));
-
   return (
     <Dialog open={isOpen} onOpenChange={onOpenChange}>
       <DialogContent>
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onFormSubmit)}>
-            <fieldset
-              disabled={form.formState.isSubmitting || isSubmitting}
-              className="border-none p-0"
-            >
         <DialogHeader>
           <DialogTitle>
             <Trans>Complete Document</Trans>
           </DialogTitle>
           <DialogDescription>
             <Trans>
-                    Are you sure you want to complete the document? This action cannot be undone.
+              Are you sure you want to complete the document? This action cannot be undone. Please
-                    Please ensure that you have completed prefilling all relevant fields before
+              ensure that you have completed prefilling all relevant fields before proceeding.
-                    proceeding.
             </Trans>
           </DialogDescription>
         </DialogHeader>
 
-              <div className="mt-4 flex flex-col gap-4">
+        <div className="flex flex-col gap-4">
-                {allowDictateNextSigner && (
+          <DocumentSigningDisclosure />
-                  <div className="space-y-4">
-                    {!isEditingNextSigner && (
-                      <div>
-                        <p className="text-muted-foreground text-sm">
-                          The next recipient to sign this document will be{' '}
-                          <span className="font-semibold">{form.watch('name')}</span> (
-                          <span className="font-semibold">{form.watch('email')}</span>).
-                        </p>
-
-                        <Button
-                          type="button"
-                          className="mt-2"
-                          variant="outline"
-                          size="sm"
-                          onClick={() => setIsEditingNextSigner((prev) => !prev)}
-                        >
-                          <Trans>Update Recipient</Trans>
-                        </Button>
-                      </div>
-                    )}
-
-                    {isEditingNextSigner && (
-                      <div className="flex flex-col gap-4 md:flex-row">
-                        <FormField
-                          control={form.control}
-                          name="name"
-                          render={({ field }) => (
-                            <FormItem className="flex-1">
-                              <FormLabel>
-                                <Trans>Name</Trans>
-                              </FormLabel>
-                              <FormControl>
-                                <Input
-                                  {...field}
-                                  className="mt-2"
-                                  placeholder="Enter the next signer's name"
-                                />
-                              </FormControl>
-                              <FormMessage />
-                            </FormItem>
-                          )}
-                        />
-
-                        <FormField
-                          control={form.control}
-                          name="email"
-                          render={({ field }) => (
-                            <FormItem className="flex-1">
-                              <FormLabel>
-                                <Trans>Email</Trans>
-                              </FormLabel>
-                              <FormControl>
-                                <Input
-                                  {...field}
-                                  type="email"
-                                  className="mt-2"
-                                  placeholder="Enter the next signer's email"
-                                />
-                              </FormControl>
-                              <FormMessage />
-                            </FormItem>
-                          )}
-                        />
-                      </div>
-                    )}
-                  </div>
-                )}
-
-                <DocumentSigningDisclosure className="mt-4" />
         </div>
 
         <DialogFooter className="mt-4">
-                <Button
+          <Button variant="secondary" onClick={onClose} disabled={isSubmitting}>
-                  type="button"
+            Cancel
-                  variant="secondary"
-                  onClick={onClose}
-                  disabled={form.formState.isSubmitting}
-                >
-                  <Trans>Cancel</Trans>
           </Button>
           <Button
-                  type="submit"
             variant={hasUninsertedFields ? 'destructive' : 'default'}
-                  disabled={form.formState.isSubmitting || !isNextSignerValid}
+            onClick={onConfirm}
-                  loading={form.formState.isSubmitting}
+            disabled={isSubmitting}
+            loading={isSubmitting}
           >
-                  {form.formState.isSubmitting ? (
+            {isSubmitting ? 'Submitting...' : hasUninsertedFields ? 'Proceed' : 'Continue'}
-                    <Trans>Submitting...</Trans>
-                  ) : hasUninsertedFields ? (
-                    <Trans>Proceed</Trans>
-                  ) : (
-                    <Trans>Continue</Trans>
-                  )}
           </Button>
         </DialogFooter>
-            </fieldset>
-          </form>
-        </Form>
       </DialogContent>
     </Dialog>
   );

apps/remix/app/components/dialogs/document-delete-dialog.tsx

@@ -4,7 +4,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { DocumentStatus } from '@prisma/client';
-import { P, match } from 'ts-pattern';
+import { match } from 'ts-pattern';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
 import { trpc as trpcReact } from '@documenso/trpc/react';
@@ -146,7 +146,7 @@ export const DocumentDeleteDialog = ({
                   </ul>
                 </AlertDescription>
               ))
-              .with(P.union(DocumentStatus.COMPLETED, DocumentStatus.REJECTED), () => (
+              .with(DocumentStatus.COMPLETED, () => (
                 <AlertDescription>
                   <p>
                     <Trans>By deleting this document, the following will occur:</Trans>

apps/remix/app/components/dialogs/template-bulk-send-dialog.tsx

@@ -114,7 +114,7 @@ export const TemplateBulkSendDialog = ({
     <Dialog>
       <DialogTrigger asChild>
         {trigger ?? (
-          <Button variant="outline">
+          <Button>
             <Upload className="mr-2 h-4 w-4" />
             <Trans>Bulk Send via CSV</Trans>
           </Button>

apps/remix/app/components/embed/embed-direct-template-client-page.tsx

@@ -3,8 +3,8 @@ import { useEffect, useLayoutEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { DocumentMeta, Recipient, Signature, TemplateMeta } from '@prisma/client';
 import { type DocumentData, type Field, FieldType } from '@prisma/client';
+import type { DocumentMeta, Recipient, Signature, TemplateMeta } from '@prisma/client';
 import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 import { DateTime } from 'luxon';
 import { useSearchParams } from 'react-router';
@@ -13,10 +13,6 @@ import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn'
 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 {
-  isFieldUnsignedAndRequired,
-  isRequiredField,
-} from '@documenso/lib/utils/advanced-fields-helpers';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
 import { trpc } from '@documenso/trpc/react';
 import type {
@@ -25,11 +21,12 @@ import type {
 } from '@documenso/trpc/server/field-router/schema';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
+import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { PDFViewer } from '@documenso/ui/primitives/pdf-viewer';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { BrandingLogo } from '~/components/general/branding-logo';
@@ -68,8 +65,16 @@ export const EmbedDirectTemplateClientPage = ({
 
   const [searchParams] = useSearchParams();
 
-  const { fullName, email, signature, setFullName, setEmail, setSignature } =
+  const {
-    useRequiredDocumentSigningContext();
+    fullName,
+    email,
+    signature,
+    signatureValid,
+    setFullName,
+    setEmail,
+    setSignature,
+    setSignatureValid,
+  } = useRequiredDocumentSigningContext();
 
   const [hasFinishedInit, setHasFinishedInit] = useState(false);
   const [hasDocumentLoaded, setHasDocumentLoaded] = useState(false);
@@ -87,7 +92,7 @@ export const EmbedDirectTemplateClientPage = ({
   const [localFields, setLocalFields] = useState<DirectTemplateLocalField[]>(() => fields);
 
   const [pendingFields, _completedFields] = [
-    localFields.filter((field) => isFieldUnsignedAndRequired(field)),
+    localFields.filter((field) => !field.inserted),
     localFields.filter((field) => field.inserted),
   ];
 
@@ -105,7 +110,7 @@ export const EmbedDirectTemplateClientPage = ({
 
         const newField: DirectTemplateLocalField = structuredClone({
           ...field,
-          customText: payload.value ?? '',
+          customText: payload.value,
           inserted: true,
           signedValue: payload,
         });
@@ -116,10 +121,8 @@ export const EmbedDirectTemplateClientPage = ({
             created: new Date(),
             recipientId: 1,
             fieldId: 1,
-            signatureImageAsBase64:
+            signatureImageAsBase64: payload.value.startsWith('data:') ? payload.value : null,
-              payload.value && payload.value.startsWith('data:') ? payload.value : null,
+            typedSignature: payload.value.startsWith('data:') ? null : payload.value,
-            typedSignature:
-              payload.value && !payload.value.startsWith('data:') ? payload.value : null,
           } satisfies Signature;
         }
 
@@ -177,7 +180,7 @@ export const EmbedDirectTemplateClientPage = ({
   };
 
   const onNextFieldClick = () => {
-    validateFieldsInserted(pendingFields);
+    validateFieldsInserted(localFields);
 
     setShowPendingFieldTooltip(true);
     setIsExpanded(false);
@@ -185,7 +188,11 @@ export const EmbedDirectTemplateClientPage = ({
 
   const onCompleteClick = async () => {
     try {
-      const valid = validateFieldsInserted(pendingFields);
+      if (hasSignatureField && !signatureValid) {
+        return;
+      }
+
+      const valid = validateFieldsInserted(localFields);
 
       if (!valid) {
         setShowPendingFieldTooltip(true);
@@ -198,6 +205,12 @@ export const EmbedDirectTemplateClientPage = ({
         directTemplateExternalId = decodeURIComponent(directTemplateExternalId);
       }
 
+      localFields.forEach((field) => {
+        if (!field.signedValue) {
+          throw new Error('Invalid configuration');
+        }
+      });
+
       const {
         documentId,
         token: documentToken,
@@ -208,11 +221,13 @@ export const EmbedDirectTemplateClientPage = ({
         directRecipientName: fullName,
         directRecipientEmail: email,
         templateUpdatedAt: updatedAt,
-        signedFieldValues: localFields
+        signedFieldValues: localFields.map((field) => {
-          .filter((field) => {
+          if (!field.signedValue) {
-            return field.signedValue && (isRequiredField(field) || field.inserted);
+            throw new Error('Invalid configuration');
-          })
+          }
-          .map((field) => field.signedValue!),
+
+          return field.signedValue;
+        }),
       });
 
       if (window.parent) {
@@ -400,26 +415,42 @@ export const EmbedDirectTemplateClientPage = ({
                   />
                 </div>
 
-                {hasSignatureField && (
                 <div>
                   <Label htmlFor="Signature">
                     <Trans>Signature</Trans>
                   </Label>
 
-                    <SignaturePadDialog
+                  <Card className="mt-2" gradient degrees={-120}>
-                      className="mt-2"
+                    <CardContent className="p-0">
+                      <SignaturePad
+                        className="h-44 w-full"
                         disabled={isThrottled || isSubmitting}
-                      disableAnimation
+                        defaultValue={signature ?? undefined}
-                      value={signature ?? ''}
+                        onChange={(value) => {
-                      onChange={(v) => setSignature(v ?? '')}
+                          setSignature(value);
-                      typedSignatureEnabled={metadata?.typedSignatureEnabled}
+                        }}
-                      uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
+                        onValidityChange={(isValid) => {
-                      drawSignatureEnabled={metadata?.drawSignatureEnabled}
+                          setSignatureValid(isValid);
+                        }}
+                        allowTypedSignature={Boolean(
+                          metadata &&
+                            'typedSignatureEnabled' in metadata &&
+                            metadata.typedSignatureEnabled,
+                        )}
                       />
+                    </CardContent>
+                  </Card>
+
+                  {hasSignatureField && !signatureValid && (
+                    <div className="text-destructive mt-2 text-sm">
+                      <Trans>
+                        Signature is too small. Please provide a more complete signature.
+                      </Trans>
                     </div>
                   )}
                 </div>
               </div>
+            </div>
 
             <div className="hidden flex-1 group-data-[expanded]/document-widget:block md:block" />
 

apps/remix/app/components/embed/embed-document-completed.tsx

@@ -10,6 +10,7 @@ export type EmbedDocumentCompletedPageProps = {
 };
 
 export const EmbedDocumentCompleted = ({ name, signature }: EmbedDocumentCompletedPageProps) => {
+  console.log({ signature });
   return (
     <div className="embed--DocumentCompleted relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
       <h3 className="text-foreground text-2xl font-semibold">

apps/remix/app/components/embed/embed-document-fields.tsx

@@ -54,8 +54,6 @@ export const EmbedDocumentFields = ({
               onSignField={onSignField}
               onUnsignField={onUnsignField}
               typedSignatureEnabled={metadata?.typedSignatureEnabled}
-              uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
-              drawSignatureEnabled={metadata?.drawSignatureEnabled}
             />
           ))
           .with(FieldType.INITIALS, () => (

apps/remix/app/components/embed/embed-document-signing-page.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useId, useLayoutEffect, useMemo, useState } from 'react';
+import { useEffect, useId, useLayoutEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
@@ -15,18 +15,18 @@ import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 
 import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
-import { isFieldUnsignedAndRequired } from '@documenso/lib/utils/advanced-fields-helpers';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
 import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { trpc } from '@documenso/trpc/react';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
+import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { PDFViewer } from '@documenso/ui/primitives/pdf-viewer';
 import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { BrandingLogo } from '~/components/general/branding-logo';
@@ -69,8 +69,15 @@ export const EmbedSignDocumentClientPage = ({
   const { _ } = useLingui();
   const { toast } = useToast();
 
-  const { fullName, email, signature, setFullName, setSignature } =
+  const {
-    useRequiredDocumentSigningContext();
+    fullName,
+    email,
+    signature,
+    signatureValid,
+    setFullName,
+    setSignature,
+    setSignatureValid,
+  } = useRequiredDocumentSigningContext();
 
   const [hasFinishedInit, setHasFinishedInit] = useState(false);
   const [hasDocumentLoaded, setHasDocumentLoaded] = useState(false);
@@ -94,26 +101,19 @@ export const EmbedSignDocumentClientPage = ({
   const [throttledOnCompleteClick, isThrottled] = useThrottleFn(() => void onCompleteClick(), 500);
 
   const [pendingFields, _completedFields] = [
-    fields.filter(
+    fields.filter((field) => field.recipientId === recipient.id && !field.inserted),
-      (field) => field.recipientId === recipient.id && isFieldUnsignedAndRequired(field),
-    ),
     fields.filter((field) => field.inserted),
   ];
 
   const { mutateAsync: completeDocumentWithToken, isPending: isSubmitting } =
     trpc.recipient.completeDocumentWithToken.useMutation();
 
-  const fieldsRequiringValidation = useMemo(
-    () => fields.filter(isFieldUnsignedAndRequired),
-    [fields],
-  );
-
   const hasSignatureField = fields.some((field) => field.type === FieldType.SIGNATURE);
 
   const assistantSignersId = useId();
 
   const onNextFieldClick = () => {
-    validateFieldsInserted(fieldsRequiringValidation);
+    validateFieldsInserted(fields);
 
     setShowPendingFieldTooltip(true);
     setIsExpanded(false);
@@ -121,7 +121,11 @@ export const EmbedSignDocumentClientPage = ({
 
   const onCompleteClick = async () => {
     try {
-      const valid = validateFieldsInserted(fieldsRequiringValidation);
+      if (hasSignatureField && !signatureValid) {
+        return;
+      }
+
+      const valid = validateFieldsInserted(fields);
 
       if (!valid) {
         setShowPendingFieldTooltip(true);
@@ -414,24 +418,40 @@ export const EmbedSignDocumentClientPage = ({
                         />
                       </div>
 
-                      {hasSignatureField && (
                       <div>
                         <Label htmlFor="Signature">
                           <Trans>Signature</Trans>
                         </Label>
 
-                          <SignaturePadDialog
+                        <Card className="mt-2" gradient degrees={-120}>
-                            className="mt-2"
+                          <CardContent className="p-0">
+                            <SignaturePad
+                              className="h-44 w-full"
                               disabled={isThrottled || isSubmitting}
-                            disableAnimation
+                              defaultValue={signature ?? undefined}
-                            value={signature ?? ''}
+                              onChange={(value) => {
-                            onChange={(v) => setSignature(v ?? '')}
+                                setSignature(value);
-                            typedSignatureEnabled={metadata?.typedSignatureEnabled}
+                              }}
-                            uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
+                              onValidityChange={(isValid) => {
-                            drawSignatureEnabled={metadata?.drawSignatureEnabled}
+                                setSignatureValid(isValid);
+                              }}
+                              allowTypedSignature={Boolean(
+                                metadata &&
+                                  'typedSignatureEnabled' in metadata &&
+                                  metadata.typedSignatureEnabled,
+                              )}
                             />
+                          </CardContent>
+                        </Card>
+
+                        {hasSignatureField && !signatureValid && (
+                          <div className="text-destructive mt-2 text-sm">
+                            <Trans>
+                              Signature is too small. Please provide a more complete signature.
+                            </Trans>
                           </div>
                         )}
+                      </div>
                     </>
                   )}
                 </div>
@@ -447,7 +467,9 @@ export const EmbedSignDocumentClientPage = ({
                 ) : (
                   <Button
                     className={allowDocumentRejection ? 'col-start-2' : 'col-span-2'}
-                    disabled={isThrottled}
+                    disabled={
+                      isThrottled || (!isAssistantMode && hasSignatureField && !signatureValid)
+                    }
                     loading={isSubmitting}
                     onClick={() => throttledOnCompleteClick()}
                   >

apps/remix/app/components/forms/profile.tsx

@@ -19,15 +19,12 @@ import {
 } from '@documenso/ui/primitives/form/form';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export const ZProfileFormSchema = z.object({
-  name: z
+  name: z.string().trim().min(1, { message: 'Please enter a valid name.' }),
-    .string()
+  signature: z.string().min(1, 'Signature Pad cannot be empty'),
-    .trim()
-    .min(1, { message: msg`Please enter a valid name.`.id }),
-  signature: z.string().min(1, { message: msg`Signature Pad cannot be empty.`.id }),
 });
 
 export const ZTwoFactorAuthTokenSchema = z.object({
@@ -112,20 +109,22 @@ export const ProfileForm = ({ className }: ProfileFormProps) => {
             </Label>
             <Input id="email" type="email" className="bg-muted mt-2" value={user.email} disabled />
           </div>
-
           <FormField
             control={form.control}
             name="signature"
-            render={({ field: { onChange, value } }) => (
+            render={({ field: { onChange } }) => (
               <FormItem>
                 <FormLabel>
                   <Trans>Signature</Trans>
                 </FormLabel>
                 <FormControl>
-                  <SignaturePadDialog
+                  <SignaturePad
+                    className="h-44 w-full"
                     disabled={isSubmitting}
-                    value={value}
+                    containerClassName={cn('rounded-lg border bg-background')}
+                    defaultValue={user.signature ?? undefined}
                     onChange={(v) => onChange(v ?? '')}
+                    allowTypedSignature={true}
                   />
                 </FormControl>
                 <FormMessage />
@@ -135,7 +134,7 @@ export const ProfileForm = ({ className }: ProfileFormProps) => {
         </fieldset>
 
         <Button type="submit" loading={isSubmitting} className="self-end">
-          <Trans>Update profile</Trans>
+          {isSubmitting ? <Trans>Updating profile...</Trans> : <Trans>Update profile</Trans>}
         </Button>
       </form>
     </Form>

apps/remix/app/components/forms/signup.tsx

@@ -30,7 +30,7 @@ import {
 } from '@documenso/ui/primitives/form/form';
 import { Input } from '@documenso/ui/primitives/input';
 import { PasswordInput } from '@documenso/ui/primitives/password-input';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { UserProfileSkeleton } from '~/components/general/user-profile-skeleton';
@@ -353,15 +353,16 @@ export const SignUpForm = ({
                 <FormField
                   control={form.control}
                   name="signature"
-                  render={({ field: { onChange, value } }) => (
+                  render={({ field: { onChange } }) => (
                     <FormItem>
                       <FormLabel>
                         <Trans>Sign Here</Trans>
                       </FormLabel>
                       <FormControl>
-                        <SignaturePadDialog
+                        <SignaturePad
+                          className="h-36 w-full"
                           disabled={isSubmitting}
-                          value={value}
+                          containerClassName="mt-2 rounded-lg border bg-background"
                           onChange={(v) => onChange(v ?? '')}
                         />
                       </FormControl>
@@ -530,27 +531,6 @@ export const SignUpForm = ({
             </div>
           </form>
         </Form>
-        <p className="text-muted-foreground mt-6 text-xs">
-          <Trans>
-            By proceeding, you agree to our{' '}
-            <Link
-              to="https://documen.so/terms"
-              target="_blank"
-              className="text-documenso-700 duration-200 hover:opacity-70"
-            >
-              Terms of Service
-            </Link>{' '}
-            and{' '}
-            <Link
-              to="https://documen.so/privacy"
-              target="_blank"
-              className="text-documenso-700 duration-200 hover:opacity-70"
-            >
-              Privacy Policy
-            </Link>
-            .
-          </Trans>
-        </p>
       </div>
     </div>
   );

apps/remix/app/components/forms/team-branding-preferences-form.tsx

@@ -308,7 +308,7 @@ export function TeamBrandingPreferencesForm({ team, settings }: TeamBrandingPref
 
           <div className="flex flex-row justify-end space-x-4">
             <Button type="submit" loading={form.formState.isSubmitting}>
-              <Trans>Update</Trans>
+              <Trans>Save</Trans>
             </Button>
           </div>
         </fieldset>

apps/remix/app/components/forms/team-document-preferences-form.tsx

@@ -8,15 +8,12 @@ import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { DOCUMENT_SIGNATURE_TYPES, DocumentSignatureType } from '@documenso/lib/constants/document';
 import {
   SUPPORTED_LANGUAGES,
   SUPPORTED_LANGUAGE_CODES,
   isValidLanguageCode,
 } from '@documenso/lib/constants/i18n';
-import { extractTeamSignatureSettings } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import { DocumentSignatureSettingsTooltip } from '@documenso/ui/components/document/document-signature-settings-tooltip';
 import { Alert } from '@documenso/ui/primitives/alert';
 import { Button } from '@documenso/ui/primitives/button';
 import {
@@ -26,9 +23,7 @@ import {
   FormField,
   FormItem,
   FormLabel,
-  FormMessage,
 } from '@documenso/ui/primitives/form/form';
-import { MultiSelectCombobox } from '@documenso/ui/primitives/multi-select-combobox';
 import {
   Select,
   SelectContent,
@@ -43,10 +38,8 @@ const ZTeamDocumentPreferencesFormSchema = z.object({
   documentVisibility: z.nativeEnum(DocumentVisibility),
   documentLanguage: z.enum(SUPPORTED_LANGUAGE_CODES),
   includeSenderDetails: z.boolean(),
+  typedSignatureEnabled: z.boolean(),
   includeSigningCertificate: z.boolean(),
-  signatureTypes: z.array(z.nativeEnum(DocumentSignatureType)).min(1, {
-    message: msg`At least one signature type must be enabled`.id,
-  }),
 });
 
 type TTeamDocumentPreferencesFormSchema = z.infer<typeof ZTeamDocumentPreferencesFormSchema>;
@@ -76,8 +69,8 @@ export const TeamDocumentPreferencesForm = ({
         ? settings?.documentLanguage
         : 'en',
       includeSenderDetails: settings?.includeSenderDetails ?? false,
+      typedSignatureEnabled: settings?.typedSignatureEnabled ?? true,
       includeSigningCertificate: settings?.includeSigningCertificate ?? true,
-      signatureTypes: extractTeamSignatureSettings(settings),
     },
     resolver: zodResolver(ZTeamDocumentPreferencesFormSchema),
   });
@@ -91,7 +84,7 @@ export const TeamDocumentPreferencesForm = ({
         documentLanguage,
         includeSenderDetails,
         includeSigningCertificate,
-        signatureTypes,
+        typedSignatureEnabled,
       } = data;
 
       await updateTeamDocumentPreferences({
@@ -100,10 +93,8 @@ export const TeamDocumentPreferencesForm = ({
           documentVisibility,
           documentLanguage,
           includeSenderDetails,
+          typedSignatureEnabled,
           includeSigningCertificate,
-          typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
-          uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
-          drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
         },
       });
 
@@ -199,44 +190,6 @@ export const TeamDocumentPreferencesForm = ({
             )}
           />
 
-          <FormField
-            control={form.control}
-            name="signatureTypes"
-            render={({ field }) => (
-              <FormItem className="flex-1">
-                <FormLabel className="flex flex-row items-center">
-                  <Trans>Default Signature Settings</Trans>
-                  <DocumentSignatureSettingsTooltip />
-                </FormLabel>
-
-                <FormControl>
-                  <MultiSelectCombobox
-                    options={Object.values(DOCUMENT_SIGNATURE_TYPES).map((option) => ({
-                      label: _(option.label),
-                      value: option.value,
-                    }))}
-                    selectedValues={field.value}
-                    onChange={field.onChange}
-                    className="bg-background w-full"
-                    enableSearch={false}
-                    emptySelectionPlaceholder="Select signature types"
-                    testId="signature-types-combobox"
-                  />
-                </FormControl>
-
-                {form.formState.errors.signatureTypes ? (
-                  <FormMessage />
-                ) : (
-                  <FormDescription>
-                    <Trans>
-                      Controls which signatures are allowed to be used when signing a document.
-                    </Trans>
-                  </FormDescription>
-                )}
-              </FormItem>
-            )}
-          />
-
           <FormField
             control={form.control}
             name="includeSenderDetails"
@@ -285,6 +238,36 @@ export const TeamDocumentPreferencesForm = ({
             )}
           />
 
+          <FormField
+            control={form.control}
+            name="typedSignatureEnabled"
+            render={({ field }) => (
+              <FormItem className="flex-1">
+                <FormLabel>
+                  <Trans>Enable Typed Signature</Trans>
+                </FormLabel>
+
+                <div>
+                  <FormControl className="block">
+                    <Switch
+                      ref={field.ref}
+                      name={field.name}
+                      checked={field.value}
+                      onCheckedChange={field.onChange}
+                    />
+                  </FormControl>
+                </div>
+
+                <FormDescription>
+                  <Trans>
+                    Controls whether the recipients can sign the documents using a typed signature.
+                    Enable or disable the typed signature globally.
+                  </Trans>
+                </FormDescription>
+              </FormItem>
+            )}
+          />
+
           <FormField
             control={form.control}
             name="includeSigningCertificate"
@@ -318,7 +301,7 @@ export const TeamDocumentPreferencesForm = ({
 
           <div className="flex flex-row justify-end space-x-4">
             <Button type="submit" loading={form.formState.isSubmitting}>
-              <Trans>Update</Trans>
+              <Trans>Save</Trans>
             </Button>
           </div>
         </fieldset>

apps/remix/app/components/general/app-nav-desktop.tsx

@@ -76,7 +76,7 @@ export const AppNavDesktop = ({
 
       <Button
         variant="outline"
-        className="text-muted-foreground flex w-full max-w-96 items-center justify-between rounded-lg"
+        className="text-muted-foreground flex w-96 items-center justify-between rounded-lg"
         onClick={() => setIsCommandMenuOpen(true)}
       >
         <div className="flex items-center">

apps/remix/app/components/general/direct-template/direct-template-configure-form.tsx

@@ -9,10 +9,6 @@ import { z } from 'zod';
 
 import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
 import type { TTemplate } from '@documenso/lib/types/template';
-import {
-  DocumentReadOnlyFields,
-  mapFieldsWithRecipients,
-} from '@documenso/ui/components/document/document-read-only-fields';
 import {
   DocumentFlowFormContainerActions,
   DocumentFlowFormContainerContent,
@@ -20,6 +16,7 @@ import {
   DocumentFlowFormContainerHeader,
   DocumentFlowFormContainerStep,
 } from '@documenso/ui/primitives/document-flow/document-flow-root';
+import { ShowFieldItem } from '@documenso/ui/primitives/document-flow/show-field-item';
 import type { DocumentFlowStep } from '@documenso/ui/primitives/document-flow/types';
 import {
   Form,
@@ -100,16 +97,14 @@ export const DirectTemplateConfigureForm = ({
       <DocumentFlowFormContainerHeader title={flowStep.title} description={flowStep.description} />
 
       <DocumentFlowFormContainerContent>
-        {isDocumentPdfLoaded && (
+        {isDocumentPdfLoaded &&
-          <DocumentReadOnlyFields
+          directTemplateRecipient.fields.map((field, index) => (
-            fields={mapFieldsWithRecipients(
+            <ShowFieldItem
-              directTemplateRecipient.fields,
+              key={index}
-              recipientsWithBlankDirectRecipientEmail,
+              field={field}
-            )}
+              recipients={recipientsWithBlankDirectRecipientEmail}
-            recipientIds={recipients.map((recipient) => recipient.id)}
-            showRecipientColors={true}
             />
-        )}
+          ))}
 
         <Form {...form}>
           <fieldset

apps/remix/app/components/general/direct-template/direct-template-signing-form.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 
 import { Trans } from '@lingui/react/macro';
 import type { Field, Recipient, Signature } from '@prisma/client';
@@ -24,6 +24,7 @@ import type {
 } from '@documenso/trpc/server/field-router/schema';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
+import { Card, CardContent } from '@documenso/ui/primitives/card';
 import {
   DocumentFlowFormContainerContent,
   DocumentFlowFormContainerFooter,
@@ -34,7 +35,7 @@ import type { DocumentFlowStep } from '@documenso/ui/primitives/document-flow/ty
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useStep } from '@documenso/ui/primitives/stepper';
 
 import { DocumentSigningCheckboxField } from '~/components/general/document-signing/document-signing-checkbox-field';
@@ -72,7 +73,8 @@ export const DirectTemplateSigningForm = ({
   template,
   onSubmit,
 }: DirectTemplateSigningFormProps) => {
-  const { fullName, signature, setFullName, setSignature } = useRequiredDocumentSigningContext();
+  const { fullName, signature, signatureValid, setFullName, setSignature } =
+    useRequiredDocumentSigningContext();
 
   const [localFields, setLocalFields] = useState<DirectTemplateLocalField[]>(directRecipientFields);
   const [validateUninsertedFields, setValidateUninsertedFields] = useState(false);
@@ -89,7 +91,7 @@ export const DirectTemplateSigningForm = ({
 
         const tempField: DirectTemplateLocalField = {
           ...field,
-          customText: value.value ?? '',
+          customText: value.value,
           inserted: true,
           signedValue: value,
         };
@@ -100,8 +102,8 @@ export const DirectTemplateSigningForm = ({
             created: new Date(),
             recipientId: 1,
             fieldId: 1,
-            signatureImageAsBase64: value.value?.startsWith('data:') ? value.value : null,
+            signatureImageAsBase64: value.value.startsWith('data:') ? value.value : null,
-            typedSignature: value.value && !value.value.startsWith('data:') ? value.value : null,
+            typedSignature: value.value.startsWith('data:') ? null : value.value,
           } satisfies Signature;
         }
 
@@ -133,6 +135,8 @@ export const DirectTemplateSigningForm = ({
     );
   };
 
+  const hasSignatureField = localFields.some((field) => field.type === FieldType.SIGNATURE);
+
   const uninsertedFields = useMemo(() => {
     return sortFieldsByPosition(localFields.filter((field) => !field.inserted));
   }, [localFields]);
@@ -145,6 +149,10 @@ export const DirectTemplateSigningForm = ({
   const handleSubmit = async () => {
     setValidateUninsertedFields(true);
 
+    if (hasSignatureField && !signatureValid) {
+      return;
+    }
+
     const isFieldsValid = validateFieldsInserted(localFields);
 
     if (!isFieldsValid) {
@@ -162,55 +170,6 @@ export const DirectTemplateSigningForm = ({
     // Do not reset to false since we do a redirect.
   };
 
-  useEffect(() => {
-    const updatedFields = [...localFields];
-
-    localFields.forEach((field) => {
-      const index = updatedFields.findIndex((f) => f.id === field.id);
-      let value = '';
-
-      match(field.type)
-        .with(FieldType.TEXT, () => {
-          const meta = field.fieldMeta ? ZTextFieldMeta.safeParse(field.fieldMeta) : null;
-
-          if (meta?.success) {
-            value = meta.data.text ?? '';
-          }
-        })
-        .with(FieldType.NUMBER, () => {
-          const meta = field.fieldMeta ? ZNumberFieldMeta.safeParse(field.fieldMeta) : null;
-
-          if (meta?.success) {
-            value = meta.data.value ?? '';
-          }
-        })
-        .with(FieldType.DROPDOWN, () => {
-          const meta = field.fieldMeta ? ZDropdownFieldMeta.safeParse(field.fieldMeta) : null;
-
-          if (meta?.success) {
-            value = meta.data.defaultValue ?? '';
-          }
-        });
-
-      if (value) {
-        const signedValue = {
-          token: directRecipient.token,
-          fieldId: field.id,
-          value,
-        };
-
-        updatedFields[index] = {
-          ...field,
-          customText: value,
-          inserted: true,
-          signedValue,
-        };
-      }
-    });
-
-    setLocalFields(updatedFields);
-  }, []);
-
   return (
     <DocumentSigningRecipientProvider recipient={directRecipient}>
       <DocumentFlowFormContainerHeader title={flowStep.title} description={flowStep.description} />
@@ -232,8 +191,6 @@ export const DirectTemplateSigningForm = ({
                   onSignField={onSignField}
                   onUnsignField={onUnsignField}
                   typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
-                  uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
-                  drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
                 />
               ))
               .with(FieldType.INITIALS, () => (
@@ -378,15 +335,19 @@ export const DirectTemplateSigningForm = ({
                 <Trans>Signature</Trans>
               </Label>
 
-              <SignaturePadDialog
+              <Card className="mt-2" gradient degrees={-120}>
-                className="mt-2"
+                <CardContent className="p-0">
+                  <SignaturePad
+                    className="h-44 w-full"
                     disabled={isSubmitting}
-                value={signature ?? ''}
+                    defaultValue={signature ?? undefined}
-                onChange={(value) => setSignature(value)}
+                    onChange={(value) => {
-                typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
+                      setSignature(value);
-                uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
+                    }}
-                drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
+                    allowTypedSignature={template.templateMeta?.typedSignatureEnabled}
                   />
+                </CardContent>
+              </Card>
             </div>
           </div>
         </div>

apps/remix/app/components/general/document-signing/document-signing-checkbox-field.tsx

@@ -97,16 +97,6 @@ export const DocumentSigningCheckboxField = ({
 
   const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
-      // Do nothing, this should only happen when the user clicks the field, but
-      // misses the checkbox which triggers this callback.
-      if (checkedValues.length === 0) {
-        return;
-      }
-
-      if (!isLengthConditionMet) {
-        return;
-      }
-
       const payload: TSignFieldWithTokenMutationSchema = {
         token: recipient.token,
         fieldId: field.id,
@@ -204,30 +194,18 @@ export const DocumentSigningCheckboxField = ({
 
       setCheckedValues(updatedValues);
 
-      const removePayload: TRemovedSignedFieldWithTokenMutationSchema = {
+      await removeSignedFieldWithToken({
         token: recipient.token,
         fieldId: field.id,
-      };
+      });
 
-      if (onUnsignField) {
+      if (updatedValues.length > 0) {
-        await onUnsignField(removePayload);
+        await signFieldWithToken({
-      } else {
-        await removeSignedFieldWithToken(removePayload);
-      }
-
-      if (updatedValues.length > 0 && shouldAutoSignField) {
-        const signPayload: TSignFieldWithTokenMutationSchema = {
           token: recipient.token,
           fieldId: field.id,
           value: toCheckboxValue(updatedValues),
           isBase64: true,
-        };
+        });
-
-        if (onSignField) {
-          await onSignField(signPayload);
-        } else {
-          await signFieldWithToken(signPayload);
-        }
       }
     } catch (err) {
       console.error(err);
@@ -276,26 +254,21 @@ export const DocumentSigningCheckboxField = ({
               {validationSign?.label} {checkboxValidationLength}
             </FieldToolTip>
           )}
-          <div className="z-50 my-0.5 flex flex-col gap-y-1">
+          <div className="z-50 flex flex-col gap-y-2">
             {values?.map((item: { id: number; value: string; checked: boolean }, index: number) => {
               const itemValue = item.value || `empty-value-${item.id}`;
 
               return (
-                <div key={index} className="flex items-center">
+                <div key={index} className="flex items-center gap-x-1.5">
                   <Checkbox
-                    className="h-3 w-3"
+                    className="h-4 w-4"
-                    id={`checkbox-${field.id}-${item.id}`}
+                    id={`checkbox-${index}`}
                     checked={checkedValues.includes(itemValue)}
                     onCheckedChange={() => handleCheckboxChange(item.value, item.id)}
                   />
-                  {!item.value.includes('empty-value-') && item.value && (
+                  <Label htmlFor={`checkbox-${index}`}>
-                    <Label
+                    {item.value.includes('empty-value-') ? '' : item.value}
-                      htmlFor={`checkbox-${field.id}-${item.id}`}
-                      className="text-foreground ml-1.5 text-xs font-normal"
-                    >
-                      {item.value}
                   </Label>
-                  )}
                 </div>
               );
             })}
@@ -304,27 +277,22 @@ export const DocumentSigningCheckboxField = ({
       )}
 
       {field.inserted && (
-        <div className="my-0.5 flex flex-col gap-y-1">
+        <div className="flex flex-col gap-y-1">
           {values?.map((item: { id: number; value: string; checked: boolean }, index: number) => {
             const itemValue = item.value || `empty-value-${item.id}`;
 
             return (
-              <div key={index} className="flex items-center">
+              <div key={index} className="flex items-center gap-x-1.5">
                 <Checkbox
                   className="h-3 w-3"
-                  id={`checkbox-${field.id}-${item.id}`}
+                  id={`checkbox-${index}`}
                   checked={parsedCheckedValues.includes(itemValue)}
                   disabled={isLoading}
                   onCheckedChange={() => void handleCheckboxOptionClick(item)}
                 />
-                {!item.value.includes('empty-value-') && item.value && (
+                <Label htmlFor={`checkbox-${index}`} className="text-xs">
-                  <Label
+                  {item.value.includes('empty-value-') ? '' : item.value}
-                    htmlFor={`checkbox-${field.id}-${item.id}`}
-                    className="text-foreground ml-1.5 text-xs font-normal"
-                  >
-                    {item.value}
                 </Label>
-                )}
               </div>
             );
           })}

apps/remix/app/components/general/document-signing/document-signing-complete-dialog.tsx

@@ -1,12 +1,8 @@
 import { useMemo, useState } from 'react';
 
-import { zodResolver } from '@hookform/resolvers/zod';
 import { Trans } from '@lingui/react/macro';
 import type { Field } from '@prisma/client';
 import { RecipientRole } from '@prisma/client';
-import { useForm } from 'react-hook-form';
-import { match } from 'ts-pattern';
-import { z } from 'zod';
 
 import { fieldsContainUnsignedRequiredField } from '@documenso/lib/utils/advanced-fields-helpers';
 import { Button } from '@documenso/ui/primitives/button';
@@ -17,15 +13,6 @@ import {
   DialogTitle,
   DialogTrigger,
 } 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 { DocumentSigningDisclosure } from '~/components/general/document-signing/document-signing-disclosure';
 
@@ -34,22 +21,10 @@ export type DocumentSigningCompleteDialogProps = {
   documentTitle: string;
   fields: Field[];
   fieldsValidated: () => void | Promise<void>;
-  onSignatureComplete: (nextSigner?: { name: string; email: string }) => void | Promise<void>;
+  onSignatureComplete: () => void | Promise<void>;
   role: RecipientRole;
   disabled?: boolean;
-  allowDictateNextSigner?: boolean;
-  defaultNextSigner?: {
-    name: string;
-    email: string;
 };
-};
-
-const ZNextSignerFormSchema = z.object({
-  name: z.string().min(1, 'Name is required'),
-  email: z.string().email('Invalid email address'),
-});
-
-type TNextSignerFormSchema = z.infer<typeof ZNextSignerFormSchema>;
 
 export const DocumentSigningCompleteDialog = ({
   isSubmitting,
@@ -59,54 +34,19 @@ export const DocumentSigningCompleteDialog = ({
   onSignatureComplete,
   role,
   disabled = false,
-  allowDictateNextSigner = false,
-  defaultNextSigner,
 }: DocumentSigningCompleteDialogProps) => {
   const [showDialog, setShowDialog] = useState(false);
-  const [isEditingNextSigner, setIsEditingNextSigner] = useState(false);
-
-  const form = useForm<TNextSignerFormSchema>({
-    resolver: allowDictateNextSigner ? zodResolver(ZNextSignerFormSchema) : undefined,
-    defaultValues: {
-      name: defaultNextSigner?.name ?? '',
-      email: defaultNextSigner?.email ?? '',
-    },
-  });
 
   const isComplete = useMemo(() => !fieldsContainUnsignedRequiredField(fields), [fields]);
 
   const handleOpenChange = (open: boolean) => {
-    if (form.formState.isSubmitting || !isComplete) {
+    if (isSubmitting || !isComplete) {
       return;
     }
 
-    if (open) {
-      form.reset({
-        name: defaultNextSigner?.name ?? '',
-        email: defaultNextSigner?.email ?? '',
-      });
-    }
-
-    setIsEditingNextSigner(false);
     setShowDialog(open);
   };
 
-  const onFormSubmit = async (data: TNextSignerFormSchema) => {
-    console.log('data', data);
-    console.log('form.formState.errors', form.formState.errors);
-    try {
-      if (allowDictateNextSigner && data.name && data.email) {
-        await onSignatureComplete({ name: data.name, email: data.email });
-      } else {
-        await onSignatureComplete();
-      }
-    } catch (error) {
-      console.error('Error completing signature:', error);
-    }
-  };
-
-  const isNextSignerValid = !allowDictateNextSigner || (form.watch('name') && form.watch('email'));
-
   return (
     <Dialog open={showDialog} onOpenChange={handleOpenChange}>
       <DialogTrigger asChild>
@@ -118,36 +58,21 @@ export const DocumentSigningCompleteDialog = ({
           loading={isSubmitting}
           disabled={disabled}
         >
-          {match({ isComplete, role })
+          {isComplete ? <Trans>Complete</Trans> : <Trans>Next field</Trans>}
-            .with({ isComplete: false }, () => <Trans>Next field</Trans>)
-            .with({ isComplete: true, role: RecipientRole.APPROVER }, () => <Trans>Approve</Trans>)
-            .with({ isComplete: true, role: RecipientRole.VIEWER }, () => (
-              <Trans>Mark as viewed</Trans>
-            ))
-            .with({ isComplete: true }, () => <Trans>Complete</Trans>)
-            .exhaustive()}
         </Button>
       </DialogTrigger>
 
       <DialogContent>
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onFormSubmit)}>
-            <fieldset disabled={form.formState.isSubmitting} className="border-none p-0">
         <DialogTitle>
           <div className="text-foreground text-xl font-semibold">
-                  {match(role)
+            {role === RecipientRole.VIEWER && <Trans>Complete Viewing</Trans>}
-                    .with(RecipientRole.VIEWER, () => <Trans>Complete Viewing</Trans>)
+            {role === RecipientRole.SIGNER && <Trans>Complete Signing</Trans>}
-                    .with(RecipientRole.SIGNER, () => <Trans>Complete Signing</Trans>)
+            {role === RecipientRole.APPROVER && <Trans>Complete Approval</Trans>}
-                    .with(RecipientRole.APPROVER, () => <Trans>Complete Approval</Trans>)
-                    .with(RecipientRole.CC, () => <Trans>Complete Viewing</Trans>)
-                    .with(RecipientRole.ASSISTANT, () => <Trans>Complete Assisting</Trans>)
-                    .exhaustive()}
           </div>
         </DialogTitle>
 
         <div className="text-muted-foreground max-w-[50ch]">
-                {match(role)
+          {role === RecipientRole.VIEWER && (
-                  .with(RecipientRole.VIEWER, () => (
             <span>
               <Trans>
                 <span className="inline-flex flex-wrap">
@@ -160,8 +85,8 @@ export const DocumentSigningCompleteDialog = ({
                 <br /> Are you sure?
               </Trans>
             </span>
-                  ))
+          )}
-                  .with(RecipientRole.SIGNER, () => (
+          {role === RecipientRole.SIGNER && (
             <span>
               <Trans>
                 <span className="inline-flex flex-wrap">
@@ -174,8 +99,8 @@ export const DocumentSigningCompleteDialog = ({
                 <br /> Are you sure?
               </Trans>
             </span>
-                  ))
+          )}
-                  .with(RecipientRole.APPROVER, () => (
+          {role === RecipientRole.APPROVER && (
             <span>
               <Trans>
                 <span className="inline-flex flex-wrap">
@@ -188,126 +113,37 @@ export const DocumentSigningCompleteDialog = ({
                 <br /> Are you sure?
               </Trans>
             </span>
-                  ))
-                  .otherwise(() => (
-                    <span>
-                      <Trans>
-                        <span className="inline-flex flex-wrap">
-                          You are about to complete viewing "
-                          <span className="inline-block max-w-[11rem] truncate align-baseline">
-                            {documentTitle}
-                          </span>
-                          ".
-                        </span>
-                        <br /> Are you sure?
-                      </Trans>
-                    </span>
-                  ))}
-              </div>
-
-              {allowDictateNextSigner && (
-                <div className="mt-4 flex flex-col gap-4">
-                  {!isEditingNextSigner && (
-                    <div>
-                      <p className="text-muted-foreground text-sm">
-                        The next recipient to sign this document will be{' '}
-                        <span className="font-semibold">{form.watch('name')}</span> (
-                        <span className="font-semibold">{form.watch('email')}</span>).
-                      </p>
-
-                      <Button
-                        type="button"
-                        className="mt-2"
-                        variant="outline"
-                        size="sm"
-                        onClick={() => setIsEditingNextSigner((prev) => !prev)}
-                      >
-                        <Trans>Update Recipient</Trans>
-                      </Button>
-                    </div>
-                  )}
-
-                  {isEditingNextSigner && (
-                    <div className="flex flex-col gap-4 md:flex-row">
-                      <FormField
-                        control={form.control}
-                        name="name"
-                        render={({ field }) => (
-                          <FormItem className="flex-1">
-                            <FormLabel>
-                              <Trans>Name</Trans>
-                            </FormLabel>
-                            <FormControl>
-                              <Input
-                                {...field}
-                                className="mt-2"
-                                placeholder="Enter the next signer's name"
-                              />
-                            </FormControl>
-
-                            <FormMessage />
-                          </FormItem>
-                        )}
-                      />
-
-                      <FormField
-                        control={form.control}
-                        name="email"
-                        render={({ field }) => (
-                          <FormItem className="flex-1">
-                            <FormLabel>
-                              <Trans>Email</Trans>
-                            </FormLabel>
-                            <FormControl>
-                              <Input
-                                {...field}
-                                type="email"
-                                className="mt-2"
-                                placeholder="Enter the next signer's email"
-                              />
-                            </FormControl>
-                            <FormMessage />
-                          </FormItem>
-                        )}
-                      />
-                    </div>
           )}
         </div>
-              )}
 
         <DocumentSigningDisclosure className="mt-4" />
 
-              <DialogFooter className="mt-4">
+        <DialogFooter>
           <div className="flex w-full flex-1 flex-nowrap gap-4">
             <Button
               type="button"
-                    className="flex-1"
+              className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
               variant="secondary"
-                    onClick={() => setShowDialog(false)}
+              onClick={() => {
-                    disabled={form.formState.isSubmitting}
+                setShowDialog(false);
+              }}
             >
               <Trans>Cancel</Trans>
             </Button>
 
             <Button
-                    type="submit"
+              type="button"
               className="flex-1"
-                    disabled={!isComplete || !isNextSignerValid}
+              disabled={!isComplete}
-                    loading={form.formState.isSubmitting}
+              loading={isSubmitting}
+              onClick={onSignatureComplete}
             >
-                    {match(role)
+              {role === RecipientRole.VIEWER && <Trans>Mark as Viewed</Trans>}
-                      .with(RecipientRole.VIEWER, () => <Trans>Mark as Viewed</Trans>)
+              {role === RecipientRole.SIGNER && <Trans>Sign</Trans>}
-                      .with(RecipientRole.SIGNER, () => <Trans>Sign</Trans>)
+              {role === RecipientRole.APPROVER && <Trans>Approve</Trans>}
-                      .with(RecipientRole.APPROVER, () => <Trans>Approve</Trans>)
-                      .with(RecipientRole.CC, () => <Trans>Mark as Viewed</Trans>)
-                      .with(RecipientRole.ASSISTANT, () => <Trans>Complete</Trans>)
-                      .exhaustive()}
             </Button>
           </div>
         </DialogFooter>
-            </fieldset>
-          </form>
-        </Form>
       </DialogContent>
     </Dialog>
   );

apps/remix/app/components/general/document-signing/document-signing-date-field.tsx

@@ -142,7 +142,7 @@ export const DocumentSigningDateField = ({
       )}
 
       {!field.inserted && (
-        <p className="group-hover:text-primary text-foreground group-hover:text-recipient-green text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+        <p className="group-hover:text-primary text-muted-foreground text-[clamp(0.425rem,25cqw,0.825rem)] duration-200 group-hover:text-yellow-300">
           <Trans>Date</Trans>
         </p>
       )}
@@ -151,10 +151,12 @@ export const DocumentSigningDateField = ({
         <div className="flex h-full w-full items-center">
           <p
             className={cn(
-              'text-foreground w-full whitespace-nowrap text-left text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
+              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
               {
-                '!text-center': parsedFieldMeta?.textAlign === 'center',
+                'text-left': parsedFieldMeta?.textAlign === 'left',
-                '!text-right': parsedFieldMeta?.textAlign === 'right',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
+                'text-right': parsedFieldMeta?.textAlign === 'right',
               },
             )}
           >

apps/remix/app/components/general/document-signing/document-signing-dropdown-field.tsx

@@ -177,11 +177,15 @@ export const DocumentSigningDropdownField = ({
         )}
 
         {!field.inserted && (
-          <p className="group-hover:text-primary text-foreground flex flex-col items-center justify-center duration-200">
+          <p className="group-hover:text-primary text-muted-foreground flex flex-col items-center justify-center duration-200">
             <Select value={localChoice} onValueChange={handleSelectItem}>
               <SelectTrigger
                 className={cn(
-                  'text-foreground z-10 h-full w-full border-none ring-0 focus:border-none focus:ring-0',
+                  'text-muted-foreground z-10 h-full w-full border-none ring-0 focus:ring-0',
+                  {
+                    'hover:text-red-300': parsedFieldMeta.required,
+                    'hover:text-yellow-300': !parsedFieldMeta.required,
+                  },
                 )}
               >
                 <SelectValue
@@ -201,7 +205,7 @@ export const DocumentSigningDropdownField = ({
         )}
 
         {field.inserted && (
-          <p className="text-foreground text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
+          <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
             {field.customText}
           </p>
         )}

apps/remix/app/components/general/document-signing/document-signing-email-field.tsx

@@ -1,6 +1,7 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -13,14 +14,10 @@ import type {
   TRemovedSignedFieldWithTokenMutationSchema,
   TSignFieldWithTokenMutationSchema,
 } from '@documenso/trpc/server/field-router/schema';
+import { cn } from '@documenso/ui/lib/utils';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import {
-  DocumentSigningFieldsInserted,
-  DocumentSigningFieldsLoader,
-  DocumentSigningFieldsUninserted,
-} from './document-signing-fields';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
@@ -123,18 +120,34 @@ export const DocumentSigningEmailField = ({
 
   return (
     <DocumentSigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Email">
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {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" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <DocumentSigningFieldsUninserted>
+        <p className="group-hover:text-primary text-muted-foreground text-[clamp(0.425rem,25cqw,0.825rem)] duration-200 group-hover:text-yellow-300">
           <Trans>Email</Trans>
-        </DocumentSigningFieldsUninserted>
+        </p>
       )}
 
       {field.inserted && (
-        <DocumentSigningFieldsInserted textAlign={parsedFieldMeta?.textAlign}>
+        <div className="flex h-full w-full items-center">
+          <p
+            className={cn(
+              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
+              {
+                'text-left': parsedFieldMeta?.textAlign === 'left',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
+                'text-right': parsedFieldMeta?.textAlign === 'right',
+              },
+            )}
+          >
             {field.customText}
-        </DocumentSigningFieldsInserted>
+          </p>
+        </div>
       )}
     </DocumentSigningFieldContainer>
   );

apps/remix/app/components/general/document-signing/document-signing-field-container.tsx

@@ -2,14 +2,12 @@ import React from 'react';
 
 import { Trans } from '@lingui/react/macro';
 import { FieldType } from '@prisma/client';
-import { TooltipArrow } from '@radix-ui/react-tooltip';
 import { X } from 'lucide-react';
 
 import { type TRecipientActionAuth } from '@documenso/lib/types/document-auth';
 import { ZFieldMetaSchema } from '@documenso/lib/types/field-meta';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { FieldRootContainer } from '@documenso/ui/components/field/field';
-import { RECIPIENT_COLOR_STYLES } from '@documenso/ui/lib/recipient-colors';
 import { cn } from '@documenso/ui/lib/utils';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 
@@ -130,51 +128,57 @@ export const DocumentSigningFieldContainer = ({
   };
 
   return (
-    <div className={cn('[container-type:size]')}>
+    <div className={cn('[container-type:size]', { group: type === 'Checkbox' })}>
-      <FieldRootContainer color={RECIPIENT_COLOR_STYLES.green} field={field}>
+      <FieldRootContainer field={field}>
         {!field.inserted && !loading && !readOnlyField && (
           <button
             type="submit"
-            className="absolute inset-0 z-10 h-full w-full rounded-[2px]"
+            className="absolute inset-0 z-10 h-full w-full rounded-md border"
             onClick={async () => handleInsertField()}
           />
         )}
 
         {readOnlyField && (
           <button className="bg-background/40 absolute inset-0 z-10 flex h-full w-full items-center justify-center rounded-md text-sm opacity-0 duration-200 group-hover:opacity-100">
-            <span className="bg-foreground/50 text-background rounded-xl p-2">
+            <span className="bg-foreground/50 dark:bg-background/50 text-background dark:text-foreground rounded-xl p-2">
               <Trans>Read only field</Trans>
             </span>
           </button>
         )}
 
+        {type === 'Date' && field.inserted && !loading && !readOnlyField && (
+          <Tooltip delayDuration={0}>
+            <TooltipTrigger asChild>
+              <button
+                className="text-destructive bg-background/40 absolute inset-0 z-10 flex h-full w-full items-center justify-center rounded-md text-sm opacity-0 duration-200 group-hover:opacity-100"
+                onClick={onRemoveSignedFieldClick}
+              >
+                <Trans>Remove</Trans>
+              </button>
+            </TooltipTrigger>
+
+            {tooltipText && <TooltipContent className="max-w-xs">{tooltipText}</TooltipContent>}
+          </Tooltip>
+        )}
+
         {type === 'Checkbox' && field.inserted && !loading && !readOnlyField && (
           <button
-            className="absolute -bottom-10 flex items-center justify-evenly rounded-md border bg-gray-900 opacity-0 group-hover:opacity-100"
+            className="dark:bg-background absolute -bottom-10 flex items-center justify-evenly rounded-md border bg-gray-900 opacity-0 group-hover:opacity-100"
             onClick={() => void onClearCheckBoxValues(type)}
           >
-            <span className="rounded-md p-1 text-gray-400 transition-colors hover:bg-white/10 hover:text-gray-100">
+            <span className="dark:text-muted-foreground/50 dark:hover:text-muted-foreground dark:hover:bg-foreground/10 rounded-md p-1 text-gray-400 transition-colors hover:bg-white/10 hover:text-gray-100">
               <X className="h-4 w-4" />
             </span>
           </button>
         )}
 
-        {type !== 'Checkbox' && field.inserted && !loading && !readOnlyField && (
+        {type !== 'Date' && type !== 'Checkbox' && field.inserted && !loading && !readOnlyField && (
-          <Tooltip delayDuration={0}>
+          <button
-            <TooltipTrigger asChild>
+            className="text-destructive bg-background/50 absolute inset-0 z-10 flex h-full w-full items-center justify-center rounded-md text-sm opacity-0 duration-200 group-hover:opacity-100"
-              <button className="absolute inset-0 z-10" onClick={onRemoveSignedFieldClick}></button>
+            onClick={onRemoveSignedFieldClick}
-            </TooltipTrigger>
-
-            <TooltipContent
-              className="border-0 bg-orange-300 fill-orange-300 font-bold text-orange-900"
-              sideOffset={2}
           >
-              {tooltipText && <p>{tooltipText}</p>}
-
             <Trans>Remove</Trans>
-              <TooltipArrow />
+          </button>
-            </TooltipContent>
-          </Tooltip>
         )}
 
         {(field.type === FieldType.RADIO || field.type === FieldType.CHECKBOX) &&

apps/remix/app/components/general/document-signing/document-signing-fields.tsx

@@ -1,51 +0,0 @@
-import { Loader } from 'lucide-react';
-
-import { cn } from '@documenso/ui/lib/utils';
-
-export const DocumentSigningFieldsLoader = () => {
-  return (
-    <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" />
-    </div>
-  );
-};
-
-export const DocumentSigningFieldsUninserted = ({ children }: { children: React.ReactNode }) => {
-  return (
-    <p className="group-hover:text-primary text-foreground group-hover:text-recipient-green text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
-      {children}
-    </p>
-  );
-};
-
-type DocumentSigningFieldsInsertedProps = {
-  children: React.ReactNode;
-
-  /**
-   * The text alignment of the field.
-   *
-   * Defaults to left.
-   */
-  textAlign?: 'left' | 'center' | 'right';
-};
-
-export const DocumentSigningFieldsInserted = ({
-  children,
-  textAlign = 'left',
-}: DocumentSigningFieldsInsertedProps) => {
-  return (
-    <div className="flex h-full w-full items-center">
-      <p
-        className={cn(
-          'text-foreground w-full text-left text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
-          {
-            '!text-center': textAlign === 'center',
-            '!text-right': textAlign === 'right',
-          },
-        )}
-      >
-        {children}
-      </p>
-    </div>
-  );
-};

apps/remix/app/components/general/document-signing/document-signing-form.tsx

@@ -1,13 +1,11 @@
 import { useId, useMemo, useState } from 'react';
 
-import { zodResolver } from '@hookform/resolvers/zod';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { type Field, FieldType, type Recipient, RecipientRole } from '@prisma/client';
 import { Controller, useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router';
-import { z } from 'zod';
 
 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
 import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
@@ -20,26 +18,17 @@ import { trpc } from '@documenso/trpc/react';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
+import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
-import { SignaturePadDialog } from '@documenso/ui/primitives/signature-pad/signature-pad-dialog';
+import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import {
+import { AssistantConfirmationDialog } from '../../dialogs/assistant-confirmation-dialog';
-  AssistantConfirmationDialog,
-  type NextSigner,
-} from '../../dialogs/assistant-confirmation-dialog';
 import { DocumentSigningCompleteDialog } from './document-signing-complete-dialog';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
 
-export const ZSigningFormSchema = z.object({
-  name: z.string().min(1, 'Name is required').optional(),
-  email: z.string().email('Invalid email address').optional(),
-});
-
-export type TSigningFormSchema = z.infer<typeof ZSigningFormSchema>;
-
 export type DocumentSigningFormProps = {
   document: DocumentAndSender;
   recipient: Recipient;
@@ -70,7 +59,8 @@ export const DocumentSigningForm = ({
 
   const assistantSignersId = useId();
 
-  const { fullName, signature, setFullName, setSignature } = useRequiredDocumentSigningContext();
+  const { fullName, signature, setFullName, setSignature, signatureValid, setSignatureValid } =
+    useRequiredDocumentSigningContext();
 
   const [validateUninsertedFields, setValidateUninsertedFields] = useState(false);
   const [isConfirmationDialogOpen, setIsConfirmationDialogOpen] = useState(false);
@@ -85,9 +75,7 @@ export const DocumentSigningForm = ({
     },
   });
 
-  const { handleSubmit, formState } = useForm<TSigningFormSchema>({
+  const { handleSubmit, formState } = useForm();
-    resolver: zodResolver(ZSigningFormSchema),
-  });
 
   // Keep the loading state going if successful since the redirect may take some time.
   const isSubmitting = formState.isSubmitting || formState.isSubmitSuccessful;
@@ -112,32 +100,20 @@ export const DocumentSigningForm = ({
     validateFieldsInserted(fieldsRequiringValidation);
   };
 
-  const onFormSubmit = async (data: TSigningFormSchema) => {
+  const onFormSubmit = async () => {
-    try {
     setValidateUninsertedFields(true);
 
     const isFieldsValid = validateFieldsInserted(fieldsRequiringValidation);
 
+    if (hasSignatureField && !signatureValid) {
+      return;
+    }
+
     if (!isFieldsValid) {
       return;
     }
 
-      const nextSigner =
+    await completeDocument();
-        data.email && data.name
-          ? {
-              email: data.email,
-              name: data.name,
-            }
-          : undefined;
-
-      await completeDocument(undefined, nextSigner);
-    } catch (error) {
-      toast({
-        title: 'Error',
-        description: error instanceof Error ? error.message : 'An error occurred while signing',
-        variant: 'destructive',
-      });
-    }
   };
 
   const onAssistantFormSubmit = () => {
@@ -148,11 +124,11 @@ export const DocumentSigningForm = ({
     setIsConfirmationDialogOpen(true);
   };
 
-  const handleAssistantConfirmDialogSubmit = async (nextSigner?: NextSigner) => {
+  const handleAssistantConfirmDialogSubmit = async () => {
     setIsAssistantSubmitting(true);
 
     try {
-      await completeDocument(undefined, nextSigner);
+      await completeDocument();
     } catch (err) {
       toast({
         title: 'Error',
@@ -165,18 +141,12 @@ export const DocumentSigningForm = ({
     }
   };
 
-  const completeDocument = async (
+  const completeDocument = async (authOptions?: TRecipientActionAuth) => {
-    authOptions?: TRecipientActionAuth,
+    await completeDocumentWithToken({
-    nextSigner?: { email: string; name: string },
-  ) => {
-    const payload = {
       token: recipient.token,
       documentId: document.id,
       authOptions,
-      ...(nextSigner?.email && nextSigner?.name ? { nextSigner } : {}),
+    });
-    };
-
-    await completeDocumentWithToken(payload);
 
     analytics.capture('App: Recipient has completed signing', {
       signerId: recipient.id,
@@ -191,31 +161,6 @@ export const DocumentSigningForm = ({
     }
   };
 
-  const nextRecipient = useMemo(() => {
-    if (
-      !document.documentMeta?.signingOrder ||
-      document.documentMeta.signingOrder !== 'SEQUENTIAL'
-    ) {
-      return undefined;
-    }
-
-    const sortedRecipients = allRecipients.sort((a, b) => {
-      // Sort by signingOrder first (nulls last), then by id
-      if (a.signingOrder === null && b.signingOrder === null) return a.id - b.id;
-      if (a.signingOrder === null) return 1;
-      if (b.signingOrder === null) return -1;
-      if (a.signingOrder === b.signingOrder) return a.id - b.id;
-      return a.signingOrder - b.signingOrder;
-    });
-
-    const currentIndex = sortedRecipients.findIndex((r) => r.id === recipient.id);
-    return currentIndex !== -1 && currentIndex < sortedRecipients.length - 1
-      ? sortedRecipients[currentIndex + 1]
-      : undefined;
-  }, [document.documentMeta?.signingOrder, allRecipients, recipient.id]);
-
-  console.log('nextRecipient', nextRecipient);
-
   return (
     <div
       className={cn(
@@ -265,19 +210,12 @@ export const DocumentSigningForm = ({
 
                   <DocumentSigningCompleteDialog
                     isSubmitting={isSubmitting}
+                    onSignatureComplete={handleSubmit(onFormSubmit)}
                     documentTitle={document.title}
                     fields={fields}
                     fieldsValidated={fieldsValidated}
-                    onSignatureComplete={async (nextSigner) => {
-                      await completeDocument(undefined, nextSigner);
-                    }}
                     role={recipient.role}
-                    allowDictateNextSigner={document.documentMeta?.allowDictateNextSigner}
+                    disabled={!isRecipientsTurn}
-                    defaultNextSigner={
-                      nextRecipient
-                        ? { name: nextRecipient.name, email: nextRecipient.email }
-                        : undefined
-                    }
                   />
                 </div>
               </div>
@@ -368,14 +306,6 @@ export const DocumentSigningForm = ({
                   onClose={() => !isAssistantSubmitting && setIsConfirmationDialogOpen(false)}
                   onConfirm={handleAssistantConfirmDialogSubmit}
                   isSubmitting={isAssistantSubmitting}
-                  allowDictateNextSigner={
-                    nextRecipient && document.documentMeta?.allowDictateNextSigner
-                  }
-                  defaultNextSigner={
-                    nextRecipient
-                      ? { name: nextRecipient.name, email: nextRecipient.email }
-                      : undefined
-                  }
                 />
               </form>
             </>
@@ -383,11 +313,7 @@ export const DocumentSigningForm = ({
             <>
               <form onSubmit={handleSubmit(onFormSubmit)}>
                 <p className="text-muted-foreground mt-2 text-sm">
-                  {recipient.role === RecipientRole.APPROVER && !hasSignatureField ? (
-                    <Trans>Please review the document before approving.</Trans>
-                  ) : (
                   <Trans>Please review the document before signing.</Trans>
-                  )}
                 </p>
 
                 <hr className="border-border mb-8 mt-4" />
@@ -411,27 +337,41 @@ export const DocumentSigningForm = ({
                       />
                     </div>
 
-                    {hasSignatureField && (
                     <div>
                       <Label htmlFor="Signature">
                         <Trans>Signature</Trans>
                       </Label>
 
-                        <SignaturePadDialog
+                      <Card className="mt-2" gradient degrees={-120}>
-                          className="mt-2"
+                        <CardContent className="p-0">
+                          <SignaturePad
+                            className="h-44 w-full"
                             disabled={isSubmitting}
-                          value={signature ?? ''}
+                            defaultValue={signature ?? undefined}
-                          onChange={(v) => setSignature(v ?? '')}
+                            onValidityChange={(isValid) => {
-                          typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
+                              setSignatureValid(isValid);
-                          uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
+                            }}
-                          drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
+                            onChange={(value) => {
+                              if (signatureValid) {
+                                setSignature(value);
+                              }
+                            }}
+                            allowTypedSignature={document.documentMeta?.typedSignatureEnabled}
                           />
+                        </CardContent>
+                      </Card>
+
+                      {hasSignatureField && !signatureValid && (
+                        <div className="text-destructive mt-2 text-sm">
+                          <Trans>
+                            Signature is too small. Please provide a more complete signature.
+                          </Trans>
                         </div>
                       )}
                     </div>
-                </fieldset>
+                  </div>
 
-                <div className="mt-6 flex flex-col gap-4 md:flex-row">
+                  <div className="flex flex-col gap-4 md:flex-row">
                     <Button
                       type="button"
                       className="dark:bg-muted dark:hover:bg-muted/80 w-full bg-black/5 hover:bg-black/10"
@@ -444,25 +384,16 @@ export const DocumentSigningForm = ({
                     </Button>
 
                     <DocumentSigningCompleteDialog
-                    isSubmitting={isSubmitting || isAssistantSubmitting}
+                      isSubmitting={isSubmitting}
+                      onSignatureComplete={handleSubmit(onFormSubmit)}
                       documentTitle={document.title}
                       fields={fields}
                       fieldsValidated={fieldsValidated}
-                    disabled={!isRecipientsTurn}
-                    onSignatureComplete={async (nextSigner) => {
-                      await completeDocument(undefined, nextSigner);
-                    }}
                       role={recipient.role}
-                    allowDictateNextSigner={
+                      disabled={!isRecipientsTurn}
-                      nextRecipient && document.documentMeta?.allowDictateNextSigner
-                    }
-                    defaultNextSigner={
-                      nextRecipient
-                        ? { name: nextRecipient.name, email: nextRecipient.email }
-                        : undefined
-                    }
                     />
                   </div>
+                </fieldset>
               </form>
             </>
           )}

apps/remix/app/components/general/document-signing/document-signing-initials-field.tsx

@@ -1,12 +1,12 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 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 { ZInitialsFieldMeta } from '@documenso/lib/types/field-meta';
 import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
 import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
 import { trpc } from '@documenso/trpc/react';
@@ -17,11 +17,6 @@ import type {
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import {
-  DocumentSigningFieldsInserted,
-  DocumentSigningFieldsLoader,
-  DocumentSigningFieldsUninserted,
-} from './document-signing-fields';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
@@ -55,9 +50,6 @@ export const DocumentSigningInitialsField = ({
 
   const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
-  const safeFieldMeta = ZInitialsFieldMeta.safeParse(field.fieldMeta);
-  const parsedFieldMeta = safeFieldMeta.success ? safeFieldMeta.data : null;
-
   const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
       const value = initials ?? '';
@@ -130,18 +122,22 @@ export const DocumentSigningInitialsField = ({
       onRemove={onRemove}
       type="Initials"
     >
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {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" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <DocumentSigningFieldsUninserted>
+        <p className="group-hover:text-primary text-muted-foreground text-[clamp(0.425rem,25cqw,0.825rem)] duration-200 group-hover:text-yellow-300">
           <Trans>Initials</Trans>
-        </DocumentSigningFieldsUninserted>
+        </p>
       )}
 
       {field.inserted && (
-        <DocumentSigningFieldsInserted textAlign={parsedFieldMeta?.textAlign}>
+        <p className="text-muted-foreground dark:text-background/80 text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
           {field.customText}
-        </DocumentSigningFieldsInserted>
+        </p>
       )}
     </DocumentSigningFieldContainer>
   );

apps/remix/app/components/general/document-signing/document-signing-name-field.tsx

@@ -3,6 +3,7 @@ import { useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -15,6 +16,7 @@ import type {
   TRemovedSignedFieldWithTokenMutationSchema,
   TSignFieldWithTokenMutationSchema,
 } from '@documenso/trpc/server/field-router/schema';
+import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 import { Dialog, DialogContent, DialogFooter, DialogTitle } from '@documenso/ui/primitives/dialog';
 import { Input } from '@documenso/ui/primitives/input';
@@ -23,11 +25,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import {
-  DocumentSigningFieldsInserted,
-  DocumentSigningFieldsLoader,
-  DocumentSigningFieldsUninserted,
-} from './document-signing-fields';
 import { useRequiredDocumentSigningContext } from './document-signing-provider';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
@@ -169,18 +166,34 @@ export const DocumentSigningNameField = ({
       onRemove={onRemove}
       type="Name"
     >
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {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" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <DocumentSigningFieldsUninserted>
+        <p className="group-hover:text-primary text-muted-foreground duration-200 group-hover:text-yellow-300">
           <Trans>Name</Trans>
-        </DocumentSigningFieldsUninserted>
+        </p>
       )}
 
       {field.inserted && (
-        <DocumentSigningFieldsInserted textAlign={parsedFieldMeta?.textAlign}>
+        <div className="flex h-full w-full items-center">
+          <p
+            className={cn(
+              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
+              {
+                'text-left': parsedFieldMeta?.textAlign === 'left',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
+                'text-right': parsedFieldMeta?.textAlign === 'right',
+              },
+            )}
+          >
             {field.customText}
-        </DocumentSigningFieldsInserted>
+          </p>
+        </div>
       )}
 
       <Dialog open={showFullNameModal} onOpenChange={setShowFullNameModal}>
@@ -189,7 +202,7 @@ export const DocumentSigningNameField = ({
             <Trans>
               Sign as
               <div>
-                {recipient.name} <div className="text-foreground">({recipient.email})</div>
+                {recipient.name} <div className="text-muted-foreground">({recipient.email})</div>
               </div>
             </Trans>
           </DialogTitle>
@@ -211,7 +224,7 @@ export const DocumentSigningNameField = ({
             <div className="flex w-full flex-1 flex-nowrap gap-4">
               <Button
                 type="button"
-                className="flex-1"
+                className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
                 variant="secondary"
                 onClick={() => {
                   setShowFullNameModal(false);

apps/remix/app/components/general/document-signing/document-signing-number-field.tsx

@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
+import { Hash, Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number';
@@ -24,11 +25,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import {
-  DocumentSigningFieldsInserted,
-  DocumentSigningFieldsLoader,
-  DocumentSigningFieldsUninserted,
-} from './document-signing-fields';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
 type ValidationErrors = {
@@ -249,16 +245,45 @@ export const DocumentSigningNumberField = ({
       onRemove={onRemove}
       type="Number"
     >
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {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" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <DocumentSigningFieldsUninserted>{fieldDisplayName}</DocumentSigningFieldsUninserted>
+        <p
+          className={cn(
+            'group-hover:text-primary text-muted-foreground flex flex-col items-center justify-center duration-200',
+            {
+              'group-hover:text-yellow-300': !field.inserted && !parsedFieldMeta?.required,
+              'group-hover:text-red-300': !field.inserted && parsedFieldMeta?.required,
+            },
+          )}
+        >
+          <span className="flex items-center justify-center gap-x-1">
+            <Hash className="h-[clamp(0.625rem,20cqw,0.925rem)] w-[clamp(0.625rem,20cqw,0.925rem)]" />{' '}
+            <span className="text-[clamp(0.425rem,25cqw,0.825rem)]">{fieldDisplayName}</span>
+          </span>
+        </p>
       )}
 
       {field.inserted && (
-        <DocumentSigningFieldsInserted textAlign={parsedFieldMeta?.textAlign}>
+        <div className="flex h-full w-full items-center">
+          <p
+            className={cn(
+              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
+              {
+                'text-left': parsedFieldMeta?.textAlign === 'left',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
+                'text-right': parsedFieldMeta?.textAlign === 'right',
+              },
+            )}
+          >
             {field.customText}
-        </DocumentSigningFieldsInserted>
+          </p>
+        </div>
       )}
 
       <Dialog open={showNumberModal} onOpenChange={setShowNumberModal}>
@@ -314,7 +339,7 @@ export const DocumentSigningNumberField = ({
             <div className="flex w-full flex-1 flex-nowrap gap-4">
               <Button
                 type="button"
-                className="flex-1"
+                className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
                 variant="secondary"
                 onClick={() => {
                   setShowNumberModal(false);

apps/remix/app/components/general/document-signing/document-signing-page-view.tsx

@@ -19,7 +19,6 @@ import {
 import type { CompletedField } from '@documenso/lib/types/fields';
 import type { FieldWithSignatureAndFieldMeta } from '@documenso/prisma/types/field-with-signature-and-fieldmeta';
 import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
-import { DocumentReadOnlyFields } from '@documenso/ui/components/document/document-read-only-fields';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { ElementVisible } from '@documenso/ui/primitives/element-visible';
 import { PDFViewer } from '@documenso/ui/primitives/pdf-viewer';
@@ -37,12 +36,13 @@ import { DocumentSigningRadioField } from '~/components/general/document-signing
 import { DocumentSigningRejectDialog } from '~/components/general/document-signing/document-signing-reject-dialog';
 import { DocumentSigningSignatureField } from '~/components/general/document-signing/document-signing-signature-field';
 import { DocumentSigningTextField } from '~/components/general/document-signing/document-signing-text-field';
+import { DocumentReadOnlyFields } from '~/components/general/document/document-read-only-fields';
 
 import { DocumentSigningRecipientProvider } from './document-signing-recipient-provider';
 
-export type DocumentSigningPageViewProps = {
+export type SigningPageViewProps = {
-  recipient: RecipientWithFields;
   document: DocumentAndSender;
+  recipient: RecipientWithFields;
   fields: Field[];
   completedFields: CompletedField[];
   isRecipientsTurn: boolean;
@@ -50,13 +50,13 @@ export type DocumentSigningPageViewProps = {
 };
 
 export const DocumentSigningPageView = ({
-  recipient,
   document,
+  recipient,
   fields,
   completedFields,
   isRecipientsTurn,
   allRecipients = [],
-}: DocumentSigningPageViewProps) => {
+}: SigningPageViewProps) => {
   const { documentData, documentMeta } = document;
 
   const [selectedSignerId, setSelectedSignerId] = useState<number | null>(allRecipients?.[0]?.id);
@@ -157,7 +157,7 @@ export const DocumentSigningPageView = ({
           </div>
         </div>
 
-        <DocumentReadOnlyFields fields={completedFields} showRecipientTooltip={true} />
+        <DocumentReadOnlyFields fields={completedFields} />
 
         {recipient.role !== RecipientRole.ASSISTANT && (
           <DocumentSigningAutoSign recipient={recipient} fields={fields} />
@@ -177,8 +177,6 @@ export const DocumentSigningPageView = ({
                     key={field.id}
                     field={field}
                     typedSignatureEnabled={documentMeta?.typedSignatureEnabled}
-                    uploadSignatureEnabled={documentMeta?.uploadSignatureEnabled}
-                    drawSignatureEnabled={documentMeta?.drawSignatureEnabled}
                   />
                 ))
                 .with(FieldType.INITIALS, () => (

apps/remix/app/components/general/document-signing/document-signing-provider.tsx

@@ -1,6 +1,4 @@
-import { createContext, useContext, useState } from 'react';
+import { createContext, useContext, useEffect, useState } from 'react';
-
-import { isBase64Image } from '@documenso/lib/constants/signatures';
 
 export type DocumentSigningContextValue = {
   fullName: string;
@@ -9,6 +7,8 @@ export type DocumentSigningContextValue = {
   setEmail: (_value: string) => void;
   signature: string | null;
   setSignature: (_value: string | null) => void;
+  signatureValid: boolean;
+  setSignatureValid: (_valid: boolean) => void;
 };
 
 const DocumentSigningContext = createContext<DocumentSigningContextValue | null>(null);
@@ -31,9 +31,6 @@ export interface DocumentSigningProviderProps {
   fullName?: string | null;
   email?: string | null;
   signature?: string | null;
-  typedSignatureEnabled?: boolean;
-  uploadSignatureEnabled?: boolean;
-  drawSignatureEnabled?: boolean;
   children: React.ReactNode;
 }
 
@@ -41,31 +38,18 @@ export const DocumentSigningProvider = ({
   fullName: initialFullName,
   email: initialEmail,
   signature: initialSignature,
-  typedSignatureEnabled = true,
-  uploadSignatureEnabled = true,
-  drawSignatureEnabled = true,
   children,
 }: DocumentSigningProviderProps) => {
   const [fullName, setFullName] = useState(initialFullName || '');
   const [email, setEmail] = useState(initialEmail || '');
+  const [signature, setSignature] = useState(initialSignature || null);
+  const [signatureValid, setSignatureValid] = useState(true);
 
-  // Ensure the user signature doesn't show up if it's not allowed.
+  useEffect(() => {
-  const [signature, setSignature] = useState(
+    if (initialSignature) {
-    (() => {
+      setSignature(initialSignature);
-      const sig = initialSignature || '';
-      const isBase64 = isBase64Image(sig);
-
-      if (isBase64 && (uploadSignatureEnabled || drawSignatureEnabled)) {
-        return sig;
     }
-
+  }, [initialSignature]);
-      if (!isBase64 && typedSignatureEnabled) {
-        return sig;
-      }
-
-      return null;
-    })(),
-  );
 
   return (
     <DocumentSigningContext.Provider
@@ -76,6 +60,8 @@ export const DocumentSigningProvider = ({
         setEmail,
         signature,
         setSignature,
+        signatureValid,
+        setSignatureValid,
       }}
     >
       {children}

apps/remix/app/components/general/document-signing/document-signing-radio-field.tsx

@@ -2,6 +2,7 @@ import { useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Loader } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -20,7 +21,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import { DocumentSigningFieldsLoader } from './document-signing-fields';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
 export type DocumentSigningRadioFieldProps = {
@@ -150,52 +150,44 @@ export const DocumentSigningRadioField = ({
 
   return (
     <DocumentSigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Radio">
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {isLoading && (
+        <div className="bg-background absolute inset-0 z-20 flex items-center justify-center rounded-md">
+          <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <RadioGroup
+        <RadioGroup onValueChange={(value) => handleSelectItem(value)} className="z-10">
-          onValueChange={(value) => handleSelectItem(value)}
-          className="z-10 my-0.5 gap-y-1"
-        >
           {values?.map((item, index) => (
-            <div key={index} className="flex items-center">
+            <div key={index} className="flex items-center gap-x-1.5">
               <RadioGroupItem
-                className="h-3 w-3 shrink-0"
+                className="h-4 w-4 shrink-0"
                 value={item.value}
-                id={`option-${field.id}-${item.id}`}
+                id={`option-${index}`}
                 checked={item.checked}
               />
-              {!item.value.includes('empty-value-') && item.value && (
+
-                <Label
+              <Label htmlFor={`option-${index}`}>
-                  htmlFor={`option-${field.id}-${item.id}`}
+                {item.value.includes('empty-value-') ? '' : item.value}
-                  className="text-foreground ml-1.5 text-xs font-normal"
-                >
-                  {item.value}
               </Label>
-              )}
             </div>
           ))}
         </RadioGroup>
       )}
 
       {field.inserted && (
-        <RadioGroup className="my-0.5 gap-y-1">
+        <RadioGroup className="gap-y-1">
           {values?.map((item, index) => (
-            <div key={index} className="flex items-center">
+            <div key={index} className="flex items-center gap-x-1.5">
               <RadioGroupItem
                 className="h-3 w-3"
                 value={item.value}
-                id={`option-${field.id}-${item.id}`}
+                id={`option-${index}`}
                 checked={item.value === field.customText}
               />
-              {!item.value.includes('empty-value-') && item.value && (
+              <Label htmlFor={`option-${index}`} className="text-xs">
-                <Label
+                {item.value.includes('empty-value-') ? '' : item.value}
-                  htmlFor={`option-${field.id}-${item.id}`}
-                  className="text-foreground ml-1.5 text-xs font-normal"
-                >
-                  {item.value}
               </Label>
-              )}
             </div>
           ))}
         </RadioGroup>

apps/remix/app/components/general/document-signing/document-signing-reject-dialog.tsx

@@ -31,7 +31,10 @@ import { Textarea } from '@documenso/ui/primitives/textarea';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 const ZRejectDocumentFormSchema = z.object({
-  reason: z.string().max(500, msg`Reason must be less than 500 characters`),
+  reason: z
+    .string()
+    .min(5, msg`Please provide a reason`)
+    .max(500, msg`Reason must be less than 500 characters`),
 });
 
 type TRejectDocumentFormSchema = z.infer<typeof ZRejectDocumentFormSchema>;

apps/remix/app/components/general/document-signing/document-signing-signature-field.tsx

@@ -17,6 +17,7 @@ import type {
 } from '@documenso/trpc/server/field-router/schema';
 import { Button } from '@documenso/ui/primitives/button';
 import { Dialog, DialogContent, DialogFooter, DialogTitle } from '@documenso/ui/primitives/dialog';
+import { Label } from '@documenso/ui/primitives/label';
 import { SignaturePad } from '@documenso/ui/primitives/signature-pad';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
@@ -28,14 +29,11 @@ import { useRequiredDocumentSigningContext } from './document-signing-provider';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
 type SignatureFieldState = 'empty' | 'signed-image' | 'signed-text';
-
 export type DocumentSigningSignatureFieldProps = {
   field: FieldWithSignature;
   onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
   onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
   typedSignatureEnabled?: boolean;
-  uploadSignatureEnabled?: boolean;
-  drawSignatureEnabled?: boolean;
 };
 
 export const DocumentSigningSignatureField = ({
@@ -43,8 +41,6 @@ export const DocumentSigningSignatureField = ({
   onSignField,
   onUnsignField,
   typedSignatureEnabled,
-  uploadSignatureEnabled,
-  drawSignatureEnabled,
 }: DocumentSigningSignatureFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
@@ -56,8 +52,12 @@ export const DocumentSigningSignatureField = ({
   const containerRef = useRef<HTMLDivElement>(null);
   const [fontSize, setFontSize] = useState(2);
 
-  const { signature: providedSignature, setSignature: setProvidedSignature } =
+  const {
-    useRequiredDocumentSigningContext();
+    signature: providedSignature,
+    setSignature: setProvidedSignature,
+    signatureValid,
+    setSignatureValid,
+  } = useRequiredDocumentSigningContext();
 
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
@@ -89,7 +89,7 @@ export const DocumentSigningSignatureField = ({
   }, [field.inserted, signature?.signatureImageAsBase64]);
 
   const onPreSign = () => {
-    if (!providedSignature) {
+    if (!providedSignature || !signatureValid) {
       setShowSignatureModal(true);
       return false;
     }
@@ -102,7 +102,6 @@ export const DocumentSigningSignatureField = ({
   const onDialogSignClick = () => {
     setShowSignatureModal(false);
     setProvidedSignature(localSignature);
-
     if (!localSignature) {
       return;
     }
@@ -117,14 +116,14 @@ export const DocumentSigningSignatureField = ({
     try {
       const value = signature || providedSignature;
 
-      if (!value) {
+      if (!value || (signature && !signatureValid)) {
         setShowSignatureModal(true);
         return;
       }
 
       const isTypedSignature = !value.startsWith('data:image');
 
-      if (isTypedSignature && typedSignatureEnabled === false) {
+      if (isTypedSignature && !typedSignatureEnabled) {
         toast({
           title: _(msg`Error`),
           description: _(msg`Typed signatures are not allowed. Please draw your signature.`),
@@ -242,7 +241,7 @@ export const DocumentSigningSignatureField = ({
       )}
 
       {state === 'empty' && (
-        <p className="group-hover:text-primary font-signature text-muted-foreground group-hover:text-recipient-green text-[clamp(0.575rem,25cqw,1.2rem)] text-xl duration-200">
+        <p className="group-hover:text-primary font-signature text-muted-foreground text-[clamp(0.575rem,25cqw,1.2rem)] text-xl duration-200 group-hover:text-yellow-300">
           <Trans>Signature</Trans>
         </p>
       )}
@@ -259,7 +258,7 @@ export const DocumentSigningSignatureField = ({
         <div ref={containerRef} className="flex h-full w-full items-center justify-center p-2">
           <p
             ref={signatureRef}
-            className="font-signature text-muted-foreground w-full overflow-hidden break-all text-center leading-tight duration-200"
+            className="font-signature text-muted-foreground dark:text-background w-full overflow-hidden break-all text-center leading-tight duration-200"
             style={{ fontSize: `${fontSize}rem` }}
           >
             {signature?.typedSignature}
@@ -276,14 +275,29 @@ export const DocumentSigningSignatureField = ({
             </Trans>
           </DialogTitle>
 
+          <div className="">
+            <Label htmlFor="signature">
+              <Trans>Signature</Trans>
+            </Label>
+
+            <div className="border-border mt-2 rounded-md border">
               <SignaturePad
-            className="mt-2"
+                id="signature"
-            value={localSignature ?? ''}
+                className="h-44 w-full"
-            onChange={({ value }) => setLocalSignature(value)}
+                onChange={(value) => setLocalSignature(value)}
-            typedSignatureEnabled={typedSignatureEnabled}
+                allowTypedSignature={typedSignatureEnabled}
-            uploadSignatureEnabled={uploadSignatureEnabled}
+                onValidityChange={(isValid) => {
-            drawSignatureEnabled={drawSignatureEnabled}
+                  setSignatureValid(isValid);
+                }}
               />
+            </div>
+
+            {!signatureValid && (
+              <div className="text-destructive mt-2 text-sm">
+                <Trans>Signature is too small. Please provide a more complete signature.</Trans>
+              </div>
+            )}
+          </div>
 
           <DocumentSigningDisclosure />
 
@@ -291,7 +305,7 @@ export const DocumentSigningSignatureField = ({
             <div className="flex w-full flex-1 flex-nowrap gap-4">
               <Button
                 type="button"
-                className="flex-1"
+                className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
                 variant="secondary"
                 onClick={() => {
                   setShowSignatureModal(false);
@@ -303,7 +317,7 @@ export const DocumentSigningSignatureField = ({
               <Button
                 type="button"
                 className="flex-1"
-                disabled={!localSignature}
+                disabled={!localSignature || !signatureValid}
                 onClick={() => onDialogSignClick()}
               >
                 <Trans>Sign</Trans>

apps/remix/app/components/general/document-signing/document-signing-text-field.tsx

@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Plural, Trans } from '@lingui/react/macro';
+import { Loader, Type } from 'lucide-react';
 import { useRevalidator } from 'react-router';
 
 import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text';
@@ -24,11 +25,6 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { useRequiredDocumentSigningAuthContext } from './document-signing-auth-provider';
 import { DocumentSigningFieldContainer } from './document-signing-field-container';
-import {
-  DocumentSigningFieldsInserted,
-  DocumentSigningFieldsLoader,
-  DocumentSigningFieldsUninserted,
-} from './document-signing-fields';
 import { useDocumentSigningRecipientContext } from './document-signing-recipient-provider';
 
 export type DocumentSigningTextFieldProps = {
@@ -252,20 +248,49 @@ export const DocumentSigningTextField = ({
       onRemove={onRemove}
       type="Text"
     >
-      {isLoading && <DocumentSigningFieldsLoader />}
+      {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" />
+        </div>
+      )}
 
       {!field.inserted && (
-        <DocumentSigningFieldsUninserted>
+        <p
+          className={cn(
+            'group-hover:text-primary text-muted-foreground flex flex-col items-center justify-center duration-200',
+            {
+              'group-hover:text-yellow-300': !field.inserted && !parsedFieldMeta?.required,
+              'group-hover:text-red-300': !field.inserted && parsedFieldMeta?.required,
+            },
+          )}
+        >
+          <span className="flex items-center justify-center gap-x-1">
+            <Type className="h-[clamp(0.625rem,20cqw,0.925rem)] w-[clamp(0.625rem,20cqw,0.925rem)]" />
+            <span className="text-[clamp(0.425rem,25cqw,0.825rem)]">
               {fieldDisplayName || <Trans>Text</Trans>}
-        </DocumentSigningFieldsUninserted>
+            </span>
+          </span>
+        </p>
       )}
 
       {field.inserted && (
-        <DocumentSigningFieldsInserted textAlign={parsedFieldMeta?.textAlign}>
+        <div className="flex h-full w-full items-center">
+          <p
+            className={cn(
+              'text-muted-foreground dark:text-background/80 w-full text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
+              {
+                'text-left': parsedFieldMeta?.textAlign === 'left',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
+                'text-right': parsedFieldMeta?.textAlign === 'right',
+              },
+            )}
+          >
             {field.customText.length < 20
               ? field.customText
               : field.customText.substring(0, 20) + '...'}
-        </DocumentSigningFieldsInserted>
+          </p>
+        </div>
       )}
 
       <Dialog open={showCustomTextModal} onOpenChange={setShowCustomTextModal}>
@@ -279,9 +304,11 @@ export const DocumentSigningTextField = ({
               id="custom-text"
               placeholder={parsedFieldMeta?.placeholder ?? _(msg`Enter your text here`)}
               className={cn('mt-2 w-full rounded-md', {
-                'border-2 border-red-300 text-left ring-2 ring-red-200 ring-offset-2 ring-offset-red-200 focus-visible:border-red-400 focus-visible:ring-4 focus-visible:ring-red-200 focus-visible:ring-offset-2 focus-visible:ring-offset-red-200':
+                'border-2 border-red-300 ring-2 ring-red-200 ring-offset-2 ring-offset-red-200 focus-visible:border-red-400 focus-visible:ring-4 focus-visible:ring-red-200 focus-visible:ring-offset-2 focus-visible:ring-offset-red-200':
                   userInputHasErrors,
-                'text-center': parsedFieldMeta?.textAlign === 'center',
+                'text-left': parsedFieldMeta?.textAlign === 'left',
+                'text-center':
+                  !parsedFieldMeta?.textAlign || parsedFieldMeta?.textAlign === 'center',
                 'text-right': parsedFieldMeta?.textAlign === 'right',
               })}
               value={localText}
@@ -327,8 +354,8 @@ export const DocumentSigningTextField = ({
             <div className="mt-4 flex w-full flex-1 flex-nowrap gap-4">
               <Button
                 type="button"
+                className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
                 variant="secondary"
-                className="flex-1"
                 onClick={() => {
                   setShowCustomTextModal(false);
                   setLocalCustomText('');

apps/remix/app/components/general/document/document-certificate-download-button.tsx

@@ -1,10 +1,9 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { DocumentStatus } from '@prisma/client';
+import { DocumentStatus } from '@prisma/client';
 import { DownloadIcon } from 'lucide-react';
 
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
@@ -77,7 +76,7 @@ export const DocumentCertificateDownloadButton = ({
       className={cn('w-full sm:w-auto', className)}
       loading={isPending}
       variant="outline"
-      disabled={!isDocumentCompleted(documentStatus)}
+      disabled={documentStatus !== DocumentStatus.COMPLETED}
       onClick={() => void onDownloadCertificatesClick()}
     >
       {!isPending && <DownloadIcon className="mr-1.5 h-4 w-4" />}

apps/remix/app/components/general/document/document-edit-form.tsx

@@ -5,7 +5,6 @@ import { useLingui } from '@lingui/react';
 import { DocumentDistributionMethod, DocumentStatus } from '@prisma/client';
 import { useNavigate, useSearchParams } from 'react-router';
 
-import { DocumentSignatureType } from '@documenso/lib/constants/document';
 import { isValidLanguageCode } from '@documenso/lib/constants/i18n';
 import {
   DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
@@ -72,7 +71,7 @@ export const DocumentEditForm = ({
 
   const { recipients, fields } = document;
 
-  const { mutateAsync: updateDocument } = trpc.document.updateDocument.useMutation({
+  const { mutateAsync: updateDocument } = trpc.document.setSettingsForDocument.useMutation({
     ...DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
     onSuccess: (newData) => {
       utils.document.getDocumentWithDetailsById.setData(
@@ -175,7 +174,7 @@ export const DocumentEditForm = ({
 
   const onAddSettingsFormSubmit = async (data: TAddSettingsFormSchema) => {
     try {
-      const { timezone, dateFormat, redirectUrl, language, signatureTypes } = data.meta;
+      const { timezone, dateFormat, redirectUrl, language } = data.meta;
 
       await updateDocument({
         documentId: document.id,
@@ -191,9 +190,6 @@ export const DocumentEditForm = ({
           dateFormat,
           redirectUrl,
           language: isValidLanguageCode(language) ? language : undefined,
-          typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
-          uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
-          drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
         },
       });
 
@@ -217,13 +213,6 @@ export const DocumentEditForm = ({
           signingOrder: data.signingOrder,
         }),
 
-        updateDocument({
-          documentId: document.id,
-          meta: {
-            allowDictateNextSigner: data.allowDictateNextSigner,
-          },
-        }),
-
         setRecipients({
           documentId: document.id,
           recipients: data.signers.map((signer) => ({
@@ -253,6 +242,14 @@ export const DocumentEditForm = ({
         fields: data.fields,
       });
 
+      await updateDocument({
+        documentId: document.id,
+
+        meta: {
+          typedSignatureEnabled: data.typedSignatureEnabled,
+        },
+      });
+
       // Clear all field data from localStorage
       for (let i = 0; i < localStorage.length; i++) {
         const key = localStorage.key(i);
@@ -368,7 +365,6 @@ export const DocumentEditForm = ({
               documentFlow={documentFlow.signers}
               recipients={recipients}
               signingOrder={document.documentMeta?.signingOrder}
-              allowDictateNextSigner={document.documentMeta?.allowDictateNextSigner}
               fields={fields}
               isDocumentEnterprise={isDocumentEnterprise}
               onSubmit={onAddSignersFormSubmit}
@@ -382,6 +378,7 @@ export const DocumentEditForm = ({
               fields={fields}
               onSubmit={onAddFieldsFormSubmit}
               isDocumentPdfLoaded={isDocumentPdfLoaded}
+              typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
               teamId={team?.id}
             />
 

apps/remix/app/components/general/document/document-page-view-button.tsx

@@ -9,7 +9,6 @@ import { match } from 'ts-pattern';
 
 import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc as trpcClient } from '@documenso/trpc/client';
 import { Button } from '@documenso/ui/primitives/button';
@@ -33,7 +32,7 @@ export const DocumentPageViewButton = ({ document }: DocumentPageViewButtonProps
 
   const isRecipient = !!recipient;
   const isPending = document.status === DocumentStatus.PENDING;
-  const isComplete = isDocumentCompleted(document);
+  const isComplete = document.status === DocumentStatus.COMPLETED;
   const isSigned = recipient?.signingStatus === SigningStatus.SIGNED;
   const role = recipient?.role;
 

apps/remix/app/components/general/document/document-page-view-dropdown.tsx

@@ -20,7 +20,6 @@ import { useNavigate } from 'react-router';
 
 import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc as trpcClient } from '@documenso/trpc/client';
 import { DocumentShareButton } from '@documenso/ui/components/document/document-share-button';
@@ -64,7 +63,7 @@ export const DocumentPageViewDropdown = ({ document }: DocumentPageViewDropdownP
   const isDraft = document.status === DocumentStatus.DRAFT;
   const isPending = document.status === DocumentStatus.PENDING;
   const isDeleted = document.deletedAt !== null;
-  const isComplete = isDocumentCompleted(document);
+  const isComplete = document.status === DocumentStatus.COMPLETED;
   const isCurrentTeamDocument = team && document.team?.url === team.url;
   const canManageDocument = Boolean(isOwner || isCurrentTeamDocument);
 

apps/remix/app/components/general/document/document-page-view-recipients.tsx

@@ -17,7 +17,6 @@ import { Link } from 'react-router';
 import { match } from 'ts-pattern';
 
 import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatSigningLink } from '@documenso/lib/utils/recipients';
 import { CopyTextButton } from '@documenso/ui/components/common/copy-text-button';
 import { SignatureIcon } from '@documenso/ui/icons/signature';
@@ -49,7 +48,7 @@ export const DocumentPageViewRecipients = ({
           <Trans>Recipients</Trans>
         </h1>
 
-        {!isDocumentCompleted(document.status) && (
+        {document.status !== DocumentStatus.COMPLETED && (
           <Link
             to={`${documentRootPath}/${document.id}/edit?step=signers`}
             title={_(msg`Modify recipients`)}

apps/remix/app/components/general/document/document-read-only-fields.tsx

@@ -0,0 +1,171 @@
+import { useState } from 'react';
+
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
+import type { DocumentMeta } from '@prisma/client';
+import { FieldType, SigningStatus } from '@prisma/client';
+import { Clock, EyeOffIcon } from 'lucide-react';
+import { P, match } from 'ts-pattern';
+
+import {
+  DEFAULT_DOCUMENT_DATE_FORMAT,
+  convertToLocalSystemFormat,
+} from '@documenso/lib/constants/date-formats';
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { DEFAULT_DOCUMENT_TIME_ZONE } from '@documenso/lib/constants/time-zones';
+import type { DocumentField } from '@documenso/lib/server-only/field/get-fields-for-document';
+import { parseMessageDescriptor } from '@documenso/lib/utils/i18n';
+import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
+import { FieldRootContainer } from '@documenso/ui/components/field/field';
+import { SignatureIcon } from '@documenso/ui/icons/signature';
+import { cn } from '@documenso/ui/lib/utils';
+import { Avatar, AvatarFallback } from '@documenso/ui/primitives/avatar';
+import { Badge } from '@documenso/ui/primitives/badge';
+import { FRIENDLY_FIELD_TYPE } from '@documenso/ui/primitives/document-flow/types';
+import { ElementVisible } from '@documenso/ui/primitives/element-visible';
+import { PopoverHover } from '@documenso/ui/primitives/popover';
+
+export type DocumentReadOnlyFieldsProps = {
+  fields: DocumentField[];
+  documentMeta?: DocumentMeta;
+  showFieldStatus?: boolean;
+};
+
+export const DocumentReadOnlyFields = ({
+  documentMeta,
+  fields,
+  showFieldStatus = true,
+}: DocumentReadOnlyFieldsProps) => {
+  const { _ } = useLingui();
+
+  const [hiddenFieldIds, setHiddenFieldIds] = useState<Record<string, boolean>>({});
+
+  const handleHideField = (fieldId: string) => {
+    setHiddenFieldIds((prev) => ({ ...prev, [fieldId]: true }));
+  };
+
+  return (
+    <ElementVisible target={PDF_VIEWER_PAGE_SELECTOR}>
+      {fields.map(
+        (field) =>
+          !hiddenFieldIds[field.secondaryId] && (
+            <FieldRootContainer
+              field={field}
+              key={field.id}
+              cardClassName="border-gray-300/50 !shadow-none backdrop-blur-[1px] bg-gray-50 ring-0 ring-offset-0"
+            >
+              <div className="absolute -right-3 -top-3">
+                <PopoverHover
+                  trigger={
+                    <Avatar className="dark:border-foreground h-8 w-8 border-2 border-solid border-gray-200/50 transition-colors hover:border-gray-200">
+                      <AvatarFallback className="bg-neutral-50 text-xs text-gray-400">
+                        {extractInitials(field.recipient.name || field.recipient.email)}
+                      </AvatarFallback>
+                    </Avatar>
+                  }
+                  contentProps={{
+                    className: 'relative flex w-fit flex-col p-4 text-sm',
+                  }}
+                >
+                  {showFieldStatus && (
+                    <Badge
+                      className="mx-auto mb-1 py-0.5"
+                      variant={
+                        field.recipient.signingStatus === SigningStatus.SIGNED
+                          ? 'default'
+                          : 'secondary'
+                      }
+                    >
+                      {field.recipient.signingStatus === SigningStatus.SIGNED ? (
+                        <>
+                          <SignatureIcon className="mr-1 h-3 w-3" />
+                          <Trans>Signed</Trans>
+                        </>
+                      ) : (
+                        <>
+                          <Clock className="mr-1 h-3 w-3" />
+                          <Trans>Pending</Trans>
+                        </>
+                      )}
+                    </Badge>
+                  )}
+
+                  <p className="text-center font-semibold">
+                    <span>{parseMessageDescriptor(_, FRIENDLY_FIELD_TYPE[field.type])} field</span>
+                  </p>
+
+                  <p className="text-muted-foreground mt-1 text-center text-xs">
+                    {field.recipient.name
+                      ? `${field.recipient.name} (${field.recipient.email})`
+                      : field.recipient.email}{' '}
+                  </p>
+
+                  <button
+                    className="absolute right-0 top-0 my-1 p-2 focus:outline-none focus-visible:ring-0"
+                    onClick={() => handleHideField(field.secondaryId)}
+                    title="Hide field"
+                  >
+                    <EyeOffIcon className="h-3 w-3" />
+                  </button>
+                </PopoverHover>
+              </div>
+
+              <div className="text-muted-foreground dark:text-background/70 break-all text-sm">
+                {field.recipient.signingStatus === SigningStatus.SIGNED &&
+                  match(field)
+                    .with({ type: FieldType.SIGNATURE }, (field) =>
+                      field.signature?.signatureImageAsBase64 ? (
+                        <img
+                          src={field.signature.signatureImageAsBase64}
+                          alt="Signature"
+                          className="h-full w-full object-contain dark:invert"
+                        />
+                      ) : (
+                        <p className="font-signature text-muted-foreground text-lg duration-200 sm:text-xl md:text-2xl">
+                          {field.signature?.typedSignature}
+                        </p>
+                      ),
+                    )
+                    .with(
+                      {
+                        type: P.union(
+                          FieldType.NAME,
+                          FieldType.INITIALS,
+                          FieldType.EMAIL,
+                          FieldType.NUMBER,
+                          FieldType.RADIO,
+                          FieldType.CHECKBOX,
+                          FieldType.DROPDOWN,
+                        ),
+                      },
+                      () => field.customText,
+                    )
+                    .with({ type: FieldType.TEXT }, () => field.customText.substring(0, 20) + '...')
+                    .with({ type: FieldType.DATE }, () =>
+                      convertToLocalSystemFormat(
+                        field.customText,
+                        documentMeta?.dateFormat ?? DEFAULT_DOCUMENT_DATE_FORMAT,
+                        documentMeta?.timezone ?? DEFAULT_DOCUMENT_TIME_ZONE,
+                      ),
+                    )
+                    .with({ type: FieldType.FREE_SIGNATURE }, () => null)
+                    .exhaustive()}
+
+                {field.recipient.signingStatus === SigningStatus.NOT_SIGNED && (
+                  <p
+                    className={cn('text-muted-foreground text-lg duration-200', {
+                      'font-signature sm:text-xl md:text-2xl':
+                        field.type === FieldType.SIGNATURE ||
+                        field.type === FieldType.FREE_SIGNATURE,
+                    })}
+                  >
+                    {parseMessageDescriptor(_, FRIENDLY_FIELD_TYPE[field.type])}
+                  </p>
+                )}
+              </div>
+            </FieldRootContainer>
+          ),
+      )}
+    </ElementVisible>
+  );
+};

apps/remix/app/components/general/document/document-status.tsx

@@ -3,7 +3,7 @@ import type { HTMLAttributes } from 'react';
 import type { MessageDescriptor } from '@lingui/core';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
-import { CheckCircle2, Clock, File, XCircle } from 'lucide-react';
+import { CheckCircle2, Clock, File } from 'lucide-react';
 import type { LucideIcon } from 'lucide-react/dist/lucide-react';
 
 import type { ExtendedDocumentStatus } from '@documenso/prisma/types/extended-document-status';
@@ -36,12 +36,6 @@ export const FRIENDLY_STATUS_MAP: Record<ExtendedDocumentStatus, FriendlyStatus>
     icon: File,
     color: 'text-yellow-500 dark:text-yellow-200',
   },
-  REJECTED: {
-    label: msg`Rejected`,
-    labelExtended: msg`Document rejected`,
-    icon: XCircle,
-    color: 'text-red-500 dark:text-red-300',
-  },
   INBOX: {
     label: msg`Inbox`,
     labelExtended: msg`Document inbox`,

apps/remix/app/components/general/refresh-on-focus.tsx

@@ -2,9 +2,6 @@ import { useCallback, useEffect } from 'react';
 
 import { useRevalidator } from 'react-router';
 
-/**
- * Not really used anymore, this causes random 500s when the user refreshes while this occurs.
- */
 export const RefreshOnFocus = () => {
   const { revalidate, state } = useRevalidator();
 

apps/remix/app/components/general/template/template-edit-form.tsx

@@ -4,7 +4,6 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { useNavigate } from 'react-router';
 
-import { DocumentSignatureType } from '@documenso/lib/constants/document';
 import { isValidLanguageCode } from '@documenso/lib/constants/i18n';
 import {
   DO_NOT_INVALIDATE_QUERY_ON_MUTATION,
@@ -125,8 +124,6 @@ export const TemplateEditForm = ({
   });
 
   const onAddSettingsFormSubmit = async (data: TAddTemplateSettingsFormSchema) => {
-    const { signatureTypes } = data.meta;
-
     try {
       await updateTemplateSettings({
         templateId: template.id,
@@ -139,9 +136,6 @@ export const TemplateEditForm = ({
         },
         meta: {
           ...data.meta,
-          typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
-          uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
-          drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
           language: isValidLanguageCode(data.meta.language) ? data.meta.language : undefined,
         },
       });
@@ -167,7 +161,6 @@ export const TemplateEditForm = ({
           templateId: template.id,
           meta: {
             signingOrder: data.signingOrder,
-            allowDictateNextSigner: data.allowDictateNextSigner,
           },
         }),
 
@@ -194,6 +187,13 @@ export const TemplateEditForm = ({
         fields: data.fields,
       });
 
+      await updateTemplateSettings({
+        templateId: template.id,
+        meta: {
+          typedSignatureEnabled: data.typedSignatureEnabled,
+        },
+      });
+
       // Clear all field data from localStorage
       for (let i = 0; i < localStorage.length; i++) {
         const key = localStorage.key(i);
@@ -271,7 +271,6 @@ export const TemplateEditForm = ({
               recipients={recipients}
               fields={fields}
               signingOrder={template.templateMeta?.signingOrder}
-              allowDictateNextSigner={template.templateMeta?.allowDictateNextSigner}
               templateDirectLink={template.directLink}
               onSubmit={onAddTemplatePlaceholderFormSubmit}
               isEnterprise={isEnterprise}
@@ -285,6 +284,7 @@ export const TemplateEditForm = ({
               fields={fields}
               onSubmit={onAddFieldsFormSubmit}
               teamId={team?.id}
+              typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
             />
           </Stepper>
         </DocumentFlowFormContainer>

apps/remix/app/components/tables/documents-table-action-button.tsx

@@ -9,7 +9,6 @@ import { match } from 'ts-pattern';
 
 import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc as trpcClient } from '@documenso/trpc/client';
 import { Button } from '@documenso/ui/primitives/button';
@@ -38,7 +37,7 @@ export const DocumentsTableActionButton = ({ row }: DocumentsTableActionButtonPr
   const isRecipient = !!recipient;
   const isDraft = row.status === DocumentStatus.DRAFT;
   const isPending = row.status === DocumentStatus.PENDING;
-  const isComplete = isDocumentCompleted(row.status);
+  const isComplete = row.status === DocumentStatus.COMPLETED;
   const isSigned = recipient?.signingStatus === SigningStatus.SIGNED;
   const role = recipient?.role;
   const isCurrentTeamDocument = team && row.team?.url === team.url;

apps/remix/app/components/tables/documents-table-action-dropdown.tsx

@@ -22,7 +22,6 @@ import { Link } from 'react-router';
 
 import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc as trpcClient } from '@documenso/trpc/client';
 import { DocumentShareButton } from '@documenso/ui/components/document/document-share-button';
@@ -67,7 +66,7 @@ export const DocumentsTableActionDropdown = ({ row }: DocumentsTableActionDropdo
   // const isRecipient = !!recipient;
   const isDraft = row.status === DocumentStatus.DRAFT;
   const isPending = row.status === DocumentStatus.PENDING;
-  const isComplete = isDocumentCompleted(row.status);
+  const isComplete = row.status === DocumentStatus.COMPLETED;
   // const isSigned = recipient?.signingStatus === SigningStatus.SIGNED;
   const isCurrentTeamDocument = team && row.team?.url === team.url;
   const canManageDocument = Boolean(isOwner || isCurrentTeamDocument);

apps/remix/app/components/tables/documents-table.tsx

@@ -9,8 +9,8 @@ import { match } from 'ts-pattern';
 
 import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
 import { useSession } from '@documenso/lib/client-only/providers/session';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import { ExtendedDocumentStatus } from '@documenso/prisma/types/extended-document-status';
 import type { TFindDocumentsResponse } from '@documenso/trpc/server/document-router/schema';
 import type { DataTableColumnDef } from '@documenso/ui/primitives/data-table';
 import { DataTable } from '@documenso/ui/primitives/data-table';
@@ -77,7 +77,7 @@ export const DocumentsTable = ({ data, isLoading, isLoadingError }: DocumentsTab
       {
         header: _(msg`Actions`),
         cell: ({ row }) =>
-          (!row.original.deletedAt || isDocumentCompleted(row.original.status)) && (
+          (!row.original.deletedAt || row.original.status === ExtendedDocumentStatus.COMPLETED) && (
             <div className="flex items-center gap-x-4">
               <DocumentsTableActionButton row={row.original} />
               <DocumentsTableActionDropdown row={row.original} />

apps/remix/app/root.tsx

@@ -27,6 +27,7 @@ import { TooltipProvider } from '@documenso/ui/primitives/tooltip';
 import type { Route } from './+types/root';
 import stylesheet from './app.css?url';
 import { GenericErrorLayout } from './components/general/generic-error-layout';
+import { RefreshOnFocus } from './components/general/refresh-on-focus';
 import { langCookie } from './storage/lang-cookie.server';
 import { themeSessionResolver } from './storage/theme-session.server';
 import { appMetaTags } from './utils/meta';
@@ -158,6 +159,8 @@ export function LayoutContent({ children }: { children: React.ReactNode }) {
         <ScrollRestoration />
         <Scripts />
 
+        <RefreshOnFocus />
+
         <script
           dangerouslySetInnerHTML={{
             __html: `window.__ENV__ = ${JSON.stringify(publicEnv)}`,

apps/remix/app/routes/_authenticated+/admin+/documents.$id.tsx

@@ -103,9 +103,7 @@ export default function AdminDocumentDetailsPage({ loaderData }: Route.Component
                 variant="outline"
                 loading={isResealDocumentLoading}
                 disabled={document.recipients.some(
-                  (recipient) =>
+                  (recipient) => recipient.signingStatus !== SigningStatus.SIGNED,
-                    recipient.signingStatus !== SigningStatus.SIGNED &&
-                    recipient.signingStatus !== SigningStatus.REJECTED,
                 )}
                 onClick={() => resealDocument({ id: document.id })}
               >

apps/remix/app/routes/_authenticated+/documents.$id._index.tsx

@@ -13,7 +13,6 @@ import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/g
 import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { DocumentVisibility } from '@documenso/lib/types/document-visibility';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
-import { DocumentReadOnlyFields } from '@documenso/ui/components/document/document-read-only-fields';
 import { Badge } from '@documenso/ui/primitives/badge';
 import { Button } from '@documenso/ui/primitives/button';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
@@ -25,6 +24,7 @@ import { DocumentPageViewDropdown } from '~/components/general/document/document
 import { DocumentPageViewInformation } from '~/components/general/document/document-page-view-information';
 import { DocumentPageViewRecentActivity } from '~/components/general/document/document-page-view-recent-activity';
 import { DocumentPageViewRecipients } from '~/components/general/document/document-page-view-recipients';
+import { DocumentReadOnlyFields } from '~/components/general/document/document-read-only-fields';
 import { DocumentRecipientLinkCopyDialog } from '~/components/general/document/document-recipient-link-copy-dialog';
 import {
   DocumentStatus as DocumentStatusComponent,
@@ -200,14 +200,8 @@ export default function DocumentPage() {
           </CardContent>
         </Card>
 
-        {document.status !== DocumentStatus.COMPLETED && (
+        {document.status === DocumentStatus.PENDING && (
-          <DocumentReadOnlyFields
+          <DocumentReadOnlyFields fields={fields} documentMeta={documentMeta || undefined} />
-            fields={fields}
-            documentMeta={documentMeta || undefined}
-            showRecipientTooltip={true}
-            showRecipientColors={true}
-            recipientIds={recipients.map((recipient) => recipient.id)}
-          />
         )}
 
         <div className="col-span-12 lg:col-span-6 xl:col-span-5">
@@ -226,9 +220,6 @@ export default function DocumentPage() {
                   .with(DocumentStatus.COMPLETED, () => (
                     <Trans>This document has been signed by all recipients</Trans>
                   ))
-                  .with(DocumentStatus.REJECTED, () => (
-                    <Trans>This document has been rejected by a recipient</Trans>
-                  ))
                   .with(DocumentStatus.DRAFT, () => (
                     <Trans>This document is currently a draft and has not been sent</Trans>
                   ))

apps/remix/app/routes/_authenticated+/documents.$id.edit.tsx

@@ -1,5 +1,5 @@
 import { Plural, Trans } from '@lingui/react/macro';
-import { TeamMemberRole } from '@prisma/client';
+import { DocumentStatus as InternalDocumentStatus, TeamMemberRole } from '@prisma/client';
 import { ChevronLeft, Users2 } from 'lucide-react';
 import { Link, redirect } from 'react-router';
 import { match } from 'ts-pattern';
@@ -9,7 +9,6 @@ import { isUserEnterprise } from '@documenso/ee/server-only/util/is-document-ent
 import { getDocumentWithDetailsById } from '@documenso/lib/server-only/document/get-document-with-details-by-id';
 import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { DocumentVisibility } from '@documenso/lib/types/document-visibility';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 
 import { DocumentEditForm } from '~/components/general/document/document-edit-form';
@@ -72,7 +71,7 @@ export async function loader({ params, request }: Route.LoaderArgs) {
     throw redirect(documentRootPath);
   }
 
-  if (isDocumentCompleted(document.status)) {
+  if (document.status === InternalDocumentStatus.COMPLETED) {
     throw redirect(`${documentRootPath}/${documentId}`);
   }
 

apps/remix/app/routes/_authenticated+/documents.$id.logs.tsx

@@ -129,7 +129,7 @@ export default function DocumentsLogsPage({ loaderData }: Route.ComponentProps)
         <Trans>Document</Trans>
       </Link>
 
-      <div className="flex flex-col">
+      <div className="flex flex-col justify-between truncate sm:flex-row">
         <div>
           <h1
             className="mt-4 block max-w-[20rem] truncate text-2xl font-semibold md:max-w-[30rem] md:text-3xl"
@@ -137,8 +137,7 @@ export default function DocumentsLogsPage({ loaderData }: Route.ComponentProps)
           >
             {document.title}
           </h1>
-        </div>
+
-        <div className="mt-1 flex flex-col justify-between sm:flex-row">
           <div className="mt-2.5 flex items-center gap-x-6">
             <DocumentStatusComponent
               inheritColor
@@ -146,6 +145,8 @@ export default function DocumentsLogsPage({ loaderData }: Route.ComponentProps)
               className="text-muted-foreground"
             />
           </div>
+        </div>
+
         <div className="mt-4 flex w-full flex-row sm:mt-0 sm:w-auto sm:self-end">
           <DocumentCertificateDownloadButton
             className="mr-2"
@@ -156,14 +157,13 @@ export default function DocumentsLogsPage({ loaderData }: Route.ComponentProps)
           <DocumentAuditLogDownloadButton documentId={document.id} />
         </div>
       </div>
-      </div>
 
       <section className="mt-6">
         <Card className="grid grid-cols-1 gap-4 p-4 sm:grid-cols-2" degrees={45} gradient>
           {documentInformation.map((info, i) => (
             <div className="text-foreground text-sm" key={i}>
               <h3 className="font-semibold">{_(info.description)}</h3>
-              <p className="text-muted-foreground truncate">{info.value}</p>
+              <p className="text-muted-foreground">{info.value}</p>
             </div>
           ))}
 

apps/remix/app/routes/_authenticated+/documents._index.tsx

@@ -50,7 +50,6 @@ export default function DocumentsPage() {
     [ExtendedDocumentStatus.DRAFT]: 0,
     [ExtendedDocumentStatus.PENDING]: 0,
     [ExtendedDocumentStatus.COMPLETED]: 0,
-    [ExtendedDocumentStatus.REJECTED]: 0,
     [ExtendedDocumentStatus.INBOX]: 0,
     [ExtendedDocumentStatus.ALL]: 0,
   });

apps/remix/app/routes/_authenticated+/templates.$id._index.tsx

@@ -7,7 +7,6 @@ import { getSession } from '@documenso/auth/server/lib/utils/get-session';
 import { type TGetTeamByUrlResponse, getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
 import { getTemplateById } from '@documenso/lib/server-only/template/get-template-by-id';
 import { formatDocumentsPath, formatTemplatesPath } from '@documenso/lib/utils/teams';
-import { DocumentReadOnlyFields } from '@documenso/ui/components/document/document-read-only-fields';
 import { Button } from '@documenso/ui/primitives/button';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { PDFViewer } from '@documenso/ui/primitives/pdf-viewer';
@@ -15,6 +14,7 @@ import { PDFViewer } from '@documenso/ui/primitives/pdf-viewer';
 import { TemplateBulkSendDialog } from '~/components/dialogs/template-bulk-send-dialog';
 import { TemplateDirectLinkDialogWrapper } from '~/components/dialogs/template-direct-link-dialog-wrapper';
 import { TemplateUseDialog } from '~/components/dialogs/template-use-dialog';
+import { DocumentReadOnlyFields } from '~/components/general/document/document-read-only-fields';
 import { TemplateDirectLinkBadge } from '~/components/general/template/template-direct-link-badge';
 import { TemplatePageViewDocumentsTable } from '~/components/general/template/template-page-view-documents-table';
 import { TemplatePageViewInformation } from '~/components/general/template/template-page-view-information';
@@ -151,9 +151,6 @@ export default function TemplatePage() {
         <DocumentReadOnlyFields
           fields={readOnlyFields}
           showFieldStatus={false}
-          showRecipientTooltip={true}
-          showRecipientColors={true}
-          recipientIds={recipients.map((recipient) => recipient.id)}
           documentMeta={mockedDocumentMeta}
         />
 

apps/remix/app/routes/_internal+/[__htmltopdf]+/certificate.tsx

@@ -1,12 +1,11 @@
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
-import { FieldType, SigningStatus } from '@prisma/client';
+import { FieldType } from '@prisma/client';
 import { DateTime } from 'luxon';
 import { redirect } from 'react-router';
 import { match } from 'ts-pattern';
 import { UAParser } from 'ua-parser-js';
 
-import { isDocumentPlatform } from '@documenso/ee/server-only/util/is-document-platform';
 import { APP_I18N_OPTIONS, ZSupportedLanguageCodeSchema } from '@documenso/lib/constants/i18n';
 import {
   RECIPIENT_ROLES_DESCRIPTION,
@@ -60,8 +59,6 @@ export async function loader({ request }: Route.LoaderArgs) {
     throw redirect('/');
   }
 
-  const isPlatformDocument = await isDocumentPlatform(document);
-
   const documentLanguage = ZSupportedLanguageCodeSchema.parse(document.documentMeta?.language);
 
   const auditLogs = await getDocumentCertificateAuditLogs({
@@ -73,7 +70,6 @@ export async function loader({ request }: Route.LoaderArgs) {
   return {
     document,
     documentLanguage,
-    isPlatformDocument,
     auditLogs,
     messages,
   };
@@ -89,7 +85,7 @@ export async function loader({ request }: Route.LoaderArgs) {
  * Update: Maybe <Trans> tags work now after RR7 migration.
  */
 export default function SigningCertificate({ loaderData }: Route.ComponentProps) {
-  const { document, documentLanguage, isPlatformDocument, auditLogs, messages } = loaderData;
+  const { document, documentLanguage, auditLogs, messages } = loaderData;
 
   const { i18n, _ } = useLingui();
 
@@ -163,13 +159,6 @@ export default function SigningCertificate({ loaderData }: Route.ComponentProps)
           log.type === DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED &&
           log.data.recipientId === recipientId,
       ),
-      [DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_REJECTED]: auditLogs[
-        DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_REJECTED
-      ].filter(
-        (log) =>
-          log.type === DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_REJECTED &&
-          log.data.recipientId === recipientId,
-      ),
     };
   };
 
@@ -293,38 +282,21 @@ export default function SigningCertificate({ loaderData }: Route.ComponentProps)
                           </span>
                         </p>
 
-                        {logs.DOCUMENT_RECIPIENT_REJECTED[0] ? (
-                          <p className="text-muted-foreground text-sm print:text-xs">
-                            <span className="font-medium">{_(msg`Rejected`)}:</span>{' '}
-                            <span className="inline-block">
-                              {logs.DOCUMENT_RECIPIENT_REJECTED[0]
-                                ? DateTime.fromJSDate(logs.DOCUMENT_RECIPIENT_REJECTED[0].createdAt)
-                                    .setLocale(APP_I18N_OPTIONS.defaultLocale)
-                                    .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')
-                                : _(msg`Unknown`)}
-                            </span>
-                          </p>
-                        ) : (
                         <p className="text-muted-foreground text-sm print:text-xs">
                           <span className="font-medium">{_(msg`Signed`)}:</span>{' '}
                           <span className="inline-block">
                             {logs.DOCUMENT_RECIPIENT_COMPLETED[0]
-                                ? DateTime.fromJSDate(
+                              ? DateTime.fromJSDate(logs.DOCUMENT_RECIPIENT_COMPLETED[0].createdAt)
-                                    logs.DOCUMENT_RECIPIENT_COMPLETED[0].createdAt,
-                                  )
                                   .setLocale(APP_I18N_OPTIONS.defaultLocale)
                                   .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')
                               : _(msg`Unknown`)}
                           </span>
                         </p>
-                        )}
 
                         <p className="text-muted-foreground text-sm print:text-xs">
                           <span className="font-medium">{_(msg`Reason`)}:</span>{' '}
                           <span className="inline-block">
-                            {recipient.signingStatus === SigningStatus.REJECTED
+                            {_(
-                              ? recipient.rejectionReason
-                              : _(
                               isOwner(recipient.email)
                                 ? FRIENDLY_SIGNING_REASONS['__OWNER__']
                                 : FRIENDLY_SIGNING_REASONS[recipient.role],
@@ -341,7 +313,6 @@ export default function SigningCertificate({ loaderData }: Route.ComponentProps)
         </CardContent>
       </Card>
 
-      {isPlatformDocument && (
       <div className="my-8 flex-row-reverse">
         <div className="flex items-end justify-end gap-x-4">
           <p className="flex-shrink-0 text-sm font-medium print:text-xs">
@@ -351,7 +322,6 @@ export default function SigningCertificate({ loaderData }: Route.ComponentProps)
           <BrandingLogo className="max-h-6 print:max-h-4" />
         </div>
       </div>
-      )}
     </div>
   );
 }

apps/remix/app/routes/_profile+/_layout.tsx

@@ -4,7 +4,7 @@ import { msg } from '@lingui/core/macro';
 import { Trans } from '@lingui/react/macro';
 import { PlusIcon } from 'lucide-react';
 import { ChevronLeft } from 'lucide-react';
-import { Link, Outlet, isRouteErrorResponse } from 'react-router';
+import { Link, Outlet } from 'react-router';
 
 import LogoIcon from '@documenso/assets/logo_icon.png';
 import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
@@ -16,8 +16,6 @@ import { BrandingLogo } from '~/components/general/branding-logo';
 import { GenericErrorLayout } from '~/components/general/generic-error-layout';
 import { appMetaTags } from '~/utils/meta';
 
-import type { Route } from './+types/_layout';
-
 export function meta() {
   return appMetaTags('Profile');
 }
@@ -98,9 +96,7 @@ export default function PublicProfileLayout() {
   );
 }
 
-export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+export function ErrorBoundary() {
-  const errorCode = isRouteErrorResponse(error) ? error.status : 500;
-
   const errorCodeMap = {
     404: {
       subHeading: msg`404 Profile not found`,
@@ -111,7 +107,6 @@ export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
 
   return (
     <GenericErrorLayout
-      errorCode={errorCode}
       errorCodeMap={errorCodeMap}
       secondaryButton={null}
       primaryButton={

apps/remix/app/routes/_recipient+/_layout.tsx

@@ -1,6 +1,6 @@
 import { Trans } from '@lingui/react/macro';
 import { ChevronLeft } from 'lucide-react';
-import { Link, Outlet, isRouteErrorResponse } from 'react-router';
+import { Link, Outlet } from 'react-router';
 
 import { useOptionalSession } from '@documenso/lib/client-only/providers/session';
 import { Button } from '@documenso/ui/primitives/button';
@@ -8,8 +8,6 @@ import { Button } from '@documenso/ui/primitives/button';
 import { Header as AuthenticatedHeader } from '~/components/general/app-header';
 import { GenericErrorLayout } from '~/components/general/generic-error-layout';
 
-import type { Route } from './+types/_layout';
-
 /**
  * A layout to handle scenarios where the user is a recipient of a given resource
  * where we do not care whether they are authenticated or not.
@@ -32,12 +30,9 @@ export default function RecipientLayout() {
   );
 }
 
-export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
+export function ErrorBoundary() {
-  const errorCode = isRouteErrorResponse(error) ? error.status : 500;
-
   return (
     <GenericErrorLayout
-      errorCode={errorCode}
       secondaryButton={null}
       primaryButton={
         <Button asChild className="w-32">

apps/remix/app/routes/_recipient+/d.$token+/_index.tsx

@@ -79,14 +79,7 @@ export default function DirectTemplatePage() {
   const { template, directTemplateRecipient } = data;
 
   return (
-    <DocumentSigningProvider
+    <DocumentSigningProvider email={user?.email} fullName={user?.name} signature={user?.signature}>
-      email={user?.email}
-      fullName={user?.name}
-      signature={user?.signature}
-      typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
-      uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
-      drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
-    >
       <DocumentSigningAuthProvider
         documentAuthOptions={template.authOptions}
         recipient={directTemplateRecipient}

apps/remix/app/routes/_recipient+/sign.$token+/_index.tsx

@@ -1,5 +1,5 @@
 import { Trans } from '@lingui/react/macro';
-import { DocumentSigningOrder, DocumentStatus, RecipientRole, SigningStatus } from '@prisma/client';
+import { DocumentStatus, RecipientRole, SigningStatus } from '@prisma/client';
 import { Clock8 } from 'lucide-react';
 import { Link, redirect } from 'react-router';
 import { getOptionalLoaderContext } from 'server/utils/get-loader-session';
@@ -13,7 +13,6 @@ import { viewedDocument } from '@documenso/lib/server-only/document/viewed-docum
 import { getCompletedFieldsForToken } from '@documenso/lib/server-only/field/get-completed-fields-for-token';
 import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-for-token';
 import { getIsRecipientsTurnToSign } from '@documenso/lib/server-only/recipient/get-is-recipient-turn';
-import { getNextPendingRecipient } from '@documenso/lib/server-only/recipient/get-next-pending-recipient';
 import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { getRecipientSignatures } from '@documenso/lib/server-only/recipient/get-recipient-signatures';
 import { getRecipientsForAssistant } from '@documenso/lib/server-only/recipient/get-recipients-for-assistant';
@@ -73,24 +72,7 @@ export async function loader({ params, request }: Route.LoaderArgs) {
       ? await getRecipientsForAssistant({
           token,
         })
-      : [recipient];
+      : [];
-
-  if (
-    document.documentMeta?.signingOrder === DocumentSigningOrder.SEQUENTIAL &&
-    recipient.role !== RecipientRole.ASSISTANT
-  ) {
-    const nextPendingRecipient = await getNextPendingRecipient({
-      documentId: document.id,
-      currentRecipientId: recipient.id,
-    });
-
-    if (nextPendingRecipient) {
-      allRecipients.push({
-        ...nextPendingRecipient,
-        fields: [],
-      });
-    }
-  }
 
   const { derivedRecipientAccessAuth } = extractDocumentAuthMethods({
     documentAuth: document.authOptions,
@@ -178,7 +160,7 @@ export default function SigningPage() {
     recipientWithFields,
   } = data;
 
-  if (document.deletedAt || document.status === DocumentStatus.REJECTED) {
+  if (document.deletedAt) {
     return (
       <div className="-mx-4 flex max-w-[100vw] flex-col items-center overflow-x-hidden px-4 pt-16 md:-mx-8 md:px-8 lg:pt-16 xl:pt-24">
         <SigningCard3D
@@ -233,9 +215,6 @@ export default function SigningPage() {
       email={recipient.email}
       fullName={user?.email === recipient.email ? user?.name : recipient.name}
       signature={user?.email === recipient.email ? user?.signature : undefined}
-      typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
-      uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
-      drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
     >
       <DocumentSigningAuthProvider
         documentAuthOptions={document.authOptions}

apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx

@@ -17,7 +17,6 @@ import { getFieldsForToken } from '@documenso/lib/server-only/field/get-fields-f
 import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-recipient-by-token';
 import { getRecipientSignatures } from '@documenso/lib/server-only/recipient/get-recipient-signatures';
 import { getUserByEmail } from '@documenso/lib/server-only/user/get-user-by-email';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { env } from '@documenso/lib/utils/env';
 import DocumentDialog from '@documenso/ui/components/document/document-dialog';
 import { DocumentDownloadButton } from '@documenso/ui/components/document/document-download-button';
@@ -206,12 +205,12 @@ export default function CompletedSigningPage({ loaderData }: Route.ComponentProp
           <div className="mt-8 flex w-full max-w-sm items-center justify-center gap-4">
             <DocumentShareButton documentId={document.id} token={recipient.token} />
 
-            {isDocumentCompleted(document.status) ? (
+            {document.status === DocumentStatus.COMPLETED ? (
               <DocumentDownloadButton
                 className="flex-1"
                 fileName={document.title}
                 documentData={document.documentData}
-                disabled={!isDocumentCompleted(document.status)}
+                disabled={document.status !== DocumentStatus.COMPLETED}
               />
             ) : (
               <DocumentDialog
@@ -269,7 +268,7 @@ export const PollUntilDocumentCompleted = ({ document }: PollUntilDocumentComple
   const { revalidate } = useRevalidator();
 
   useEffect(() => {
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return;
     }
 

apps/remix/app/routes/embed+/direct.$url.tsx

@@ -131,14 +131,7 @@ export default function EmbedDirectTemplatePage() {
   } = useSuperLoaderData<typeof loader>();
 
   return (
-    <DocumentSigningProvider
+    <DocumentSigningProvider email={user?.email} fullName={user?.name} signature={user?.signature}>
-      email={user?.email}
-      fullName={user?.name}
-      signature={user?.signature}
-      typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
-      uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
-      drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
-    >
       <DocumentSigningAuthProvider
         documentAuthOptions={template.authOptions}
         recipient={recipient}

apps/remix/app/routes/embed+/sign.$url.tsx

@@ -1,4 +1,4 @@
-import { RecipientRole } from '@prisma/client';
+import { DocumentStatus, RecipientRole } from '@prisma/client';
 import { data } from 'react-router';
 import { match } from 'ts-pattern';
 
@@ -14,7 +14,6 @@ import { getRecipientByToken } from '@documenso/lib/server-only/recipient/get-re
 import { getRecipientsForAssistant } from '@documenso/lib/server-only/recipient/get-recipients-for-assistant';
 import { getTeamById } from '@documenso/lib/server-only/team/get-team';
 import { DocumentAccessAuth } from '@documenso/lib/types/document-auth';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
 
 import { EmbedSignDocumentClientPage } from '~/components/embed/embed-document-signing-page';
@@ -156,9 +155,6 @@ export default function EmbedSignDocumentPage() {
       email={recipient.email}
       fullName={user?.email === recipient.email ? user?.name : recipient.name}
       signature={user?.email === recipient.email ? user?.signature : undefined}
-      typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
-      uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
-      drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
     >
       <DocumentSigningAuthProvider
         documentAuthOptions={document.authOptions}
@@ -172,7 +168,7 @@ export default function EmbedSignDocumentPage() {
           recipient={recipient}
           fields={fields}
           metadata={document.documentMeta}
-          isCompleted={isDocumentCompleted(document.status)}
+          isCompleted={document.status === DocumentStatus.COMPLETED}
           hidePoweredBy={
             isCommunityPlan || isPlatformDocument || isEnterpriseDocument || hidePoweredBy
           }

apps/remix/app/storage/theme-session.server.ts

@@ -12,7 +12,6 @@ const themeSessionStorage = createCookieSessionStorage({
     secrets: ['insecure-secret-do-not-care'],
     secure: useSecureCookies,
     domain: getCookieDomain(),
-    maxAge: 60 * 60 * 24 * 365,
   },
 });
 

apps/remix/package.json

@@ -99,6 +99,5 @@
     "vite": "^6.1.0",
     "vite-plugin-babel-macros": "^1.0.6",
     "vite-tsconfig-paths": "^5.1.4"
-  },
+  }
-  "version": "1.10.0-rc.1"
 }

docker/build.sh

@@ -8,7 +8,6 @@ command -v docker >/dev/null 2>&1 || {
 SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
 MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
 
-# Get Git information
 APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
 GIT_SHA="$(git rev-parse HEAD)"
 
@@ -16,39 +15,12 @@ echo "Building docker image for monorepo at $MONOREPO_ROOT"
 echo "App version: $APP_VERSION"
 echo "Git SHA: $GIT_SHA"
 
-# Build with temporary base tag
 docker build -f "$SCRIPT_DIR/Dockerfile" \
     --progress=plain \
-    -t "documenso-base" \
+    -t "documenso/documenso:latest" \
+    -t "documenso/documenso:$GIT_SHA" \
+    -t "documenso/documenso:$APP_VERSION" \
+    -t "ghcr.io/documenso/documenso:latest" \
+    -t "ghcr.io/documenso/documenso:$GIT_SHA" \
+    -t "ghcr.io/documenso/documenso:$APP_VERSION" \
     "$MONOREPO_ROOT"
-
-# Handle repository tagging
-if [ ! -z "$DOCKER_REPOSITORY" ]; then
-    echo "Using custom repository: $DOCKER_REPOSITORY"
-    
-    # Add tags for custom repository
-    docker tag "documenso-base" "$DOCKER_REPOSITORY:latest"
-    docker tag "documenso-base" "$DOCKER_REPOSITORY:$GIT_SHA"
-
-    # Add version tag if available
-    if [ ! -z "$APP_VERSION" ] && [ "$APP_VERSION" != "undefined" ]; then
-        docker tag "documenso-base" "$DOCKER_REPOSITORY:$APP_VERSION"
-    fi
-else
-    echo "Using default repositories: dockerhub and ghcr.io"
-    
-    # Add tags for both default repositories
-    docker tag "documenso-base" "documenso/documenso:latest"
-    docker tag "documenso-base" "documenso/documenso:$GIT_SHA"
-    docker tag "documenso-base" "ghcr.io/documenso/documenso:latest"
-    docker tag "documenso-base" "ghcr.io/documenso/documenso:$GIT_SHA"
-
-    # Add version tags if available
-    if [ ! -z "$APP_VERSION" ] && [ "$APP_VERSION" != "undefined" ]; then
-        docker tag "documenso-base" "documenso/documenso:$APP_VERSION"
-        docker tag "documenso-base" "ghcr.io/documenso/documenso:$APP_VERSION"
-    fi
-fi
-
-# Remove the temporary base tag
-docker rmi "documenso-base"

docker/buildx.sh

@@ -9,11 +9,11 @@ SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
 MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
 
 # Get the platform from environment variable or set to linux/amd64 if not set
+# quote the string to prevent word splitting
 if [ -z "$PLATFORM" ]; then
     PLATFORM="linux/amd64"
 fi
 
-# Get Git information
 APP_VERSION="$(git name-rev --tags --name-only $(git rev-parse HEAD) | head -n 1 | sed 's/\^0//')"
 GIT_SHA="$(git rev-parse HEAD)"
 
@@ -21,41 +21,14 @@ echo "Building docker image for monorepo at $MONOREPO_ROOT"
 echo "App version: $APP_VERSION"
 echo "Git SHA: $GIT_SHA"
 
-# Build with temporary base tag
 docker buildx build \
     -f "$SCRIPT_DIR/Dockerfile" \
     --platform=$PLATFORM \
     --progress=plain \
-    -t "documenso-base" \
+    -t "documenso/documenso:latest" \
+    -t "documenso/documenso:$GIT_SHA" \
+    -t "documenso/documenso:$APP_VERSION" \
+    -t "ghcr.io/documenso/documenso:latest" \
+    -t "ghcr.io/documenso/documenso:$GIT_SHA" \
+    -t "ghcr.io/documenso/documenso:$APP_VERSION" \
     "$MONOREPO_ROOT"
-
-# Handle repository tagging
-if [ ! -z "$DOCKER_REPOSITORY" ]; then
-    echo "Using custom repository: $DOCKER_REPOSITORY"
-    
-    # Add tags for custom repository
-    docker tag "documenso-base" "$DOCKER_REPOSITORY:latest"
-    docker tag "documenso-base" "$DOCKER_REPOSITORY:$GIT_SHA"
-
-    # Add version tag if available
-    if [ ! -z "$APP_VERSION" ] && [ "$APP_VERSION" != "undefined" ]; then
-        docker tag "documenso-base" "$DOCKER_REPOSITORY:$APP_VERSION"
-    fi
-else
-    echo "Using default repositories: dockerhub and ghcr.io"
-    
-    # Add tags for both default repositories
-    docker tag "documenso-base" "documenso/documenso:latest"
-    docker tag "documenso-base" "documenso/documenso:$GIT_SHA"
-    docker tag "documenso-base" "ghcr.io/documenso/documenso:latest"
-    docker tag "documenso-base" "ghcr.io/documenso/documenso:$GIT_SHA"
-
-    # Add version tags if available
-    if [ ! -z "$APP_VERSION" ] && [ "$APP_VERSION" != "undefined" ]; then
-        docker tag "documenso-base" "documenso/documenso:$APP_VERSION"
-        docker tag "documenso-base" "ghcr.io/documenso/documenso:$APP_VERSION"
-    fi
-fi
-
-# Remove the temporary base tag
-docker rmi "documenso-base"

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "@documenso/root",
-  "version": "1.10.0-rc.1",
+  "version": "1.9.0-rc.11",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@documenso/root",
-      "version": "1.10.0-rc.1",
+      "version": "1.9.0-rc.11",
       "workspaces": [
         "apps/*",
         "packages/*"
@@ -95,7 +95,6 @@
     },
     "apps/remix": {
       "name": "@documenso/remix",
-      "version": "1.10.0-rc.1",
       "dependencies": {
         "@documenso/api": "*",
         "@documenso/assets": "*",

package.json

@@ -1,6 +1,6 @@
 {
   "private": true,
-  "version": "1.10.0-rc.1",
+  "version": "1.9.0-rc.11",
   "scripts": {
     "build": "turbo run build",
     "dev": "turbo run dev --filter=@documenso/remix",
@@ -14,7 +14,7 @@
     "prepare": "husky && husky install || true",
     "commitlint": "commitlint --edit",
     "clean": "turbo run clean && rimraf node_modules",
-    "d": "npm run dx && npm run translate:compile && npm run dev",
+    "d": "npm run dx && npm run dev",
     "dx": "npm i && npm run dx:up && npm run prisma:migrate-dev && npm run prisma:seed",
     "dx:up": "docker compose -f docker/development/compose.yml up -d",
     "dx:down": "docker compose -f docker/development/compose.yml down",

packages/api/v1/implementation.ts

@@ -1,5 +1,5 @@
 import type { Prisma } from '@prisma/client';
-import { DocumentDataType, SigningStatus, TeamMemberRole } from '@prisma/client';
+import { DocumentDataType, DocumentStatus, SigningStatus, TeamMemberRole } from '@prisma/client';
 import { tsr } from '@ts-rest/serverless/fetch';
 import { match } from 'ts-pattern';
 
@@ -50,7 +50,6 @@ import {
   getPresignGetUrl,
   getPresignPostUrl,
 } from '@documenso/lib/universal/upload/server-actions';
-import { isDocumentCompleted } from '@documenso/lib/utils/document';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
 
@@ -177,7 +176,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
         };
       }
 
-      if (!isDocumentCompleted(document.status)) {
+      if (document.status !== DocumentStatus.COMPLETED) {
         return {
           status: 400,
           body: {
@@ -323,11 +322,8 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
         dateFormat: dateFormat?.value,
         redirectUrl: body.meta.redirectUrl,
         signingOrder: body.meta.signingOrder,
-        allowDictateNextSigner: body.meta.allowDictateNextSigner,
         language: body.meta.language,
         typedSignatureEnabled: body.meta.typedSignatureEnabled,
-        uploadSignatureEnabled: body.meta.uploadSignatureEnabled,
-        drawSignatureEnabled: body.meta.drawSignatureEnabled,
         distributionMethod: body.meta.distributionMethod,
         emailSettings: body.meta.emailSettings,
         requestMetadata: metadata,
@@ -584,7 +580,6 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
         userId: user.id,
         teamId: team?.id,
         recipients: body.recipients,
-        prefillFields: body.prefillFields,
         override: {
           title: body.title,
           ...body.meta,
@@ -673,7 +668,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
         };
       }
 
-      if (isDocumentCompleted(document.status)) {
+      if (document.status === DocumentStatus.COMPLETED) {
         return {
           status: 400,
           body: {
@@ -776,7 +771,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: {
@@ -867,7 +862,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: {
@@ -926,7 +921,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: {
@@ -991,7 +986,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: { message: 'Document is already completed' },
@@ -1153,7 +1148,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: {
@@ -1241,7 +1236,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
       };
     }
 
-    if (isDocumentCompleted(document.status)) {
+    if (document.status === DocumentStatus.COMPLETED) {
       return {
         status: 400,
         body: {

packages/api/v1/schema.ts

@@ -23,7 +23,7 @@ import {
   ZRecipientActionAuthTypesSchema,
 } from '@documenso/lib/types/document-auth';
 import { ZDocumentEmailSettingsSchema } from '@documenso/lib/types/document-email';
-import { ZFieldMetaPrefillFieldsSchema, ZFieldMetaSchema } from '@documenso/lib/types/field-meta';
+import { ZFieldMetaSchema } from '@documenso/lib/types/field-meta';
 
 extendZodWithOpenApi(z);
 
@@ -96,7 +96,7 @@ export const ZSendDocumentForSigningMutationSchema = z
         'Whether to send completion emails when the document is fully signed. This will override the document email settings.',
     }),
   })
-  .or(z.any().transform(() => ({ sendEmail: true, sendCompletionEmails: undefined })));
+  .or(z.literal('').transform(() => ({ sendEmail: true, sendCompletionEmails: undefined })));
 
 export type TSendDocumentForSigningMutationSchema = typeof ZSendDocumentForSigningMutationSchema;
 
@@ -155,11 +155,8 @@ export const ZCreateDocumentMutationSchema = z.object({
         }),
       redirectUrl: z.string(),
       signingOrder: z.nativeEnum(DocumentSigningOrder).optional(),
-      allowDictateNextSigner: z.boolean().optional(),
       language: z.enum(SUPPORTED_LANGUAGE_CODES).optional(),
       typedSignatureEnabled: z.boolean().optional().default(true),
-      uploadSignatureEnabled: z.boolean().optional().default(true),
-      drawSignatureEnabled: z.boolean().optional().default(true),
       distributionMethod: z.nativeEnum(DocumentDistributionMethod).optional(),
       emailSettings: ZDocumentEmailSettingsSchema.optional(),
     })
@@ -221,7 +218,6 @@ export const ZCreateDocumentFromTemplateMutationSchema = z.object({
       dateFormat: z.string(),
       redirectUrl: z.string(),
       signingOrder: z.nativeEnum(DocumentSigningOrder).optional(),
-      allowDictateNextSigner: z.boolean().optional(),
       language: z.enum(SUPPORTED_LANGUAGE_CODES).optional(),
     })
     .partial()
@@ -289,12 +285,9 @@ export const ZGenerateDocumentFromTemplateMutationSchema = z.object({
       dateFormat: z.string(),
       redirectUrl: ZUrlSchema,
       signingOrder: z.nativeEnum(DocumentSigningOrder),
-      allowDictateNextSigner: z.boolean(),
       language: z.enum(SUPPORTED_LANGUAGE_CODES),
       distributionMethod: z.nativeEnum(DocumentDistributionMethod),
       typedSignatureEnabled: z.boolean(),
-      uploadSignatureEnabled: z.boolean(),
-      drawSignatureEnabled: z.boolean(),
       emailSettings: ZDocumentEmailSettingsSchema,
     })
     .partial()
@@ -306,7 +299,6 @@ export const ZGenerateDocumentFromTemplateMutationSchema = z.object({
     })
     .optional(),
   formValues: z.record(z.string(), z.union([z.string(), z.boolean(), z.number()])).optional(),
-  prefillFields: z.array(ZFieldMetaPrefillFieldsSchema).optional(),
 });
 
 export type TGenerateDocumentFromTemplateMutationSchema = z.infer<

packages/app-tests/e2e/api/v1/template-field-prefill.spec.ts

@@ -1,614 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
-import type { TCheckboxFieldMeta, TRadioFieldMeta } from '@documenso/lib/types/field-meta';
-import { prisma } from '@documenso/prisma';
-import { FieldType, RecipientRole } from '@documenso/prisma/client';
-import { seedBlankTemplate } from '@documenso/prisma/seed/templates';
-import { seedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin } from '../../fixtures/authentication';
-
-const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
-
-test.describe('Template Field Prefill API v1', () => {
-  test('should create a document from template with prefilled fields', async ({
-    page,
-    request,
-  }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template with seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template with Advanced Fields',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add fields to the template
-    // Add TEXT field
-    const textField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.TEXT,
-        page: 1,
-        positionX: 5,
-        positionY: 5,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'text',
-          label: 'Text Field',
-        },
-      },
-    });
-
-    // Add NUMBER field
-    const numberField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.NUMBER,
-        page: 1,
-        positionX: 5,
-        positionY: 15,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'number',
-          label: 'Number Field',
-        },
-      },
-    });
-
-    // Add RADIO field
-    const radioField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.RADIO,
-        page: 1,
-        positionX: 5,
-        positionY: 25,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'radio',
-          label: 'Radio Field',
-          values: [
-            { id: 1, value: 'Option A', checked: false },
-            { id: 2, value: 'Option B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // Add CHECKBOX field
-    const checkboxField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.CHECKBOX,
-        page: 1,
-        positionX: 5,
-        positionY: 35,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'checkbox',
-          label: 'Checkbox Field',
-          values: [
-            { id: 1, value: 'Check A', checked: false },
-            { id: 2, value: 'Check B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // Add DROPDOWN field
-    const dropdownField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.DROPDOWN,
-        page: 1,
-        positionX: 5,
-        positionY: 45,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'dropdown',
-          label: 'Dropdown Field',
-          values: [{ value: 'Select A' }, { value: 'Select B' }],
-        },
-      },
-    });
-
-    // 6. Sign in as the user
-    await apiSignin({
-      page,
-      email: user.email,
-    });
-
-    // 7. Navigate to the template
-    await page.goto(`${WEBAPP_BASE_URL}/templates/${template.id}`);
-
-    // 8. Create a document from the template with prefilled fields
-    const response = await request.post(
-      `${WEBAPP_BASE_URL}/api/v1/templates/${template.id}/generate-document`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'Content-Type': 'application/json',
-        },
-        data: {
-          title: 'Document with Prefilled Fields',
-          recipients: [
-            {
-              id: recipient.id,
-              email: 'recipient@example.com',
-              name: 'Test Recipient',
-              role: 'SIGNER',
-            },
-          ],
-          prefillFields: [
-            {
-              id: textField.id,
-              type: 'text',
-              label: 'Prefilled Text',
-              value: 'This is prefilled text',
-            },
-            {
-              id: numberField.id,
-              type: 'number',
-              label: 'Prefilled Number',
-              value: '42',
-            },
-            {
-              id: radioField.id,
-              type: 'radio',
-              label: 'Prefilled Radio',
-              value: 'Option A',
-            },
-            {
-              id: checkboxField.id,
-              type: 'checkbox',
-              label: 'Prefilled Checkbox',
-              value: ['Check A', 'Check B'],
-            },
-            {
-              id: dropdownField.id,
-              type: 'dropdown',
-              label: 'Prefilled Dropdown',
-              value: 'Select B',
-            },
-          ],
-        },
-      },
-    );
-    const responseData = await response.json();
-
-    expect(response.ok()).toBeTruthy();
-    expect(response.status()).toBe(200);
-
-    expect(responseData.documentId).toBeDefined();
-
-    // 9. Verify the document was created with prefilled fields
-    const document = await prisma.document.findUnique({
-      where: {
-        id: responseData.documentId,
-      },
-      include: {
-        fields: true,
-      },
-    });
-
-    expect(document).not.toBeNull();
-
-    // 10. Verify each field has the correct prefilled values
-    const documentTextField = document?.fields.find(
-      (field) => field.type === FieldType.TEXT && field.fieldMeta?.type === 'text',
-    );
-    expect(documentTextField?.fieldMeta).toMatchObject({
-      type: 'text',
-      label: 'Prefilled Text',
-      text: 'This is prefilled text',
-    });
-
-    const documentNumberField = document?.fields.find(
-      (field) => field.type === FieldType.NUMBER && field.fieldMeta?.type === 'number',
-    );
-    expect(documentNumberField?.fieldMeta).toMatchObject({
-      type: 'number',
-      label: 'Prefilled Number',
-      value: '42',
-    });
-
-    const documentRadioField = document?.fields.find(
-      (field) => field.type === FieldType.RADIO && field.fieldMeta?.type === 'radio',
-    );
-    expect(documentRadioField?.fieldMeta).toMatchObject({
-      type: 'radio',
-      label: 'Prefilled Radio',
-    });
-    // Check that the correct radio option is selected
-    const radioValues = (documentRadioField?.fieldMeta as TRadioFieldMeta)?.values || [];
-    const selectedRadioOption = radioValues.find((option) => option.checked);
-    expect(selectedRadioOption?.value).toBe('Option A');
-
-    const documentCheckboxField = document?.fields.find(
-      (field) => field.type === FieldType.CHECKBOX && field.fieldMeta?.type === 'checkbox',
-    );
-    expect(documentCheckboxField?.fieldMeta).toMatchObject({
-      type: 'checkbox',
-      label: 'Prefilled Checkbox',
-    });
-    // Check that the correct checkbox options are selected
-    const checkboxValues = (documentCheckboxField?.fieldMeta as TCheckboxFieldMeta)?.values || [];
-    const checkedOptions = checkboxValues.filter((option) => option.checked);
-    expect(checkedOptions.length).toBe(2);
-    expect(checkedOptions.map((option) => option.value)).toContain('Check A');
-    expect(checkedOptions.map((option) => option.value)).toContain('Check B');
-
-    const documentDropdownField = document?.fields.find(
-      (field) => field.type === FieldType.DROPDOWN && field.fieldMeta?.type === 'dropdown',
-    );
-    expect(documentDropdownField?.fieldMeta).toMatchObject({
-      type: 'dropdown',
-      label: 'Prefilled Dropdown',
-      defaultValue: 'Select B',
-    });
-
-    // 11. Sign in as the recipient and verify the prefilled fields are visible
-    const documentRecipient = await prisma.recipient.findFirst({
-      where: {
-        documentId: document?.id,
-        email: 'recipient@example.com',
-      },
-    });
-
-    // Send the document to the recipient
-    const sendResponse = await request.post(
-      `${WEBAPP_BASE_URL}/api/v1/documents/${document?.id}/send`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'Content-Type': 'application/json',
-        },
-        data: {
-          sendEmail: false,
-        },
-      },
-    );
-
-    expect(sendResponse.ok()).toBeTruthy();
-    expect(sendResponse.status()).toBe(200);
-
-    expect(documentRecipient).not.toBeNull();
-
-    // Visit the signing page
-    await page.goto(`${WEBAPP_BASE_URL}/sign/${documentRecipient?.token}`);
-
-    // Verify the prefilled fields are visible with correct values
-    // Text field
-    await expect(page.getByText('This is prefilled')).toBeVisible();
-
-    // Number field
-    await expect(page.getByText('42')).toBeVisible();
-
-    // Radio field
-    await expect(page.getByText('Option A')).toBeVisible();
-    await expect(page.getByRole('radio', { name: 'Option A' })).toBeChecked();
-
-    // Checkbox field
-    await expect(page.getByText('Check A')).toBeVisible();
-    await expect(page.getByText('Check B')).toBeVisible();
-    await expect(page.getByRole('checkbox', { name: 'Check A' })).toBeChecked();
-    await expect(page.getByRole('checkbox', { name: 'Check B' })).toBeChecked();
-
-    // Dropdown field
-    await expect(page.getByText('Select B')).toBeVisible();
-  });
-
-  test('should create a document from template without prefilled fields', async ({
-    page,
-    request,
-  }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template with seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template with Default Fields',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add fields to the template
-    // Add TEXT field
-    const textField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.TEXT,
-        page: 1,
-        positionX: 5,
-        positionY: 5,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'text',
-          label: 'Default Text Field',
-        },
-      },
-    });
-
-    // Add NUMBER field
-    const numberField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.NUMBER,
-        page: 1,
-        positionX: 5,
-        positionY: 15,
-        width: 10,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'number',
-          label: 'Default Number Field',
-        },
-      },
-    });
-
-    // 6. Sign in as the user
-    await apiSignin({
-      page,
-      email: user.email,
-    });
-
-    // 7. Navigate to the template
-    await page.goto(`${WEBAPP_BASE_URL}/templates/${template.id}`);
-
-    // 8. Create a document from the template without prefilled fields
-    const response = await request.post(
-      `${WEBAPP_BASE_URL}/api/v1/templates/${template.id}/generate-document`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'Content-Type': 'application/json',
-        },
-        data: {
-          title: 'Document with Default Fields',
-          recipients: [
-            {
-              id: recipient.id,
-              email: 'recipient@example.com',
-              name: 'Test Recipient',
-              role: 'SIGNER',
-            },
-          ],
-        },
-      },
-    );
-
-    const responseData = await response.json();
-
-    expect(response.ok()).toBeTruthy();
-    expect(response.status()).toBe(200);
-
-    expect(responseData.documentId).toBeDefined();
-
-    // 9. Verify the document was created with default fields
-    const document = await prisma.document.findUnique({
-      where: {
-        id: responseData.documentId,
-      },
-      include: {
-        fields: true,
-      },
-    });
-
-    expect(document).not.toBeNull();
-
-    // 10. Verify fields have their default values
-    const documentTextField = document?.fields.find((field) => field.type === FieldType.TEXT);
-    expect(documentTextField?.fieldMeta).toMatchObject({
-      type: 'text',
-      label: 'Default Text Field',
-    });
-
-    const documentNumberField = document?.fields.find((field) => field.type === FieldType.NUMBER);
-    expect(documentNumberField?.fieldMeta).toMatchObject({
-      type: 'number',
-      label: 'Default Number Field',
-    });
-
-    // 11. Sign in as the recipient and verify the default fields are visible
-    const documentRecipient = await prisma.recipient.findFirst({
-      where: {
-        documentId: document?.id,
-        email: 'recipient@example.com',
-      },
-    });
-
-    expect(documentRecipient).not.toBeNull();
-
-    const sendResponse = await request.post(
-      `${WEBAPP_BASE_URL}/api/v1/documents/${document?.id}/send`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'Content-Type': 'application/json',
-        },
-        data: {
-          sendEmail: false,
-        },
-      },
-    );
-
-    expect(sendResponse.ok()).toBeTruthy();
-    expect(sendResponse.status()).toBe(200);
-
-    // Visit the signing page
-    await page.goto(`${WEBAPP_BASE_URL}/sign/${documentRecipient?.token}`);
-
-    // Verify the default fields are visible with correct labels
-    await expect(page.getByText('Default Text Field')).toBeVisible();
-    await expect(page.getByText('Default Number Field')).toBeVisible();
-  });
-
-  test('should handle invalid field prefill values', async ({ request }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template using seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template for Invalid Test',
-        visibility: 'EVERYONE',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add a field to the template
-    const field = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.RADIO,
-        page: 1,
-        positionX: 100,
-        positionY: 100,
-        width: 100,
-        height: 50,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'radio',
-          label: 'Radio Field',
-          values: [
-            { id: 1, value: 'Option A', checked: false },
-            { id: 2, value: 'Option B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // 6. Try to create a document with invalid prefill value
-    const response = await request.post(
-      `${WEBAPP_BASE_URL}/api/v1/templates/${template.id}/generate-document`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'Content-Type': 'application/json',
-        },
-        data: {
-          title: 'Document with Invalid Prefill',
-          recipients: [
-            {
-              id: recipient.id,
-              email: 'recipient@example.com',
-              name: 'Test Recipient',
-              role: 'SIGNER',
-            },
-          ],
-          prefillFields: [
-            {
-              id: field.id,
-              type: 'radio',
-              label: 'Invalid Radio',
-              value: 'Non-existent Option', // This option doesn't exist
-            },
-          ],
-        },
-      },
-    );
-
-    // 7. Verify the request fails with appropriate error
-    expect(response.ok()).toBeFalsy();
-    expect(response.status()).toBe(400);
-
-    const errorData = await response.json();
-    expect(errorData.message).toContain('not found in options for RADIO field');
-  });
-});

packages/app-tests/e2e/api/v2/template-field-prefill.spec.ts

@@ -1,602 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
-import type { TCheckboxFieldMeta, TRadioFieldMeta } from '@documenso/lib/types/field-meta';
-import { prisma } from '@documenso/prisma';
-import { FieldType, RecipientRole } from '@documenso/prisma/client';
-import { seedBlankTemplate } from '@documenso/prisma/seed/templates';
-import { seedUser } from '@documenso/prisma/seed/users';
-
-import { apiSignin } from '../../fixtures/authentication';
-
-const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
-
-test.describe('Template Field Prefill API v2', () => {
-  test('should create a document from template with prefilled fields', async ({
-    page,
-    request,
-  }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template with seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template with Advanced Fields V2',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add fields to the template
-    // Add TEXT field
-    const textField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.TEXT,
-        page: 1,
-        positionX: 5,
-        positionY: 5,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'text',
-          label: 'Text Field',
-        },
-      },
-    });
-
-    // Add NUMBER field
-    const numberField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.NUMBER,
-        page: 1,
-        positionX: 5,
-        positionY: 15,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'number',
-          label: 'Number Field',
-        },
-      },
-    });
-
-    // Add RADIO field
-    const radioField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.RADIO,
-        page: 1,
-        positionX: 5,
-        positionY: 25,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'radio',
-          label: 'Radio Field',
-          values: [
-            { id: 1, value: 'Option A', checked: false },
-            { id: 2, value: 'Option B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // Add CHECKBOX field
-    const checkboxField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.CHECKBOX,
-        page: 1,
-        positionX: 5,
-        positionY: 35,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'checkbox',
-          label: 'Checkbox Field',
-          values: [
-            { id: 1, value: 'Check A', checked: false },
-            { id: 2, value: 'Check B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // Add DROPDOWN field
-    const dropdownField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.DROPDOWN,
-        page: 1,
-        positionX: 5,
-        positionY: 45,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'dropdown',
-          label: 'Dropdown Field',
-          values: [{ value: 'Select A' }, { value: 'Select B' }],
-        },
-      },
-    });
-
-    // 6. Sign in as the user
-    await apiSignin({
-      page,
-      email: user.email,
-    });
-
-    // 7. Navigate to the template
-    await page.goto(`${WEBAPP_BASE_URL}/templates/${template.id}`);
-
-    // 8. Create a document from the template with prefilled fields using v2 API
-    const response = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
-      headers: {
-        Authorization: `Bearer ${token}`,
-        'Content-Type': 'application/json',
-      },
-      data: {
-        templateId: template.id,
-        recipients: [
-          {
-            id: recipient.id,
-            email: 'recipient@example.com',
-            name: 'Test Recipient',
-          },
-        ],
-        prefillFields: [
-          {
-            id: textField.id,
-            type: 'text',
-            label: 'Prefilled Text',
-            value: 'This is prefilled text',
-          },
-          {
-            id: numberField.id,
-            type: 'number',
-            label: 'Prefilled Number',
-            value: '42',
-          },
-          {
-            id: radioField.id,
-            type: 'radio',
-            label: 'Prefilled Radio',
-            value: 'Option A',
-          },
-          {
-            id: checkboxField.id,
-            type: 'checkbox',
-            label: 'Prefilled Checkbox',
-            value: ['Check A', 'Check B'],
-          },
-          {
-            id: dropdownField.id,
-            type: 'dropdown',
-            label: 'Prefilled Dropdown',
-            value: 'Select B',
-          },
-        ],
-      },
-    });
-
-    const responseData = await response.json();
-
-    expect(response.ok()).toBeTruthy();
-    expect(response.status()).toBe(200);
-
-    expect(responseData.id).toBeDefined();
-
-    // 9. Verify the document was created with prefilled fields
-    const document = await prisma.document.findUnique({
-      where: {
-        id: responseData.id,
-      },
-      include: {
-        fields: true,
-      },
-    });
-
-    expect(document).not.toBeNull();
-
-    // 10. Verify each field has the correct prefilled values
-    const documentTextField = document?.fields.find(
-      (field) => field.type === FieldType.TEXT && field.fieldMeta?.type === 'text',
-    );
-    expect(documentTextField?.fieldMeta).toMatchObject({
-      type: 'text',
-      label: 'Prefilled Text',
-      text: 'This is prefilled text',
-    });
-
-    const documentNumberField = document?.fields.find(
-      (field) => field.type === FieldType.NUMBER && field.fieldMeta?.type === 'number',
-    );
-    expect(documentNumberField?.fieldMeta).toMatchObject({
-      type: 'number',
-      label: 'Prefilled Number',
-      value: '42',
-    });
-
-    const documentRadioField = document?.fields.find(
-      (field) => field.type === FieldType.RADIO && field.fieldMeta?.type === 'radio',
-    );
-    expect(documentRadioField?.fieldMeta).toMatchObject({
-      type: 'radio',
-      label: 'Prefilled Radio',
-    });
-    // Check that the correct radio option is selected
-    const radioValues = (documentRadioField?.fieldMeta as TRadioFieldMeta)?.values || [];
-    const selectedRadioOption = radioValues.find((option) => option.checked);
-    expect(selectedRadioOption?.value).toBe('Option A');
-
-    const documentCheckboxField = document?.fields.find(
-      (field) => field.type === FieldType.CHECKBOX && field.fieldMeta?.type === 'checkbox',
-    );
-    expect(documentCheckboxField?.fieldMeta).toMatchObject({
-      type: 'checkbox',
-      label: 'Prefilled Checkbox',
-    });
-    // Check that the correct checkbox options are selected
-    const checkboxValues = (documentCheckboxField?.fieldMeta as TCheckboxFieldMeta)?.values || [];
-    const checkedOptions = checkboxValues.filter((option) => option.checked);
-    expect(checkedOptions.length).toBe(2);
-    expect(checkedOptions.map((option) => option.value)).toContain('Check A');
-    expect(checkedOptions.map((option) => option.value)).toContain('Check B');
-
-    const documentDropdownField = document?.fields.find(
-      (field) => field.type === FieldType.DROPDOWN && field.fieldMeta?.type === 'dropdown',
-    );
-    expect(documentDropdownField?.fieldMeta).toMatchObject({
-      type: 'dropdown',
-      label: 'Prefilled Dropdown',
-      defaultValue: 'Select B',
-    });
-
-    const sendResponse = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/document/distribute`, {
-      headers: {
-        Authorization: `Bearer ${token}`,
-        'Content-Type': 'application/json',
-      },
-      data: {
-        documentId: document?.id,
-        meta: {
-          subject: 'Test Subject',
-          message: 'Test Message',
-        },
-      },
-    });
-
-    await expect(sendResponse.ok()).toBeTruthy();
-    await expect(sendResponse.status()).toBe(200);
-
-    // 11. Sign in as the recipient and verify the prefilled fields are visible
-    const documentRecipient = await prisma.recipient.findFirst({
-      where: {
-        documentId: document?.id,
-        email: 'recipient@example.com',
-      },
-    });
-
-    expect(documentRecipient).not.toBeNull();
-
-    // Visit the signing page
-    await page.goto(`${WEBAPP_BASE_URL}/sign/${documentRecipient?.token}`);
-
-    // Verify the prefilled fields are visible with correct values
-    // Text field
-    await expect(page.getByText('This is prefilled')).toBeVisible();
-
-    // Number field
-    await expect(page.getByText('42')).toBeVisible();
-
-    // Radio field
-    await expect(page.getByText('Option A')).toBeVisible();
-    await expect(page.getByRole('radio', { name: 'Option A' })).toBeChecked();
-
-    // Checkbox field
-    await expect(page.getByText('Check A')).toBeVisible();
-    await expect(page.getByText('Check B')).toBeVisible();
-    await expect(page.getByRole('checkbox', { name: 'Check A' })).toBeChecked();
-    await expect(page.getByRole('checkbox', { name: 'Check B' })).toBeChecked();
-
-    // Dropdown field
-    await expect(page.getByText('Select B')).toBeVisible();
-  });
-
-  test('should create a document from template without prefilled fields', async ({
-    page,
-    request,
-  }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template with seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template with Default Fields V2',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add fields to the template
-    // Add TEXT field
-    const textField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.TEXT,
-        page: 1,
-        positionX: 5,
-        positionY: 5,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'text',
-          label: 'Default Text Field',
-        },
-      },
-    });
-
-    // Add NUMBER field
-    const numberField = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.NUMBER,
-        page: 1,
-        positionX: 5,
-        positionY: 15,
-        width: 20,
-        height: 5,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'number',
-          label: 'Default Number Field',
-        },
-      },
-    });
-
-    // 6. Sign in as the user
-    await apiSignin({
-      page,
-      email: user.email,
-    });
-
-    // 7. Navigate to the template
-    await page.goto(`${WEBAPP_BASE_URL}/templates/${template.id}`);
-
-    // 8. Create a document from the template without prefilled fields using v2 API
-    const response = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
-      headers: {
-        Authorization: `Bearer ${token}`,
-        'Content-Type': 'application/json',
-      },
-      data: {
-        templateId: template.id,
-        recipients: [
-          {
-            id: recipient.id,
-            email: 'recipient@example.com',
-            name: 'Test Recipient',
-          },
-        ],
-      },
-    });
-
-    const responseData = await response.json();
-
-    expect(response.ok()).toBeTruthy();
-    expect(response.status()).toBe(200);
-
-    expect(responseData.id).toBeDefined();
-
-    // 9. Verify the document was created with default fields
-    const document = await prisma.document.findUnique({
-      where: {
-        id: responseData.id,
-      },
-      include: {
-        fields: true,
-      },
-    });
-
-    expect(document).not.toBeNull();
-
-    // 10. Verify fields have their default values
-    const documentTextField = document?.fields.find((field) => field.type === FieldType.TEXT);
-    expect(documentTextField?.fieldMeta).toMatchObject({
-      type: 'text',
-      label: 'Default Text Field',
-    });
-
-    const documentNumberField = document?.fields.find((field) => field.type === FieldType.NUMBER);
-    expect(documentNumberField?.fieldMeta).toMatchObject({
-      type: 'number',
-      label: 'Default Number Field',
-    });
-
-    const sendResponse = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/document/distribute`, {
-      headers: {
-        Authorization: `Bearer ${token}`,
-        'Content-Type': 'application/json',
-      },
-      data: {
-        documentId: document?.id,
-        meta: {
-          subject: 'Test Subject',
-          message: 'Test Message',
-        },
-      },
-    });
-
-    await expect(sendResponse.ok()).toBeTruthy();
-    await expect(sendResponse.status()).toBe(200);
-
-    // 11. Sign in as the recipient and verify the default fields are visible
-    const documentRecipient = await prisma.recipient.findFirst({
-      where: {
-        documentId: document?.id,
-        email: 'recipient@example.com',
-      },
-    });
-
-    expect(documentRecipient).not.toBeNull();
-
-    // Visit the signing page
-    await page.goto(`${WEBAPP_BASE_URL}/sign/${documentRecipient?.token}`);
-
-    await expect(page.getByText('This is prefilled')).not.toBeVisible();
-  });
-
-  test('should handle invalid field prefill values', async ({ request }) => {
-    // 1. Create a user
-    const user = await seedUser();
-
-    // 2. Create an API token for the user
-    const { token } = await createApiToken({
-      userId: user.id,
-      tokenName: 'test-token',
-      expiresIn: null,
-    });
-
-    // 3. Create a template using seedBlankTemplate
-    const template = await seedBlankTemplate(user, {
-      createTemplateOptions: {
-        title: 'Template for Invalid Test V2',
-        visibility: 'EVERYONE',
-      },
-    });
-
-    // 4. Create a recipient for the template
-    const recipient = await prisma.recipient.create({
-      data: {
-        templateId: template.id,
-        email: 'recipient@example.com',
-        name: 'Test Recipient',
-        role: RecipientRole.SIGNER,
-        token: 'test-token',
-        readStatus: 'NOT_OPENED',
-        sendStatus: 'NOT_SENT',
-        signingStatus: 'NOT_SIGNED',
-      },
-    });
-
-    // 5. Add a field to the template
-    const field = await prisma.field.create({
-      data: {
-        templateId: template.id,
-        recipientId: recipient.id,
-        type: FieldType.RADIO,
-        page: 1,
-        positionX: 100,
-        positionY: 100,
-        width: 100,
-        height: 50,
-        customText: '',
-        inserted: false,
-        fieldMeta: {
-          type: 'radio',
-          label: 'Radio Field',
-          values: [
-            { id: 1, value: 'Option A', checked: false },
-            { id: 2, value: 'Option B', checked: false },
-          ],
-        },
-      },
-    });
-
-    // 7. Try to create a document with invalid prefill value
-    const response = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
-      headers: {
-        Authorization: `Bearer ${token}`,
-        'Content-Type': 'application/json',
-      },
-      data: {
-        templateId: template.id,
-        recipients: [
-          {
-            id: recipient.id,
-            email: 'recipient@example.com',
-            name: 'Test Recipient',
-          },
-        ],
-        prefillFields: [
-          {
-            id: field.id,
-            type: 'radio',
-            label: 'Invalid Radio',
-            value: 'Non-existent Option', // This option doesn't exist
-          },
-        ],
-      },
-    });
-
-    // 8. Verify the request fails with appropriate error
-    expect(response.ok()).toBeFalsy();
-    expect(response.status()).toBe(400);
-
-    const errorData = await response.json();
-    expect(errorData.message).toContain('not found in options for RADIO field');
-  });
-});

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

@@ -210,7 +210,7 @@ test('[DOCUMENT_AUTH]: should allow field signing when required for recipient au
         }),
       },
     ],
-    fields: [FieldType.DATE, FieldType.SIGNATURE],
+    fields: [FieldType.DATE],
   });
 
   for (const recipient of recipients) {
@@ -246,9 +246,7 @@ test('[DOCUMENT_AUTH]: should allow field signing when required for recipient au
       });
     }
 
-    if (fields.some((field) => field.type === FieldType.SIGNATURE)) {
     await signSignaturePad(page);
-    }
 
     for (const field of fields) {
       await page.locator(`#field-${field.id}`).getByRole('button').click();
@@ -309,7 +307,7 @@ test('[DOCUMENT_AUTH]: should allow field signing when required for recipient an
         }),
       },
     ],
-    fields: [FieldType.DATE, FieldType.SIGNATURE],
+    fields: [FieldType.DATE],
     updateDocumentOptions: {
       authOptions: createDocumentAuthOptions({
         globalAccessAuth: null,
@@ -351,9 +349,7 @@ test('[DOCUMENT_AUTH]: should allow field signing when required for recipient an
       });
     }
 
-    if (fields.some((field) => field.type === FieldType.SIGNATURE)) {
     await signSignaturePad(page);
-    }
 
     for (const field of fields) {
       await page.locator(`#field-${field.id}`).getByRole('button').click();

packages/app-tests/e2e/document-auth/next-recipient-dictation.spec.ts

@@ -1,390 +0,0 @@
-import { expect, test } from '@playwright/test';
-import {
-  DocumentSigningOrder,
-  DocumentStatus,
-  FieldType,
-  RecipientRole,
-  SigningStatus,
-} from '@prisma/client';
-
-import { prisma } from '@documenso/prisma';
-import { seedPendingDocumentWithFullFields } from '@documenso/prisma/seed/documents';
-import { seedUser } from '@documenso/prisma/seed/users';
-
-import { signDirectSignaturePad, signSignaturePad } from '../fixtures/signature';
-
-test('[NEXT_RECIPIENT_DICTATION]: should allow updating next recipient when dictation is enabled', async ({
-  page,
-}) => {
-  const user = await seedUser();
-  const firstSigner = await seedUser();
-  const secondSigner = await seedUser();
-  const thirdSigner = await seedUser();
-
-  const { recipients, document } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [firstSigner, secondSigner, thirdSigner],
-    recipientsCreateOptions: [{ signingOrder: 1 }, { signingOrder: 2 }, { signingOrder: 3 }],
-    updateDocumentOptions: {
-      documentMeta: {
-        upsert: {
-          create: {
-            allowDictateNextSigner: true,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-          update: {
-            allowDictateNextSigner: true,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-        },
-      },
-    },
-  });
-
-  const firstRecipient = recipients[0];
-  const { token, fields } = firstRecipient;
-
-  const signUrl = `/sign/${token}`;
-
-  await page.goto(signUrl);
-  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-  await signSignaturePad(page);
-
-  // Fill in all fields
-  for (const field of fields) {
-    await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-    if (field.type === FieldType.TEXT) {
-      await page.locator('#custom-text').fill('TEXT');
-      await page.getByRole('button', { name: 'Save' }).click();
-    }
-
-    await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-  }
-
-  // Complete signing and update next recipient
-  await page.getByRole('button', { name: 'Complete' }).click();
-
-  // Verify next recipient info is shown
-  await expect(page.getByRole('dialog')).toBeVisible();
-  await expect(page.getByText('The next recipient to sign this document will be')).toBeVisible();
-
-  // Update next recipient
-  await page.locator('button').filter({ hasText: 'Update Recipient' }).click();
-  await page.waitForTimeout(1000);
-
-  // Use dialog context to ensure we're targeting the correct form fields
-  const dialog = page.getByRole('dialog');
-  await dialog.getByLabel('Name').fill('New Recipient');
-  await dialog.getByLabel('Email').fill('new.recipient@example.com');
-
-  // Submit and verify completion
-  await page.getByRole('button', { name: 'Sign' }).click();
-  await page.waitForURL(`${signUrl}/complete`);
-
-  // Verify document and recipient states
-  const updatedDocument = await prisma.document.findUniqueOrThrow({
-    where: { id: document.id },
-    include: {
-      recipients: {
-        orderBy: { signingOrder: 'asc' },
-      },
-    },
-  });
-
-  // Document should still be pending as there are more recipients
-  expect(updatedDocument.status).toBe(DocumentStatus.PENDING);
-
-  // First recipient should be completed
-  const updatedFirstRecipient = updatedDocument.recipients[0];
-  expect(updatedFirstRecipient.signingStatus).toBe(SigningStatus.SIGNED);
-
-  // Second recipient should be the new recipient
-  const updatedSecondRecipient = updatedDocument.recipients[1];
-  expect(updatedSecondRecipient.name).toBe('New Recipient');
-  expect(updatedSecondRecipient.email).toBe('new.recipient@example.com');
-  expect(updatedSecondRecipient.signingOrder).toBe(2);
-  expect(updatedSecondRecipient.signingStatus).toBe(SigningStatus.NOT_SIGNED);
-});
-
-test('[NEXT_RECIPIENT_DICTATION]: should not show dictation UI when disabled', async ({ page }) => {
-  const user = await seedUser();
-  const firstSigner = await seedUser();
-  const secondSigner = await seedUser();
-
-  const { recipients, document } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [firstSigner, secondSigner],
-    recipientsCreateOptions: [{ signingOrder: 1 }, { signingOrder: 2 }],
-    updateDocumentOptions: {
-      documentMeta: {
-        upsert: {
-          create: {
-            allowDictateNextSigner: false,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-          update: {
-            allowDictateNextSigner: false,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-        },
-      },
-    },
-  });
-
-  const firstRecipient = recipients[0];
-  const { token, fields } = firstRecipient;
-
-  const signUrl = `/sign/${token}`;
-
-  await page.goto(signUrl);
-  await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-  await signSignaturePad(page);
-
-  // Fill in all fields
-  for (const field of fields) {
-    await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-    if (field.type === FieldType.TEXT) {
-      await page.locator('#custom-text').fill('TEXT');
-      await page.getByRole('button', { name: 'Save' }).click();
-    }
-
-    await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-  }
-
-  // Complete signing
-  await page.getByRole('button', { name: 'Complete' }).click();
-
-  // Verify next recipient UI is not shown
-  await expect(
-    page.getByText('The next recipient to sign this document will be'),
-  ).not.toBeVisible();
-  await expect(page.getByRole('button', { name: 'Update Recipient' })).not.toBeVisible();
-
-  // Submit and verify completion
-  await page.getByRole('button', { name: 'Sign' }).click();
-  await page.waitForURL(`${signUrl}/complete`);
-
-  // Verify document and recipient states
-
-  const updatedDocument = await prisma.document.findUniqueOrThrow({
-    where: { id: document.id },
-    include: {
-      recipients: {
-        orderBy: { signingOrder: 'asc' },
-      },
-    },
-  });
-
-  // Document should still be pending as there are more recipients
-  expect(updatedDocument.status).toBe(DocumentStatus.PENDING);
-
-  // First recipient should be completed
-  const updatedFirstRecipient = updatedDocument.recipients[0];
-  expect(updatedFirstRecipient.signingStatus).toBe(SigningStatus.SIGNED);
-
-  // Second recipient should remain unchanged
-  const updatedSecondRecipient = updatedDocument.recipients[1];
-  expect(updatedSecondRecipient.email).toBe(secondSigner.email);
-  expect(updatedSecondRecipient.signingOrder).toBe(2);
-  expect(updatedSecondRecipient.signingStatus).toBe(SigningStatus.NOT_SIGNED);
-});
-
-test('[NEXT_RECIPIENT_DICTATION]: should work with parallel signing flow', async ({ page }) => {
-  const user = await seedUser();
-  const firstSigner = await seedUser();
-  const secondSigner = await seedUser();
-
-  const { recipients, document } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [firstSigner, secondSigner],
-    recipientsCreateOptions: [{ signingOrder: 1 }, { signingOrder: 2 }],
-    updateDocumentOptions: {
-      documentMeta: {
-        upsert: {
-          create: {
-            allowDictateNextSigner: false,
-            signingOrder: DocumentSigningOrder.PARALLEL,
-          },
-          update: {
-            allowDictateNextSigner: false,
-            signingOrder: DocumentSigningOrder.PARALLEL,
-          },
-        },
-      },
-    },
-  });
-
-  // Test both recipients can sign in parallel
-  for (const recipient of recipients) {
-    const { token, fields } = recipient;
-    const signUrl = `/sign/${token}`;
-
-    await page.goto(signUrl);
-    await expect(page.getByRole('heading', { name: 'Sign Document' })).toBeVisible();
-
-    await signSignaturePad(page);
-
-    // Fill in all fields
-    for (const field of fields) {
-      await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-      if (field.type === FieldType.TEXT) {
-        await page.locator('#custom-text').fill('TEXT');
-        await page.getByRole('button', { name: 'Save' }).click();
-      }
-
-      await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-    }
-
-    // Complete signing
-    await page.getByRole('button', { name: 'Complete' }).click();
-
-    // Verify next recipient UI is not shown in parallel flow
-    await expect(
-      page.getByText('The next recipient to sign this document will be'),
-    ).not.toBeVisible();
-    await expect(page.getByRole('button', { name: 'Update Recipient' })).not.toBeVisible();
-
-    // Submit and verify completion
-    await page.getByRole('button', { name: 'Sign' }).click();
-    await page.waitForURL(`${signUrl}/complete`);
-  }
-
-  // Verify final document and recipient states
-  await expect(async () => {
-    const updatedDocument = await prisma.document.findUniqueOrThrow({
-      where: { id: document.id },
-      include: {
-        recipients: {
-          orderBy: { signingOrder: 'asc' },
-        },
-      },
-    });
-
-    // Document should be completed since all recipients have signed
-    expect(updatedDocument.status).toBe(DocumentStatus.COMPLETED);
-
-    // All recipients should be completed
-    for (const recipient of updatedDocument.recipients) {
-      expect(recipient.signingStatus).toBe(SigningStatus.SIGNED);
-    }
-  }).toPass();
-});
-
-test('[NEXT_RECIPIENT_DICTATION]: should allow assistant to dictate next signer', async ({
-  page,
-}) => {
-  const user = await seedUser();
-  const assistant = await seedUser();
-  const signer = await seedUser();
-  const thirdSigner = await seedUser();
-
-  const { recipients, document } = await seedPendingDocumentWithFullFields({
-    owner: user,
-    recipients: [assistant, signer, thirdSigner],
-    recipientsCreateOptions: [
-      { signingOrder: 1, role: RecipientRole.ASSISTANT },
-      { signingOrder: 2, role: RecipientRole.SIGNER },
-      { signingOrder: 3, role: RecipientRole.SIGNER },
-    ],
-    updateDocumentOptions: {
-      documentMeta: {
-        upsert: {
-          create: {
-            allowDictateNextSigner: true,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-          update: {
-            allowDictateNextSigner: true,
-            signingOrder: DocumentSigningOrder.SEQUENTIAL,
-          },
-        },
-      },
-    },
-  });
-
-  const assistantRecipient = recipients[0];
-  const { token, fields } = assistantRecipient;
-
-  const signUrl = `/sign/${token}`;
-
-  await page.goto(signUrl);
-  await expect(page.getByRole('heading', { name: 'Assist Document' })).toBeVisible();
-
-  await page.getByRole('radio', { name: assistantRecipient.name }).click();
-
-  // Fill in all fields
-  for (const field of fields) {
-    await page.locator(`#field-${field.id}`).getByRole('button').click();
-
-    if (field.type === FieldType.SIGNATURE) {
-      await signDirectSignaturePad(page);
-      await page.getByRole('button', { name: 'Sign', exact: true }).click();
-    }
-
-    if (field.type === FieldType.TEXT) {
-      await page.locator('#custom-text').fill('TEXT');
-      await page.getByRole('button', { name: 'Save' }).click();
-    }
-
-    await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
-  }
-
-  // Complete assisting and update next recipient
-  await page.getByRole('button', { name: 'Continue' }).click();
-
-  // Verify next recipient info is shown
-  await expect(page.getByRole('dialog')).toBeVisible();
-  await expect(page.getByText('The next recipient to sign this document will be')).toBeVisible();
-
-  // Update next recipient
-  await page.locator('button').filter({ hasText: 'Update Recipient' }).click();
-
-  // Use dialog context to ensure we're targeting the correct form fields
-  const dialog = page.getByRole('dialog');
-  await dialog.getByLabel('Name').fill('New Signer');
-  await dialog.getByLabel('Email').fill('new.signer@example.com');
-
-  // Submit and verify completion
-  await page.getByRole('button', { name: /Continue|Proceed/i }).click();
-  await page.waitForURL(`${signUrl}/complete`);
-
-  // Verify document and recipient states
-  await expect(async () => {
-    const updatedDocument = await prisma.document.findUniqueOrThrow({
-      where: { id: document.id },
-      include: {
-        recipients: {
-          orderBy: { signingOrder: 'asc' },
-        },
-      },
-    });
-
-    // Document should still be pending as there are more recipients
-    expect(updatedDocument.status).toBe(DocumentStatus.PENDING);
-
-    // Assistant should be completed
-    const updatedAssistant = updatedDocument.recipients[0];
-    expect(updatedAssistant.signingStatus).toBe(SigningStatus.SIGNED);
-    expect(updatedAssistant.role).toBe(RecipientRole.ASSISTANT);
-
-    // Second recipient should be the new signer
-    const updatedSigner = updatedDocument.recipients[1];
-    expect(updatedSigner.name).toBe('New Signer');
-    expect(updatedSigner.email).toBe('new.signer@example.com');
-    expect(updatedSigner.signingOrder).toBe(2);
-    expect(updatedSigner.signingStatus).toBe(SigningStatus.NOT_SIGNED);
-    expect(updatedSigner.role).toBe(RecipientRole.SIGNER);
-
-    // Third recipient should remain unchanged
-    const thirdRecipient = updatedDocument.recipients[2];
-    expect(thirdRecipient.email).toBe(thirdSigner.email);
-    expect(thirdRecipient.signingOrder).toBe(3);
-    expect(thirdRecipient.signingStatus).toBe(SigningStatus.NOT_SIGNED);
-    expect(thirdRecipient.role).toBe(RecipientRole.SIGNER);
-  }).toPass();
-});

packages/app-tests/e2e/document-flow/stepper-component.spec.ts

@@ -377,9 +377,7 @@ test('[DOCUMENT_FLOW]: should be able to approve a document', async ({ page }) =
       await expect(page.locator(`#field-${field.id}`)).toHaveAttribute('data-inserted', 'true');
     }
 
-    await page
+    await page.getByRole('button', { name: 'Complete' }).click();
-      .getByRole('button', { name: role === RecipientRole.SIGNER ? 'Complete' : 'Approve' })
-      .click();
     await page
       .getByRole('button', { name: role === RecipientRole.SIGNER ? 'Sign' : 'Approve' })
       .click();
@@ -449,7 +447,7 @@ test('[DOCUMENT_FLOW]: should be able to create, send with redirect url, sign a
   const { status } = await getDocumentByToken(token);
   expect(status).toBe(DocumentStatus.PENDING);
 
-  await page.getByRole('button', { name: 'Approve' }).click();
+  await page.getByRole('button', { name: 'Complete' }).click();
   await expect(page.getByRole('dialog').getByText('Complete Approval').first()).toBeVisible();
   await page.getByRole('button', { name: 'Approve' }).click();
 

packages/app-tests/e2e/features/include-document-certificate.spec.ts

@@ -222,10 +222,7 @@ test.describe('Signing Certificate Tests', () => {
 
     // Toggle signing certificate setting
     await page.getByLabel('Include the Signing Certificate in the Document').click();
-    await page
+    await page.getByRole('button', { name: /Save/ }).first().click();
-      .getByRole('button', { name: /Update/ })
-      .first()
-      .click();
 
     await page.waitForTimeout(1000);
 
@@ -239,10 +236,7 @@ test.describe('Signing Certificate Tests', () => {
 
     // Toggle the setting back to true
     await page.getByLabel('Include the Signing Certificate in the Document').click();
-    await page
+    await page.getByRole('button', { name: /Save/ }).first().click();
-      .getByRole('button', { name: /Update/ })
-      .first()
-      .click();
 
     await page.waitForTimeout(1000);
 

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

@@ -1,28 +1,40 @@
 import type { Page } from '@playwright/test';
 
-/**
- * Will open the signature pad dialog and sign it.
- */
 export const signSignaturePad = async (page: Page) => {
   await page.waitForTimeout(200);
 
-  await page.getByTestId('signature-pad-dialog-button').click();
+  const canvas = page.getByTestId('signature-pad');
 
-  // Click type tab
+  const box = await canvas.boundingBox();
-  await page.getByRole('tab', { name: 'Type' }).click();
-  await page.getByTestId('signature-pad-type-input').fill('Signature');
 
-  // Click Next button
+  if (!box) {
-  await page.getByRole('button', { name: 'Next' }).click();
+    throw new Error('Signature pad not found');
-};
+  }
-
+
-/**
+  // Calculate center point
- * For when the signature pad is already open.
+  const centerX = box.x + box.width / 2;
- */
+  const centerY = box.y + box.height / 2;
-export const signDirectSignaturePad = async (page: Page) => {
+
-  await page.waitForTimeout(200);
+  // Calculate square size (making it slightly smaller than the canvas)
-
+  const squareSize = Math.min(box.width, box.height) * 0.4; // 40% of the smallest dimension
-  // Click type tab
+
-  await page.getByRole('tab', { name: 'Type' }).click();
+  // Move to center
-  await page.getByTestId('signature-pad-type-input').fill('Signature');
+  await page.mouse.move(centerX, centerY);
+  await page.mouse.down();
+
+  // Draw square clockwise from center
+  // Move right
+  await page.mouse.move(centerX + squareSize, centerY, { steps: 10 });
+  // Move down
+  await page.mouse.move(centerX + squareSize, centerY + squareSize, { steps: 10 });
+  // Move left
+  await page.mouse.move(centerX - squareSize, centerY + squareSize, { steps: 10 });
+  // Move up
+  await page.mouse.move(centerX - squareSize, centerY - squareSize, { steps: 10 });
+  // Move right
+  await page.mouse.move(centerX + squareSize, centerY - squareSize, { steps: 10 });
+  // Move down to close the square
+  await page.mouse.move(centerX + squareSize, centerY, { steps: 10 });
+
+  await page.mouse.up();
 };

packages/app-tests/e2e/public-profiles/public-profiles.spec.ts

@@ -56,7 +56,6 @@ test('[PUBLIC_PROFILE]: create profile', async ({ page }) => {
   // Go back to public profile page.
   await page.goto(`${NEXT_PUBLIC_WEBAPP_URL()}/settings/public-profile`);
   await page.getByRole('switch').click();
-  await page.waitForTimeout(1000);
 
   // Assert values.
   await page.goto(`${NEXT_PUBLIC_WEBAPP_URL()}/p/${publicProfileUrl}`);
@@ -128,7 +127,6 @@ test('[PUBLIC_PROFILE]: create team profile', async ({ page }) => {
   // Go back to public profile page.
   await page.goto(`${NEXT_PUBLIC_WEBAPP_URL()}/t/${team.url}/settings/public-profile`);
   await page.getByRole('switch').click();
-  await page.waitForTimeout(1000);
 
   // Assert values.
   await page.goto(`${NEXT_PUBLIC_WEBAPP_URL()}/p/${publicProfileUrl}`);

packages/app-tests/e2e/teams/team-global-settings.spec.ts

@@ -23,7 +23,7 @@ test('[TEAMS]: update the default document visibility in the team global setting
   // !: Brittle selector
   await page.getByRole('combobox').first().click();
   await page.getByRole('option', { name: 'Admin' }).click();
-  await page.getByRole('button', { name: 'Update' }).first().click();
+  await page.getByRole('button', { name: 'Save' }).first().click();
 
   const toast = page.locator('li[role="status"][data-state="open"]').first();
   await expect(toast).toBeVisible();
@@ -47,7 +47,7 @@ test('[TEAMS]: update the sender details in the team global settings', async ({
 
   await expect(checkbox).toBeChecked();
 
-  await page.getByRole('button', { name: 'Update' }).first().click();
+  await page.getByRole('button', { name: 'Save' }).first().click();
 
   const toast = page.locator('li[role="status"][data-state="open"]').first();
   await expect(toast).toBeVisible();

packages/app-tests/e2e/teams/team-signature-settings.spec.ts

@@ -1,182 +0,0 @@
-import { expect, test } from '@playwright/test';
-
-import { prisma } from '@documenso/prisma';
-import {
-  seedTeamDocumentWithMeta,
-  seedTeamDocuments,
-  seedTeamTemplateWithMeta,
-} from '@documenso/prisma/seed/documents';
-
-import { apiSignin } from '../fixtures/authentication';
-
-test.describe.configure({ mode: 'parallel' });
-
-test('[TEAMS]: check that default team signature settings are all enabled', async ({ page }) => {
-  const { team } = await seedTeamDocuments();
-
-  await apiSignin({
-    page,
-    email: team.owner.email,
-    password: 'password',
-    redirectPath: `/t/${team.url}/settings/preferences`,
-  });
-
-  // Verify that the default created team settings has all signatures enabled
-  await expect(page.getByRole('combobox').filter({ hasText: 'Type' })).toBeVisible();
-  await expect(page.getByRole('combobox').filter({ hasText: 'Upload' })).toBeVisible();
-  await expect(page.getByRole('combobox').filter({ hasText: 'Draw' })).toBeVisible();
-
-  const document = await seedTeamDocumentWithMeta(team);
-
-  // Create a document and check the settings
-  await page.goto(`/t/${team.url}/documents/${document.id}/edit`);
-
-  // Verify that the settings match
-  await page.getByRole('button', { name: 'Advanced Options' }).click();
-  await expect(page.getByRole('combobox').filter({ hasText: 'Type' })).toBeVisible();
-  await expect(page.getByRole('combobox').filter({ hasText: 'Upload' })).toBeVisible();
-  await expect(page.getByRole('combobox').filter({ hasText: 'Draw' })).toBeVisible();
-
-  // Go to document and check that the signatured tabs are correct.
-  await page.goto(`/sign/${document.recipients[0].token}`);
-  await page.getByTestId('signature-pad-dialog-button').click();
-
-  // Check the tab values
-  await expect(page.getByRole('tab', { name: 'Type' })).toBeVisible();
-  await expect(page.getByRole('tab', { name: 'Upload' })).toBeVisible();
-  await expect(page.getByRole('tab', { name: 'Draw' })).toBeVisible();
-});
-
-test('[TEAMS]: check signature modes can be disabled', async ({ page }) => {
-  const { team } = await seedTeamDocuments();
-
-  await apiSignin({
-    page,
-    email: team.owner.email,
-    password: 'password',
-    redirectPath: `/t/${team.url}/settings/preferences`,
-  });
-
-  const allTabs = ['Type', 'Upload', 'Draw'];
-  const tabTest = [['Type', 'Upload', 'Draw'], ['Type', 'Upload'], ['Type']];
-
-  for (const tabs of tabTest) {
-    await page.goto(`/t/${team.url}/settings/preferences`);
-
-    // Update combobox to have the correct tabs
-    await page.getByTestId('signature-types-combobox').click();
-
-    await expect(page.getByRole('option', { name: 'Type' })).toBeVisible();
-    await expect(page.getByRole('option', { name: 'Upload' })).toBeVisible();
-    await expect(page.getByRole('option', { name: 'Draw' })).toBeVisible();
-
-    // Clear all selected items.
-    for (const tab of allTabs) {
-      const item = page.getByRole('option', { name: tab });
-
-      const isSelected = (await item.innerHTML()).includes('opacity-100');
-
-      if (isSelected) {
-        await item.click();
-      }
-    }
-
-    // Selected wanted items.
-    for (const tab of tabs) {
-      const item = page.getByRole('option', { name: tab });
-      await item.click();
-    }
-
-    await page.getByRole('button', { name: 'Update' }).first().click();
-
-    const document = await seedTeamDocumentWithMeta(team);
-
-    // Go to document and check that the signatured tabs are correct.
-    await page.goto(`/sign/${document.recipients[0].token}`);
-    await page.getByTestId('signature-pad-dialog-button').click();
-
-    // Check the tab values
-    for (const tab of allTabs) {
-      if (tabs.includes(tab)) {
-        await expect(page.getByRole('tab', { name: tab })).toBeVisible();
-      } else {
-        await expect(page.getByRole('tab', { name: tab })).not.toBeVisible();
-      }
-    }
-  }
-});
-
-test('[TEAMS]: check signature modes work for templates', async ({ page }) => {
-  const { team } = await seedTeamDocuments();
-
-  await apiSignin({
-    page,
-    email: team.owner.email,
-    password: 'password',
-    redirectPath: `/t/${team.url}/settings/preferences`,
-  });
-
-  const allTabs = ['Type', 'Upload', 'Draw'];
-  const tabTest = [['Type', 'Upload', 'Draw'], ['Type', 'Upload'], ['Type']];
-
-  for (const tabs of tabTest) {
-    await page.goto(`/t/${team.url}/settings/preferences`);
-
-    // Update combobox to have the correct tabs
-    await page.getByTestId('signature-types-combobox').click();
-
-    await expect(page.getByRole('option', { name: 'Type' })).toBeVisible();
-    await expect(page.getByRole('option', { name: 'Upload' })).toBeVisible();
-    await expect(page.getByRole('option', { name: 'Draw' })).toBeVisible();
-
-    // Clear all selected items.
-    for (const tab of allTabs) {
-      const item = page.getByRole('option', { name: tab });
-
-      const isSelected = (await item.innerHTML()).includes('opacity-100');
-
-      if (isSelected) {
-        await item.click();
-      }
-    }
-
-    // Selected wanted items.
-    for (const tab of tabs) {
-      const item = page.getByRole('option', { name: tab });
-      await item.click();
-    }
-
-    await page.getByRole('button', { name: 'Update' }).first().click();
-
-    const template = await seedTeamTemplateWithMeta(team);
-
-    await page.goto(`/t/${team.url}/templates/${template.id}`);
-    await page.getByRole('button', { name: 'Use' }).click();
-
-    // Check the send document checkbox to true
-    await page.getByLabel('Send document').click();
-    await page.getByRole('button', { name: 'Create and send' }).click();
-    await page.waitForTimeout(1000);
-
-    const document = await prisma.document.findFirst({
-      where: {
-        templateId: template.id,
-      },
-      include: {
-        documentMeta: true,
-      },
-    });
-
-    // Test kinda flaky, debug here.
-    // console.log({
-    //   tabs,
-    //   typedSignatureEnabled: document?.documentMeta?.typedSignatureEnabled,
-    //   uploadSignatureEnabled: document?.documentMeta?.uploadSignatureEnabled,
-    //   drawSignatureEnabled: document?.documentMeta?.drawSignatureEnabled,
-    // });
-
-    expect(document?.documentMeta?.typedSignatureEnabled).toEqual(tabs.includes('Type'));
-    expect(document?.documentMeta?.uploadSignatureEnabled).toEqual(tabs.includes('Upload'));
-    expect(document?.documentMeta?.drawSignatureEnabled).toEqual(tabs.includes('Draw'));
-  }
-});

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

@@ -298,7 +298,6 @@ test('[DIRECT_TEMPLATES]: use direct template link with 2 recipients', async ({
     await page.goto(formatDirectTemplatePath(template.directLink?.token || ''));
     await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
 
-    await page.waitForTimeout(1000);
     await page.getByPlaceholder('recipient@documenso.com').fill(seedTestEmail());
 
     await page.getByRole('button', { name: 'Continue' }).click();

packages/app-tests/e2e/user/update-name.spec.ts

@@ -4,7 +4,6 @@ import { getUserByEmail } from '@documenso/lib/server-only/user/get-user-by-emai
 import { seedUser } from '@documenso/prisma/seed/users';
 
 import { apiSignin } from '../fixtures/authentication';
-import { signSignaturePad } from '../fixtures/signature';
 
 test('[USER] update full name', async ({ page }) => {
   const user = await seedUser();
@@ -13,7 +12,7 @@ test('[USER] update full name', async ({ page }) => {
 
   await page.getByLabel('Full Name').fill('John Doe');
 
-  await signSignaturePad(page);
+  await page.getByPlaceholder('Type your signature').fill('John Doe');
 
   await page.getByRole('button', { name: 'Update profile' }).click();
 

packages/email/template-components/template-document-cancel.tsx

@@ -8,14 +8,12 @@ export interface TemplateDocumentCancelProps {
   inviterEmail: string;
   documentName: string;
   assetBaseUrl: string;
-  cancellationReason?: string;
 }
 
 export const TemplateDocumentCancel = ({
   inviterName,
   documentName,
   assetBaseUrl,
-  cancellationReason,
 }: TemplateDocumentCancelProps) => {
   return (
     <>
@@ -36,12 +34,6 @@ export const TemplateDocumentCancel = ({
         <Text className="my-1 text-center text-base text-slate-400">
           <Trans>You don't need to sign it anymore.</Trans>
         </Text>
-
-        {cancellationReason && (
-          <Text className="mt-4 text-center text-base">
-            <Trans>Reason for cancellation: {cancellationReason}</Trans>
-          </Text>
-        )}
       </Section>
     </>
   );

packages/email/templates/document-cancel.tsx

@@ -14,7 +14,6 @@ export const DocumentCancelTemplate = ({
   inviterEmail = 'lucas@documenso.com',
   documentName = 'Open Source Pledge.pdf',
   assetBaseUrl = 'http://localhost:3002',
-  cancellationReason,
 }: DocumentCancelEmailTemplateProps) => {
   const { _ } = useLingui();
   const branding = useBranding();
@@ -49,7 +48,6 @@ export const DocumentCancelTemplate = ({
                 inviterEmail={inviterEmail}
                 documentName={documentName}
                 assetBaseUrl={assetBaseUrl}
-                cancellationReason={cancellationReason}
               />
             </Section>
           </Container>

packages/lib/constants/document.ts

@@ -8,9 +8,6 @@ export const DOCUMENT_STATUS: {
   [DocumentStatus.COMPLETED]: {
     description: msg`Completed`,
   },
-  [DocumentStatus.REJECTED]: {
-    description: msg`Rejected`,
-  },
   [DocumentStatus.DRAFT]: {
     description: msg`Draft`,
   },
@@ -34,29 +31,3 @@ export const DOCUMENT_DISTRIBUTION_METHODS: Record<string, DocumentDistributionM
     description: msg`None`,
   },
 } satisfies Record<DocumentDistributionMethod, DocumentDistributionMethodTypeData>;
-
-export enum DocumentSignatureType {
-  DRAW = 'draw',
-  TYPE = 'type',
-  UPLOAD = 'upload',
-}
-
-type DocumentSignatureTypeData = {
-  label: MessageDescriptor;
-  value: DocumentSignatureType;
-};
-
-export const DOCUMENT_SIGNATURE_TYPES = {
-  [DocumentSignatureType.DRAW]: {
-    label: msg`Draw`,
-    value: DocumentSignatureType.DRAW,
-  },
-  [DocumentSignatureType.TYPE]: {
-    label: msg`Type`,
-    value: DocumentSignatureType.TYPE,
-  },
-  [DocumentSignatureType.UPLOAD]: {
-    label: msg`Upload`,
-    value: DocumentSignatureType.UPLOAD,
-  },
-} satisfies Record<DocumentSignatureType, DocumentSignatureTypeData>;

packages/lib/constants/signatures.ts

@@ -1,4 +0,0 @@
-export const SIGNATURE_CANVAS_DPI = 2;
-export const SIGNATURE_MIN_COVERAGE_THRESHOLD = 0.01;
-
-export const isBase64Image = (value: string) => value.startsWith('data:image/png;base64,');

packages/lib/jobs/client.ts

@@ -1,6 +1,5 @@
 import { JobClient } from './client/client';
 import { SEND_CONFIRMATION_EMAIL_JOB_DEFINITION } from './definitions/emails/send-confirmation-email';
-import { SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION } from './definitions/emails/send-document-cancelled-emails';
 import { SEND_PASSWORD_RESET_SUCCESS_EMAIL_JOB_DEFINITION } from './definitions/emails/send-password-reset-success-email';
 import { SEND_RECIPIENT_SIGNED_EMAIL_JOB_DEFINITION } from './definitions/emails/send-recipient-signed-email';
 import { SEND_SIGNING_REJECTION_EMAILS_JOB_DEFINITION } from './definitions/emails/send-rejection-emails';
@@ -25,7 +24,6 @@ export const jobsClient = new JobClient([
   SEND_PASSWORD_RESET_SUCCESS_EMAIL_JOB_DEFINITION,
   SEND_SIGNING_REJECTION_EMAILS_JOB_DEFINITION,
   SEND_RECIPIENT_SIGNED_EMAIL_JOB_DEFINITION,
-  SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION,
   BULK_SEND_TEMPLATE_JOB_DEFINITION,
 ] as const);
 

packages/lib/jobs/definitions/emails/send-document-cancelled-emails.handler.ts

@@ -1,105 +0,0 @@
-import { createElement } from 'react';
-
-import { msg } from '@lingui/core/macro';
-import { ReadStatus, SendStatus, SigningStatus } from '@prisma/client';
-
-import { mailer } from '@documenso/email/mailer';
-import DocumentCancelTemplate from '@documenso/email/templates/document-cancel';
-import { prisma } from '@documenso/prisma';
-
-import { getI18nInstance } from '../../../client-only/providers/i18n-server';
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../../constants/app';
-import { FROM_ADDRESS, FROM_NAME } from '../../../constants/email';
-import { extractDerivedDocumentEmailSettings } from '../../../types/document-email';
-import { renderEmailWithI18N } from '../../../utils/render-email-with-i18n';
-import { teamGlobalSettingsToBranding } from '../../../utils/team-global-settings-to-branding';
-import type { JobRunIO } from '../../client/_internal/job';
-import type { TSendDocumentCancelledEmailsJobDefinition } from './send-document-cancelled-emails';
-
-export const run = async ({
-  payload,
-  io,
-}: {
-  payload: TSendDocumentCancelledEmailsJobDefinition;
-  io: JobRunIO;
-}) => {
-  const { documentId, cancellationReason } = payload;
-
-  const document = await prisma.document.findFirstOrThrow({
-    where: {
-      id: documentId,
-    },
-    include: {
-      user: true,
-      documentMeta: true,
-      recipients: true,
-      team: {
-        select: {
-          teamEmail: true,
-          name: true,
-          url: true,
-          teamGlobalSettings: true,
-        },
-      },
-    },
-  });
-
-  const { documentMeta, user: documentOwner } = document;
-
-  // Check if document cancellation emails are enabled
-  const isEmailEnabled = extractDerivedDocumentEmailSettings(documentMeta).documentDeleted;
-
-  if (!isEmailEnabled) {
-    return;
-  }
-
-  const i18n = await getI18nInstance(documentMeta?.language);
-
-  // Send cancellation emails to all recipients who have been sent the document or viewed it
-  const recipientsToNotify = document.recipients.filter(
-    (recipient) =>
-      (recipient.sendStatus === SendStatus.SENT || recipient.readStatus === ReadStatus.OPENED) &&
-      recipient.signingStatus !== SigningStatus.REJECTED,
-  );
-
-  await io.runTask('send-cancellation-emails', async () => {
-    await Promise.all(
-      recipientsToNotify.map(async (recipient) => {
-        const template = createElement(DocumentCancelTemplate, {
-          documentName: document.title,
-          inviterName: documentOwner.name || undefined,
-          inviterEmail: documentOwner.email,
-          assetBaseUrl: NEXT_PUBLIC_WEBAPP_URL(),
-          cancellationReason: cancellationReason || 'The document has been cancelled.',
-        });
-
-        const branding = document.team?.teamGlobalSettings
-          ? teamGlobalSettingsToBranding(document.team.teamGlobalSettings)
-          : undefined;
-
-        const [html, text] = await Promise.all([
-          renderEmailWithI18N(template, { lang: documentMeta?.language, branding }),
-          renderEmailWithI18N(template, {
-            lang: documentMeta?.language,
-            branding,
-            plainText: true,
-          }),
-        ]);
-
-        await mailer.sendMail({
-          to: {
-            name: recipient.name,
-            address: recipient.email,
-          },
-          from: {
-            name: FROM_NAME,
-            address: FROM_ADDRESS,
-          },
-          subject: i18n._(msg`Document "${document.title}" Cancelled`),
-          html,
-          text,
-        });
-      }),
-    );
-  });
-};

packages/lib/jobs/definitions/emails/send-document-cancelled-emails.ts

@@ -1,33 +0,0 @@
-import { z } from 'zod';
-
-import { type JobDefinition } from '../../client/_internal/job';
-
-const SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_ID = 'send.document.cancelled.emails';
-
-const SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_SCHEMA = z.object({
-  documentId: z.number(),
-  cancellationReason: z.string().optional(),
-  requestMetadata: z.any().optional(),
-});
-
-export type TSendDocumentCancelledEmailsJobDefinition = z.infer<
-  typeof SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_SCHEMA
->;
-
-export const SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION = {
-  id: SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_ID,
-  name: 'Send Document Cancelled Emails',
-  version: '1.0.0',
-  trigger: {
-    name: SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_ID,
-    schema: SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_SCHEMA,
-  },
-  handler: async ({ payload, io }) => {
-    const handler = await import('./send-document-cancelled-emails.handler');
-
-    await handler.run({ payload, io });
-  },
-} as const satisfies JobDefinition<
-  typeof SEND_DOCUMENT_CANCELLED_EMAILS_JOB_DEFINITION_ID,
-  TSendDocumentCancelledEmailsJobDefinition
->;

packages/lib/jobs/definitions/emails/send-team-deleted-email.ts

@@ -23,8 +23,6 @@ const SEND_TEAM_DELETED_EMAIL_JOB_DEFINITION_SCHEMA = z.object({
         brandingHidePoweredBy: z.boolean(),
         teamId: z.number(),
         typedSignatureEnabled: z.boolean(),
-        uploadSignatureEnabled: z.boolean(),
-        drawSignatureEnabled: z.boolean(),
       })
       .nullish(),
   }),

packages/lib/jobs/definitions/internal/seal-document.handler.ts

@@ -6,11 +6,9 @@ import { PDFDocument } from 'pdf-lib';
 import { prisma } from '@documenso/prisma';
 import { signPdf } from '@documenso/signing';
 
-import { AppError, AppErrorCode } from '../../../errors/app-error';
 import { sendCompletedEmail } from '../../../server-only/document/send-completed-email';
 import PostHogServerClient from '../../../server-only/feature-flags/get-post-hog-server-client';
 import { getCertificatePdf } from '../../../server-only/htmltopdf/get-certificate-pdf';
-import { addRejectionStampToPdf } from '../../../server-only/pdf/add-rejection-stamp-to-pdf';
 import { flattenAnnotations } from '../../../server-only/pdf/flatten-annotations';
 import { flattenForm } from '../../../server-only/pdf/flatten-form';
 import { insertFieldInPDF } from '../../../server-only/pdf/insert-field-in-pdf';
@@ -24,7 +22,6 @@ import {
 import { getFileServerSide } from '../../../universal/upload/get-file.server';
 import { putPdfFileServerSide } from '../../../universal/upload/put-file.server';
 import { fieldsContainUnsignedRequiredField } from '../../../utils/advanced-fields-helpers';
-import { isDocumentCompleted } from '../../../utils/document';
 import { createDocumentAuditLogData } from '../../../utils/document-audit-logs';
 import type { JobRunIO } from '../../client/_internal/job';
 import type { TSealDocumentJobDefinition } from './seal-document';
@@ -41,6 +38,11 @@ export const run = async ({
   const document = await prisma.document.findFirstOrThrow({
     where: {
       id: documentId,
+      recipients: {
+        every: {
+          signingStatus: SigningStatus.SIGNED,
+        },
+      },
     },
     include: {
       documentMeta: true,
@@ -57,16 +59,6 @@ export const run = async ({
     },
   });
 
-  const isComplete =
-    document.recipients.some((recipient) => recipient.signingStatus === SigningStatus.REJECTED) ||
-    document.recipients.every((recipient) => recipient.signingStatus === SigningStatus.SIGNED);
-
-  if (!isComplete) {
-    throw new AppError(AppErrorCode.UNKNOWN_ERROR, {
-      message: 'Document is not complete',
-    });
-  }
-
   // Seems silly but we need to do this in case the job is re-ran
   // after it has already run through the update task further below.
   // eslint-disable-next-line @typescript-eslint/require-await
@@ -99,15 +91,9 @@ export const run = async ({
     },
   });
 
-  // Determine if the document has been rejected by checking if any recipient has rejected it
+  if (recipients.some((recipient) => recipient.signingStatus !== SigningStatus.SIGNED)) {
-  const rejectedRecipient = recipients.find(
+    throw new Error(`Document ${document.id} has unsigned recipients`);
-    (recipient) => recipient.signingStatus === SigningStatus.REJECTED,
+  }
-  );
-
-  const isRejected = Boolean(rejectedRecipient);
-
-  // Get the rejection reason from the rejected recipient
-  const rejectionReason = rejectedRecipient?.rejectionReason ?? '';
 
   const fields = await prisma.field.findMany({
     where: {
@@ -118,8 +104,7 @@ export const run = async ({
     },
   });
 
-  // Skip the field check if the document is rejected
+  if (fieldsContainUnsignedRequiredField(fields)) {
-  if (!isRejected && fieldsContainUnsignedRequiredField(fields)) {
     throw new Error(`Document ${document.id} has unsigned required fields`);
   }
 
@@ -147,11 +132,6 @@ export const run = async ({
     flattenForm(pdfDoc);
     flattenAnnotations(pdfDoc);
 
-    // Add rejection stamp if the document is rejected
-    if (isRejected && rejectionReason) {
-      await addRejectionStampToPdf(pdfDoc, rejectionReason);
-    }
-
     if (certificateData) {
       const certificateDoc = await PDFDocument.load(certificateData);
 
@@ -180,11 +160,8 @@ export const run = async ({
 
     const { name } = path.parse(document.title);
 
-    // Add suffix based on document status
-    const suffix = isRejected ? '_rejected.pdf' : '_signed.pdf';
-
     const documentData = await putPdfFileServerSide({
-      name: `${name}${suffix}`,
+      name: `${name}_signed.pdf`,
       type: 'application/pdf',
       arrayBuffer: async () => Promise.resolve(pdfBuffer),
     });
@@ -200,7 +177,6 @@ export const run = async ({
       event: 'App: Document Sealed',
       properties: {
         documentId: document.id,
-        isRejected,
       },
     });
   }
@@ -218,7 +194,7 @@ export const run = async ({
           id: document.id,
         },
         data: {
-          status: isRejected ? DocumentStatus.REJECTED : DocumentStatus.COMPLETED,
+          status: DocumentStatus.COMPLETED,
           completedAt: new Date(),
         },
       });
@@ -240,7 +216,6 @@ export const run = async ({
           user: null,
           data: {
             transactionId: nanoid(),
-            ...(isRejected ? { isRejected: true, rejectionReason: rejectionReason } : {}),
           },
         }),
       });
@@ -248,9 +223,9 @@ export const run = async ({
   });
 
   await io.runTask('send-completed-email', async () => {
-    let shouldSendCompletedEmail = sendEmail && !isResealing && !isRejected;
+    let shouldSendCompletedEmail = sendEmail && !isResealing;
 
-    if (isResealing && !isDocumentCompleted(document.status)) {
+    if (isResealing && documentStatus !== DocumentStatus.COMPLETED) {
       shouldSendCompletedEmail = sendEmail;
     }
 
@@ -271,9 +246,7 @@ export const run = async ({
   });
 
   await triggerWebhook({
-    event: isRejected
+    event: WebhookTriggerEvents.DOCUMENT_COMPLETED,
-      ? WebhookTriggerEvents.DOCUMENT_REJECTED
-      : WebhookTriggerEvents.DOCUMENT_COMPLETED,
     data: ZWebhookDocumentSchema.parse(mapDocumentToWebhookDocumentPayload(updatedDocument)),
     userId: updatedDocument.userId,
     teamId: updatedDocument.teamId ?? undefined,

packages/lib/server-only/admin/get-documents-stats.ts

@@ -13,7 +13,6 @@ export const getDocumentStats = async () => {
     [ExtendedDocumentStatus.DRAFT]: 0,
     [ExtendedDocumentStatus.PENDING]: 0,
     [ExtendedDocumentStatus.COMPLETED]: 0,
-    [ExtendedDocumentStatus.REJECTED]: 0,
     [ExtendedDocumentStatus.ALL]: 0,
   };
 

packages/lib/server-only/admin/get-signing-volume.ts

@@ -1,4 +1,4 @@
-import { DocumentStatus, SubscriptionStatus } from '@prisma/client';
+import { DocumentStatus } from '@prisma/client';
 
 import { kyselyPrisma, sql } from '@documenso/prisma';
 
@@ -44,6 +44,7 @@ export async function getSigningVolume({
         .on('td.status', '=', sql.lit(DocumentStatus.COMPLETED))
         .on('td.deletedAt', 'is', null),
     )
+    // @ts-expect-error - Raw SQL enum casting not properly typed by Kysely
     .where(sql`s.status = ${SubscriptionStatus.ACTIVE}::"SubscriptionStatus"`)
     .where((eb) =>
       eb.or([
@@ -81,6 +82,7 @@ export async function getSigningVolume({
     .selectFrom('Subscription as s')
     .leftJoin('User as u', 's.userId', 'u.id')
     .leftJoin('Team as t', 's.teamId', 't.id')
+    // @ts-expect-error - Raw SQL enum casting not properly typed by Kysely
     .where(sql`s.status = ${SubscriptionStatus.ACTIVE}::"SubscriptionStatus"`)
     .where((eb) =>
       eb.or([

packages/lib/server-only/document-meta/upsert-document-meta.ts

@@ -24,11 +24,8 @@ export type CreateDocumentMetaOptions = {
   redirectUrl?: string;
   emailSettings?: TDocumentEmailSettings;
   signingOrder?: DocumentSigningOrder;
-  allowDictateNextSigner?: boolean;
   distributionMethod?: DocumentDistributionMethod;
   typedSignatureEnabled?: boolean;
-  uploadSignatureEnabled?: boolean;
-  drawSignatureEnabled?: boolean;
   language?: SupportedLanguageCodes;
   requestMetadata: ApiRequestMetadata;
 };
@@ -44,12 +41,9 @@ export const upsertDocumentMeta = async ({
   password,
   redirectUrl,
   signingOrder,
-  allowDictateNextSigner,
   emailSettings,
   distributionMethod,
   typedSignatureEnabled,
-  uploadSignatureEnabled,
-  drawSignatureEnabled,
   language,
   requestMetadata,
 }: CreateDocumentMetaOptions) => {
@@ -99,12 +93,9 @@ export const upsertDocumentMeta = async ({
         documentId,
         redirectUrl,
         signingOrder,
-        allowDictateNextSigner,
         emailSettings,
         distributionMethod,
         typedSignatureEnabled,
-        uploadSignatureEnabled,
-        drawSignatureEnabled,
         language,
       },
       update: {
@@ -115,12 +106,9 @@ export const upsertDocumentMeta = async ({
         timezone,
         redirectUrl,
         signingOrder,
-        allowDictateNextSigner,
         emailSettings,
         distributionMethod,
         typedSignatureEnabled,
-        uploadSignatureEnabled,
-        drawSignatureEnabled,
         language,
       },
     });

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

@@ -7,10 +7,7 @@ import {
   WebhookTriggerEvents,
 } from '@prisma/client';
 
-import {
+import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
-  DOCUMENT_AUDIT_LOG_TYPE,
-  RECIPIENT_DIFF_TYPE,
-} from '@documenso/lib/types/document-audit-logs';
 import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { fieldsContainUnsignedRequiredField } from '@documenso/lib/utils/advanced-fields-helpers';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
@@ -33,10 +30,6 @@ export type CompleteDocumentWithTokenOptions = {
   userId?: number;
   authOptions?: TRecipientActionAuth;
   requestMetadata?: RequestMetadata;
-  nextSigner?: {
-    email: string;
-    name: string;
-  };
 };
 
 const getDocument = async ({ token, documentId }: CompleteDocumentWithTokenOptions) => {
@@ -64,7 +57,6 @@ export const completeDocumentWithToken = async ({
   token,
   documentId,
   requestMetadata,
-  nextSigner,
 }: CompleteDocumentWithTokenOptions) => {
   const document = await getDocument({ token, documentId });
 
@@ -154,6 +146,7 @@ export const completeDocumentWithToken = async ({
           recipientName: recipient.name,
           recipientId: recipient.id,
           recipientRole: recipient.role,
+          // actionAuth: derivedRecipientActionAuth || undefined,
         },
       }),
     });
@@ -171,9 +164,6 @@ export const completeDocumentWithToken = async ({
     select: {
       id: true,
       signingOrder: true,
-      name: true,
-      email: true,
-      role: true,
     },
     where: {
       documentId: document.id,
@@ -196,49 +186,9 @@ export const completeDocumentWithToken = async ({
       const [nextRecipient] = pendingRecipients;
 
       await prisma.$transaction(async (tx) => {
-        if (nextSigner && document.documentMeta?.allowDictateNextSigner) {
-          await tx.documentAuditLog.create({
-            data: createDocumentAuditLogData({
-              type: DOCUMENT_AUDIT_LOG_TYPE.RECIPIENT_UPDATED,
-              documentId: document.id,
-              user: {
-                name: recipient.name,
-                email: recipient.email,
-              },
-              requestMetadata,
-              data: {
-                recipientEmail: nextRecipient.email,
-                recipientName: nextRecipient.name,
-                recipientId: nextRecipient.id,
-                recipientRole: nextRecipient.role,
-                changes: [
-                  {
-                    type: RECIPIENT_DIFF_TYPE.NAME,
-                    from: nextRecipient.name,
-                    to: nextSigner.name,
-                  },
-                  {
-                    type: RECIPIENT_DIFF_TYPE.EMAIL,
-                    from: nextRecipient.email,
-                    to: nextSigner.email,
-                  },
-                ],
-              },
-            }),
-          });
-        }
-
         await tx.recipient.update({
           where: { id: nextRecipient.id },
-          data: {
+          data: { sendStatus: SendStatus.SENT },
-            sendStatus: SendStatus.SENT,
-            ...(nextSigner && document.documentMeta?.allowDictateNextSigner
-              ? {
-                  name: nextSigner.name,
-                  email: nextSigner.email,
-                }
-              : {}),
-          },
         });
 
         await jobs.triggerJob({

packages/lib/server-only/document/create-document-v2.ts

@@ -158,10 +158,6 @@ export const createDocumentV2 = async ({
             language: meta?.language || team?.teamGlobalSettings?.documentLanguage,
             typedSignatureEnabled:
               meta?.typedSignatureEnabled ?? team?.teamGlobalSettings?.typedSignatureEnabled,
-            uploadSignatureEnabled:
-              meta?.uploadSignatureEnabled ?? team?.teamGlobalSettings?.uploadSignatureEnabled,
-            drawSignatureEnabled:
-              meta?.drawSignatureEnabled ?? team?.teamGlobalSettings?.drawSignatureEnabled,
           },
         },
       },

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

@@ -128,10 +128,8 @@ export const createDocument = async ({
         documentMeta: {
           create: {
             language: team?.teamGlobalSettings?.documentLanguage,
+            typedSignatureEnabled: team?.teamGlobalSettings?.typedSignatureEnabled,
             timezone: timezone,
-            typedSignatureEnabled: team?.teamGlobalSettings?.typedSignatureEnabled ?? true,
-            uploadSignatureEnabled: team?.teamGlobalSettings?.uploadSignatureEnabled ?? true,
-            drawSignatureEnabled: team?.teamGlobalSettings?.drawSignatureEnabled ?? true,
           },
         },
       },

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

@@ -26,7 +26,6 @@ import {
   mapDocumentToWebhookDocumentPayload,
 } from '../../types/webhook-payload';
 import type { ApiRequestMetadata } from '../../universal/extract-request-metadata';
-import { isDocumentCompleted } from '../../utils/document';
 import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
 import { renderEmailWithI18N } from '../../utils/render-email-with-i18n';
 import { teamGlobalSettingsToBranding } from '../../utils/team-global-settings-to-branding';
@@ -162,7 +161,7 @@ const handleDocumentOwnerDelete = async ({
   }
 
   // Soft delete completed documents.
-  if (isDocumentCompleted(document.status)) {
+  if (document.status === DocumentStatus.COMPLETED) {
     return await prisma.$transaction(async (tx) => {
       await tx.documentAuditLog.create({
         data: createDocumentAuditLogData({