fix: update create envelope item endpoint to use formdata

packages/app-tests/e2e/api/v2/envelopes-api.spec.ts

@@ -18,7 +18,7 @@ import {
   RecipientRole,
 } from '@documenso/prisma/client';
 import { seedUser } from '@documenso/prisma/seed/users';
-import type { TCreateEnvelopeItemsRequest } from '@documenso/trpc/server/envelope-router/create-envelope-items.types';
+import type { TCreateEnvelopeItemsPayload } from '@documenso/trpc/server/envelope-router/create-envelope-items.types';
 import type {
   TCreateEnvelopePayload,
   TCreateEnvelopeResponse,
@@ -403,28 +403,20 @@ test.describe('API V2 Envelopes', () => {
     expect(unauthRequest.status()).toBe(404);
 
     // Step 2: Create second envelope item via API
-    // Todo: Envelopes - Use API Route
-    const fieldMetaDocumentData = await prisma.documentData.create({
-      data: {
-        type: 'BYTES_64',
-        data: fieldMetaPdf.toString('base64'),
-        initialData: fieldMetaPdf.toString('base64'),
-      },
-    });
-
-    const createEnvelopeItemsRequest: TCreateEnvelopeItemsRequest = {
+    const createEnvelopeItemsPayload: TCreateEnvelopeItemsPayload = {
       envelopeId: createdEnvelope.id,
-      data: [
-        {
-          title: 'Field Meta Test',
-          documentDataId: fieldMetaDocumentData.id,
-        },
-      ],
     };
 
+    const createEnvelopeItemFormData = new FormData();
+    createEnvelopeItemFormData.append('payload', JSON.stringify(createEnvelopeItemsPayload));
+    createEnvelopeItemFormData.append(
+      'files',
+      new File([fieldMetaPdf], 'field-meta.pdf', { type: 'application/pdf' }),
+    );
+
     const createItemsRes = await request.post(`${baseUrl}/envelope/item/create-many`, {
       headers: { Authorization: `Bearer ${tokenA}` },
-      data: createEnvelopeItemsRequest,
+      multipart: createEnvelopeItemFormData,
     });
 
     expect(createItemsRes.ok()).toBeTruthy();

packages/lib/client-only/providers/envelope-render-provider.tsx

@@ -23,7 +23,7 @@ type EnvelopeRenderOverrideSettings = {
 type EnvelopeRenderItem = TEnvelope['envelopeItems'][number];
 
 type EnvelopeRenderProviderValue = {
-  getPdfBuffer: (documentDataId: string) => FileData | null;
+  getPdfBuffer: (envelopeItemId: string) => FileData | null;
   envelopeItems: EnvelopeRenderItem[];
   currentEnvelopeItem: EnvelopeRenderItem | null;
   setCurrentEnvelopeItem: (envelopeItemId: string) => void;
@@ -103,14 +103,14 @@ export const EnvelopeRenderProvider = ({
   );
 
   const loadEnvelopeItemPdfFile = async (envelopeItem: EnvelopeRenderItem) => {
-    if (files[envelopeItem.documentDataId]?.status === 'loading') {
+    if (files[envelopeItem.id]?.status === 'loading') {
       return;
     }
 
-    if (!files[envelopeItem.documentDataId]) {
+    if (!files[envelopeItem.id]) {
       setFiles((prev) => ({
         ...prev,
-        [envelopeItem.documentDataId]: {
+        [envelopeItem.id]: {
           status: 'loading',
         },
       }));
@@ -129,7 +129,7 @@ export const EnvelopeRenderProvider = ({
 
       setFiles((prev) => ({
         ...prev,
-        [envelopeItem.documentDataId]: {
+        [envelopeItem.id]: {
           file: new Uint8Array(file),
           status: 'loaded',
         },
@@ -139,7 +139,7 @@ export const EnvelopeRenderProvider = ({
 
       setFiles((prev) => ({
         ...prev,
-        [envelopeItem.documentDataId]: {
+        [envelopeItem.id]: {
           status: 'error',
         },
       }));
@@ -147,8 +147,8 @@ export const EnvelopeRenderProvider = ({
   };
 
   const getPdfBuffer = useCallback(
-    (documentDataId: string) => {
-      return files[documentDataId] || null;
+    (envelopeItemId: string) => {
+      return files[envelopeItemId] || null;
     },
     [files],
   );
@@ -168,7 +168,7 @@ export const EnvelopeRenderProvider = ({
 
   // Look for any missing pdf files and load them.
   useEffect(() => {
-    const missingFiles = envelope.envelopeItems.filter((item) => !files[item.documentDataId]);
+    const missingFiles = envelope.envelopeItems.filter((item) => !files[item.id]);
 
     for (const item of missingFiles) {
       void loadEnvelopeItemPdfFile(item);

packages/lib/server-only/envelope/get-envelope-for-recipient-signing.ts

@@ -74,7 +74,6 @@ export const ZEnvelopeForSigningResponse = z.object({
       envelopeId: true,
       id: true,
       title: true,
-      documentDataId: true,
       order: true,
     }).array(),
 

packages/lib/types/envelope.ts

@@ -6,8 +6,8 @@ import { EnvelopeSchema } from '@documenso/prisma/generated/zod/modelSchema/Enve
 import { TeamSchema } from '@documenso/prisma/generated/zod/modelSchema/TeamSchema';
 import TemplateDirectLinkSchema from '@documenso/prisma/generated/zod/modelSchema/TemplateDirectLinkSchema';
 
-import { ZFieldSchema } from './field';
-import { ZRecipientLiteSchema } from './recipient';
+import { ZEnvelopeFieldSchema } from './field';
+import { ZEnvelopeRecipientLiteSchema } from './recipient';
 
 /**
  * The full envelope response schema.
@@ -56,19 +56,12 @@ export const ZEnvelopeSchema = EnvelopeSchema.pick({
     emailId: true,
     emailReplyTo: true,
   }),
-  recipients: ZRecipientLiteSchema.omit({
-    documentId: true,
-    templateId: true,
-  }).array(),
-  fields: ZFieldSchema.omit({
-    documentId: true,
-    templateId: true,
-  }).array(),
+  recipients: ZEnvelopeRecipientLiteSchema.array(),
+  fields: ZEnvelopeFieldSchema.array(),
   envelopeItems: EnvelopeItemSchema.pick({
     envelopeId: true,
     id: true,
     title: true,
-    documentDataId: true,
     order: true,
   }).array(),
   directLink: TemplateDirectLinkSchema.pick({

packages/trpc/server/envelope-router/create-envelope-items.ts

@@ -2,6 +2,7 @@ import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { getEnvelopeWhereInput } from '@documenso/lib/server-only/envelope/get-envelope-by-id';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
 import { prefixedId } from '@documenso/lib/universal/id';
+import { putNormalizedPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { canEnvelopeItemsBeModified } from '@documenso/lib/utils/envelope';
 import { prisma } from '@documenso/prisma';
@@ -13,7 +14,6 @@ import {
 } from './create-envelope-items.types';
 
 export const createEnvelopeItemsRoute = authenticatedProcedure
-  // Todo: Envelopes - Pending direct uploads
   .meta({
     openapi: {
       method: 'POST',
@@ -27,7 +27,8 @@ export const createEnvelopeItemsRoute = authenticatedProcedure
   .output(ZCreateEnvelopeItemsResponseSchema)
   .mutation(async ({ input, ctx }) => {
     const { user, teamId, metadata } = ctx;
-    const { envelopeId, data: items } = input;
+    const { payload, files } = input;
+    const { envelopeId } = payload;
 
     ctx.logger.info({
       input: {
@@ -81,7 +82,7 @@ export const createEnvelopeItemsRoute = authenticatedProcedure
     const organisationClaim = envelope.team.organisation.organisationClaim;
 
     const remainingEnvelopeItems =
-      organisationClaim.envelopeItemCount - envelope.envelopeItems.length - items.length;
+      organisationClaim.envelopeItemCount - envelope.envelopeItems.length - files.length;
 
     if (remainingEnvelopeItems < 0) {
       throw new AppError('ENVELOPE_ITEM_LIMIT_EXCEEDED', {
@@ -90,41 +91,24 @@ export const createEnvelopeItemsRoute = authenticatedProcedure
       });
     }
 
-    const foundDocumentData = await prisma.documentData.findMany({
-      where: {
-        id: {
-          in: items.map((item) => item.documentDataId),
-        },
-      },
-      select: {
-        envelopeItem: {
-          select: {
-            id: true,
-          },
-        },
-      },
-    });
+    // For each file, stream to s3 and create the document data.
+    const envelopeItems = await Promise.all(
+      files.map(async (file) => {
+        const { id: documentDataId } = await putNormalizedPdfFileServerSide(file);
 
-    // Check that all the document data was found.
-    if (foundDocumentData.length !== items.length) {
-      throw new AppError(AppErrorCode.NOT_FOUND, {
-        message: 'Document data not found',
-      });
-    }
-
-    // Check that it doesn't already have an envelope item.
-    if (foundDocumentData.some((documentData) => documentData.envelopeItem?.id)) {
-      throw new AppError(AppErrorCode.INVALID_REQUEST, {
-        message: 'Document data not found',
-      });
-    }
+        return {
+          title: file.name,
+          documentDataId,
+        };
+      }),
+    );
 
     const currentHighestOrderValue =
       envelope.envelopeItems[envelope.envelopeItems.length - 1]?.order ?? 1;
 
     const result = await prisma.$transaction(async (tx) => {
       const createdItems = await tx.envelopeItem.createManyAndReturn({
-        data: items.map((item) => ({
+        data: envelopeItems.map((item) => ({
           id: prefixedId('envelope_item'),
           envelopeId,
           title: item.title,

packages/trpc/server/envelope-router/create-envelope-items.types.ts

@@ -1,38 +1,29 @@
 import { z } from 'zod';
+import { zfd } from 'zod-form-data';
 
-import DocumentDataSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 
-import { ZDocumentTitleSchema } from '../document-router/schema';
+import { zodFormData } from '../../utils/zod-form-data';
 
-export const ZCreateEnvelopeItemsRequestSchema = z.object({
+export const ZCreateEnvelopeItemsPayloadSchema = z.object({
   envelopeId: z.string(),
-  data: z
-    .object({
-      title: ZDocumentTitleSchema,
-      documentDataId: z.string(),
-    })
-    .array(),
+  // data: z.object() // Currently not used.
+});
+
+export const ZCreateEnvelopeItemsRequestSchema = zodFormData({
+  payload: zfd.json(ZCreateEnvelopeItemsPayloadSchema),
+  files: zfd.repeatableOfType(zfd.file()),
 });
 
 export const ZCreateEnvelopeItemsResponseSchema = z.object({
   createdEnvelopeItems: EnvelopeItemSchema.pick({
     id: true,
     title: true,
-    documentDataId: true,
     envelopeId: true,
     order: true,
-  })
-    .extend({
-      documentData: DocumentDataSchema.pick({
-        type: true,
-        id: true,
-        data: true,
-        initialData: true,
-      }),
-    })
-    .array(),
+  }).array(),
 });
 
+export type TCreateEnvelopeItemsPayload = z.infer<typeof ZCreateEnvelopeItemsPayloadSchema>;
 export type TCreateEnvelopeItemsRequest = z.infer<typeof ZCreateEnvelopeItemsRequestSchema>;
 export type TCreateEnvelopeItemsResponse = z.infer<typeof ZCreateEnvelopeItemsResponseSchema>;

packages/ui/components/pdf-viewer/pdf-viewer-konva.tsx

@@ -78,7 +78,7 @@ export const PdfViewerKonva = ({
   const [pdfError, setPdfError] = useState(false);
 
   const envelopeItemFile = useMemo(() => {
-    const data = getPdfBuffer(currentEnvelopeItem?.documentDataId || '');
+    const data = getPdfBuffer(currentEnvelopeItem?.id || '');
 
     if (!data || data.status !== 'loaded') {
       return null;
@@ -87,7 +87,7 @@ export const PdfViewerKonva = ({
     return {
       data: new Uint8Array(data.file),
     };
-  }, [currentEnvelopeItem?.documentDataId, getPdfBuffer]);
+  }, [currentEnvelopeItem?.id, getPdfBuffer]);
 
   const onDocumentLoaded = useCallback(
     (doc: PDFDocumentProxy) => {