fix: finish file stuff

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

@@ -559,5 +559,10 @@ test.describe('API V2 Envelopes', () => {
     );
     expect(finalEnvelope.title).toBe('Envelope Full Field Test');
     expect(finalEnvelope.type).toBe(EnvelopeType.DOCUMENT);
+
+    console.log({
+      createdEnvelopeId: finalEnvelope.id,
+      userEmail: userA.email,
+    });
   });
 });

packages/lib/client-only/download-pdf.ts

@@ -1,12 +1,14 @@
-import type { DocumentData } from '@prisma/client';
+import type { EnvelopeItem } from '@prisma/client';
 
-import { getFile } from '../universal/upload/get-file';
+import { getEnvelopeDownloadUrl } from '../utils/envelope-download';
 import { downloadFile } from './download-file';
 
 type DocumentVersion = 'original' | 'signed';
 
 type DownloadPDFProps = {
-  documentData: DocumentData;
+  envelopeItem: Pick<EnvelopeItem, 'id' | 'envelopeId'>;
+  token: string | undefined;
+
   fileName?: string;
   /**
    * Specifies which version of the document to download.
@@ -17,18 +19,18 @@ type DownloadPDFProps = {
 };
 
 export const downloadPDF = async ({
-  documentData,
+  envelopeItem,
+  token,
   fileName,
   version = 'signed',
 }: DownloadPDFProps) => {
-  const bytes = await getFile({
-    type: documentData.type,
-    data: version === 'signed' ? documentData.data : documentData.initialData,
+  const downloadUrl = getEnvelopeDownloadUrl({
+    envelopeItem: envelopeItem,
+    token,
+    version,
   });
 
-  const blob = new Blob([bytes], {
-    type: 'application/pdf',
-  });
+  const blob = await fetch(downloadUrl).then(async (res) => await res.blob());
 
   const baseTitle = (fileName ?? 'document').replace(/\.pdf$/, '');
   const suffix = version === 'signed' ? '_signed.pdf' : '.pdf';

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

@@ -1,13 +1,11 @@
 import { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import React from 'react';
 
-import type { DocumentData } from '@prisma/client';
-
 import type { TRecipientColor } from '@documenso/ui/lib/recipient-colors';
 import { AVAILABLE_RECIPIENT_COLORS } from '@documenso/ui/lib/recipient-colors';
 
 import type { TEnvelope } from '../../types/envelope';
-import { getFile } from '../../universal/upload/get-file';
+import { getEnvelopeDownloadUrl } from '../../utils/envelope-download';
 
 type FileData =
   | {
@@ -49,6 +47,13 @@ interface EnvelopeRenderProviderProps {
    * Only required for generic page renderers.
    */
   recipientIds?: number[];
+
+  /**
+   * The token to access the envelope.
+   *
+   * If not provided, it will be assumed that the current user can access the document.
+   */
+  token: string | undefined;
 }
 
 const EnvelopeRenderContext = createContext<EnvelopeRenderProviderValue | null>(null);
@@ -70,6 +75,7 @@ export const EnvelopeRenderProvider = ({
   children,
   envelope,
   fields,
+  token,
   recipientIds = [],
 }: EnvelopeRenderProviderProps) => {
   // Indexed by documentDataId.
@@ -84,27 +90,35 @@ export const EnvelopeRenderProvider = ({
     [envelope.envelopeItems],
   );
 
-  const loadEnvelopeItemPdfFile = async (documentData: DocumentData) => {
-    if (files[documentData.id]?.status === 'loading') {
+  const loadEnvelopeItemPdfFile = async (envelopeItem: EnvelopeRenderItem) => {
+    if (files[envelopeItem.documentDataId]?.status === 'loading') {
       return;
     }
 
-    if (!files[documentData.id]) {
+    if (!files[envelopeItem.documentDataId]) {
       setFiles((prev) => ({
         ...prev,
-        [documentData.id]: {
+        [envelopeItem.documentDataId]: {
           status: 'loading',
         },
       }));
     }
 
     try {
-      const file = await getFile(documentData);
+      const downloadUrl = getEnvelopeDownloadUrl({
+        envelopeItem: envelopeItem,
+        token,
+        version: 'signed',
+      });
+
+      const blob = await fetch(downloadUrl).then(async (res) => await res.blob());
+
+      const file = await blob.arrayBuffer();
 
       setFiles((prev) => ({
         ...prev,
-        [documentData.id]: {
-          file,
+        [envelopeItem.documentDataId]: {
+          file: new Uint8Array(file),
           status: 'loaded',
         },
       }));
@@ -113,7 +127,7 @@ export const EnvelopeRenderProvider = ({
 
       setFiles((prev) => ({
         ...prev,
-        [documentData.id]: {
+        [envelopeItem.documentDataId]: {
           status: 'error',
         },
       }));
@@ -145,7 +159,7 @@ export const EnvelopeRenderProvider = ({
     const missingFiles = envelope.envelopeItems.filter((item) => !files[item.documentDataId]);
 
     for (const item of missingFiles) {
-      void loadEnvelopeItemPdfFile(item.documentData);
+      void loadEnvelopeItemPdfFile(item);
     }
   }, [envelope.envelopeItems]);
 

packages/lib/server-only/admin/admin-find-documents.ts

@@ -78,6 +78,14 @@ export const adminFindDocuments = async ({
             url: true,
           },
         },
+        envelopeItems: {
+          select: {
+            id: true,
+            envelopeId: true,
+            title: true,
+            order: true,
+          },
+        },
       },
     }),
     prisma.envelope.count({

packages/lib/server-only/document/find-documents.ts

@@ -248,6 +248,14 @@ export const findDocuments = async ({
             url: true,
           },
         },
+        envelopeItems: {
+          select: {
+            id: true,
+            envelopeId: true,
+            title: true,
+            order: true,
+          },
+        },
       },
     }),
     prisma.envelope.count({

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

@@ -91,7 +91,7 @@ export const getDocumentAndSenderByToken = async ({
         },
       },
       envelopeItems: {
-        select: {
+        include: {
           documentData: true,
         },
       },

packages/lib/server-only/document/get-document-with-details-by-id.ts

@@ -63,5 +63,8 @@ export const getDocumentWithDetailsById = async ({
       documentId: legacyDocumentId,
       password: null,
     },
+    envelopeItems: envelope.envelopeItems.map((envelopeItem) => ({
+      ...envelopeItem,
+    })),
   };
 };

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

@@ -2,7 +2,6 @@ import { DocumentSigningOrder, DocumentStatus, EnvelopeType, SigningStatus } fro
 import { z } from 'zod';
 
 import { prisma } from '@documenso/prisma';
-import DocumentDataSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import DocumentMetaSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentMetaSchema';
 import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 import EnvelopeSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeSchema';
@@ -72,20 +71,12 @@ export const ZEnvelopeForSigningResponse = z.object({
       .array(),
 
     envelopeItems: EnvelopeItemSchema.pick({
+      envelopeId: true,
       id: true,
       title: true,
       documentDataId: true,
       order: true,
-    })
-      .extend({
-        documentData: DocumentDataSchema.pick({
-          type: true,
-          id: true,
-          data: true,
-          initialData: true,
-        }),
-      })
-      .array(),
+    }).array(),
 
     team: TeamSchema.pick({
       id: true,
@@ -199,11 +190,7 @@ export const getEnvelopeForRecipientSigning = async ({
           signingOrder: 'asc',
         },
       },
-      envelopeItems: {
-        include: {
-          documentData: true,
-        },
-      },
+      envelopeItems: true,
       team: {
         select: {
           id: true,

packages/lib/server-only/template/get-template-by-direct-link-token.ts

@@ -87,5 +87,9 @@ export const getTemplateByDirectLinkToken = async ({
     },
     recipients: recipientsWithMappedFields,
     fields: recipientsWithMappedFields.flatMap((recipient) => recipient.fields),
+    envelopeItems: envelope.envelopeItems.map((item) => ({
+      id: item.id,
+      envelopeId: item.envelopeId,
+    })),
   };
 };

packages/lib/server-only/template/get-template-by-id.ts

@@ -29,6 +29,7 @@ export const getTemplateById = async ({ id, userId, teamId }: GetTemplateByIdOpt
       envelopeItems: {
         select: {
           id: true,
+          envelopeId: true,
           documentData: true,
         },
       },
@@ -94,5 +95,9 @@ export const getTemplateById = async ({ id, userId, teamId }: GetTemplateByIdOpt
         }
       : null,
     id: mapSecondaryIdToTemplateId(envelope.secondaryId),
+    envelopeItems: envelope.envelopeItems.map((envelopeItem) => ({
+      id: envelopeItem.id,
+      envelopeId: envelopeItem.envelopeId,
+    })),
   };
 };

packages/lib/types/document.ts

@@ -2,6 +2,7 @@ import { z } from 'zod';
 
 import { DocumentDataSchema } from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import { DocumentMetaSchema } from '@documenso/prisma/generated/zod/modelSchema/DocumentMetaSchema';
+import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 import { FolderSchema } from '@documenso/prisma/generated/zod/modelSchema/FolderSchema';
 import { TeamSchema } from '@documenso/prisma/generated/zod/modelSchema/TeamSchema';
 import { UserSchema } from '@documenso/prisma/generated/zod/modelSchema/UserSchema';
@@ -74,6 +75,10 @@ export const ZDocumentSchema = LegacyDocumentSchema.pick({
     password: z.string().nullable().default(null),
     documentId: z.number().default(-1).optional(),
   }),
+  envelopeItems: EnvelopeItemSchema.pick({
+    id: true,
+    envelopeId: true,
+  }).array(),
 
   folder: FolderSchema.pick({
     id: true,

packages/lib/types/envelope.ts

@@ -1,6 +1,5 @@
 import { z } from 'zod';
 
-import DocumentDataSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import { DocumentMetaSchema } from '@documenso/prisma/generated/zod/modelSchema/DocumentMetaSchema';
 import { EnvelopeItemSchema } from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 import { EnvelopeSchema } from '@documenso/prisma/generated/zod/modelSchema/EnvelopeSchema';
@@ -66,20 +65,12 @@ export const ZEnvelopeSchema = EnvelopeSchema.pick({
     templateId: true,
   }).array(),
   envelopeItems: EnvelopeItemSchema.pick({
+    envelopeId: true,
     id: true,
     title: true,
     documentDataId: true,
     order: true,
-  })
-    .extend({
-      documentData: DocumentDataSchema.pick({
-        type: true,
-        id: true,
-        data: true,
-        initialData: true,
-      }),
-    })
-    .array(),
+  }).array(),
   directLink: TemplateDirectLinkSchema.pick({
     directTemplateRecipientId: true,
     enabled: true,

packages/lib/types/template.ts

@@ -2,6 +2,7 @@ import { z } from 'zod';
 
 import { DocumentDataSchema } from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import { DocumentMetaSchema } from '@documenso/prisma/generated/zod/modelSchema/DocumentMetaSchema';
+import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 import { FolderSchema } from '@documenso/prisma/generated/zod/modelSchema/FolderSchema';
 import TeamSchema from '@documenso/prisma/generated/zod/modelSchema/TeamSchema';
 import { UserSchema } from '@documenso/prisma/generated/zod/modelSchema/UserSchema';
@@ -87,6 +88,10 @@ export const ZTemplateSchema = TemplateSchema.pick({
     createdAt: true,
     updatedAt: true,
   }).nullable(),
+  envelopeItems: EnvelopeItemSchema.pick({
+    id: true,
+    envelopeId: true,
+  }).array(),
 });
 
 export type TTemplate = z.infer<typeof ZTemplateSchema>;

packages/lib/utils/envelope-download.ts

@@ -0,0 +1,19 @@
+import type { EnvelopeItem } from '@prisma/client';
+
+import { NEXT_PUBLIC_WEBAPP_URL } from '../constants/app';
+
+export type EnvelopeDownloadUrlOptions = {
+  envelopeItem: Pick<EnvelopeItem, 'id' | 'envelopeId'>;
+  token: string | undefined;
+  version: 'original' | 'signed';
+};
+
+export const getEnvelopeDownloadUrl = (options: EnvelopeDownloadUrlOptions) => {
+  const { envelopeItem, token, version } = options;
+
+  const { id, envelopeId } = envelopeItem;
+
+  return token
+    ? `${NEXT_PUBLIC_WEBAPP_URL()}/api/files/token/${token}/envelopeItem/${id}/download/${version}`
+    : `${NEXT_PUBLIC_WEBAPP_URL()}/api/files/envelope/${envelopeId}/envelopeItem/${id}/download/${version}`;
+};

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

@@ -92,6 +92,14 @@ export const findInbox = async ({ userId, page = 1, perPage = 10, orderBy }: Fin
             url: true,
           },
         },
+        envelopeItems: {
+          select: {
+            id: true,
+            envelopeId: true,
+            title: true,
+            order: true,
+          },
+        },
       },
     }),
     prisma.envelope.count({

packages/trpc/server/embedding-router/get-multi-sign-document.types.ts

@@ -4,6 +4,7 @@ import { ZDocumentLiteSchema } from '@documenso/lib/types/document';
 import { ZRecipientLiteSchema } from '@documenso/lib/types/recipient';
 import DocumentDataSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import DocumentMetaSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentMetaSchema';
+import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 import FieldSchema from '@documenso/prisma/generated/zod/modelSchema/FieldSchema';
 import SignatureSchema from '@documenso/prisma/generated/zod/modelSchema/SignatureSchema';
 
@@ -40,6 +41,10 @@ export const ZGetMultiSignDocumentResponseSchema = ZDocumentLiteSchema.extend({
       signature: SignatureSchema.nullable(),
     }),
   ),
+  envelopeItems: EnvelopeItemSchema.pick({
+    id: true,
+    envelopeId: true,
+  }).array(),
 });
 
 export type TGetMultiSignDocumentRequestSchema = z.infer<typeof ZGetMultiSignDocumentRequestSchema>;

packages/trpc/server/envelope-router/get-envelope-items-by-token.types.ts

@@ -1,6 +1,5 @@
 import { z } from 'zod';
 
-import DocumentDataSchema from '@documenso/prisma/generated/zod/modelSchema/DocumentDataSchema';
 import EnvelopeItemSchema from '@documenso/prisma/generated/zod/modelSchema/EnvelopeItemSchema';
 
 export const ZGetEnvelopeItemsByTokenRequestSchema = z.object({
@@ -19,16 +18,8 @@ export const ZGetEnvelopeItemsByTokenRequestSchema = z.object({
 export const ZGetEnvelopeItemsByTokenResponseSchema = z.object({
   envelopeItems: EnvelopeItemSchema.pick({
     id: true,
+    envelopeId: true,
     title: true,
     order: true,
-  })
-    .extend({
-      documentData: DocumentDataSchema.pick({
-        type: true,
-        id: true,
-        data: true,
-        initialData: true,
-      }),
-    })
-    .array(),
+  }).array(),
 });

packages/ui/components/document/document-dialog.tsx

@@ -1,61 +0,0 @@
-import { useState } from 'react';
-
-import type { DocumentData } from '@prisma/client';
-import * as DialogPrimitive from '@radix-ui/react-dialog';
-import { X } from 'lucide-react';
-
-import { cn } from '../../lib/utils';
-import { Dialog, DialogOverlay, DialogPortal, DialogTrigger } from '../../primitives/dialog';
-import PDFViewer from '../../primitives/pdf-viewer';
-
-export type DocumentDialogProps = {
-  trigger?: React.ReactNode;
-  documentData: DocumentData;
-} & Omit<DialogPrimitive.DialogProps, 'children'>;
-
-/**
- * A dialog which renders the provided document.
- */
-export default function DocumentDialog({ trigger, documentData, ...props }: DocumentDialogProps) {
-  const [documentLoaded, setDocumentLoaded] = useState(false);
-
-  const onDocumentLoad = () => {
-    setDocumentLoaded(true);
-  };
-
-  return (
-    <Dialog {...props}>
-      <DialogPortal>
-        <DialogOverlay className="bg-black/80" />
-
-        {trigger && (
-          <DialogTrigger onClick={(e) => e.stopPropagation()} asChild={true}>
-            {trigger}
-          </DialogTrigger>
-        )}
-
-        <DialogPrimitive.Content
-          className={cn(
-            'animate-in data-[state=open]:fade-in-90 sm:zoom-in-90 pointer-events-none fixed z-50 h-screen w-screen overflow-y-auto px-2 py-14 opacity-0 transition-opacity lg:py-32',
-            {
-              'opacity-100': documentLoaded,
-            },
-          )}
-          onClick={() => props.onOpenChange?.(false)}
-        >
-          <PDFViewer
-            className="mx-auto w-full max-w-3xl xl:max-w-5xl"
-            documentData={documentData}
-            onClick={(e) => e.stopPropagation()}
-            onDocumentLoad={onDocumentLoad}
-          />
-
-          <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none disabled:pointer-events-none">
-            <X className="h-6 w-6 text-white" />
-            <span className="sr-only">Close</span>
-          </DialogPrimitive.Close>
-        </DialogPrimitive.Content>
-      </DialogPortal>
-    </Dialog>
-  );
-}

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

@@ -1,69 +0,0 @@
-import type { HTMLAttributes } from 'react';
-import { useState } from 'react';
-
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
-import type { DocumentData } from '@prisma/client';
-import { Download } from 'lucide-react';
-
-import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-import { Button } from '../../primitives/button';
-
-export type DownloadButtonProps = HTMLAttributes<HTMLButtonElement> & {
-  disabled?: boolean;
-  fileName?: string;
-  documentData?: DocumentData;
-};
-
-export const DocumentDownloadButton = ({
-  className,
-  fileName,
-  documentData,
-  disabled,
-  ...props
-}: DownloadButtonProps) => {
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
-  const [isLoading, setIsLoading] = useState(false);
-
-  const onDownloadClick = async () => {
-    try {
-      setIsLoading(true);
-
-      if (!documentData) {
-        setIsLoading(false);
-        return;
-      }
-
-      await downloadPDF({ documentData, fileName }).then(() => {
-        setIsLoading(false);
-      });
-    } catch (err) {
-      setIsLoading(false);
-
-      toast({
-        title: _('Something went wrong'),
-        description: _('An error occurred while downloading your document.'),
-        variant: 'destructive',
-      });
-    }
-  };
-
-  return (
-    <Button
-      type="button"
-      variant="outline"
-      className={className}
-      disabled={disabled || !documentData}
-      onClick={onDownloadClick}
-      loading={isLoading}
-      {...props}
-    >
-      {!isLoading && <Download className="mr-2 h-5 w-5" />}
-      <Trans>Download</Trans>
-    </Button>
-  );
-};

packages/ui/primitives/pdf-viewer.tsx

@@ -1,9 +1,10 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { DocumentData } from '@prisma/client';
+import type { EnvelopeItem } from '@prisma/client';
+import { base64 } from '@scure/base';
 import { Loader } from 'lucide-react';
 import { type PDFDocumentProxy } from 'pdfjs-dist';
 import { Document as PDFDocument, Page as PDFPage, pdfjs } from 'react-pdf';
@@ -11,7 +12,7 @@ import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 import 'react-pdf/dist/esm/Page/TextLayer.css';
 
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
-import { getFile } from '@documenso/lib/universal/upload/get-file';
+import { getEnvelopeDownloadUrl } from '@documenso/lib/utils/envelope-download';
 
 import { cn } from '../lib/utils';
 import { useToast } from './use-toast';
@@ -48,17 +49,23 @@ const PDFLoader = () => (
 
 export type PDFViewerProps = {
   className?: string;
-  documentData: Pick<DocumentData, 'type' | 'data'>;
+  envelopeItem: Pick<EnvelopeItem, 'id' | 'envelopeId'>;
+  token: string | undefined;
+  version: 'original' | 'signed';
   onDocumentLoad?: (_doc: LoadedPDFDocument) => void;
   onPageClick?: OnPDFViewerPageClick;
+  overrideData?: string;
   [key: string]: unknown;
 } & Omit<React.HTMLAttributes<HTMLDivElement>, 'onPageClick'>;
 
 export const PDFViewer = ({
   className,
-  documentData,
+  envelopeItem,
+  token,
+  version,
   onDocumentLoad,
   onPageClick,
+  overrideData,
   ...props
 }: PDFViewerProps) => {
   const { _ } = useLingui();
@@ -67,17 +74,14 @@ export const PDFViewer = ({
   const $el = useRef<HTMLDivElement>(null);
 
   const [isDocumentBytesLoading, setIsDocumentBytesLoading] = useState(false);
-  const [documentBytes, setDocumentBytes] = useState<Uint8Array | null>(null);
+  const [documentBytes, setDocumentBytes] = useState<Uint8Array | null>(
+    overrideData ? base64.decode(overrideData) : null,
+  );
 
   const [width, setWidth] = useState(0);
   const [numPages, setNumPages] = useState(0);
   const [pdfError, setPdfError] = useState(false);
 
-  const memoizedData = useMemo(
-    () => ({ type: documentData.type, data: documentData.data }),
-    [documentData.data, documentData.type],
-  );
-
   const isLoading = isDocumentBytesLoading || !documentBytes;
 
   const onDocumentLoaded = (doc: LoadedPDFDocument) => {
@@ -142,13 +146,26 @@ export const PDFViewer = ({
   }, []);
 
   useEffect(() => {
+    if (overrideData) {
+      const bytes = base64.decode(overrideData);
+
+      setDocumentBytes(bytes);
+      return;
+    }
+
     const fetchDocumentBytes = async () => {
       try {
         setIsDocumentBytesLoading(true);
 
-        const bytes = await getFile(memoizedData);
+        const documentUrl = getEnvelopeDownloadUrl({
+          envelopeItem: envelopeItem,
+          token,
+          version,
+        });
 
-        setDocumentBytes(bytes);
+        const bytes = await fetch(documentUrl).then(async (res) => await res.arrayBuffer());
+
+        setDocumentBytes(new Uint8Array(bytes));
 
         setIsDocumentBytesLoading(false);
       } catch (err) {
@@ -163,7 +180,7 @@ export const PDFViewer = ({
     };
 
     void fetchDocumentBytes();
-  }, [memoizedData, toast]);
+  }, [envelopeItem.envelopeId, envelopeItem.id, token, version, toast, overrideData]);
 
   return (
     <div ref={$el} className={cn('overflow-hidden', className)} {...props}>