fix: remove server actions (#684)

apps/marketing/next.config.js

@@ -22,7 +22,7 @@ const config = {
   experimental: {
     outputFileTracingRoot: path.join(__dirname, '../../'),
     serverActions: {
-      bodySizeLimit: '50mb' 
+      bodySizeLimit: '50mb',
     },
   },
   reactStrictMode: true,

apps/marketing/package.json

@@ -24,8 +24,8 @@
     "lucide-react": "^0.279.0",
     "luxon": "^3.4.0",
     "micro": "^10.0.1",
-    "next": "14.0.0",
+    "next": "14.0.3",
-    "next-auth": "4.24.3",
+    "next-auth": "4.24.5",
     "next-contentlayer": "^0.3.4",
     "next-plausible": "^3.10.1",
     "perfect-freehand": "^1.2.0",
@@ -44,5 +44,13 @@
     "@types/node": "20.1.0",
     "@types/react": "18.2.18",
     "@types/react-dom": "18.2.7"
+  },
+  "overrides": {
+    "next-auth": {
+      "next": "$next"
+    },
+    "next-contentlayer": {
+      "next": "$next"
+    }
   }
 }

apps/web/next.config.js

@@ -23,7 +23,7 @@ const config = {
   experimental: {
     outputFileTracingRoot: path.join(__dirname, '../../'),
     serverActions: {
-      bodySizeLimit: '50mb' 
+      bodySizeLimit: '50mb',
     },
   },
   reactStrictMode: true,

apps/web/package.json

@@ -27,8 +27,8 @@
     "lucide-react": "^0.279.0",
     "luxon": "^3.4.0",
     "micro": "^10.0.1",
-    "next": "14.0.0",
+    "next": "14.0.3",
-    "next-auth": "4.24.3",
+    "next-auth": "4.24.5",
     "next-plausible": "^3.10.1",
     "next-themes": "^0.2.1",
     "perfect-freehand": "^1.2.0",
@@ -53,5 +53,13 @@
     "@types/node": "20.1.0",
     "@types/react": "18.2.18",
     "@types/react-dom": "18.2.7"
+  },
+  "overrides": {
+    "next-auth": {
+      "next": "$next"
+    },
+    "next-contentlayer": {
+      "next": "$next"
+    }
   }
 }

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

@@ -7,6 +7,7 @@ import { useRouter } from 'next/navigation';
 import type { DocumentData, Field, Recipient, User } from '@documenso/prisma/client';
 import { DocumentStatus } from '@documenso/prisma/client';
 import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
+import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
 import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { AddFieldsFormPartial } from '@documenso/ui/primitives/document-flow/add-fields';
@@ -25,11 +26,6 @@ import type { DocumentFlowStep } from '@documenso/ui/primitives/document-flow/ty
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { addFields } from '~/components/forms/edit-document/add-fields.action';
-import { addSigners } from '~/components/forms/edit-document/add-signers.action';
-import { completeDocument } from '~/components/forms/edit-document/add-subject.action';
-import { addTitle } from '~/components/forms/edit-document/add-title.action';
-
 export type EditDocumentFormProps = {
   className?: string;
   user: User;
@@ -56,6 +52,11 @@ export const EditDocumentForm = ({
     document.status === DocumentStatus.DRAFT ? 'title' : 'signers',
   );
 
+  const { mutateAsync: addTitle } = trpc.document.setTitleForDocument.useMutation();
+  const { mutateAsync: addFields } = trpc.field.addFields.useMutation();
+  const { mutateAsync: addSigners } = trpc.recipient.addSigners.useMutation();
+  const { mutateAsync: sendDocument } = trpc.document.sendDocument.useMutation();
+
   const documentFlow: Record<EditDocumentStep, DocumentFlowStep> = {
     title: {
       title: 'Add Title',
@@ -154,7 +155,7 @@ export const EditDocumentForm = ({
     const { subject, message } = data.email;
 
     try {
-      await completeDocument({
+      await sendDocument({
         documentId: document.id,
         email: {
           subject,

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

@@ -7,9 +7,9 @@ import { useRouter } from 'next/navigation';
 import { useSession } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
 
-import { completeDocumentWithToken } from '@documenso/lib/server-only/document/complete-document-with-token';
 import { sortFieldsByPosition, validateFieldsInserted } from '@documenso/lib/utils/fields';
-import { Document, Field, Recipient } from '@documenso/prisma/client';
+import type { Document, Field, Recipient } from '@documenso/prisma/client';
+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';
@@ -34,6 +34,9 @@ export const SigningForm = ({ document, recipient, fields }: SigningFormProps) =
   const { fullName, signature, setFullName, setSignature } = useRequiredSigningContext();
   const [validateUninsertedFields, setValidateUninsertedFields] = useState(false);
 
+  const { mutateAsync: completeDocumentWithToken } =
+    trpc.recipient.completeDocumentWithToken.useMutation();
+
   const {
     handleSubmit,
     formState: { isSubmitting },

apps/web/src/components/forms/edit-document/add-fields.action.ts

@@ -1,30 +0,0 @@
-'use server';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { setFieldsForDocument } from '@documenso/lib/server-only/field/set-fields-for-document';
-import type { TAddFieldsFormSchema } from '@documenso/ui/primitives/document-flow/add-fields.types';
-
-export type AddFieldsActionInput = TAddFieldsFormSchema & {
-  documentId: number;
-};
-
-export const addFields = async ({ documentId, fields }: AddFieldsActionInput) => {
-  'use server';
-
-  const { user } = await getRequiredServerComponentSession();
-
-  await setFieldsForDocument({
-    userId: user.id,
-    documentId,
-    fields: fields.map((field) => ({
-      id: field.nativeId,
-      signerEmail: field.signerEmail,
-      type: field.type,
-      pageNumber: field.pageNumber,
-      pageX: field.pageX,
-      pageY: field.pageY,
-      pageWidth: field.pageWidth,
-      pageHeight: field.pageHeight,
-    })),
-  });
-};

apps/web/src/components/forms/edit-document/add-signers.action.ts

@@ -1,25 +0,0 @@
-'use server';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { setRecipientsForDocument } from '@documenso/lib/server-only/recipient/set-recipients-for-document';
-import type { TAddSignersFormSchema } from '@documenso/ui/primitives/document-flow/add-signers.types';
-
-export type AddSignersActionInput = TAddSignersFormSchema & {
-  documentId: number;
-};
-
-export const addSigners = async ({ documentId, signers }: AddSignersActionInput) => {
-  'use server';
-
-  const { user } = await getRequiredServerComponentSession();
-
-  await setRecipientsForDocument({
-    userId: user.id,
-    documentId,
-    recipients: signers.map((signer) => ({
-      id: signer.nativeId,
-      email: signer.email,
-      name: signer.name,
-    })),
-  });
-};

apps/web/src/components/forms/edit-document/add-subject.action.ts

@@ -1,29 +0,0 @@
-'use server';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { upsertDocumentMeta } from '@documenso/lib/server-only/document-meta/upsert-document-meta';
-import { sendDocument } from '@documenso/lib/server-only/document/send-document';
-import type { TAddSubjectFormSchema } from '@documenso/ui/primitives/document-flow/add-subject.types';
-
-export type CompleteDocumentActionInput = TAddSubjectFormSchema & {
-  documentId: number;
-};
-
-export const completeDocument = async ({ documentId, email }: CompleteDocumentActionInput) => {
-  'use server';
-
-  const { user } = await getRequiredServerComponentSession();
-
-  if (email.message || email.subject) {
-    await upsertDocumentMeta({
-      documentId,
-      subject: email.subject,
-      message: email.message,
-    });
-  }
-
-  return await sendDocument({
-    userId: user.id,
-    documentId,
-  });
-};

apps/web/src/components/forms/edit-document/add-title.action.ts

@@ -1,21 +0,0 @@
-'use server';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { updateTitle } from '@documenso/lib/server-only/document/update-title';
-import type { TAddTitleFormSchema } from '@documenso/ui/primitives/document-flow/add-title.types';
-
-export type AddTitleActionInput = TAddTitleFormSchema & {
-  documentId: number;
-};
-
-export const addTitle = async ({ documentId, title }: AddTitleActionInput) => {
-  'use server';
-
-  const { user } = await getRequiredServerComponentSession();
-
-  await updateTitle({
-    documentId,
-    userId: user.id,
-    title: title,
-  });
-};

package.json

@@ -47,8 +47,13 @@
     "apps/*",
     "packages/*"
   ],
-  "dependencies": {
+  "dependencies": {},
-    "recharts": "^2.7.2",
+  "overrides": {
-    "react-hotkeys-hook": "^4.4.1"
+    "next-auth": {
+      "next": "14.0.3"
+    },
+    "next-contentlayer": {
+      "next": "14.0.3"
+    }
   }
 }

packages/ee/package.json

@@ -17,8 +17,8 @@
     "@documenso/prisma": "*",
     "luxon": "^3.4.0",
     "micro": "^10.0.1",
-    "next": "14.0.0",
+    "next": "14.0.3",
-    "next-auth": "4.24.3",
+    "next-auth": "4.24.5",
     "react": "18.2.0",
     "ts-pattern": "^5.0.5",
     "zod": "^3.22.4"

packages/email/components.ts

@@ -0,0 +1,17 @@
+export * from '@react-email/body';
+export * from '@react-email/button';
+export * from '@react-email/column';
+export * from '@react-email/container';
+export * from '@react-email/font';
+export * from '@react-email/head';
+export * from '@react-email/heading';
+export * from '@react-email/hr';
+export * from '@react-email/html';
+export * from '@react-email/img';
+export * from '@react-email/link';
+export * from '@react-email/preview';
+export * from '@react-email/render';
+export * from '@react-email/row';
+export * from '@react-email/section';
+export * from '@react-email/tailwind';
+export * from '@react-email/text';

packages/email/package.json

@@ -18,8 +18,23 @@
   },
   "dependencies": {
     "@documenso/nodemailer-resend": "2.0.0",
-    "@react-email/components": "^0.0.11",
+    "@react-email/body": "0.0.4",
-    "@react-email/tailwind": "0.0.9",
+    "@react-email/button": "0.0.11",
+    "@react-email/column": "0.0.8",
+    "@react-email/container": "0.0.10",
+    "@react-email/font": "0.0.4",
+    "@react-email/head": "0.0.6",
+    "@react-email/heading": "0.0.9",
+    "@react-email/hr": "0.0.6",
+    "@react-email/html": "0.0.6",
+    "@react-email/img": "0.0.6",
+    "@react-email/link": "0.0.6",
+    "@react-email/preview": "0.0.7",
+    "@react-email/render": "0.0.9",
+    "@react-email/row": "0.0.6",
+    "@react-email/section": "0.0.10",
+    "@react-email/tailwind": "0.0.13-canary.1",
+    "@react-email/text": "0.0.6",
     "nodemailer": "^6.9.3",
     "react-email": "^1.9.5",
     "resend": "^2.0.0"
@@ -29,8 +44,5 @@
     "@documenso/tsconfig": "*",
     "@types/nodemailer": "^6.4.8",
     "tsup": "^7.1.0"
-  },
-  "overrides": {
-    "@react-email/tailwind": "0.0.9"
   }
 }

packages/email/render.ts

@@ -1 +1 @@
-export { render } from '@react-email/components';
+export { render, renderAsync } from '@react-email/render';

packages/email/template-components/template-confirmation-email.tsx

@@ -1,7 +1,4 @@
-import { Button, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export type TemplateConfirmationEmailProps = {
@@ -14,15 +11,7 @@ export const TemplateConfirmationEmail = ({
   assetBaseUrl,
 }: TemplateConfirmationEmailProps) => {
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section className="flex-row items-center justify-center">
@@ -47,6 +36,6 @@ export const TemplateConfirmationEmail = ({
           </Text>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };

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

@@ -1,7 +1,4 @@
-import { Button, Column, Img, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Column, Img, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export interface TemplateDocumentCompletedProps {
@@ -20,15 +17,7 @@ export const TemplateDocumentCompleted = ({
   };
 
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section>
@@ -72,7 +61,7 @@ export const TemplateDocumentCompleted = ({
           </Button>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

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

@@ -1,4 +1,4 @@
-import { Column, Img, Row, Section } from '@react-email/components';
+import { Column, Img, Row, Section } from '../components';
 
 export interface TemplateDocumentImageProps {
   assetBaseUrl: string;

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

@@ -1,7 +1,4 @@
-import { Button, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export interface TemplateDocumentInviteProps {
@@ -19,15 +16,7 @@ export const TemplateDocumentInvite = ({
   assetBaseUrl,
 }: TemplateDocumentInviteProps) => {
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section>
@@ -49,7 +38,7 @@ export const TemplateDocumentInvite = ({
           </Button>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

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

@@ -1,7 +1,4 @@
-import { Column, Img, Section, Tailwind, Text } from '@react-email/components';
+import { Column, Img, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export interface TemplateDocumentPendingProps {
@@ -18,15 +15,7 @@ export const TemplateDocumentPending = ({
   };
 
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section>
@@ -52,7 +41,7 @@ export const TemplateDocumentPending = ({
           We'll notify you as soon as it's ready.
         </Text>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

packages/email/template-components/template-document-self-signed.tsx

@@ -1,7 +1,4 @@
-import { Button, Column, Img, Link, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Column, Img, Link, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export interface TemplateDocumentSelfSignedProps {
@@ -20,15 +17,7 @@ export const TemplateDocumentSelfSigned = ({
   };
 
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section className="flex-row items-center justify-center">
@@ -84,7 +73,7 @@ export const TemplateDocumentSelfSigned = ({
           </Button>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

packages/email/template-components/template-footer.tsx

@@ -1,4 +1,4 @@
-import { Link, Section, Text } from '@react-email/components';
+import { Link, Section, Text } from '../components';
 
 export type TemplateFooterProps = {
   isDocument?: boolean;

packages/email/template-components/template-forgot-password.tsx

@@ -1,7 +1,4 @@
-import { Button, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export type TemplateForgotPasswordProps = {
@@ -14,15 +11,7 @@ export const TemplateForgotPassword = ({
   assetBaseUrl,
 }: TemplateForgotPasswordProps) => {
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section className="flex-row items-center justify-center">
@@ -43,7 +32,7 @@ export const TemplateForgotPassword = ({
           </Button>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

packages/email/template-components/template-reset-password.tsx

@@ -1,7 +1,4 @@
-import { Button, Section, Tailwind, Text } from '@react-email/components';
+import { Button, Section, Text } from '../components';
-
-import * as config from '@documenso/tailwind-config';
-
 import { TemplateDocumentImage } from './template-document-image';
 
 export interface TemplateResetPasswordProps {
@@ -12,15 +9,7 @@ export interface TemplateResetPasswordProps {
 
 export const TemplateResetPassword = ({ assetBaseUrl }: TemplateResetPasswordProps) => {
   return (
-    <Tailwind
+    <>
-      config={{
-        theme: {
-          extend: {
-            colors: config.theme.extend.colors,
-          },
-        },
-      }}
-    >
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
 
       <Section className="flex-row items-center justify-center">
@@ -41,7 +30,7 @@ export const TemplateResetPassword = ({ assetBaseUrl }: TemplateResetPasswordPro
           </Button>
         </Section>
       </Section>
-    </Tailwind>
+    </>
   );
 };
 

packages/email/templates/confirm-email.tsx

@@ -1,20 +1,8 @@
-import {
-  Body,
-  Container,
-  Head,
-  Html,
-  Img,
-  Preview,
-  Section,
-  Tailwind,
-} from '@react-email/components';
-
 import config from '@documenso/tailwind-config';
 
-import {
+import { Body, Container, Head, Html, Img, Preview, Section, Tailwind } from '../components';
-  TemplateConfirmationEmail,
+import type { TemplateConfirmationEmailProps } from '../template-components/template-confirmation-email';
-  TemplateConfirmationEmailProps,
+import { TemplateConfirmationEmail } from '../template-components/template-confirmation-email';
-} from '../template-components/template-confirmation-email';
 import { TemplateFooter } from '../template-components/template-footer';
 
 export const ConfirmEmailTemplate = ({

packages/email/templates/document-completed.tsx

@@ -1,20 +1,8 @@
-import {
-  Body,
-  Container,
-  Head,
-  Html,
-  Img,
-  Preview,
-  Section,
-  Tailwind,
-} from '@react-email/components';
-
 import config from '@documenso/tailwind-config';
 
-import {
+import { Body, Container, Head, Html, Img, Preview, Section, Tailwind } from '../components';
-  TemplateDocumentCompleted,
+import type { TemplateDocumentCompletedProps } from '../template-components/template-document-completed';
-  TemplateDocumentCompletedProps,
+import { TemplateDocumentCompleted } from '../template-components/template-document-completed';
-} from '../template-components/template-document-completed';
 import { TemplateFooter } from '../template-components/template-footer';
 
 export type DocumentCompletedEmailTemplateProps = Partial<TemplateDocumentCompletedProps>;

packages/email/templates/document-invite.tsx

@@ -1,3 +1,5 @@
+import config from '@documenso/tailwind-config';
+
 import {
   Body,
   Container,
@@ -10,14 +12,9 @@ import {
   Section,
   Tailwind,
   Text,
-} from '@react-email/components';
+} from '../components';
-
+import type { TemplateDocumentInviteProps } from '../template-components/template-document-invite';
-import config from '@documenso/tailwind-config';
+import { TemplateDocumentInvite } from '../template-components/template-document-invite';
-
-import {
-  TemplateDocumentInvite,
-  TemplateDocumentInviteProps,
-} from '../template-components/template-document-invite';
 import { TemplateFooter } from '../template-components/template-footer';
 
 export type DocumentInviteEmailTemplateProps = Partial<TemplateDocumentInviteProps> & {

packages/email/templates/document-pending.tsx

@@ -1,20 +1,8 @@
-import {
-  Body,
-  Container,
-  Head,
-  Html,
-  Img,
-  Preview,
-  Section,
-  Tailwind,
-} from '@react-email/components';
-
 import config from '@documenso/tailwind-config';
 
-import {
+import { Body, Container, Head, Html, Img, Preview, Section, Tailwind } from '../components';
-  TemplateDocumentPending,
+import type { TemplateDocumentPendingProps } from '../template-components/template-document-pending';
-  TemplateDocumentPendingProps,
+import { TemplateDocumentPending } from '../template-components/template-document-pending';
-} from '../template-components/template-document-pending';
 import { TemplateFooter } from '../template-components/template-footer';
 
 export type DocumentPendingEmailTemplateProps = Partial<TemplateDocumentPendingProps>;

packages/email/templates/document-self-signed.tsx

@@ -1,20 +1,8 @@
-import {
-  Body,
-  Container,
-  Head,
-  Html,
-  Img,
-  Preview,
-  Section,
-  Tailwind,
-} from '@react-email/components';
-
 import config from '@documenso/tailwind-config';
 
-import {
+import { Body, Container, Head, Html, Img, Preview, Section, Tailwind } from '../components';
-  TemplateDocumentSelfSigned,
+import type { TemplateDocumentSelfSignedProps } from '../template-components/template-document-self-signed';
-  TemplateDocumentSelfSignedProps,
+import { TemplateDocumentSelfSigned } from '../template-components/template-document-self-signed';
-} from '../template-components/template-document-self-signed';
 import { TemplateFooter } from '../template-components/template-footer';
 
 export type DocumentSelfSignedTemplateProps = TemplateDocumentSelfSignedProps;

packages/email/templates/forgot-password.tsx

@@ -1,21 +1,9 @@
-import {
-  Body,
-  Container,
-  Head,
-  Html,
-  Img,
-  Preview,
-  Section,
-  Tailwind,
-} from '@react-email/components';
-
 import config from '@documenso/tailwind-config';
 
+import { Body, Container, Head, Html, Img, Preview, Section, Tailwind } from '../components';
 import { TemplateFooter } from '../template-components/template-footer';
-import {
+import type { TemplateForgotPasswordProps } from '../template-components/template-forgot-password';
-  TemplateForgotPassword,
+import { TemplateForgotPassword } from '../template-components/template-forgot-password';
-  TemplateForgotPasswordProps,
-} from '../template-components/template-forgot-password';
 
 export type ForgotPasswordTemplateProps = Partial<TemplateForgotPasswordProps>;
 

packages/email/templates/reset-password.tsx

@@ -1,3 +1,5 @@
+import config from '@documenso/tailwind-config';
+
 import {
   Body,
   Container,
@@ -10,15 +12,10 @@ import {
   Section,
   Tailwind,
   Text,
-} from '@react-email/components';
+} from '../components';
-
-import config from '@documenso/tailwind-config';
-
 import { TemplateFooter } from '../template-components/template-footer';
-import {
+import type { TemplateResetPasswordProps } from '../template-components/template-reset-password';
-  TemplateResetPassword,
+import { TemplateResetPassword } from '../template-components/template-reset-password';
-  TemplateResetPasswordProps,
-} from '../template-components/template-reset-password';
 
 export type ResetPasswordTemplateProps = Partial<TemplateResetPasswordProps>;
 

packages/lib/package.json

@@ -34,8 +34,8 @@
     "bcrypt": "^5.1.0",
     "luxon": "^3.4.0",
     "nanoid": "^4.0.2",
-    "next": "14.0.0",
+    "next": "14.0.3",
-    "next-auth": "4.24.3",
+    "next-auth": "4.24.5",
     "oslo": "^0.17.0",
     "pdf-lib": "^1.17.1",
     "react": "18.2.0",

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

@@ -54,6 +54,7 @@ export const signFieldWithToken = async ({
     field.type === FieldType.SIGNATURE || field.type === FieldType.FREE_SIGNATURE;
 
   let customText = !isSignatureField ? value : undefined;
+
   const signatureImageAsBase64 = isSignatureField && isBase64 ? value : undefined;
   const typedSignature = isSignatureField && !isBase64 ? value : undefined;
 
@@ -61,29 +62,48 @@ export const signFieldWithToken = async ({
     customText = DateTime.now().toFormat('yyyy-MM-dd hh:mm a');
   }
 
-  await prisma.field.update({
+  if (isSignatureField && !signatureImageAsBase64 && !typedSignature) {
-    where: {
+    throw new Error('Signature field must have a signature');
-      id: field.id,
+  }
-    },
+
-    data: {
+  return await prisma.$transaction(async (tx) => {
-      customText,
+    const updatedField = await tx.field.update({
-      inserted: true,
+      where: {
-      Signature: isSignatureField
+        id: field.id,
-        ? {
+      },
-            upsert: {
+      data: {
-              create: {
+        customText,
-                recipientId: field.recipientId,
+        inserted: true,
-                signatureImageAsBase64,
+      },
-                typedSignature,
+    });
-              },
+
-              update: {
+    if (isSignatureField) {
-                recipientId: field.recipientId,
+      if (!field.recipientId) {
-                signatureImageAsBase64,
+        throw new Error('Field has no recipientId');
-                typedSignature,
+      }
-              },
+
-            },
+      const signature = await tx.signature.upsert({
-          }
+        where: {
-        : undefined,
+          fieldId: field.id,
-    },
+        },
+        create: {
+          fieldId: field.id,
+          recipientId: field.recipientId,
+          signatureImageAsBase64: signatureImageAsBase64,
+          typedSignature: typedSignature,
+        },
+        update: {
+          signatureImageAsBase64: signatureImageAsBase64,
+          typedSignature: typedSignature,
+        },
+      });
+
+      // Dirty but I don't want to deal with type information
+      Object.assign(updatedField, {
+        Signature: signature,
+      });
+    }
+
+    return updatedField;
   });
 };

packages/tailwind-config/package.json

@@ -9,7 +9,7 @@
   "dependencies": {
     "autoprefixer": "^10.4.13",
     "postcss": "^8.4.21",
-    "tailwindcss": "^3.2.7",
+    "tailwindcss": "3.3.2",
     "tailwindcss-animate": "^1.0.5"
   },
   "devDependencies": {

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

@@ -1,6 +1,7 @@
 import { TRPCError } from '@trpc/server';
 
 import { getServerLimits } from '@documenso/ee/server-only/limits/server';
+import { upsertDocumentMeta } from '@documenso/lib/server-only/document-meta/upsert-document-meta';
 import { createDocument } from '@documenso/lib/server-only/document/create-document';
 import { deleteDraftDocument } from '@documenso/lib/server-only/document/delete-draft-document';
 import { duplicateDocumentById } from '@documenso/lib/server-only/document/duplicate-document-by-id';
@@ -176,7 +177,15 @@ export const documentRouter = router({
     .input(ZSendDocumentMutationSchema)
     .mutation(async ({ input, ctx }) => {
       try {
-        const { documentId } = input;
+        const { documentId, email } = input;
+
+        if (email.message || email.subject) {
+          await upsertDocumentMeta({
+            documentId,
+            subject: email.subject,
+            message: email.message,
+          });
+        }
 
         return await sendDocument({
           userId: ctx.user.id,

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

@@ -65,6 +65,10 @@ export type TSetFieldsForDocumentMutationSchema = z.infer<
 
 export const ZSendDocumentMutationSchema = z.object({
   documentId: z.number(),
+  email: z.object({
+    subject: z.string(),
+    message: z.string(),
+  }),
 });
 
 export const ZResendDocumentMutationSchema = z.object({

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

@@ -1,15 +1,47 @@
 import { TRPCError } from '@trpc/server';
 
 import { removeSignedFieldWithToken } from '@documenso/lib/server-only/field/remove-signed-field-with-token';
+import { setFieldsForDocument } from '@documenso/lib/server-only/field/set-fields-for-document';
 import { signFieldWithToken } from '@documenso/lib/server-only/field/sign-field-with-token';
 
-import { procedure, router } from '../trpc';
+import { authenticatedProcedure, procedure, router } from '../trpc';
 import {
+  ZAddFieldsMutationSchema,
   ZRemovedSignedFieldWithTokenMutationSchema,
   ZSignFieldWithTokenMutationSchema,
 } from './schema';
 
 export const fieldRouter = router({
+  addFields: authenticatedProcedure
+    .input(ZAddFieldsMutationSchema)
+    .mutation(async ({ input, ctx }) => {
+      try {
+        const { documentId, fields } = input;
+
+        return await setFieldsForDocument({
+          documentId,
+          userId: ctx.user.id,
+          fields: fields.map((field) => ({
+            id: field.nativeId,
+            signerEmail: field.signerEmail,
+            type: field.type,
+            pageNumber: field.pageNumber,
+            pageX: field.pageX,
+            pageY: field.pageY,
+            pageWidth: field.pageWidth,
+            pageHeight: field.pageHeight,
+          })),
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message: 'We were unable to sign this field. Please try again later.',
+        });
+      }
+    }),
+
   signFieldWithToken: procedure
     .input(ZSignFieldWithTokenMutationSchema)
     .mutation(async ({ input }) => {

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

@@ -1,5 +1,26 @@
 import { z } from 'zod';
 
+import { FieldType } from '@documenso/prisma/client';
+
+export const ZAddFieldsMutationSchema = z.object({
+  documentId: z.number(),
+  fields: z.array(
+    z.object({
+      formId: z.string().min(1),
+      nativeId: z.number().optional(),
+      type: z.nativeEnum(FieldType),
+      signerEmail: z.string().min(1),
+      pageNumber: z.number().min(1),
+      pageX: z.number().min(0),
+      pageY: z.number().min(0),
+      pageWidth: z.number().min(0),
+      pageHeight: z.number().min(0),
+    }),
+  ),
+});
+
+export type TAddFieldsMutationSchema = z.infer<typeof ZAddFieldsMutationSchema>;
+
 export const ZSignFieldWithTokenMutationSchema = z.object({
   token: z.string(),
   fieldId: z.number(),

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

@@ -0,0 +1,54 @@
+import { TRPCError } from '@trpc/server';
+
+import { completeDocumentWithToken } from '@documenso/lib/server-only/document/complete-document-with-token';
+import { setRecipientsForDocument } from '@documenso/lib/server-only/recipient/set-recipients-for-document';
+
+import { authenticatedProcedure, procedure, router } from '../trpc';
+import { ZAddSignersMutationSchema, ZCompleteDocumentWithTokenMutationSchema } from './schema';
+
+export const recipientRouter = router({
+  addSigners: authenticatedProcedure
+    .input(ZAddSignersMutationSchema)
+    .mutation(async ({ input, ctx }) => {
+      try {
+        const { documentId, signers } = input;
+
+        return await setRecipientsForDocument({
+          userId: ctx.user.id,
+          documentId,
+          recipients: signers.map((signer) => ({
+            id: signer.nativeId,
+            email: signer.email,
+            name: signer.name,
+          })),
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message: 'We were unable to sign this field. Please try again later.',
+        });
+      }
+    }),
+
+  completeDocumentWithToken: procedure
+    .input(ZCompleteDocumentWithTokenMutationSchema)
+    .mutation(async ({ input }) => {
+      try {
+        const { token, documentId } = input;
+
+        return await completeDocumentWithToken({
+          token,
+          documentId,
+        });
+      } catch (err) {
+        console.error(err);
+
+        throw new TRPCError({
+          code: 'BAD_REQUEST',
+          message: 'We were unable to sign this field. Please try again later.',
+        });
+      }
+    }),
+});

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

@@ -0,0 +1,33 @@
+import { z } from 'zod';
+
+export const ZAddSignersMutationSchema = z
+  .object({
+    documentId: z.number(),
+    signers: z.array(
+      z.object({
+        nativeId: z.number().optional(),
+        email: z.string().email().min(1),
+        name: z.string(),
+      }),
+    ),
+  })
+  .refine(
+    (schema) => {
+      const emails = schema.signers.map((signer) => signer.email.toLowerCase());
+
+      return new Set(emails).size === emails.length;
+    },
+    // Dirty hack to handle errors when .root is populated for an array type
+    { message: 'Signers must have unique emails', path: ['signers__root'] },
+  );
+
+export type TAddSignersMutationSchema = z.infer<typeof ZAddSignersMutationSchema>;
+
+export const ZCompleteDocumentWithTokenMutationSchema = z.object({
+  token: z.string(),
+  documentId: z.number(),
+});
+
+export type TCompleteDocumentWithTokenMutationSchema = z.infer<
+  typeof ZCompleteDocumentWithTokenMutationSchema
+>;

packages/trpc/server/router.ts

@@ -3,6 +3,7 @@ import { authRouter } from './auth-router/router';
 import { documentRouter } from './document-router/router';
 import { fieldRouter } from './field-router/router';
 import { profileRouter } from './profile-router/router';
+import { recipientRouter } from './recipient-router/router';
 import { shareLinkRouter } from './share-link-router/router';
 import { singleplayerRouter } from './singleplayer-router/router';
 import { router } from './trpc';
@@ -13,6 +14,7 @@ export const appRouter = router({
   profile: profileRouter,
   document: documentRouter,
   field: fieldRouter,
+  recipient: recipientRouter,
   admin: adminRouter,
   shareLink: shareLinkRouter,
   singleplayer: singleplayerRouter,

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

@@ -3,7 +3,7 @@ import { createElement } from 'react';
 import { PDFDocument } from 'pdf-lib';
 
 import { mailer } from '@documenso/email/mailer';
-import { render } from '@documenso/email/render';
+import { renderAsync } from '@documenso/email/render';
 import { DocumentSelfSignedEmailTemplate } from '@documenso/email/templates/document-self-signed';
 import { FROM_ADDRESS, FROM_NAME, SERVICE_USER_EMAIL } from '@documenso/lib/constants/email';
 import { insertFieldInPDF } from '@documenso/lib/server-only/pdf/insert-field-in-pdf';
@@ -36,6 +36,7 @@ export const singleplayerRouter = router({
       });
 
       const doc = await PDFDocument.load(document);
+
       const createdAt = new Date();
 
       const isBase64 = signer.signature.startsWith('data:image/png;base64,');
@@ -149,6 +150,11 @@ export const singleplayerRouter = router({
         assetBaseUrl: process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000',
       });
 
+      const [html, text] = await Promise.all([
+        renderAsync(template),
+        renderAsync(template, { plainText: true }),
+      ]);
+
       // Send email to signer.
       await mailer.sendMail({
         to: {
@@ -160,8 +166,8 @@ export const singleplayerRouter = router({
           address: FROM_ADDRESS,
         },
         subject: 'Document signed',
-        html: render(template),
+        html,
-        text: render(template, { plainText: true }),
+        text,
         attachments: [{ content: signedPdfBuffer, filename: documentName }],
       });
 

packages/ui/package.json

@@ -62,7 +62,7 @@
     "framer-motion": "^10.12.8",
     "lucide-react": "^0.279.0",
     "luxon": "^3.4.2",
-    "next": "14.0.0",
+    "next": "14.0.3",
     "pdfjs-dist": "3.6.172",
     "react-day-picker": "^8.7.1",
     "react-hook-form": "^7.45.4",