feat: simplify billing ux

Co-authored-by: Ephraim Atta-Duncan <ephraimduncan68@gmail.com>

.env.example

@@ -29,6 +29,10 @@ NEXT_PUBLIC_WEBAPP_URL="http://localhost:3000"
 # URL used by the web app to request itself (e.g. local background jobs)
 NEXT_PRIVATE_INTERNAL_WEBAPP_URL="http://localhost:3000"
 
+# [[SERVER]]
+# OPTIONAL: The port the server will listen on. Defaults to 3000.
+PORT=3000
+
 # [[DATABASE]]
 NEXT_PRIVATE_DATABASE_URL="postgres://documenso:password@127.0.0.1:54320/documenso"
 # Defines the URL to use for the database when running migrations and other commands that won't work with a connection pool.

CODE_STYLE.md

@@ -0,0 +1,692 @@
+# Documenso Code Style Guide
+
+This document captures the code style, patterns, and conventions used in the Documenso codebase. It covers both enforceable rules and subjective "taste" elements that make our code consistent and maintainable.
+
+## Table of Contents
+
+1. [General Principles](#general-principles)
+2. [TypeScript Conventions](#typescript-conventions)
+3. [Imports & Dependencies](#imports--dependencies)
+4. [Functions & Methods](#functions--methods)
+5. [React & Components](#react--components)
+6. [Error Handling](#error-handling)
+7. [Async/Await Patterns](#asyncawait-patterns)
+8. [Whitespace & Formatting](#whitespace--formatting)
+9. [Naming Conventions](#naming-conventions)
+10. [Pattern Matching](#pattern-matching)
+11. [Database & Prisma](#database--prisma)
+12. [TRPC Patterns](#trpc-patterns)
+
+---
+
+## General Principles
+
+- **Functional over Object-Oriented**: Prefer functional programming patterns over classes
+- **Explicit over Implicit**: Be explicit about types, return values, and error cases
+- **Early Returns**: Use guard clauses and early returns to reduce nesting
+- **Immutability**: Favor `const` over `let`; avoid mutation where possible
+
+---
+
+## TypeScript Conventions
+
+### Type Definitions
+
+```typescript
+// ✅ Prefer `type` over `interface`
+type CreateDocumentOptions = {
+  templateId: number;
+  userId: number;
+  recipients: Recipient[];
+};
+
+// ❌ Avoid interfaces unless absolutely necessary
+interface CreateDocumentOptions {
+  templateId: number;
+}
+```
+
+### Type Imports
+
+```typescript
+// ✅ Use `type` keyword for type-only imports
+import type { Document, Recipient } from '@prisma/client';
+import { DocumentStatus } from '@prisma/client';
+
+// Types in function signatures
+export const findDocuments = async ({ userId, teamId }: FindDocumentsOptions) => {
+  // ...
+};
+```
+
+### Inline Types for Function Parameters
+
+```typescript
+// ✅ Extract inline types to named types
+type FinalRecipient = Pick<Recipient, 'name' | 'email' | 'role' | 'authOptions'> & {
+  templateRecipientId: number;
+  fields: Field[];
+};
+
+const finalRecipients: FinalRecipient[] = [];
+```
+
+---
+
+## Imports & Dependencies
+
+### Import Organization
+
+Imports should be organized in the following order with blank lines between groups:
+
+```typescript
+// 1. React imports
+import { useCallback, useEffect, useMemo } from 'react';
+
+// 2. Third-party library imports (alphabetically)
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans } from '@lingui/react/macro';
+import type { Document, Recipient } from '@prisma/client';
+import { DocumentStatus, RecipientRole } from '@prisma/client';
+import { match } from 'ts-pattern';
+
+// 3. Internal package imports (from @documenso/*)
+import { AppError } from '@documenso/lib/errors/app-error';
+import { prisma } from '@documenso/prisma';
+import { Button } from '@documenso/ui/primitives/button';
+
+// 4. Relative imports
+import { getTeamById } from '../team/get-team';
+import type { FindResultResponse } from './types';
+```
+
+### Destructuring Imports
+
+```typescript
+// ✅ Destructure specific exports
+// ✅ Use type imports for types
+import type { Document } from '@prisma/client';
+
+import { Button } from '@documenso/ui/primitives/button';
+import { Input } from '@documenso/ui/primitives/input';
+```
+
+---
+
+## Functions & Methods
+
+### Arrow Functions
+
+```typescript
+// ✅ Always use arrow functions for functions
+export const createDocument = async ({
+  userId,
+  title,
+}: CreateDocumentOptions) => {
+  // ...
+};
+
+// ✅ Callbacks and handlers
+const onSubmit = useCallback(async () => {
+  // ...
+}, [dependencies]);
+
+// ❌ Avoid regular function declarations
+function createDocument() {
+  // ...
+}
+```
+
+### Function Parameters
+
+```typescript
+// ✅ Use destructured object parameters for multiple params
+export const findDocuments = async ({
+  userId,
+  teamId,
+  status = ExtendedDocumentStatus.ALL,
+  page = 1,
+  perPage = 10,
+}: FindDocumentsOptions) => {
+  // ...
+};
+
+// ✅ Destructure on separate line when needed
+const onFormSubmit = form.handleSubmit(onSubmit);
+
+// ✅ Deconstruct nested properties explicitly
+const { user } = ctx;
+const { templateId } = input;
+```
+
+---
+
+## React & Components
+
+### Component Definition
+
+```typescript
+// ✅ Use const with arrow function
+export const AddSignersFormPartial = ({
+  documentFlow,
+  recipients,
+  fields,
+  onSubmit,
+}: AddSignersFormProps) => {
+  // ...
+};
+
+// ❌ Never use classes
+class MyComponent extends React.Component {
+  // ...
+}
+```
+
+### Hooks
+
+```typescript
+// ✅ Group related hooks together with blank line separation
+const { _ } = useLingui();
+const { toast } = useToast();
+
+const { currentStep, totalSteps, previousStep } = useStep();
+
+const form = useForm<TFormSchema>({
+  resolver: zodResolver(ZFormSchema),
+  defaultValues: {
+    // ...
+  },
+});
+```
+
+### Event Handlers
+
+```typescript
+// ✅ Use arrow functions with descriptive names
+const onFormSubmit = async () => {
+  await form.trigger();
+  // ...
+};
+
+const onFieldCopy = useCallback(
+  (event?: KeyboardEvent | null) => {
+    event?.preventDefault();
+    // ...
+  },
+  [dependencies],
+);
+
+// ✅ Inline handlers for simple operations
+<Button onClick={() => setOpen(false)}>Close</Button>
+```
+
+### State Management
+
+```typescript
+// ✅ Descriptive state names with auxiliary verbs
+const [isLoading, setIsLoading] = useState(false);
+const [hasError, setHasError] = useState(false);
+const [showAdvancedSettings, setShowAdvancedSettings] = useState(false);
+
+// ✅ Complex state in single useState when related
+const [coords, setCoords] = useState({
+  x: 0,
+  y: 0,
+});
+```
+
+---
+
+## Error Handling
+
+### Try-Catch Blocks
+
+```typescript
+// ✅ Use try-catch for operations that might fail
+try {
+  const document = await getDocumentById({
+    documentId: Number(documentId),
+    userId: user.id,
+  });
+
+  return {
+    status: 200,
+    body: document,
+  };
+} catch (err) {
+  return {
+    status: 404,
+    body: {
+      message: 'Document not found',
+    },
+  };
+}
+```
+
+### Throwing Errors
+
+```typescript
+// ✅ Use AppError for application errors
+throw new AppError(AppErrorCode.NOT_FOUND, {
+  message: 'Template not found',
+});
+
+// ✅ Use descriptive error messages
+if (!template) {
+  throw new AppError(AppErrorCode.NOT_FOUND, {
+    message: `Template with ID ${templateId} not found`,
+  });
+}
+```
+
+### Error Parsing on Frontend
+
+```typescript
+// ✅ Parse errors on the frontend
+try {
+  await updateOrganisation({ organisationId, data });
+} catch (err) {
+  const error = AppError.parseError(err);
+  console.error(error);
+
+  toast({
+    title: t`An error occurred`,
+    description: error.message,
+    variant: 'destructive',
+  });
+}
+```
+
+---
+
+## Async/Await Patterns
+
+### Async Function Definitions
+
+```typescript
+// ✅ Mark async functions clearly
+export const createDocument = async ({
+  userId,
+  title,
+}: Options): Promise<Document> => {
+  // ...
+};
+
+// ✅ Use await for promises
+const document = await prisma.document.create({ data });
+
+// ✅ Use Promise.all for parallel operations
+const [document, recipients] = await Promise.all([
+  getDocumentById({ documentId }),
+  getRecipientsForDocument({ documentId }),
+]);
+```
+
+### Void for Fire-and-Forget
+
+```typescript
+// ✅ Use void for intentionally unwaited promises
+void handleAutoSave();
+
+// ✅ Or in event handlers
+onClick={() => void onFormSubmit()}
+```
+
+---
+
+## Whitespace & Formatting
+
+### Blank Lines Between Concepts
+
+```typescript
+// ✅ Blank line after imports
+import { prisma } from '@documenso/prisma';
+
+export const findDocuments = async () => {
+  // ...
+};
+
+// ✅ Blank line between logical sections
+const user = await prisma.user.findFirst({ where: { id: userId } });
+
+let team = null;
+
+if (teamId !== undefined) {
+  team = await getTeamById({ userId, teamId });
+}
+
+// ✅ Blank line before return statements
+const result = await someOperation();
+
+return result;
+```
+
+### Function/Method Spacing
+
+```typescript
+// ✅ No blank lines between chained methods in same operation
+const documents = await prisma.document
+  .findMany({ where: { userId } })
+  .then((docs) => docs.map(maskTokens));
+
+// ✅ Blank line between different operations
+const document = await createDocument({ userId });
+
+await sendDocument({ documentId: document.id });
+
+return document;
+```
+
+### Object and Array Formatting
+
+```typescript
+// ✅ Multi-line when complex
+const options = {
+  userId,
+  teamId,
+  status: ExtendedDocumentStatus.ALL,
+  page: 1,
+};
+
+// ✅ Single line when simple
+const coords = { x: 0, y: 0 };
+
+// ✅ Array items on separate lines when objects
+const recipients = [
+  {
+    name: 'John',
+    email: 'john@example.com',
+  },
+  {
+    name: 'Jane',
+    email: 'jane@example.com',
+  },
+];
+```
+
+---
+
+## Naming Conventions
+
+### Variables
+
+```typescript
+// ✅ camelCase for variables and functions
+const documentId = 123;
+const onSubmit = () => {};
+
+// ✅ Descriptive names with auxiliary verbs for booleans
+const isLoading = false;
+const hasError = false;
+const canEdit = true;
+const shouldRender = true;
+
+// ✅ Prefix with $ for DOM elements
+const $page = document.querySelector('.page');
+const $inputRef = useRef<HTMLInputElement>(null);
+```
+
+### Types and Schemas
+
+```typescript
+// ✅ PascalCase for types
+type CreateDocumentOptions = {
+  userId: number;
+};
+
+// ✅ Prefix Zod schemas with Z
+const ZCreateDocumentSchema = z.object({
+  title: z.string(),
+});
+
+// ✅ Prefix type from Zod schema with T
+type TCreateDocumentSchema = z.infer<typeof ZCreateDocumentSchema>;
+```
+
+### Constants
+
+```typescript
+// ✅ UPPER_SNAKE_CASE for true constants
+const DEFAULT_DOCUMENT_DATE_FORMAT = 'dd/MM/yyyy';
+const MAX_FILE_SIZE = 1024 * 1024 * 5;
+
+// ✅ camelCase for const variables that aren't "constants"
+const userId = await getUserId();
+```
+
+### Functions
+
+```typescript
+// ✅ Verb-based names for functions
+const createDocument = async () => {};
+const findDocuments = async () => {};
+const updateDocument = async () => {};
+const deleteDocument = async () => {};
+
+// ✅ On prefix for event handlers
+const onSubmit = () => {};
+const onClick = () => {};
+const onFieldCopy = () => {}; // 'on' is also acceptable
+```
+
+### Clarity Over Brevity
+
+```typescript
+// ✅ Prefer descriptive names over abbreviations
+const superLongMethodThatIsCorrect = () => {};
+const recipientAuthenticationOptions = {};
+const documentMetadata = {};
+
+// ❌ Avoid abbreviations that sacrifice clarity
+const supLongMethThatIsCorrect = () => {};
+const recipAuthOpts = {};
+const docMeta = {};
+
+// ✅ Common abbreviations that are widely understood are acceptable
+const userId = 123;
+const htmlElement = document.querySelector('div');
+const apiResponse = await fetch('/api');
+```
+
+---
+
+## Pattern Matching
+
+### Using ts-pattern
+
+```typescript
+import { match } from 'ts-pattern';
+
+// ✅ Use match for complex conditionals
+const result = match(status)
+  .with(ExtendedDocumentStatus.DRAFT, () => ({
+    status: 'draft',
+  }))
+  .with(ExtendedDocumentStatus.PENDING, () => ({
+    status: 'pending',
+  }))
+  .with(ExtendedDocumentStatus.COMPLETED, () => ({
+    status: 'completed',
+  }))
+  .exhaustive();
+
+// ✅ Use .otherwise() for default case when not exhaustive
+const value = match(type)
+  .with('text', () => 'Text field')
+  .with('number', () => 'Number field')
+  .otherwise(() => 'Unknown field');
+```
+
+---
+
+## Database & Prisma
+
+### Query Structure
+
+```typescript
+// ✅ Destructure commonly used fields
+const { id, email, name } = user;
+
+// ✅ Use select to limit returned fields
+const user = await prisma.user.findFirst({
+  where: { id: userId },
+  select: {
+    id: true,
+    email: true,
+    name: true,
+  },
+});
+
+// ✅ Use include for relations
+const document = await prisma.document.findFirst({
+  where: { id: documentId },
+  include: {
+    recipients: true,
+    fields: true,
+  },
+});
+```
+
+### Transactions
+
+```typescript
+// ✅ Use transactions for related operations
+return await prisma.$transaction(async (tx) => {
+  const document = await tx.document.create({ data });
+
+  await tx.field.createMany({ data: fieldsData });
+
+  await tx.documentAuditLog.create({ data: auditData });
+
+  return document;
+});
+```
+
+### Where Clauses
+
+```typescript
+// ✅ Build complex where clauses separately
+const whereClause: Prisma.DocumentWhereInput = {
+  AND: [
+    { userId: user.id },
+    { deletedAt: null },
+    { status: { in: [DocumentStatus.DRAFT, DocumentStatus.PENDING] } },
+  ],
+};
+
+const documents = await prisma.document.findMany({
+  where: whereClause,
+});
+```
+
+---
+
+## TRPC Patterns
+
+### Router Structure
+
+```typescript
+// ✅ Destructure context and input at start
+.query(async ({ input, ctx }) => {
+  const { teamId } = ctx;
+  const { templateId } = input;
+
+  ctx.logger.info({
+    input: { templateId },
+  });
+
+  return await getTemplateById({
+    id: templateId,
+    userId: ctx.user.id,
+    teamId,
+  });
+});
+```
+
+### Request/Response Schemas
+
+```typescript
+// ✅ Name schemas clearly
+const ZCreateDocumentRequestSchema = z.object({
+  title: z.string(),
+  recipients: z.array(ZRecipientSchema),
+});
+
+const ZCreateDocumentResponseSchema = z.object({
+  documentId: z.number(),
+  status: z.string(),
+});
+```
+
+### Error Handling in TRPC
+
+```typescript
+// ✅ Catch and transform errors appropriately
+try {
+  const result = await createDocument({ userId, data });
+
+  return result;
+} catch (err) {
+  return AppError.toRestAPIError(err);
+}
+
+// ✅ Or throw AppError directly
+if (!template) {
+  throw new AppError(AppErrorCode.NOT_FOUND, {
+    message: 'Template not found',
+  });
+}
+```
+
+---
+
+## Additional Patterns
+
+### Optional Chaining
+
+```typescript
+// ✅ Use optional chaining for potentially undefined values
+const email = user?.email;
+const recipientToken = recipient?.token ?? '';
+
+// ✅ Use nullish coalescing for defaults
+const pageSize = perPage ?? 10;
+const status = documentStatus ?? DocumentStatus.DRAFT;
+```
+
+### Array Operations
+
+```typescript
+// ✅ Use functional array methods
+const activeRecipients = recipients.filter((r) => r.signingStatus === 'SIGNED');
+const recipientEmails = recipients.map((r) => r.email);
+const hasSignedRecipients = recipients.some((r) => r.signingStatus === 'SIGNED');
+
+// ✅ Use find instead of filter + [0]
+const recipient = recipients.find((r) => r.id === recipientId);
+```
+
+### Conditional Rendering
+
+```typescript
+// ✅ Use && for conditional rendering
+{isLoading && <Loader />}
+
+// ✅ Use ternary for either/or
+{isLoading ? <Loader /> : <Content />}
+
+// ✅ Extract complex conditions to variables
+const shouldShowAdvanced = isAdmin && hasPermission && !isDisabled;
+{shouldShowAdvanced && <AdvancedSettings />}
+```
+
+---
+
+## When in Doubt
+
+- **Consistency**: Follow the patterns you see in similar files
+- **Readability**: Favor code that's easy to read over clever one-liners
+- **Explicitness**: Be explicit rather than implicit
+- **Whitespace**: Use blank lines to separate logical sections
+- **Early Returns**: Use guard clauses to reduce nesting
+- **Functional**: Prefer functional patterns over imperative ones

apps/openpage-api/package.json

@@ -5,7 +5,7 @@
   "scripts": {
     "dev": "next dev -p 3003",
     "build": "next build",
-    "start": "next start",
+    "start": "next start -p 3003",
     "lint:fix": "next lint --fix",
     "clean": "rimraf .next && rimraf node_modules"
   },

apps/remix/app/components/dialogs/admin-organisation-member-update-dialog.tsx

@@ -0,0 +1,218 @@
+import { useEffect, useState } from 'react';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useLingui } from '@lingui/react/macro';
+import { Trans } from '@lingui/react/macro';
+import { OrganisationMemberRole } from '@prisma/client';
+import type * as DialogPrimitive from '@radix-ui/react-dialog';
+import { useForm } from 'react-hook-form';
+import { useNavigate } from 'react-router';
+import { match } from 'ts-pattern';
+import { z } from 'zod';
+
+import { getHighestOrganisationRoleInGroup } from '@documenso/lib/utils/organisations';
+import { trpc } from '@documenso/trpc/react';
+import type { TGetAdminOrganisationResponse } from '@documenso/trpc/server/admin-router/get-admin-organisation.types';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+export type AdminOrganisationMemberUpdateDialogProps = {
+  trigger?: React.ReactNode;
+  organisationId: string;
+  organisationMember: TGetAdminOrganisationResponse['members'][number];
+  isOwner: boolean;
+} & Omit<DialogPrimitive.DialogProps, 'children'>;
+
+const ZUpdateOrganisationMemberFormSchema = z.object({
+  role: z.enum(['OWNER', 'ADMIN', 'MANAGER', 'MEMBER']),
+});
+
+type ZUpdateOrganisationMemberSchema = z.infer<typeof ZUpdateOrganisationMemberFormSchema>;
+
+export const AdminOrganisationMemberUpdateDialog = ({
+  trigger,
+  organisationId,
+  organisationMember,
+  isOwner,
+  ...props
+}: AdminOrganisationMemberUpdateDialogProps) => {
+  const [open, setOpen] = useState(false);
+
+  const { t } = useLingui();
+  const { toast } = useToast();
+  const navigate = useNavigate();
+
+  // Determine the current role value for the form
+  const currentRoleValue = isOwner
+    ? 'OWNER'
+    : getHighestOrganisationRoleInGroup(
+        organisationMember.organisationGroupMembers.map((ogm) => ogm.group),
+      );
+  const organisationMemberName = organisationMember.user.name ?? organisationMember.user.email;
+
+  const form = useForm<ZUpdateOrganisationMemberSchema>({
+    resolver: zodResolver(ZUpdateOrganisationMemberFormSchema),
+    defaultValues: {
+      role: currentRoleValue,
+    },
+  });
+
+  const { mutateAsync: updateOrganisationMemberRole } =
+    trpc.admin.organisationMember.updateRole.useMutation();
+
+  const onFormSubmit = async ({ role }: ZUpdateOrganisationMemberSchema) => {
+    try {
+      await updateOrganisationMemberRole({
+        organisationId,
+        userId: organisationMember.userId,
+        role,
+      });
+
+      const roleLabel = match(role)
+        .with('OWNER', () => t`Owner`)
+        .with(OrganisationMemberRole.ADMIN, () => t`Admin`)
+        .with(OrganisationMemberRole.MANAGER, () => t`Manager`)
+        .with(OrganisationMemberRole.MEMBER, () => t`Member`)
+        .exhaustive();
+
+      toast({
+        title: t`Success`,
+        description:
+          role === 'OWNER'
+            ? t`Ownership transferred to ${organisationMemberName}.`
+            : t`Updated ${organisationMemberName} to ${roleLabel}.`,
+        duration: 5000,
+      });
+
+      setOpen(false);
+
+      // Refresh the page to show updated data
+      await navigate(0);
+    } catch (err) {
+      console.error(err);
+
+      toast({
+        title: t`An unknown error occurred`,
+        description: t`We encountered an unknown error while attempting to update this organisation member. Please try again later.`,
+        variant: 'destructive',
+      });
+    }
+  };
+
+  useEffect(() => {
+    if (!open) {
+      return;
+    }
+
+    form.reset({
+      role: currentRoleValue,
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [open, currentRoleValue, form]);
+
+  return (
+    <Dialog
+      {...props}
+      open={open}
+      onOpenChange={(value) => !form.formState.isSubmitting && setOpen(value)}
+    >
+      <DialogTrigger onClick={(e) => e.stopPropagation()} asChild>
+        {trigger ?? (
+          <Button variant="secondary">
+            <Trans>Update role</Trans>
+          </Button>
+        )}
+      </DialogTrigger>
+
+      <DialogContent position="center">
+        <DialogHeader>
+          <DialogTitle>
+            <Trans>Update organisation member</Trans>
+          </DialogTitle>
+
+          <DialogDescription className="mt-4">
+            <Trans>
+              You are currently updating{' '}
+              <span className="font-bold">{organisationMemberName}.</span>
+            </Trans>
+          </DialogDescription>
+        </DialogHeader>
+
+        <Form {...form}>
+          <form onSubmit={form.handleSubmit(onFormSubmit)}>
+            <fieldset className="flex h-full flex-col" disabled={form.formState.isSubmitting}>
+              <FormField
+                control={form.control}
+                name="role"
+                render={({ field }) => (
+                  <FormItem className="w-full">
+                    <FormLabel required>
+                      <Trans>Role</Trans>
+                    </FormLabel>
+                    <FormControl>
+                      <Select {...field} onValueChange={field.onChange}>
+                        <SelectTrigger className="text-muted-foreground">
+                          <SelectValue />
+                        </SelectTrigger>
+
+                        <SelectContent className="w-full" position="popper">
+                          <SelectItem value="OWNER">
+                            <Trans>Owner</Trans>
+                          </SelectItem>
+                          <SelectItem value={OrganisationMemberRole.ADMIN}>
+                            <Trans>Admin</Trans>
+                          </SelectItem>
+                          <SelectItem value={OrganisationMemberRole.MANAGER}>
+                            <Trans>Manager</Trans>
+                          </SelectItem>
+                          <SelectItem value={OrganisationMemberRole.MEMBER}>
+                            <Trans>Member</Trans>
+                          </SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <DialogFooter className="mt-4">
+                <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
+                  <Trans>Cancel</Trans>
+                </Button>
+
+                <Button type="submit" loading={form.formState.isSubmitting}>
+                  <Trans>Update</Trans>
+                </Button>
+              </DialogFooter>
+            </fieldset>
+          </form>
+        </Form>
+      </DialogContent>
+    </Dialog>
+  );
+};

apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx

@@ -15,18 +15,16 @@ import {
 import { AnimatePresence, motion } from 'framer-motion';
 import { InfoIcon } from 'lucide-react';
 import { useForm } from 'react-hook-form';
+import { useNavigate } from 'react-router';
 import { match } from 'ts-pattern';
 import * as z from 'zod';
 
 import { useCurrentOrganisation } from '@documenso/lib/client-only/providers/organisation';
-import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
 import type { TEnvelope } from '@documenso/lib/types/envelope';
-import { formatSigningLink } from '@documenso/lib/utils/recipients';
 import { trpc, trpc as trpcReact } from '@documenso/trpc/react';
-import { CopyTextButton } from '@documenso/ui/components/common/copy-text-button';
 import { DocumentSendEmailMessageHelper } from '@documenso/ui/components/document/document-send-email-message-helper';
+import { cn } from '@documenso/ui/lib/utils';
 import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
-import { AvatarWithText } from '@documenso/ui/primitives/avatar';
 import { Button } from '@documenso/ui/primitives/button';
 import {
   Dialog,
@@ -65,6 +63,7 @@ export type EnvelopeDistributeDialogProps = {
     fields: Pick<Field, 'type' | 'recipientId'>[];
   };
   onDistribute?: () => Promise<void>;
+  documentRootPath: string;
   trigger?: React.ReactNode;
 };
 
@@ -89,6 +88,7 @@ export type TEnvelopeDistributeFormSchema = z.infer<typeof ZEnvelopeDistributeFo
 export const EnvelopeDistributeDialog = ({
   envelope,
   trigger,
+  documentRootPath,
   onDistribute,
 }: EnvelopeDistributeDialogProps) => {
   const organisation = useCurrentOrganisation();
@@ -97,6 +97,7 @@ export const EnvelopeDistributeDialog = ({
 
   const { toast } = useToast();
   const { t } = useLingui();
+  const navigate = useNavigate();
 
   const [isOpen, setIsOpen] = useState(false);
 
@@ -163,6 +164,14 @@ export const EnvelopeDistributeDialog = ({
 
       await onDistribute?.();
 
+      let redirectPath = `${documentRootPath}/${envelope.id}`;
+
+      if (meta.distributionMethod === DocumentDistributionMethod.NONE) {
+        redirectPath += '?action=copy-links';
+      }
+
+      await navigate(redirectPath);
+
       toast({
         title: t`Envelope distributed`,
         description: t`Your envelope has been distributed successfully.`,
@@ -198,6 +207,7 @@ export const EnvelopeDistributeDialog = ({
             <Trans>Recipients will be able to sign the document once sent</Trans>
           </DialogDescription>
         </DialogHeader>
+
         {!invalidEnvelopeCode ? (
           <Form {...form}>
             <form onSubmit={handleSubmit(onFormSubmit)}>
@@ -220,7 +230,11 @@ export const EnvelopeDistributeDialog = ({
                   </TabsList>
                 </Tabs>
 
-                <div className="min-h-72">
+                <div
+                  className={cn('min-h-72', {
+                    'min-h-[23rem]': organisation.organisationClaim.flags.emailDomains,
+                  })}
+                >
                   <AnimatePresence initial={false} mode="wait">
                     {distributionMethod === DocumentDistributionMethod.EMAIL && (
                       <motion.div
@@ -355,73 +369,18 @@ export const EnvelopeDistributeDialog = ({
                         exit={{ opacity: 0, transition: { duration: 0.15 } }}
                         className="min-h-60 rounded-lg border"
                       >
-                        {envelope.status === DocumentStatus.DRAFT ? (
-                          <div className="text-muted-foreground py-24 text-center text-sm">
-                            <p>
-                              <Trans>We won't send anything to notify recipients.</Trans>
-                            </p>
+                        <div className="text-muted-foreground py-24 text-center text-sm">
+                          <p>
+                            <Trans>We won't send anything to notify recipients.</Trans>
+                          </p>
 
-                            <p className="mt-2">
-                              <Trans>
-                                We will generate signing links for you, which you can send to the
-                                recipients through your method of choice.
-                              </Trans>
-                            </p>
-                          </div>
-                        ) : (
-                          <ul className="text-muted-foreground divide-y">
-                            {/* Todo: Envelopes - I don't think this section shows up */}
-
-                            {recipients.length === 0 && (
-                              <li className="flex flex-col items-center justify-center py-6 text-sm">
-                                <Trans>No recipients</Trans>
-                              </li>
-                            )}
-
-                            {recipients.map((recipient) => (
-                              <li
-                                key={recipient.id}
-                                className="flex items-center justify-between px-4 py-3 text-sm"
-                              >
-                                <AvatarWithText
-                                  avatarFallback={recipient.email.slice(0, 1).toUpperCase()}
-                                  primaryText={
-                                    <p className="text-muted-foreground text-sm">
-                                      {recipient.email}
-                                    </p>
-                                  }
-                                  secondaryText={
-                                    <p className="text-muted-foreground/70 text-xs">
-                                      {t(RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName)}
-                                    </p>
-                                  }
-                                />
-
-                                {recipient.role !== RecipientRole.CC && (
-                                  <CopyTextButton
-                                    value={formatSigningLink(recipient.token)}
-                                    onCopySuccess={() => {
-                                      toast({
-                                        title: t`Copied to clipboard`,
-                                        description: t`The signing link has been copied to your clipboard.`,
-                                      });
-                                    }}
-                                    badgeContentUncopied={
-                                      <p className="ml-1 text-xs">
-                                        <Trans>Copy</Trans>
-                                      </p>
-                                    }
-                                    badgeContentCopied={
-                                      <p className="ml-1 text-xs">
-                                        <Trans>Copied</Trans>
-                                      </p>
-                                    }
-                                  />
-                                )}
-                              </li>
-                            ))}
-                          </ul>
-                        )}
+                          <p className="mt-2">
+                            <Trans>
+                              We will generate signing links for you, which you can send to the
+                              recipients through your method of choice.
+                            </Trans>
+                          </p>
+                        </div>
                       </motion.div>
                     )}
                   </AnimatePresence>

apps/remix/app/components/dialogs/envelope-download-dialog.tsx

@@ -213,8 +213,6 @@ export const EnvelopeDownloadDialog = ({
               </div>
             ))
           )}
-
-          {/* Todo: Envelopes - Download all button */}
         </div>
       </DialogContent>
     </Dialog>

apps/remix/app/components/dialogs/template-create-dialog.tsx

@@ -7,9 +7,9 @@ import { FilePlus, Loader } from 'lucide-react';
 import { useNavigate } from 'react-router';
 
 import { useSession } from '@documenso/lib/client-only/providers/session';
+import { putPdfFile } from '@documenso/lib/universal/upload/put-file';
 import { formatTemplatesPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import type { TCreateTemplatePayloadSchema } from '@documenso/trpc/server/template-router/schema';
 import { Button } from '@documenso/ui/primitives/button';
 import {
   Dialog,
@@ -54,17 +54,13 @@ export const TemplateCreateDialog = ({ folderId }: TemplateCreateDialogProps) =>
     setIsUploadingFile(true);
 
     try {
-      const payload = {
+      const response = await putPdfFile(file);
+
+      const { legacyTemplateId: id } = await createTemplate({
         title: file.name,
+        templateDocumentDataId: response.id,
         folderId: folderId,
-      } satisfies TCreateTemplatePayloadSchema;
-
-      const formData = new FormData();
-
-      formData.append('payload', JSON.stringify(payload));
-      formData.append('file', file);
-
-      const { envelopeId: id } = await createTemplate(formData);
+      });
 
       toast({
         title: _(msg`Template document uploaded`),

apps/remix/app/components/forms/editor/editor-field-signature-form.tsx

@@ -1,6 +1,7 @@
 import { useEffect } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { Trans } from '@lingui/react/macro';
 import { useForm, useWatch } from 'react-hook-form';
 import type { z } from 'zod';
 
@@ -60,7 +61,12 @@ export const EditorFieldSignatureForm = ({
     <Form {...form}>
       <form>
         <fieldset className="flex flex-col gap-2">
-          <EditorGenericFontSizeField formControl={form.control} />
+          <div>
+            <EditorGenericFontSizeField formControl={form.control} />
+            <p className="text-muted-foreground mt-0.5 text-xs">
+              <Trans>The typed signature font size</Trans>
+            </p>
+          </div>
         </fieldset>
       </form>
     </Form>

apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx

@@ -8,11 +8,13 @@ import { Popover, PopoverContent, PopoverTrigger } from '@documenso/ui/primitive
 export type DocumentSigningAttachmentsPopoverProps = {
   envelopeId: string;
   token: string;
+  trigger?: React.ReactNode;
 };
 
 export const DocumentSigningAttachmentsPopover = ({
   envelopeId,
   token,
+  trigger,
 }: DocumentSigningAttachmentsPopoverProps) => {
   const { data: attachments } = trpc.envelope.attachment.find.useQuery({
     envelopeId,
@@ -26,15 +28,17 @@ export const DocumentSigningAttachmentsPopover = ({
   return (
     <Popover>
       <PopoverTrigger asChild>
-        <Button variant="outline" className="gap-2">
-          <PaperclipIcon className="h-4 w-4" />
-          <span>
-            <Trans>Attachments</Trans>{' '}
-            {attachments && attachments.data.length > 0 && (
-              <span className="ml-1">({attachments.data.length})</span>
-            )}
-          </span>
-        </Button>
+        {trigger ?? (
+          <Button variant="outline" className="gap-2">
+            <PaperclipIcon className="h-4 w-4" />
+            <span>
+              <Trans>Attachments</Trans>{' '}
+              {attachments && attachments.data.length > 0 && (
+                <span className="ml-1">({attachments.data.length})</span>
+              )}
+            </span>
+          </Button>
+        )}
       </PopoverTrigger>
 
       <PopoverContent className="w-96" align="start">

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

@@ -3,7 +3,7 @@ import { lazy, useMemo } from 'react';
 import { Plural, Trans } from '@lingui/react/macro';
 import { EnvelopeType, RecipientRole } from '@prisma/client';
 import { motion } from 'framer-motion';
-import { ArrowLeftIcon, BanIcon, DownloadCloudIcon } from 'lucide-react';
+import { ArrowLeftIcon, BanIcon, DownloadCloudIcon, PaperclipIcon } from 'lucide-react';
 import { Link } from 'react-router';
 import { match } from 'ts-pattern';
 
@@ -75,7 +75,7 @@ export const DocumentSigningPageViewV2 = () => {
       <EnvelopeSignerHeader />
 
       {/* Main Content Area */}
-      <div className="flex h-[calc(100vh-73px)] w-screen">
+      <div className="flex h-[calc(100vh-4rem)] w-screen">
         {/* Left Section - Step Navigation */}
         <div className="bg-background border-border hidden w-80 flex-shrink-0 flex-col overflow-y-auto border-r py-4 lg:flex">
           <div className="px-4">
@@ -121,12 +121,16 @@ export const DocumentSigningPageViewV2 = () => {
                 <Trans>Actions</Trans>
               </h4>
 
-              <div className="w-full">
-                <DocumentSigningAttachmentsPopover
-                  envelopeId={envelope.id}
-                  token={recipient.token}
-                />
-              </div>
+              <DocumentSigningAttachmentsPopover
+                envelopeId={envelope.id}
+                token={recipient.token}
+                trigger={
+                  <Button variant="ghost" size="sm" className="w-full justify-start">
+                    <PaperclipIcon className="mr-2 h-4 w-4" />
+                    <Trans>Attachments</Trans>
+                  </Button>
+                }
+              />
 
               <EnvelopeDownloadDialog
                 envelopeId={envelope.id}

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

@@ -8,6 +8,7 @@ import {
   RecipientRole,
   SigningStatus,
 } from '@prisma/client';
+import { prop, sortBy } from 'remeda';
 
 import { isBase64Image } from '@documenso/lib/constants/signatures';
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -165,7 +166,29 @@ export const EnvelopeSigningProvider = ({
    * The fields that are still required to be signed by the actual recipient.
    */
   const recipientFieldsRemaining = useMemo(() => {
-    return envelopeData.recipient.fields.filter((field) => isFieldUnsignedAndRequired(field));
+    const requiredFields = envelopeData.recipient.fields
+      .filter((field) => isFieldUnsignedAndRequired(field))
+      .map((field) => {
+        const envelopeItem = envelope.envelopeItems.find(
+          (item) => item.id === field.envelopeItemId,
+        );
+
+        if (!envelopeItem) {
+          throw new Error('Missing envelope item');
+        }
+
+        return {
+          ...field,
+          envelopeItemOrder: envelopeItem.order,
+        };
+      });
+
+    return sortBy(
+      requiredFields,
+      [prop('envelopeItemOrder'), 'asc'],
+      [prop('page'), 'asc'],
+      [prop('positionY'), 'asc'],
+    );
   }, [envelopeData.recipient.fields]);
 
   /**

apps/remix/app/components/general/document/document-certificate-qr-view.tsx

@@ -4,7 +4,10 @@ import { Trans } from '@lingui/react/macro';
 import type { DocumentData, EnvelopeItem } from '@prisma/client';
 import { DateTime } from 'luxon';
 
-import { EnvelopeRenderProvider } from '@documenso/lib/client-only/providers/envelope-render-provider';
+import {
+  EnvelopeRenderProvider,
+  useCurrentEnvelopeRender,
+} from '@documenso/lib/client-only/providers/envelope-render-provider';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
 import PDFViewerKonvaLazy from '@documenso/ui/components/pdf-viewer/pdf-viewer-konva-lazy';
@@ -92,6 +95,60 @@ export const DocumentCertificateQRView = ({
         </Dialog>
       )}
 
+      {internalVersion === 2 ? (
+        <EnvelopeRenderProvider envelope={{ envelopeItems }}>
+          <DocumentCertificateQrV2
+            title={title}
+            recipientCount={recipientCount}
+            formattedDate={formattedDate}
+          />
+        </EnvelopeRenderProvider>
+      ) : (
+        <>
+          <div className="flex w-full flex-col justify-between gap-4 md:flex-row md:items-end">
+            <div className="space-y-1">
+              <h1 className="text-xl font-medium">{title}</h1>
+              <div className="text-muted-foreground flex flex-col gap-0.5 text-sm">
+                <p>
+                  <Trans>{recipientCount} recipients</Trans>
+                </p>
+
+                <p>
+                  <Trans>Completed on {formattedDate}</Trans>
+                </p>
+              </div>
+            </div>
+
+            <ShareDocumentDownloadButton
+              title={title}
+              documentData={envelopeItems[0].documentData}
+            />
+          </div>
+
+          <div className="mt-12 w-full">
+            <PDFViewer key={envelopeItems[0].id} documentData={envelopeItems[0].documentData} />
+          </div>
+        </>
+      )}
+    </div>
+  );
+};
+
+type DocumentCertificateQrV2Props = {
+  title: string;
+  recipientCount: number;
+  formattedDate: string;
+};
+
+const DocumentCertificateQrV2 = ({
+  title,
+  recipientCount,
+  formattedDate,
+}: DocumentCertificateQrV2Props) => {
+  const { currentEnvelopeItem } = useCurrentEnvelopeRender();
+
+  return (
+    <div className="flex min-h-screen flex-col items-start">
       <div className="flex w-full flex-col justify-between gap-4 md:flex-row md:items-end">
         <div className="space-y-1">
           <h1 className="text-xl font-medium">{title}</h1>
@@ -106,21 +163,18 @@ export const DocumentCertificateQRView = ({
           </div>
         </div>
 
-        <ShareDocumentDownloadButton title={title} documentData={envelopeItems[0].documentData} />
+        {currentEnvelopeItem && (
+          <ShareDocumentDownloadButton
+            title={title}
+            documentData={currentEnvelopeItem.documentData}
+          />
+        )}
       </div>
 
       <div className="mt-12 w-full">
-        {internalVersion === 2 ? (
-          <EnvelopeRenderProvider envelope={{ envelopeItems }}>
-            <EnvelopeRendererFileSelector className="mb-4 p-0" fields={[]} secondaryOverride={''} />
+        <EnvelopeRendererFileSelector className="mb-4 p-0" fields={[]} secondaryOverride={''} />
 
-            <PDFViewerKonvaLazy customPageRenderer={EnvelopeGenericPageRenderer} />
-          </EnvelopeRenderProvider>
-        ) : (
-          <>
-            <PDFViewer key={envelopeItems[0].id} documentData={envelopeItems[0].documentData} />
-          </>
-        )}
+        <PDFViewerKonvaLazy customPageRenderer={EnvelopeGenericPageRenderer} />
       </div>
     </div>
   );

apps/remix/app/components/general/document/document-drop-zone-wrapper.tsx

@@ -16,9 +16,9 @@ import { APP_DOCUMENT_UPLOAD_SIZE_LIMIT, IS_BILLING_ENABLED } from '@documenso/l
 import { DEFAULT_DOCUMENT_TIME_ZONE, TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { megabytesToBytes } from '@documenso/lib/universal/unit-convertions';
+import { putPdfFile } from '@documenso/lib/universal/upload/put-file';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import type { TCreateDocumentPayloadSchema } from '@documenso/trpc/server/document-router/create-document.types';
 import { cn } from '@documenso/ui/lib/utils';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
@@ -62,18 +62,14 @@ export const DocumentDropZoneWrapper = ({ children, className }: DocumentDropZon
     try {
       setIsLoading(true);
 
-      const payload = {
+      const response = await putPdfFile(file);
+
+      const { legacyDocumentId: id } = await createDocument({
         title: file.name,
-        timezone: userTimezone,
+        documentDataId: response.id,
+        timezone: userTimezone, // Note: When migrating to v2 document upload remember to pass this through as a 'userTimezone' field.
         folderId: folderId ?? undefined,
-      } satisfies TCreateDocumentPayloadSchema;
-
-      const formData = new FormData();
-
-      formData.append('payload', JSON.stringify(payload));
-      formData.append('file', file);
-
-      const { envelopeId: id } = await createDocument(formData);
+      });
 
       void refreshLimits();
 

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

@@ -1,7 +1,10 @@
+import { useEffect, useState } from 'react';
+
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { DocumentStatus, RecipientRole, SigningStatus } from '@prisma/client';
+import { TooltipArrow } from '@radix-ui/react-tooltip';
 import {
   AlertTriangle,
   CheckIcon,
@@ -12,7 +15,7 @@ import {
   PlusIcon,
   UserIcon,
 } from 'lucide-react';
-import { Link } from 'react-router';
+import { Link, useSearchParams } from 'react-router';
 import { match } from 'ts-pattern';
 
 import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
@@ -24,6 +27,12 @@ import { SignatureIcon } from '@documenso/ui/icons/signature';
 import { AvatarWithText } from '@documenso/ui/primitives/avatar';
 import { Badge } from '@documenso/ui/primitives/badge';
 import { PopoverHover } from '@documenso/ui/primitives/popover';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from '@documenso/ui/primitives/tooltip';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type DocumentPageViewRecipientsProps = {
@@ -37,8 +46,24 @@ export const DocumentPageViewRecipients = ({
 }: DocumentPageViewRecipientsProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const [searchParams, setSearchParams] = useSearchParams();
 
   const recipients = envelope.recipients;
+  const [shouldHighlightCopyButtons, setShouldHighlightCopyButtons] = useState(false);
+
+  // Check for action=view-tokens query parameter and set highlighting state
+  useEffect(() => {
+    const hasViewTokensAction = searchParams.get('action') === 'copy-links';
+
+    if (hasViewTokensAction) {
+      setShouldHighlightCopyButtons(true);
+
+      // Remove the query parameter immediately
+      const params = new URLSearchParams(searchParams);
+      params.delete('action');
+      setSearchParams(params);
+    }
+  }, [searchParams, setSearchParams]);
 
   return (
     <section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
@@ -69,7 +94,7 @@ export const DocumentPageViewRecipients = ({
           </li>
         )}
 
-        {recipients.map((recipient) => (
+        {recipients.map((recipient, i) => (
           <li key={recipient.id} className="flex items-center justify-between px-4 py-2.5 text-sm">
             <AvatarWithText
               avatarFallback={recipient.email.slice(0, 1).toUpperCase()}
@@ -159,15 +184,33 @@ export const DocumentPageViewRecipients = ({
               {envelope.status === DocumentStatus.PENDING &&
                 recipient.signingStatus === SigningStatus.NOT_SIGNED &&
                 recipient.role !== RecipientRole.CC && (
-                  <CopyTextButton
-                    value={formatSigningLink(recipient.token)}
-                    onCopySuccess={() => {
-                      toast({
-                        title: _(msg`Copied to clipboard`),
-                        description: _(msg`The signing link has been copied to your clipboard.`),
-                      });
-                    }}
-                  />
+                  <TooltipProvider>
+                    <Tooltip open={shouldHighlightCopyButtons && i === 0}>
+                      <TooltipTrigger asChild>
+                        <div
+                          className={shouldHighlightCopyButtons ? 'animate-pulse' : ''}
+                          onClick={() => setShouldHighlightCopyButtons(false)}
+                        >
+                          <CopyTextButton
+                            value={formatSigningLink(recipient.token)}
+                            onCopySuccess={() => {
+                              toast({
+                                title: _(msg`Copied to clipboard`),
+                                description: _(
+                                  msg`The signing link has been copied to your clipboard.`,
+                                ),
+                              });
+                              setShouldHighlightCopyButtons(false);
+                            }}
+                          />
+                        </div>
+                      </TooltipTrigger>
+                      <TooltipContent sideOffset={2}>
+                        <Trans>Copy Signing Links</Trans>
+                        <TooltipArrow className="fill-background" />
+                      </TooltipContent>
+                    </Tooltip>
+                  </TooltipProvider>
                 )}
             </div>
           </li>

apps/remix/app/components/general/document/document-upload-button.tsx

@@ -13,9 +13,9 @@ import { useSession } from '@documenso/lib/client-only/providers/session';
 import { APP_DOCUMENT_UPLOAD_SIZE_LIMIT } from '@documenso/lib/constants/app';
 import { DEFAULT_DOCUMENT_TIME_ZONE, TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { putPdfFile } from '@documenso/lib/universal/upload/put-file';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import type { TCreateDocumentPayloadSchema } from '@documenso/trpc/server/document-router/create-document.types';
 import { cn } from '@documenso/ui/lib/utils';
 import { DocumentDropzone } from '@documenso/ui/primitives/document-upload';
 import {
@@ -73,18 +73,14 @@ export const DocumentUploadButton = ({ className }: DocumentUploadButtonProps) =
     try {
       setIsLoading(true);
 
-      const payload = {
+      const response = await putPdfFile(file);
+
+      const { legacyDocumentId: id } = await createDocument({
         title: file.name,
+        documentDataId: response.id,
         timezone: userTimezone,
         folderId: folderId ?? undefined,
-      } satisfies TCreateDocumentPayloadSchema;
-
-      const formData = new FormData();
-
-      formData.append('payload', JSON.stringify(payload));
-      formData.append('file', file);
-
-      const { envelopeId: id } = await createDocument(formData);
+      });
 
       void refreshLimits();
 

apps/remix/app/components/general/document/envelope-upload-button.tsx

@@ -14,9 +14,9 @@ import { useSession } from '@documenso/lib/client-only/providers/session';
 import { APP_DOCUMENT_UPLOAD_SIZE_LIMIT } from '@documenso/lib/constants/app';
 import { TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { putPdfFile } from '@documenso/lib/universal/upload/put-file';
 import { formatDocumentsPath, formatTemplatesPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import type { TCreateEnvelopePayload } from '@documenso/trpc/server/envelope-router/create-envelope.types';
 import { cn } from '@documenso/ui/lib/utils';
 import { DocumentDropzone } from '@documenso/ui/primitives/document-upload';
 import {
@@ -78,24 +78,35 @@ export const EnvelopeUploadButton = ({ className, type, folderId }: EnvelopeUplo
     try {
       setIsLoading(true);
 
-      const payload = {
+      const result = await Promise.all(
+        files.map(async (file) => {
+          try {
+            const response = await putPdfFile(file);
+
+            return {
+              title: file.name,
+              documentDataId: response.id,
+            };
+          } catch (err) {
+            console.error(err);
+            throw new Error('Failed to upload document');
+          }
+        }),
+      );
+
+      const envelopeItemsToCreate = result.filter(
+        (item): item is { title: string; documentDataId: string } => item !== undefined,
+      );
+
+      const { id } = await createEnvelope({
         folderId,
         type,
         title: files[0].name,
+        items: envelopeItemsToCreate,
         meta: {
           timezone: userTimezone,
         },
-      } satisfies TCreateEnvelopePayload;
-
-      const formData = new FormData();
-
-      formData.append('payload', JSON.stringify(payload));
-
-      for (const file of files) {
-        formData.append('files', file);
-      }
-
-      const { id } = await createEnvelope(formData).catch((error) => {
+      }).catch((error) => {
         console.error(error);
 
         throw error;

apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page-renderer.tsx

@@ -57,8 +57,6 @@ export default function EnvelopeEditorFieldsPageRenderer() {
   );
 
   const handleResizeOrMove = (event: KonvaEventObject<Event>) => {
-    console.log('Field resized or moved');
-
     const { current: container } = canvasElement;
 
     if (!container) {
@@ -273,9 +271,6 @@ export default function EnvelopeEditorFieldsPageRenderer() {
         return;
       }
 
-      console.log(`pointerPosition.x: ${pointerPosition.x}`);
-      console.log(`pointerPosition.y: ${pointerPosition.y}`);
-
       x1 = pointerPosition.x / scale;
       y1 = pointerPosition.y / scale;
       x2 = pointerPosition.x / scale;

apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx

@@ -5,6 +5,7 @@ import { msg } from '@lingui/core/macro';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { FieldType, RecipientRole } from '@prisma/client';
 import { FileTextIcon } from 'lucide-react';
+import { Link } from 'react-router';
 import { isDeepEqual } from 'remeda';
 import { match } from 'ts-pattern';
 
@@ -20,6 +21,7 @@ import type {
   TNameFieldMeta,
   TNumberFieldMeta,
   TRadioFieldMeta,
+  TSignatureFieldMeta,
   TTextFieldMeta,
 } from '@documenso/lib/types/field-meta';
 import { canRecipientFieldsBeModified } from '@documenso/lib/utils/recipients';
@@ -37,6 +39,7 @@ import { EditorFieldInitialsForm } from '~/components/forms/editor/editor-field-
 import { EditorFieldNameForm } from '~/components/forms/editor/editor-field-name-form';
 import { EditorFieldNumberForm } from '~/components/forms/editor/editor-field-number-form';
 import { EditorFieldRadioForm } from '~/components/forms/editor/editor-field-radio-form';
+import { EditorFieldSignatureForm } from '~/components/forms/editor/editor-field-signature-form';
 import { EditorFieldTextForm } from '~/components/forms/editor/editor-field-text-form';
 
 import { EnvelopeEditorFieldDragDrop } from './envelope-editor-fields-drag-drop';
@@ -61,7 +64,7 @@ const FieldSettingsTypeTranslations: Record<FieldType, MessageDescriptor> = {
 };
 
 export const EnvelopeEditorFieldsPage = () => {
-  const { envelope, editorFields } = useCurrentEnvelopeEditor();
+  const { envelope, editorFields, relativePath } = useCurrentEnvelopeEditor();
 
   const { currentEnvelopeItem } = useCurrentEnvelopeRender();
 
@@ -104,12 +107,12 @@ export const EnvelopeEditorFieldsPage = () => {
 
   return (
     <div className="relative flex h-full">
-      <div className="flex w-full flex-col">
+      <div className="flex w-full flex-col overflow-y-auto">
         {/* Horizontal envelope item selector */}
         <EnvelopeRendererFileSelector fields={editorFields.localFields} />
 
         {/* Document View */}
-        <div className="mt-4 flex justify-center p-4">
+        <div className="mt-4 flex h-full justify-center p-4">
           {currentEnvelopeItem !== null ? (
             <PDFViewerKonvaLazy customPageRenderer={EnvelopeEditorFieldsPageRenderer} />
           ) : (
@@ -128,7 +131,7 @@ export const EnvelopeEditorFieldsPage = () => {
 
       {/* Right Section - Form Fields Panel */}
       {currentEnvelopeItem && (
-        <div className="bg-background border-border sticky top-0 h-[calc(100vh-73px)] w-80 flex-shrink-0 overflow-y-auto border-l py-4">
+        <div className="bg-background border-border sticky top-0 h-full w-80 flex-shrink-0 overflow-y-auto border-l py-4">
           {/* Recipient selector section. */}
           <section className="px-4">
             <h3 className="text-foreground mb-2 text-sm font-semibold">
@@ -137,8 +140,14 @@ export const EnvelopeEditorFieldsPage = () => {
 
             {envelope.recipients.length === 0 ? (
               <Alert variant="warning">
-                <AlertDescription>
+                <AlertDescription className="flex flex-col gap-2">
                   <Trans>You need at least one recipient to add fields</Trans>
+
+                  <Link to={`${relativePath.editorPath}`} className="text-sm">
+                    <p>
+                      <Trans>Click here to add a recipient</Trans>
+                    </p>
+                  </Link>
                 </AlertDescription>
               </Alert>
             ) : (
@@ -182,7 +191,7 @@ export const EnvelopeEditorFieldsPage = () => {
 
           {/* Field details section. */}
           <AnimateGenericFadeInOut key={editorFields.selectedField?.formId}>
-            {selectedField && selectedField.type !== FieldType.SIGNATURE && (
+            {selectedField && (
               <section>
                 <Separator className="my-4" />
 
@@ -192,6 +201,12 @@ export const EnvelopeEditorFieldsPage = () => {
                   </h3>
 
                   {match(selectedField.type)
+                    .with(FieldType.SIGNATURE, () => (
+                      <EditorFieldSignatureForm
+                        value={selectedField?.fieldMeta as TSignatureFieldMeta | undefined}
+                        onValueChange={(value) => updateSelectedFieldMeta(value)}
+                      />
+                    ))
                     .with(FieldType.CHECKBOX, () => (
                       <EditorFieldCheckboxForm
                         value={selectedField?.fieldMeta as TCheckboxFieldMeta | undefined}

apps/remix/app/components/general/envelope-editor/envelope-editor-header.tsx

@@ -37,7 +37,6 @@ export default function EnvelopeEditorHeader() {
     updateEnvelope,
     autosaveError,
     relativePath,
-    syncEnvelope,
     editorFields,
   } = useCurrentEnvelopeEditor();
 
@@ -152,7 +151,7 @@ export default function EnvelopeEditorHeader() {
                   ...envelope,
                   fields: editorFields.localFields,
                 }}
-                onDistribute={syncEnvelope}
+                documentRootPath={relativePath.documentRootPath}
                 trigger={
                   <Button size="sm">
                     <SendIcon className="mr-2 h-4 w-4" />

apps/remix/app/components/general/envelope-editor/envelope-editor-preview-page.tsx

@@ -33,7 +33,7 @@ export const EnvelopeEditorPreviewPage = () => {
 
   return (
     <div className="relative flex h-full">
-      <div className="flex w-full flex-col">
+      <div className="flex w-full flex-col overflow-y-auto">
         {/* Horizontal envelope item selector */}
         <EnvelopeRendererFileSelector fields={editorFields.localFields} />
 
@@ -82,7 +82,7 @@ export const EnvelopeEditorPreviewPage = () => {
 
       {/* Right Section - Form Fields Panel */}
       {currentEnvelopeItem && false && (
-        <div className="sticky top-0 h-[calc(100vh-73px)] w-80 flex-shrink-0 overflow-y-auto border-l border-gray-200 bg-white py-4">
+        <div className="sticky top-0 h-full w-80 flex-shrink-0 overflow-y-auto border-l border-gray-200 bg-white py-4">
           {/* Add fields section. */}
           <section className="px-4">
             {/* <h3 className="mb-2 text-sm font-semibold text-gray-900">

apps/remix/app/components/general/envelope-editor/envelope-editor-recipient-form.tsx

@@ -14,7 +14,7 @@ import { DocumentSigningOrder, EnvelopeType, RecipientRole, SendStatus } from '@
 import { motion } from 'framer-motion';
 import { GripVerticalIcon, HelpCircleIcon, PlusIcon, TrashIcon } from 'lucide-react';
 import { useFieldArray, useForm, useWatch } from 'react-hook-form';
-import { prop, sortBy } from 'remeda';
+import { isDeepEqual, prop, sortBy } from 'remeda';
 import { z } from 'zod';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
@@ -148,8 +148,7 @@ export const EnvelopeEditorRecipientForm = () => {
     },
   });
 
-  // Always show advanced settings if any recipient has auth options.
-  const alwaysShowAdvancedSettings = useMemo(() => {
+  const recipientHasAuthSettings = useMemo(() => {
     const recipientHasAuthOptions = recipients.find((recipient) => {
       const recipientAuthOptions = ZRecipientAuthOptionsSchema.parse(recipient.authOptions);
 
@@ -165,7 +164,7 @@ export const EnvelopeEditorRecipientForm = () => {
     return recipientHasAuthOptions !== undefined || formHasActionAuth !== undefined;
   }, [recipients, form]);
 
-  const [showAdvancedSettings, setShowAdvancedSettings] = useState(alwaysShowAdvancedSettings);
+  const [showAdvancedSettings, setShowAdvancedSettings] = useState(recipientHasAuthSettings);
   const [showSigningOrderConfirmation, setShowSigningOrderConfirmation] = useState(false);
 
   const {
@@ -464,7 +463,7 @@ export const EnvelopeEditorRecipientForm = () => {
     const formValueSigners = formValues.signers || [];
 
     // Remove the last signer if it's empty.
-    const recipients = formValueSigners.filter((signer, i) => {
+    const nonEmptyRecipients = formValueSigners.filter((signer, i) => {
       if (i === formValueSigners.length - 1 && signer.email === '') {
         return false;
       }
@@ -474,26 +473,48 @@ export const EnvelopeEditorRecipientForm = () => {
 
     const validatedFormValues = ZEnvelopeRecipientsForm.safeParse({
       ...formValues,
-      signers: recipients,
+      signers: nonEmptyRecipients,
     });
 
-    if (validatedFormValues.success) {
-      console.log('validatedFormValues', validatedFormValues);
+    if (!validatedFormValues.success) {
+      return;
+    }
 
+    const { data } = validatedFormValues;
+
+    const hasSigningOrderChanged = envelope.documentMeta.signingOrder !== data.signingOrder;
+    const hasAllowDictateNextSignerChanged =
+      envelope.documentMeta.allowDictateNextSigner !== data.allowDictateNextSigner;
+
+    const hasSignersChanged =
+      data.signers.length !== recipients.length ||
+      data.signers.some((signer) => {
+        const recipient = recipients.find((recipient) => recipient.id === signer.id);
+
+        if (!recipient) {
+          return true;
+        }
+
+        return (
+          signer.email !== recipient.email ||
+          signer.name !== recipient.name ||
+          signer.role !== recipient.role ||
+          signer.signingOrder !== recipient.signingOrder ||
+          !isDeepEqual(signer.actionAuth, recipient.authOptions?.actionAuth)
+        );
+      });
+
+    if (hasSignersChanged) {
       setRecipientsDebounced(validatedFormValues.data.signers);
+    }
 
-      if (
-        validatedFormValues.data.signingOrder !== envelope.documentMeta.signingOrder ||
-        validatedFormValues.data.allowDictateNextSigner !==
-          envelope.documentMeta.allowDictateNextSigner
-      ) {
-        updateEnvelope({
-          meta: {
-            signingOrder: validatedFormValues.data.signingOrder,
-            allowDictateNextSigner: validatedFormValues.data.allowDictateNextSigner,
-          },
-        });
-      }
+    if (hasSigningOrderChanged || hasAllowDictateNextSignerChanged) {
+      updateEnvelope({
+        meta: {
+          signingOrder: validatedFormValues.data.signingOrder,
+          allowDictateNextSigner: validatedFormValues.data.allowDictateNextSigner,
+        },
+      });
     }
   }, [formValues]);
 
@@ -534,17 +555,16 @@ export const EnvelopeEditorRecipientForm = () => {
         <AnimateGenericFadeInOut motionKey={showAdvancedSettings ? 'Show' : 'Hide'}>
           <Form {...form}>
             <div className="bg-accent/50 -mt-2 mb-2 space-y-4 rounded-md p-4">
-              {!alwaysShowAdvancedSettings && organisation.organisationClaim.flags.cfr21 && (
+              {organisation.organisationClaim.flags.cfr21 && (
                 <div className="flex flex-row items-center">
                   <Checkbox
                     id="showAdvancedRecipientSettings"
-                    className="h-5 w-5"
                     checked={showAdvancedSettings}
                     onCheckedChange={(value) => setShowAdvancedSettings(Boolean(value))}
                   />
 
                   <label
-                    className="text-muted-foreground ml-2 text-sm"
+                    className="ml-2 text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
                     htmlFor="showAdvancedRecipientSettings"
                   >
                     <Trans>Show advanced settings</Trans>
@@ -703,171 +723,48 @@ export const EnvelopeEditorRecipientForm = () => {
                             <motion.fieldset
                               data-native-id={signer.id}
                               disabled={isSubmitting || !canRecipientBeModified(signer.id)}
-                              className={cn('grid grid-cols-10 items-end gap-2 pb-2', {
-                                'border-b pt-2': showAdvancedSettings,
-                                'grid-cols-12 pr-3': isSigningOrderSequential,
+                              className={cn('pb-2', {
+                                'border-b pb-4':
+                                  showAdvancedSettings && index !== signers.length - 1,
+                                'pt-2': showAdvancedSettings && index === 0,
+                                'pr-3': isSigningOrderSequential,
                               })}
                             >
-                              {isSigningOrderSequential && (
-                                <FormField
-                                  control={form.control}
-                                  name={`signers.${index}.signingOrder`}
-                                  render={({ field }) => (
-                                    <FormItem
-                                      className={cn(
-                                        'col-span-1 mt-auto flex items-center gap-x-1 space-y-0',
-                                        {
-                                          'mb-6':
-                                            form.formState.errors.signers?.[index] &&
-                                            !form.formState.errors.signers[index]?.signingOrder,
-                                        },
-                                      )}
-                                    >
-                                      <GripVerticalIcon className="h-5 w-5 flex-shrink-0 opacity-40" />
-                                      <FormControl>
-                                        <Input
-                                          type="number"
-                                          max={signers.length}
-                                          data-testid="signing-order-input"
-                                          className={cn(
-                                            'w-full text-center',
-                                            '[appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',
-                                          )}
-                                          {...field}
-                                          onChange={(e) => {
-                                            field.onChange(e);
-                                            handleSigningOrderChange(index, e.target.value);
-                                          }}
-                                          onBlur={(e) => {
-                                            field.onBlur();
-                                            handleSigningOrderChange(index, e.target.value);
-                                          }}
-                                          disabled={
-                                            snapshot.isDragging ||
-                                            isSubmitting ||
-                                            !canRecipientBeModified(signer.id)
-                                          }
-                                        />
-                                      </FormControl>
-                                      <FormMessage />
-                                    </FormItem>
-                                  )}
-                                />
-                              )}
-
-                              <FormField
-                                control={form.control}
-                                name={`signers.${index}.email`}
-                                render={({ field }) => (
-                                  <FormItem
-                                    className={cn('relative', {
-                                      'mb-6':
-                                        form.formState.errors.signers?.[index] &&
-                                        !form.formState.errors.signers[index]?.email,
-                                      'col-span-4': !showAdvancedSettings,
-                                      'col-span-5': showAdvancedSettings,
-                                    })}
-                                  >
-                                    {!showAdvancedSettings && index === 0 && (
-                                      <FormLabel required>
-                                        <Trans>Email</Trans>
-                                      </FormLabel>
-                                    )}
-
-                                    <FormControl>
-                                      <RecipientAutoCompleteInput
-                                        type="email"
-                                        placeholder={t`Email`}
-                                        value={field.value}
-                                        disabled={
-                                          snapshot.isDragging ||
-                                          isSubmitting ||
-                                          !canRecipientBeModified(signer.id)
-                                        }
-                                        options={recipientSuggestions}
-                                        onSelect={(suggestion) =>
-                                          handleRecipientAutoCompleteSelect(index, suggestion)
-                                        }
-                                        onSearchQueryChange={(query) => {
-                                          field.onChange(query);
-                                          setRecipientSearchQuery(query);
-                                        }}
-                                        loading={isLoading}
-                                        data-testid="signer-email-input"
-                                        maxLength={254}
-                                      />
-                                    </FormControl>
-
-                                    <FormMessage />
-                                  </FormItem>
-                                )}
-                              />
-
-                              <FormField
-                                control={form.control}
-                                name={`signers.${index}.name`}
-                                render={({ field }) => (
-                                  <FormItem
-                                    className={cn({
-                                      'mb-6':
-                                        form.formState.errors.signers?.[index] &&
-                                        !form.formState.errors.signers[index]?.name,
-                                      'col-span-4': !showAdvancedSettings,
-                                      'col-span-5': showAdvancedSettings,
-                                    })}
-                                  >
-                                    {!showAdvancedSettings && index === 0 && (
-                                      <FormLabel>
-                                        <Trans>Name</Trans>
-                                      </FormLabel>
-                                    )}
-
-                                    <FormControl>
-                                      <RecipientAutoCompleteInput
-                                        type="text"
-                                        placeholder={t`Name`}
-                                        {...field}
-                                        disabled={
-                                          snapshot.isDragging ||
-                                          isSubmitting ||
-                                          !canRecipientBeModified(signer.id)
-                                        }
-                                        options={recipientSuggestions}
-                                        onSelect={(suggestion) =>
-                                          handleRecipientAutoCompleteSelect(index, suggestion)
-                                        }
-                                        onSearchQueryChange={(query) => {
-                                          field.onChange(query);
-                                          setRecipientSearchQuery(query);
-                                        }}
-                                        loading={isLoading}
-                                        maxLength={255}
-                                      />
-                                    </FormControl>
-
-                                    <FormMessage />
-                                  </FormItem>
-                                )}
-                              />
-
-                              {showAdvancedSettings &&
-                                organisation.organisationClaim.flags.cfr21 && (
+                              <div className="flex flex-row items-center gap-x-2">
+                                {isSigningOrderSequential && (
                                   <FormField
                                     control={form.control}
-                                    name={`signers.${index}.actionAuth`}
+                                    name={`signers.${index}.signingOrder`}
                                     render={({ field }) => (
                                       <FormItem
-                                        className={cn('col-span-8', {
-                                          'mb-6':
-                                            form.formState.errors.signers?.[index] &&
-                                            !form.formState.errors.signers[index]?.actionAuth,
-                                          'col-span-10': isSigningOrderSequential,
-                                        })}
+                                        className={cn(
+                                          'mt-auto flex items-center gap-x-1 space-y-0',
+                                          {
+                                            'mb-6':
+                                              form.formState.errors.signers?.[index] &&
+                                              !form.formState.errors.signers[index]?.signingOrder,
+                                          },
+                                        )}
                                       >
+                                        <GripVerticalIcon className="h-5 w-5 flex-shrink-0 opacity-40" />
                                         <FormControl>
-                                          <RecipientActionAuthSelect
+                                          <Input
+                                            type="number"
+                                            max={signers.length}
+                                            data-testid="signing-order-input"
+                                            className={cn(
+                                              'w-10 text-center',
+                                              '[appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',
+                                            )}
                                             {...field}
-                                            onValueChange={field.onChange}
+                                            onChange={(e) => {
+                                              field.onChange(e);
+                                              handleSigningOrderChange(index, e.target.value);
+                                            }}
+                                            onBlur={(e) => {
+                                              field.onBlur();
+                                              handleSigningOrderChange(index, e.target.value);
+                                            }}
                                             disabled={
                                               snapshot.isDragging ||
                                               isSubmitting ||
@@ -875,20 +772,109 @@ export const EnvelopeEditorRecipientForm = () => {
                                             }
                                           />
                                         </FormControl>
-
                                         <FormMessage />
                                       </FormItem>
                                     )}
                                   />
                                 )}
 
-                              <div className="col-span-2 flex gap-x-2">
+                                <FormField
+                                  control={form.control}
+                                  name={`signers.${index}.email`}
+                                  render={({ field }) => (
+                                    <FormItem
+                                      className={cn('relative w-full', {
+                                        'mb-6':
+                                          form.formState.errors.signers?.[index] &&
+                                          !form.formState.errors.signers[index]?.email,
+                                      })}
+                                    >
+                                      {!showAdvancedSettings && index === 0 && (
+                                        <FormLabel required>
+                                          <Trans>Email</Trans>
+                                        </FormLabel>
+                                      )}
+
+                                      <FormControl>
+                                        <RecipientAutoCompleteInput
+                                          type="email"
+                                          placeholder={t`Email`}
+                                          value={field.value}
+                                          disabled={
+                                            snapshot.isDragging ||
+                                            isSubmitting ||
+                                            !canRecipientBeModified(signer.id)
+                                          }
+                                          options={recipientSuggestions}
+                                          onSelect={(suggestion) =>
+                                            handleRecipientAutoCompleteSelect(index, suggestion)
+                                          }
+                                          onSearchQueryChange={(query) => {
+                                            field.onChange(query);
+                                            setRecipientSearchQuery(query);
+                                          }}
+                                          loading={isLoading}
+                                          data-testid="signer-email-input"
+                                          maxLength={254}
+                                        />
+                                      </FormControl>
+
+                                      <FormMessage />
+                                    </FormItem>
+                                  )}
+                                />
+
+                                <FormField
+                                  control={form.control}
+                                  name={`signers.${index}.name`}
+                                  render={({ field }) => (
+                                    <FormItem
+                                      className={cn('w-full', {
+                                        'mb-6':
+                                          form.formState.errors.signers?.[index] &&
+                                          !form.formState.errors.signers[index]?.name,
+                                      })}
+                                    >
+                                      {!showAdvancedSettings && index === 0 && (
+                                        <FormLabel>
+                                          <Trans>Name</Trans>
+                                        </FormLabel>
+                                      )}
+
+                                      <FormControl>
+                                        <RecipientAutoCompleteInput
+                                          type="text"
+                                          placeholder={t`Name`}
+                                          {...field}
+                                          disabled={
+                                            snapshot.isDragging ||
+                                            isSubmitting ||
+                                            !canRecipientBeModified(signer.id)
+                                          }
+                                          options={recipientSuggestions}
+                                          onSelect={(suggestion) =>
+                                            handleRecipientAutoCompleteSelect(index, suggestion)
+                                          }
+                                          onSearchQueryChange={(query) => {
+                                            field.onChange(query);
+                                            setRecipientSearchQuery(query);
+                                          }}
+                                          loading={isLoading}
+                                          maxLength={255}
+                                        />
+                                      </FormControl>
+
+                                      <FormMessage />
+                                    </FormItem>
+                                  )}
+                                />
+
                                 <FormField
                                   control={form.control}
                                   name={`signers.${index}.role`}
                                   render={({ field }) => (
                                     <FormItem
-                                      className={cn('mt-auto', {
+                                      className={cn('mt-auto w-fit', {
                                         'mb-6':
                                           form.formState.errors.signers?.[index] &&
                                           !form.formState.errors.signers[index]?.role,
@@ -916,14 +902,11 @@ export const EnvelopeEditorRecipientForm = () => {
                                   )}
                                 />
 
-                                <button
-                                  type="button"
-                                  className={cn(
-                                    'mt-auto inline-flex h-10 w-10 items-center justify-center hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50',
-                                    {
-                                      'mb-6': form.formState.errors.signers?.[index],
-                                    },
-                                  )}
+                                <Button
+                                  variant="ghost"
+                                  className={cn('mt-auto px-2', {
+                                    'mb-6': form.formState.errors.signers?.[index],
+                                  })}
                                   data-testid="remove-signer-button"
                                   disabled={
                                     snapshot.isDragging ||
@@ -934,8 +917,40 @@ export const EnvelopeEditorRecipientForm = () => {
                                   onClick={() => onRemoveSigner(index)}
                                 >
                                   <TrashIcon className="h-4 w-4" />
-                                </button>
+                                </Button>
                               </div>
+
+                              {showAdvancedSettings &&
+                                organisation.organisationClaim.flags.cfr21 && (
+                                  <FormField
+                                    control={form.control}
+                                    name={`signers.${index}.actionAuth`}
+                                    render={({ field }) => (
+                                      <FormItem
+                                        className={cn('mt-2 w-full', {
+                                          'mb-6':
+                                            form.formState.errors.signers?.[index] &&
+                                            !form.formState.errors.signers[index]?.actionAuth,
+                                          'pl-6': isSigningOrderSequential,
+                                        })}
+                                      >
+                                        <FormControl>
+                                          <RecipientActionAuthSelect
+                                            {...field}
+                                            onValueChange={field.onChange}
+                                            disabled={
+                                              snapshot.isDragging ||
+                                              isSubmitting ||
+                                              !canRecipientBeModified(signer.id)
+                                            }
+                                          />
+                                        </FormControl>
+
+                                        <FormMessage />
+                                      </FormItem>
+                                    )}
+                                  />
+                                )}
                             </motion.fieldset>
                           </div>
                         )}

apps/remix/app/components/general/envelope-editor/envelope-editor-settings-dialog.tsx

@@ -355,7 +355,7 @@ export const EnvelopeEditorSettingsDialog = ({
           <Form {...form}>
             <form onSubmit={form.handleSubmit(onFormSubmit)}>
               <fieldset
-                className="flex min-h-[45rem] w-full flex-col space-y-6 px-6 pt-6"
+                className="flex h-[45rem] max-h-[calc(100vh-14rem)] w-full flex-col space-y-6 overflow-y-auto px-6 pt-6"
                 disabled={form.formState.isSubmitting}
                 key={activeTab}
               >

apps/remix/app/components/general/envelope-editor/envelope-editor.tsx

@@ -81,7 +81,6 @@ export default function EnvelopeEditor() {
     isAutosaving,
     flushAutosave,
     relativePath,
-    syncEnvelope,
     editorFields,
   } = useCurrentEnvelopeEditor();
 
@@ -157,7 +156,7 @@ export default function EnvelopeEditor() {
       <EnvelopeEditorHeader />
 
       {/* Main Content Area */}
-      <div className="flex h-[calc(100vh-73px)] w-screen">
+      <div className="flex h-[calc(100vh-4rem)] w-screen">
         {/* Left Section - Step Navigation */}
         <div className="bg-background border-border flex w-80 flex-shrink-0 flex-col overflow-y-auto border-r py-4">
           {/* Left section step selector. */}
@@ -251,7 +250,7 @@ export default function EnvelopeEditor() {
                   ...envelope,
                   fields: editorFields.localFields,
                 }}
-                onDistribute={syncEnvelope}
+                documentRootPath={relativePath.documentRootPath}
                 trigger={
                   <Button variant="ghost" size="sm" className="w-full justify-start">
                     <SendIcon className="mr-2 h-4 w-4" />
@@ -369,16 +368,14 @@ export default function EnvelopeEditor() {
         </div>
 
         {/* Main Content - Changes based on current step */}
-        <div className="flex-1 overflow-y-auto">
-          <AnimateGenericFadeInOut key={currentStep}>
-            {match({ currentStep, isStepLoading })
-              .with({ isStepLoading: true }, () => <SpinnerBox className="py-32" />)
-              .with({ currentStep: 'upload' }, () => <EnvelopeEditorUploadPage />)
-              .with({ currentStep: 'addFields' }, () => <EnvelopeEditorFieldsPage />)
-              .with({ currentStep: 'preview' }, () => <EnvelopeEditorPreviewPage />)
-              .exhaustive()}
-          </AnimateGenericFadeInOut>
-        </div>
+        <AnimateGenericFadeInOut className="flex-1 overflow-y-auto" key={currentStep}>
+          {match({ currentStep, isStepLoading })
+            .with({ isStepLoading: true }, () => <SpinnerBox className="py-32" />)
+            .with({ currentStep: 'upload' }, () => <EnvelopeEditorUploadPage />)
+            .with({ currentStep: 'addFields' }, () => <EnvelopeEditorFieldsPage />)
+            .with({ currentStep: 'preview' }, () => <EnvelopeEditorPreviewPage />)
+            .exhaustive()}
+        </AnimateGenericFadeInOut>
       </div>
     </div>
   );

apps/remix/app/components/general/envelope-editor/envelope-file-selector.tsx

@@ -20,7 +20,8 @@ export const EnvelopeItemSelector = ({
 }: EnvelopeItemSelectorProps) => {
   return (
     <button
-      className={`flex min-w-0 flex-shrink-0 cursor-pointer items-center space-x-3 rounded-lg border px-4 py-3 transition-colors ${
+      title={typeof primaryText === 'string' ? primaryText : undefined}
+      className={`flex h-fit max-w-72 flex-shrink-0 cursor-pointer items-center space-x-3 rounded-lg border px-4 py-3 transition-colors ${
         isSelected
           ? 'border-green-200 bg-green-50 text-green-900 dark:border-green-400/30 dark:bg-green-400/10 dark:text-green-400'
           : 'border-border bg-muted/50 hover:bg-muted/70'
@@ -39,7 +40,7 @@ export const EnvelopeItemSelector = ({
         <div className="text-xs text-gray-500">{secondaryText}</div>
       </div>
       <div
-        className={cn('h-2 w-2 rounded-full', {
+        className={cn('h-2 w-2 flex-shrink-0 rounded-full', {
           'bg-green-500': isSelected,
         })}
       ></div>
@@ -61,7 +62,7 @@ export const EnvelopeRendererFileSelector = ({
   const { envelopeItems, currentEnvelopeItem, setCurrentEnvelopeItem } = useCurrentEnvelopeRender();
 
   return (
-    <div className={cn('flex h-fit space-x-2 overflow-x-auto p-4', className)}>
+    <div className={cn('flex h-fit flex-shrink-0 space-x-2 overflow-x-auto p-4', className)}>
       {envelopeItems.map((doc, i) => (
         <EnvelopeItemSelector
           key={doc.id}

apps/remix/app/components/general/envelope-editor/envelope-generic-page-renderer.tsx

@@ -12,7 +12,7 @@ import { getClientSideFieldTranslations } from '@documenso/lib/utils/fields';
 export default function EnvelopeGenericPageRenderer() {
   const { i18n } = useLingui();
 
-  const { currentEnvelopeItem, fields } = useCurrentEnvelopeRender();
+  const { currentEnvelopeItem, fields, getRecipientColorKey } = useCurrentEnvelopeRender();
 
   const {
     stage,
@@ -60,8 +60,7 @@ export default function EnvelopeGenericPageRenderer() {
       translations: getClientSideFieldTranslations(i18n),
       pageWidth: unscaledViewport.width,
       pageHeight: unscaledViewport.height,
-      // color: getRecipientColorKey(field.recipientId),
-      color: 'purple', // Todo
+      color: getRecipientColorKey(field.recipientId),
       editable: false,
       mode: 'sign',
     });
@@ -80,7 +79,7 @@ export default function EnvelopeGenericPageRenderer() {
   };
 
   /**
-   * Render fields when they are added or removed from the localFields.
+   * Render fields when they are added or removed
    */
   useEffect(() => {
     if (!pageLayer.current || !stage.current) {
@@ -93,14 +92,12 @@ export default function EnvelopeGenericPageRenderer() {
         group.name() === 'field-group' &&
         !localPageFields.some((field) => field.id.toString() === group.id())
       ) {
-        console.log('Field removed, removing from canvas');
         group.destroy();
       }
     });
 
     // If it exists, rerender.
     localPageFields.forEach((field) => {
-      console.log('Field created/updated, rendering on canvas');
       renderFieldOnLayer(field);
     });
 

apps/remix/app/components/general/folder/folder-grid.tsx

@@ -6,6 +6,7 @@ import { FolderIcon, HomeIcon } from 'lucide-react';
 import { Link } from 'react-router';
 
 import { useCurrentOrganisation } from '@documenso/lib/client-only/providers/organisation';
+import { IS_ENVELOPES_ENABLED } from '@documenso/lib/constants/app';
 import { formatDocumentsPath, formatTemplatesPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
 import { type TFolderWithSubfolders } from '@documenso/trpc/server/folder-router/schema';
@@ -98,7 +99,7 @@ export const FolderGrid = ({ type, parentId }: FolderGridProps) => {
         </div>
 
         <div className="flex gap-4 sm:flex-row sm:justify-end">
-          {organisation.organisationClaim.flags.allowEnvelopes && (
+          {(IS_ENVELOPES_ENABLED || organisation.organisationClaim.flags.allowEnvelopes) && (
             <EnvelopeUploadButton type={type} folderId={parentId || undefined} />
           )}
 

apps/remix/app/components/general/org-menu-switcher.tsx

@@ -282,18 +282,6 @@ export const OrgMenuSwitcher = () => {
                 </DropdownMenuItem>
               )}
 
-              <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
-                <Link to="/inbox">
-                  <Trans>Personal Inbox</Trans>
-                </Link>
-              </DropdownMenuItem>
-
-              <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
-                <Link to="/settings/profile">
-                  <Trans>Account</Trans>
-                </Link>
-              </DropdownMenuItem>
-
               {currentOrganisation &&
                 canExecuteOrganisationAction(
                   'MANAGE_ORGANISATION',
@@ -306,6 +294,18 @@ export const OrgMenuSwitcher = () => {
                   </DropdownMenuItem>
                 )}
 
+              <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
+                <Link to="/inbox">
+                  <Trans>Personal Inbox</Trans>
+                </Link>
+              </DropdownMenuItem>
+
+              <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
+                <Link to="/settings/profile">
+                  <Trans>Account</Trans>
+                </Link>
+              </DropdownMenuItem>
+
               {currentTeam && canExecuteTeamAction('MANAGE_TEAM', currentTeam.currentTeamRole) && (
                 <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
                   <Link to={`/t/${currentTeam.url}/settings`}>

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

@@ -16,7 +16,7 @@ import { Link } from 'react-router';
 
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
-import { isPersonalLayout } from '@documenso/lib/utils/organisations';
+import { canExecuteOrganisationAction, isPersonalLayout } from '@documenso/lib/utils/organisations';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 
@@ -29,6 +29,10 @@ export const SettingsDesktopNav = ({ className, ...props }: SettingsDesktopNavPr
 
   const isPersonalLayoutMode = isPersonalLayout(organisations);
 
+  const hasManageableBillingOrgs = organisations.some((org) =>
+    canExecuteOrganisationAction('MANAGE_BILLING', org.currentOrganisationRole),
+  );
+
   return (
     <div className={cn('flex flex-col gap-y-2', className)} {...props}>
       <Link to="/settings/profile">
@@ -127,21 +131,6 @@ export const SettingsDesktopNav = ({ className, ...props }: SettingsDesktopNavPr
               <Trans>Webhooks</Trans>
             </Button>
           </Link>
-
-          {IS_BILLING_ENABLED() && (
-            <Link to="/settings/billing">
-              <Button
-                variant="ghost"
-                className={cn(
-                  'w-full justify-start',
-                  pathname?.startsWith('/settings/billing') && 'bg-secondary',
-                )}
-              >
-                <CreditCardIcon className="mr-2 h-5 w-5" />
-                <Trans>Billing</Trans>
-              </Button>
-            </Link>
-          )}
         </>
       )}
 
@@ -158,6 +147,21 @@ export const SettingsDesktopNav = ({ className, ...props }: SettingsDesktopNavPr
         </Button>
       </Link>
 
+      {IS_BILLING_ENABLED() && hasManageableBillingOrgs && (
+        <Link to="/settings/billing">
+          <Button
+            variant="ghost"
+            className={cn(
+              'w-full justify-start',
+              pathname?.startsWith('/settings/billing') && 'bg-secondary',
+            )}
+          >
+            <CreditCardIcon className="mr-2 h-5 w-5" />
+            <Trans>Billing</Trans>
+          </Button>
+        </Link>
+      )}
+
       <Link to="/settings/security">
         <Button
           variant="ghost"

apps/remix/app/components/general/settings-nav-mobile.tsx

@@ -17,7 +17,7 @@ import { Link, useLocation } from 'react-router';
 
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
-import { isPersonalLayout } from '@documenso/lib/utils/organisations';
+import { canExecuteOrganisationAction, isPersonalLayout } from '@documenso/lib/utils/organisations';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 
@@ -30,6 +30,10 @@ export const SettingsMobileNav = ({ className, ...props }: SettingsMobileNavProp
 
   const isPersonalLayoutMode = isPersonalLayout(organisations);
 
+  const hasManageableBillingOrgs = organisations.some((org) =>
+    canExecuteOrganisationAction('MANAGE_BILLING', org.currentOrganisationRole),
+  );
+
   return (
     <div
       className={cn('flex flex-wrap items-center justify-start gap-x-2 gap-y-4', className)}
@@ -127,21 +131,6 @@ export const SettingsMobileNav = ({ className, ...props }: SettingsMobileNavProp
               <Trans>Webhooks</Trans>
             </Button>
           </Link>
-
-          {IS_BILLING_ENABLED() && (
-            <Link to="/settings/billing">
-              <Button
-                variant="ghost"
-                className={cn(
-                  'w-full justify-start',
-                  pathname?.startsWith('/settings/billing') && 'bg-secondary',
-                )}
-              >
-                <CreditCardIcon className="mr-2 h-5 w-5" />
-                <Trans>Billing</Trans>
-              </Button>
-            </Link>
-          )}
         </>
       )}
 
@@ -158,6 +147,21 @@ export const SettingsMobileNav = ({ className, ...props }: SettingsMobileNavProp
         </Button>
       </Link>
 
+      {IS_BILLING_ENABLED() && hasManageableBillingOrgs && (
+        <Link to="/settings/billing">
+          <Button
+            variant="ghost"
+            className={cn(
+              'w-full justify-start',
+              pathname?.startsWith('/settings/billing') && 'bg-secondary',
+            )}
+          >
+            <CreditCardIcon className="mr-2 h-5 w-5" />
+            <Trans>Billing</Trans>
+          </Button>
+        </Link>
+      )}
+
       <Link to="/settings/security">
         <Button
           variant="ghost"

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

@@ -15,7 +15,6 @@ export type ShareDocumentDownloadButtonProps = {
   documentData: DocumentData;
 };
 
-// Todo: Envelopes - Support multiple item downloads.
 export const ShareDocumentDownloadButton = ({
   title,
   documentData,

apps/remix/app/components/general/template/template-drop-zone-wrapper.tsx

@@ -10,9 +10,9 @@ import { match } from 'ts-pattern';
 
 import { APP_DOCUMENT_UPLOAD_SIZE_LIMIT } from '@documenso/lib/constants/app';
 import { megabytesToBytes } from '@documenso/lib/universal/unit-convertions';
+import { putPdfFile } from '@documenso/lib/universal/upload/put-file';
 import { formatTemplatesPath } from '@documenso/lib/utils/teams';
 import { trpc } from '@documenso/trpc/react';
-import type { TCreateTemplatePayloadSchema } from '@documenso/trpc/server/template-router/schema';
 import { cn } from '@documenso/ui/lib/utils';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
@@ -40,17 +40,13 @@ export const TemplateDropZoneWrapper = ({ children, className }: TemplateDropZon
     try {
       setIsLoading(true);
 
-      const payload = {
+      const documentData = await putPdfFile(file);
+
+      const { legacyTemplateId: id } = await createTemplate({
         title: file.name,
+        templateDocumentDataId: documentData.id,
         folderId: folderId ?? undefined,
-      } satisfies TCreateTemplatePayloadSchema;
-
-      const formData = new FormData();
-
-      formData.append('payload', JSON.stringify(payload));
-      formData.append('file', file);
-
-      const { envelopeId: id } = await createTemplate(formData);
+      });
 
       toast({
         title: _(msg`Template uploaded`),

apps/remix/app/components/tables/user-billing-organisations-table.tsx

@@ -0,0 +1,136 @@
+import { useMemo } from 'react';
+
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
+import { SubscriptionStatus } from '@prisma/client';
+import { Link } from 'react-router';
+import { match } from 'ts-pattern';
+
+import { useSession } from '@documenso/lib/client-only/providers/session';
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { formatAvatarUrl } from '@documenso/lib/utils/avatars';
+import { canExecuteOrganisationAction } from '@documenso/lib/utils/organisations';
+import { trpc } from '@documenso/trpc/react';
+import { AvatarWithText } from '@documenso/ui/primitives/avatar';
+import { Badge } from '@documenso/ui/primitives/badge';
+import { Button } from '@documenso/ui/primitives/button';
+import type { DataTableColumnDef } from '@documenso/ui/primitives/data-table';
+import { DataTable } from '@documenso/ui/primitives/data-table';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+const BillingPortalButton = ({ organisationId }: { organisationId: string }) => {
+  const { _ } = useLingui();
+  const { toast } = useToast();
+
+  const { mutateAsync: manageSubscription, isPending } =
+    trpc.enterprise.billing.subscription.manage.useMutation();
+
+  const handleOpenPortal = async () => {
+    try {
+      const { redirectUrl } = await manageSubscription({ organisationId });
+      window.open(redirectUrl, '_blank');
+    } catch (err) {
+      toast({
+        title: _(msg`Something went wrong`),
+        description: _(msg`Unable to access billing portal. Please try again.`),
+        variant: 'destructive',
+      });
+    }
+  };
+
+  return (
+    <Button variant="outline" onClick={handleOpenPortal} loading={isPending}>
+      <Trans>Manage Billing</Trans>
+    </Button>
+  );
+};
+
+export const UserBillingOrganisationsTable = () => {
+  const { _ } = useLingui();
+  const { organisations } = useSession();
+
+  const billingOrganisations = useMemo(() => {
+    return organisations.filter((org) =>
+      canExecuteOrganisationAction('MANAGE_BILLING', org.currentOrganisationRole),
+    );
+  }, [organisations]);
+
+  const getSubscriptionStatusDisplay = (status: SubscriptionStatus | undefined) => {
+    return match(status)
+      .with(SubscriptionStatus.ACTIVE, () => ({
+        label: _(msg`Active`),
+        variant: 'default' as const,
+      }))
+      .with(SubscriptionStatus.PAST_DUE, () => ({
+        label: _(msg`Past Due`),
+        variant: 'warning' as const,
+      }))
+      .with(SubscriptionStatus.INACTIVE, () => ({
+        label: _(msg`Inactive`),
+        variant: 'neutral' as const,
+      }))
+      .otherwise(() => ({
+        label: _(msg`Free`),
+        variant: 'neutral' as const,
+      }));
+  };
+
+  const columns = useMemo(() => {
+    return [
+      {
+        header: _(msg`Organisation`),
+        accessorKey: 'name',
+        cell: ({ row }) => (
+          <Link to={`/o/${row.original.url}`} preventScrollReset={true}>
+            <AvatarWithText
+              avatarSrc={formatAvatarUrl(row.original.avatarImageId)}
+              avatarClass="h-12 w-12"
+              avatarFallback={row.original.name.slice(0, 1).toUpperCase()}
+              primaryText={
+                <span className="text-foreground/80 font-semibold">{row.original.name}</span>
+              }
+              secondaryText={`${NEXT_PUBLIC_WEBAPP_URL()}/o/${row.original.url}`}
+            />
+          </Link>
+        ),
+      },
+      {
+        header: _(msg`Subscription Status`),
+        accessorKey: 'subscription',
+        cell: ({ row }) => {
+          const subscription = row.original.subscription;
+          const status = subscription?.status;
+          const { label, variant } = getSubscriptionStatusDisplay(status);
+
+          return <Badge variant={variant}>{label}</Badge>;
+        },
+      },
+      {
+        header: _(msg`Actions`),
+        id: 'actions',
+        cell: ({ row }) => <BillingPortalButton organisationId={row.original.id} />,
+      },
+    ] satisfies DataTableColumnDef<(typeof billingOrganisations)[number]>[];
+  }, [_, billingOrganisations]);
+
+  if (billingOrganisations.length === 0) {
+    return (
+      <div className="text-muted-foreground flex flex-col items-center justify-center rounded-lg border border-dashed py-12 text-center">
+        <p className="text-sm">
+          <Trans>You don't manage billing for any organisations.</Trans>
+        </p>
+      </div>
+    );
+  }
+
+  return (
+    <DataTable
+      columns={columns}
+      data={billingOrganisations}
+      perPage={billingOrganisations.length}
+      currentPage={1}
+      totalPages={1}
+    />
+  );
+};

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

@@ -116,7 +116,7 @@ export default function Layout({ loaderData, params, matches }: Route.ComponentP
 
         {!user.emailVerified && <VerifyEmailBanner email={user.email} />}
 
-        {banner && <AppBanner banner={banner} />}
+        {banner && !hideHeader && <AppBanner banner={banner} />}
 
         {!hideHeader && <Header />}
 

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

@@ -34,6 +34,7 @@ import { Input } from '@documenso/ui/primitives/input';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@documenso/ui/primitives/tooltip';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
+import { AdminOrganisationMemberUpdateDialog } from '~/components/dialogs/admin-organisation-member-update-dialog';
 import { GenericErrorLayout } from '~/components/general/generic-error-layout';
 import { SettingsHeader } from '~/components/general/settings-header';
 
@@ -71,23 +72,6 @@ export default function OrganisationGroupSettingsPage({ params }: Route.Componen
       },
     });
 
-  const { mutateAsync: promoteToOwner, isPending: isPromotingToOwner } =
-    trpc.admin.organisationMember.promoteToOwner.useMutation({
-      onSuccess: () => {
-        toast({
-          title: t`Success`,
-          description: t`Member promoted to owner successfully`,
-        });
-      },
-      onError: () => {
-        toast({
-          title: t`Error`,
-          description: t`We couldn't promote the member to owner. Please try again.`,
-          variant: 'destructive',
-        });
-      },
-    });
-
   const teamsColumns = useMemo(() => {
     return [
       {
@@ -120,23 +104,24 @@ export default function OrganisationGroupSettingsPage({ params }: Route.Componen
       },
       {
         header: t`Actions`,
-        cell: ({ row }) => (
-          <div className="flex justify-end space-x-2">
-            <Button
-              variant="outline"
-              disabled={row.original.userId === organisation?.ownerUserId}
-              loading={isPromotingToOwner}
-              onClick={async () =>
-                promoteToOwner({
-                  organisationId,
-                  userId: row.original.userId,
-                })
-              }
-            >
-              <Trans>Promote to owner</Trans>
-            </Button>
-          </div>
-        ),
+        cell: ({ row }) => {
+          const isOwner = row.original.userId === organisation?.ownerUserId;
+
+          return (
+            <div className="flex justify-end space-x-2">
+              <AdminOrganisationMemberUpdateDialog
+                trigger={
+                  <Button variant="outline">
+                    <Trans>Update role</Trans>
+                  </Button>
+                }
+                organisationId={organisationId}
+                organisationMember={row.original}
+                isOwner={isOwner}
+              />
+            </div>
+          );
+        },
       },
     ] satisfies DataTableColumnDef<TGetAdminOrganisationResponse['members'][number]>[];
   }, [organisation]);

apps/remix/app/routes/_authenticated+/settings+/_dynamic_personal_routes+/billing.tsx

@@ -1,5 +0,0 @@
-import BillingPage, { meta } from '../../o.$orgUrl.settings.billing';
-
-export { meta };
-
-export default BillingPage;

apps/remix/app/routes/_authenticated+/settings+/billing.tsx

@@ -0,0 +1,27 @@
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+
+import { SettingsHeader } from '~/components/general/settings-header';
+import { UserBillingOrganisationsTable } from '~/components/tables/user-billing-organisations-table';
+import { appMetaTags } from '~/utils/meta';
+
+export function meta() {
+  return appMetaTags('Billing');
+}
+
+export default function SettingsBilling() {
+  const { _ } = useLingui();
+
+  return (
+    <div>
+      <SettingsHeader
+        title={_(msg`Billing`)}
+        subtitle={_(
+          msg`Manage billing and subscriptions for organisations where you have billing management permissions.`,
+        )}
+      />
+
+      <UserBillingOrganisationsTable />
+    </div>
+  );
+}

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

@@ -148,6 +148,7 @@ export default function DocumentPage({ params }: Route.ComponentProps) {
             <EnvelopeRenderProvider
               envelope={envelope}
               fields={envelope.status == DocumentStatus.COMPLETED ? [] : envelope.fields}
+              recipientIds={envelope.recipients.map((recipient) => recipient.id)}
             >
               {isMultiEnvelopeItem && (
                 <EnvelopeRendererFileSelector fields={envelope.fields} className="mb-4 p-0" />

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

@@ -99,7 +99,11 @@ export default function EnvelopeEditorPage({ params }: Route.ComponentProps) {
 
   return (
     <EnvelopeEditorProvider initialEnvelope={envelope}>
-      <EnvelopeRenderProvider envelope={envelope}>
+      <EnvelopeRenderProvider
+        envelope={envelope}
+        fields={envelope.fields}
+        recipientIds={envelope.recipients.map((recipient) => recipient.id)}
+      >
         <EnvelopeEditor />
       </EnvelopeRenderProvider>
     </EnvelopeEditorProvider>

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

@@ -168,7 +168,11 @@ export default function TemplatePage({ params }: Route.ComponentProps) {
       <div className="mt-6 grid w-full grid-cols-12 gap-8">
         {envelope.internalVersion === 2 ? (
           <div className="relative col-span-12 lg:col-span-6 xl:col-span-7">
-            <EnvelopeRenderProvider envelope={envelope} fields={envelope.fields}>
+            <EnvelopeRenderProvider
+              envelope={envelope}
+              fields={envelope.fields}
+              recipientIds={envelope.recipients.map((recipient) => recipient.id)}
+            >
               {isMultiEnvelopeItem && (
                 <EnvelopeRendererFileSelector fields={envelope.fields} className="mb-4 p-0" />
               )}

apps/remix/server/main.js

@@ -30,4 +30,6 @@ server.use(
 
 const handler = handle(build, server);
 
-serve({ fetch: handler.fetch, port: 3000 });
+const port = parseInt(process.env.PORT || '3000', 10);
+
+serve({ fetch: handler.fetch, port });

apps/remix/server/trpc/hono-trpc-open-api.ts

@@ -1,10 +1,10 @@
 import type { Context } from 'hono';
+import { createOpenApiFetchHandler } from 'trpc-to-openapi';
 
 import { API_V2_BETA_URL } from '@documenso/lib/constants/app';
 import { AppError, genericErrorCodeToTrpcErrorCodeMap } from '@documenso/lib/errors/app-error';
 import { createTrpcContext } from '@documenso/trpc/server/context';
 import { appRouter } from '@documenso/trpc/server/router';
-import { createOpenApiFetchHandler } from '@documenso/trpc/utils/openapi-fetch-handler';
 import { handleTrpcRouterError } from '@documenso/trpc/utils/trpc-error-handler';
 
 export const openApiTrpcServerHandler = async (c: Context) => {

apps/remix/vite.config.ts

@@ -21,7 +21,7 @@ export default defineConfig({
     },
   },
   server: {
-    port: 3000,
+    port: parseInt(process.env.PORT || '3000', 10),
     strictPort: true,
   },
   plugins: [

package.json

@@ -44,7 +44,7 @@
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
     "@lingui/cli": "^5.2.0",
-    "@prisma/client": "^6.18.0",
+    "@prisma/client": "^6.8.2",
     "dotenv": "^16.5.0",
     "dotenv-cli": "^8.0.0",
     "eslint": "^8.40.0",
@@ -54,21 +54,11 @@
     "nodemailer": "^6.10.1",
     "playwright": "1.52.0",
     "prettier": "^3.3.3",
-    "prisma": "^6.18.0",
+    "prisma": "^6.8.2",
     "prisma-extension-kysely": "^3.0.0",
     "prisma-kysely": "^1.8.0",
     "rimraf": "^5.0.1",
     "turbo": "^1.9.3",
-    "@trpc/client": "11.7.0",
-    "@trpc/react-query": "11.7.0",
-    "@trpc/server": "11.7.0",
-    "superjson": "^2.2.5",
-    "trpc-to-openapi": "2.4.0",
-    "zod-openapi": "^4.2.4",
-    "@ts-rest/core": "^3.52.1",
-    "@ts-rest/open-api": "^3.52.1",
-    "@ts-rest/serverless": "^3.52.1",
-    "zod-prisma-types": "3.3.5",
     "vite": "^6.3.5"
   },
   "name": "@documenso/root",
@@ -86,12 +76,12 @@
     "mupdf": "^1.0.0",
     "react": "^18",
     "typescript": "5.6.2",
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   },
   "overrides": {
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   },
   "trigger.dev": {
     "endpointId": "documenso-app"
   }
-}
+}

packages/api/package.json

@@ -17,14 +17,14 @@
   "dependencies": {
     "@documenso/lib": "*",
     "@documenso/prisma": "*",
-    "@ts-rest/core": "^3.52.0",
-    "@ts-rest/open-api": "^3.52.0",
-    "@ts-rest/serverless": "^3.52.0",
+    "@ts-rest/core": "^3.30.5",
+    "@ts-rest/open-api": "^3.33.0",
+    "@ts-rest/serverless": "^3.30.5",
     "@types/swagger-ui-react": "^5.18.0",
     "luxon": "^3.4.0",
-    "superjson": "^2.2.5",
+    "superjson": "^1.13.1",
     "swagger-ui-react": "^5.21.0",
     "ts-pattern": "^5.0.5",
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   }
 }

packages/app-tests/e2e/admin/organisations/update-organisation-member-role.spec.ts

@@ -68,15 +68,29 @@ test('[ADMIN]: promote member to owner', async ({ page }) => {
   // Test promoting a MEMBER to owner
   const memberRow = page.getByRole('row', { name: memberUser.email });
 
-  // Find and click the "Promote to owner" button for the member
-  const promoteButton = memberRow.getByRole('button', { name: 'Promote to owner' });
-  await expect(promoteButton).toBeVisible();
-  await expect(promoteButton).not.toBeDisabled();
+  // Find and click the "Update role" button for the member
+  const updateRoleButton = memberRow.getByRole('button', {
+    name: 'Update role',
+  });
+  await expect(updateRoleButton).toBeVisible();
+  await expect(updateRoleButton).not.toBeDisabled();
 
-  await promoteButton.click();
+  await updateRoleButton.click();
 
-  // Verify success toast appears
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible();
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   // Reload the page to see the changes
   await page.reload();
@@ -89,12 +103,18 @@ test('[ADMIN]: promote member to owner', async ({ page }) => {
   const previousOwnerRow = page.getByRole('row', { name: ownerUser.email });
   await expect(previousOwnerRow.getByRole('status').filter({ hasText: 'Owner' })).not.toBeVisible();
 
-  // Verify that the promote button is now disabled for the new owner
-  const newOwnerPromoteButton = newOwnerRow.getByRole('button', { name: 'Promote to owner' });
-  await expect(newOwnerPromoteButton).toBeDisabled();
+  // Verify that the Update role button exists for the new owner and shows Owner as current role
+  const newOwnerUpdateButton = newOwnerRow.getByRole('button', {
+    name: 'Update role',
+  });
+  await expect(newOwnerUpdateButton).toBeVisible();
 
-  // Test that we can't promote the current owner (button should be disabled)
-  await expect(newOwnerPromoteButton).toHaveAttribute('disabled');
+  // Verify clicking it shows the dialog with Owner already selected
+  await newOwnerUpdateButton.click();
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Close the dialog without making changes
+  await page.getByRole('button', { name: 'Cancel' }).click();
 });
 
 test('[ADMIN]: promote manager to owner', async ({ page }) => {
@@ -130,10 +150,26 @@ test('[ADMIN]: promote manager to owner', async ({ page }) => {
 
   // Promote the manager to owner
   const managerRow = page.getByRole('row', { name: managerUser.email });
-  const promoteButton = managerRow.getByRole('button', { name: 'Promote to owner' });
+  const updateRoleButton = managerRow.getByRole('button', {
+    name: 'Update role',
+  });
 
-  await promoteButton.click();
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible();
+  await updateRoleButton.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   // Reload and verify the change
   await page.reload();
@@ -173,14 +209,27 @@ test('[ADMIN]: promote admin member to owner', async ({ page }) => {
 
   // Promote the admin member to owner
   const adminMemberRow = page.getByRole('row', { name: adminMemberUser.email });
-  const promoteButton = adminMemberRow.getByRole('button', { name: 'Promote to owner' });
-
-  await promoteButton.click();
-
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible({
-    timeout: 10_000,
+  const updateRoleButton = adminMemberRow.getByRole('button', {
+    name: 'Update role',
   });
 
+  await updateRoleButton.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
+
   // Reload and verify the change
   await page.reload();
   await expect(adminMemberRow.getByRole('status').filter({ hasText: 'Owner' })).toBeVisible();
@@ -249,11 +298,25 @@ test('[ADMIN]: verify role hierarchy after promotion', async ({ page }) => {
   await expect(memberRow.getByRole('status').filter({ hasText: 'Owner' })).not.toBeVisible();
 
   // Promote member to owner
-  const promoteButton = memberRow.getByRole('button', { name: 'Promote to owner' });
-  await promoteButton.click();
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible({
-    timeout: 10_000,
+  const updateRoleButton = memberRow.getByRole('button', {
+    name: 'Update role',
   });
+  await updateRoleButton.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   // Reload page to see updated state
   await page.reload();
@@ -262,9 +325,11 @@ test('[ADMIN]: verify role hierarchy after promotion', async ({ page }) => {
   memberRow = page.getByRole('row', { name: memberUser.email });
   await expect(memberRow.getByRole('status').filter({ hasText: 'Owner' })).toBeVisible();
 
-  // Verify the promote button is now disabled for the new owner
-  const newOwnerPromoteButton = memberRow.getByRole('button', { name: 'Promote to owner' });
-  await expect(newOwnerPromoteButton).toBeDisabled();
+  // Verify the Update role button exists and shows Owner as current role
+  const newOwnerUpdateButton = memberRow.getByRole('button', {
+    name: 'Update role',
+  });
+  await expect(newOwnerUpdateButton).toBeVisible();
 
   // Sign in as the newly promoted user to verify they have owner permissions
   await apiSignin({
@@ -336,28 +401,56 @@ test('[ADMIN]: multiple promotions in sequence', async ({ page }) => {
 
   // First promotion: Member 1 becomes owner
   let member1Row = page.getByRole('row', { name: member1User.email });
-  let promoteButton1 = member1Row.getByRole('button', { name: 'Promote to owner' });
-  await promoteButton1.click();
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible({
-    timeout: 10_000,
+  let updateRoleButton1 = member1Row.getByRole('button', {
+    name: 'Update role',
   });
+  await updateRoleButton1.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   await page.reload();
 
-  // Verify Member 1 is now owner and button is disabled
+  // Verify Member 1 is now owner
   member1Row = page.getByRole('row', { name: member1User.email });
   await expect(member1Row.getByRole('status').filter({ hasText: 'Owner' })).toBeVisible();
-  promoteButton1 = member1Row.getByRole('button', { name: 'Promote to owner' });
-  await expect(promoteButton1).toBeDisabled();
+  updateRoleButton1 = member1Row.getByRole('button', { name: 'Update role' });
+  await expect(updateRoleButton1).toBeVisible();
 
   // Second promotion: Member 2 becomes the new owner
   const member2Row = page.getByRole('row', { name: member2User.email });
-  const promoteButton2 = member2Row.getByRole('button', { name: 'Promote to owner' });
-  await expect(promoteButton2).not.toBeDisabled();
-  await promoteButton2.click();
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible({
-    timeout: 10_000,
+  const updateRoleButton2 = member2Row.getByRole('button', {
+    name: 'Update role',
   });
+  await expect(updateRoleButton2).toBeVisible();
+  await updateRoleButton2.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   await page.reload();
 
@@ -365,9 +458,11 @@ test('[ADMIN]: multiple promotions in sequence', async ({ page }) => {
   await expect(member2Row.getByRole('status').filter({ hasText: 'Owner' })).toBeVisible();
   await expect(member1Row.getByRole('status').filter({ hasText: 'Owner' })).not.toBeVisible();
 
-  // Verify Member 1's promote button is now enabled again
-  const newPromoteButton1 = member1Row.getByRole('button', { name: 'Promote to owner' });
-  await expect(newPromoteButton1).not.toBeDisabled();
+  // Verify Member 1's Update role button is still visible
+  const newUpdateButton1 = member1Row.getByRole('button', {
+    name: 'Update role',
+  });
+  await expect(newUpdateButton1).toBeVisible();
 });
 
 test('[ADMIN]: verify organisation access after ownership change', async ({ page }) => {
@@ -402,11 +497,25 @@ test('[ADMIN]: verify organisation access after ownership change', async ({ page
   });
 
   const memberRow = page.getByRole('row', { name: memberUser.email });
-  const promoteButton = memberRow.getByRole('button', { name: 'Promote to owner' });
-  await promoteButton.click();
-  await expect(page.getByText('Member promoted to owner successfully').first()).toBeVisible({
-    timeout: 10_000,
+  const updateRoleButton = memberRow.getByRole('button', {
+    name: 'Update role',
   });
+  await updateRoleButton.click();
+
+  // Wait for dialog to open and select Owner role
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  // Find and click the select trigger - it's a button with role="combobox"
+  await page.getByRole('dialog').locator('button[role="combobox"]').click();
+
+  // Select "Owner" from the dropdown options
+  await page.getByRole('option', { name: 'Owner' }).click();
+
+  // Click Update button
+  await page.getByRole('dialog').getByRole('button', { name: 'Update' }).click();
+
+  // Wait for dialog to close (indicates success)
+  await expect(page.getByRole('dialog')).not.toBeVisible({ timeout: 10_000 });
 
   // Test that the new owner can access organisation settings
   await apiSignin({

packages/auth/package.json

@@ -20,6 +20,6 @@
     "luxon": "^3.5.0",
     "nanoid": "^5.1.5",
     "ts-pattern": "^5.0.5",
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   }
 }

packages/ee/package.json

@@ -19,6 +19,6 @@
     "micro": "^10.0.1",
     "react": "^18",
     "ts-pattern": "^5.0.5",
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   }
 }

packages/lib/client-only/hooks/use-editor-fields.ts

@@ -50,6 +50,7 @@ type UseEditorFieldsResponse = {
 
   // Field operations
   addField: (field: Omit<TLocalField, 'formId'>) => TLocalField;
+  setFieldId: (formId: string, id: number) => void;
   removeFieldsByFormId: (formIds: string[]) => void;
   updateFieldByFormId: (formId: string, updates: Partial<TLocalField>) => void;
   duplicateField: (field: TLocalField, recipientId?: number) => TLocalField;
@@ -160,6 +161,17 @@ export const useEditorFields = ({
     [localFields, remove, triggerFieldsUpdate],
   );
 
+  const setFieldId = (formId: string, id: number) => {
+    const index = localFields.findIndex((field) => field.formId === formId);
+
+    if (index !== -1) {
+      update(index, {
+        ...localFields[index],
+        id,
+      });
+    }
+  };
+
   const updateFieldByFormId = useCallback(
     (formId: string, updates: Partial<TLocalField>) => {
       const index = localFields.findIndex((field) => field.formId === formId);
@@ -269,6 +281,7 @@ export const useEditorFields = ({
 
     // Field operations
     addField,
+    setFieldId,
     removeFieldsByFormId,
     updateFieldByFormId,
     duplicateField,

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

@@ -97,6 +97,11 @@ export const EnvelopeEditorProvider = ({
   const [envelope, setEnvelope] = useState(initialEnvelope);
   const [autosaveError, setAutosaveError] = useState<boolean>(false);
 
+  const editorFields = useEditorFields({
+    envelope,
+    handleFieldsUpdate: (fields) => setFieldsDebounced(fields),
+  });
+
   const envelopeUpdateMutationQuery = trpc.envelope.update.useMutation({
     onSuccess: (response, input) => {
       setEnvelope({
@@ -184,13 +189,24 @@ export const EnvelopeEditorProvider = ({
     triggerSave: setFieldsDebounced,
     flush: setFieldsAsync,
     isPending: isFieldsMutationPending,
-  } = useEnvelopeAutosave(async (fields: TLocalField[]) => {
-    await envelopeFieldSetMutationQuery.mutateAsync({
+  } = useEnvelopeAutosave(async (localFields: TLocalField[]) => {
+    const envelopeFields = await envelopeFieldSetMutationQuery.mutateAsync({
       envelopeId: envelope.id,
       envelopeType: envelope.type,
-      fields,
+      fields: localFields,
     });
-  }, 1000);
+
+    // Insert the IDs into the local fields.
+    envelopeFields.fields.forEach((field) => {
+      const localField = localFields.find((localField) => localField.formId === field.formId);
+
+      if (localField && !localField.id) {
+        localField.id = field.id;
+
+        editorFields.setFieldId(localField.formId, field.id);
+      }
+    });
+  }, 2000);
 
   const {
     triggerSave: setEnvelopeDebounced,
@@ -221,11 +237,6 @@ export const EnvelopeEditorProvider = ({
     setEnvelopeDebounced(envelopeUpdates);
   };
 
-  const editorFields = useEditorFields({
-    envelope,
-    handleFieldsUpdate: (fields) => setFieldsDebounced(fields),
-  });
-
   const getRecipientColorKey = useCallback(
     (recipientId: number) => {
       const recipientIndex = envelope.recipients.findIndex(

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

@@ -3,6 +3,9 @@ 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';
 
@@ -23,6 +26,7 @@ type EnvelopeRenderProviderValue = {
   currentEnvelopeItem: EnvelopeRenderItem | null;
   setCurrentEnvelopeItem: (envelopeItemId: string) => void;
   fields: TEnvelope['fields'];
+  getRecipientColorKey: (recipientId: number) => TRecipientColor;
 };
 
 interface EnvelopeRenderProviderProps {
@@ -35,6 +39,13 @@ interface EnvelopeRenderProviderProps {
    * Only pass if the CustomRenderer you are passing in wants fields.
    */
   fields?: TEnvelope['fields'];
+
+  /**
+   * Optional recipient IDs used to determine the color of the fields.
+   *
+   * Only required for generic page renderers.
+   */
+  recipientIds?: number[];
 }
 
 const EnvelopeRenderContext = createContext<EnvelopeRenderProviderValue | null>(null);
@@ -56,6 +67,7 @@ export const EnvelopeRenderProvider = ({
   children,
   envelope,
   fields,
+  recipientIds = [],
 }: EnvelopeRenderProviderProps) => {
   // Indexed by documentDataId.
   const [files, setFiles] = useState<Record<string, FileData>>({});
@@ -132,6 +144,17 @@ export const EnvelopeRenderProvider = ({
     }
   }, [envelope.envelopeItems]);
 
+  const getRecipientColorKey = useCallback(
+    (recipientId: number) => {
+      const recipientIndex = recipientIds.findIndex((id) => id === recipientId);
+
+      return AVAILABLE_RECIPIENT_COLORS[
+        Math.max(recipientIndex, 0) % AVAILABLE_RECIPIENT_COLORS.length
+      ];
+    },
+    [recipientIds],
+  );
+
   return (
     <EnvelopeRenderContext.Provider
       value={{
@@ -140,6 +163,7 @@ export const EnvelopeRenderProvider = ({
         currentEnvelopeItem: currentItem,
         setCurrentEnvelopeItem,
         fields: fields ?? [],
+        getRecipientColorKey,
       }}
     >
       {children}

packages/lib/constants/app.ts

@@ -14,3 +14,5 @@ export const IS_BILLING_ENABLED = () => env('NEXT_PUBLIC_FEATURE_BILLING_ENABLED
 export const API_V2_BETA_URL = '/api/v2-beta';
 
 export const SUPPORT_EMAIL = env('NEXT_PUBLIC_SUPPORT_EMAIL') ?? 'support@documenso.com';
+
+export const IS_ENVELOPES_ENABLED = env('NEXT_PUBLIC_FEATURE_ENVELOPES_ENABLED') === 'true';

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

@@ -189,7 +189,6 @@ export const run = async ({
     settings,
   });
 
-  // Todo: Envelopes - Is it okay to have dynamic IDs?
   const newDocumentData = await Promise.all(
     envelopeItems.map(async (envelopeItem) =>
       io.runTask(`decorate-and-sign-envelope-item-${envelopeItem.id}`, async () => {

packages/lib/package.json

@@ -55,11 +55,11 @@
     "skia-canvas": "^3.0.8",
     "stripe": "^12.7.0",
     "ts-pattern": "^5.0.5",
-    "zod": "^3.25.76"
+    "zod": "3.24.1"
   },
   "devDependencies": {
     "@playwright/browser-chromium": "1.52.0",
     "@types/luxon": "^3.3.1",
     "@types/pg": "^8.11.4"
   }
-}
+}

packages/lib/server-only/document/get-stats.ts

@@ -1,7 +1,5 @@
-import { EnvelopeType, TeamMemberRole } from '@prisma/client';
 import type { Prisma, User } from '@prisma/client';
-import { SigningStatus } from '@prisma/client';
-import { DocumentVisibility } from '@prisma/client';
+import { DocumentVisibility, EnvelopeType, SigningStatus, TeamMemberRole } from '@prisma/client';
 import { DateTime } from 'luxon';
 import { match } from 'ts-pattern';
 
@@ -215,13 +213,14 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
     ],
   };
 
+  const rootPageFilter = folderId === undefined ? { folderId: null } : {};
+
   let ownerCountsWhereInput: Prisma.EnvelopeWhereInput = {
     type: EnvelopeType.DOCUMENT,
     userId: userIdWhereClause,
     createdAt,
     teamId,
     deletedAt: null,
-    folderId,
   };
 
   let notSignedCountsGroupByArgs = null;
@@ -265,8 +264,16 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
 
   ownerCountsWhereInput = {
     ...ownerCountsWhereInput,
-    ...visibilityFiltersWhereInput,
-    ...searchFilter,
+    AND: [
+      ...(Array.isArray(visibilityFiltersWhereInput.AND)
+        ? visibilityFiltersWhereInput.AND
+        : visibilityFiltersWhereInput.AND
+          ? [visibilityFiltersWhereInput.AND]
+          : []),
+      searchFilter,
+      rootPageFilter,
+      folderId ? { folderId } : {},
+    ],
   };
 
   if (teamEmail) {
@@ -285,6 +292,7 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
         },
       ],
       deletedAt: null,
+      AND: [searchFilter, rootPageFilter, folderId ? { folderId } : {}],
     };
 
     notSignedCountsGroupByArgs = {
@@ -296,7 +304,6 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
         type: EnvelopeType.DOCUMENT,
         userId: userIdWhereClause,
         createdAt,
-        folderId,
         status: ExtendedDocumentStatus.PENDING,
         recipients: {
           some: {
@@ -306,6 +313,7 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
           },
         },
         deletedAt: null,
+        AND: [searchFilter, rootPageFilter, folderId ? { folderId } : {}],
       },
     } satisfies Prisma.EnvelopeGroupByArgs;
 
@@ -318,7 +326,6 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
         type: EnvelopeType.DOCUMENT,
         userId: userIdWhereClause,
         createdAt,
-        folderId,
         OR: [
           {
             status: ExtendedDocumentStatus.PENDING,
@@ -342,6 +349,7 @@ const getTeamCounts = async (options: GetTeamCountsOption) => {
             },
           },
         ],
+        AND: [searchFilter, rootPageFilter, folderId ? { folderId } : {}],
       },
     } satisfies Prisma.EnvelopeGroupByArgs;
   }

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

@@ -256,11 +256,10 @@ export const sendDocument = async ({
       });
     }
 
-    // Todo: Envelopes - [AUDIT_LOGS]
     if (envelope.internalVersion === 2) {
-      await Promise.all(
+      const autoInsertedFields = await Promise.all(
         fieldsToAutoInsert.map(async (field) => {
-          await tx.field.update({
+          return await tx.field.update({
             where: {
               id: field.fieldId,
             },
@@ -271,6 +270,21 @@ export const sendDocument = async ({
           });
         }),
       );
+
+      await tx.documentAuditLog.create({
+        data: createDocumentAuditLogData({
+          type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELDS_AUTO_INSERTED,
+          envelopeId: envelope.id,
+          data: {
+            fields: autoInsertedFields.map((field) => ({
+              fieldId: field.id,
+              fieldType: field.type,
+              recipientId: field.recipientId,
+            })),
+          },
+          // Don't put metadata or user here since it's a system event.
+        }),
+      });
     }
 
     return await tx.envelope.update({

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

@@ -16,16 +16,11 @@ import type { ApiRequestMetadata } from '@documenso/lib/universal/extract-reques
 import { nanoid, prefixedId } from '@documenso/lib/universal/id';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
+import type { TCreateEnvelopeRequest } from '@documenso/trpc/server/envelope-router/create-envelope.types';
 
-import type {
-  TDocumentAccessAuthTypes,
-  TDocumentActionAuthTypes,
-  TRecipientAccessAuthTypes,
-  TRecipientActionAuthTypes,
-} from '../../types/document-auth';
+import type { TDocumentAccessAuthTypes, TDocumentActionAuthTypes } from '../../types/document-auth';
 import type { TDocumentFormValues } from '../../types/document-form-values';
 import type { TEnvelopeAttachmentType } from '../../types/envelope-attachment';
-import type { TFieldAndMeta } from '../../types/field-meta';
 import {
   ZWebhookDocumentSchema,
   mapEnvelopeToWebhookDocumentPayload,
@@ -39,25 +34,6 @@ import { incrementDocumentId, incrementTemplateId } from '../envelope/increment-
 import { getTeamSettings } from '../team/get-team-settings';
 import { triggerWebhook } from '../webhooks/trigger/trigger-webhook';
 
-type CreateEnvelopeRecipientFieldOptions = TFieldAndMeta & {
-  documentDataId: string;
-  page: number;
-  positionX: number;
-  positionY: number;
-  width: number;
-  height: number;
-};
-
-type CreateEnvelopeRecipientOptions = {
-  email: string;
-  name: string;
-  role: RecipientRole;
-  signingOrder?: number;
-  accessAuth?: TRecipientAccessAuthTypes[];
-  actionAuth?: TRecipientActionAuthTypes[];
-  fields?: CreateEnvelopeRecipientFieldOptions[];
-};
-
 export type CreateEnvelopeOptions = {
   userId: number;
   teamId: number;
@@ -80,7 +56,7 @@ export type CreateEnvelopeOptions = {
     visibility?: DocumentVisibility;
     globalAccessAuth?: TDocumentAccessAuthTypes[];
     globalActionAuth?: TDocumentActionAuthTypes[];
-    recipients?: CreateEnvelopeRecipientOptions[];
+    recipients?: TCreateEnvelopeRequest['recipients'];
     folderId?: string;
   };
   attachments?: Array<{

packages/lib/server-only/field/set-fields-for-document.ts

@@ -306,7 +306,10 @@ export const setFieldsForDocument = async ({
           });
         }
 
-        return upsertedField;
+        return {
+          ...upsertedField,
+          formId: field.formId,
+        };
       }),
     );
   });
@@ -340,17 +343,25 @@ export const setFieldsForDocument = async ({
   }
 
   // Filter out fields that have been removed or have been updated.
-  const filteredFields = existingFields.filter((field) => {
-    const isRemoved = removedFields.find((removedField) => removedField.id === field.id);
-    const isUpdated = persistedFields.find((persistedField) => persistedField.id === field.id);
+  const mappedFilteredFields = existingFields
+    .filter((field) => {
+      const isRemoved = removedFields.find((removedField) => removedField.id === field.id);
+      const isUpdated = persistedFields.find((persistedField) => persistedField.id === field.id);
 
-    return !isRemoved && !isUpdated;
-  });
+      return !isRemoved && !isUpdated;
+    })
+    .map((field) => ({
+      ...mapFieldToLegacyField(field, envelope),
+      formId: undefined,
+    }));
+
+  const mappedPersistentFields = persistedFields.map((field) => ({
+    ...mapFieldToLegacyField(field, envelope),
+    formId: field?.formId,
+  }));
 
   return {
-    fields: [...filteredFields, ...persistedFields].map((field) =>
-      mapFieldToLegacyField(field, envelope),
-    ),
+    fields: [...mappedFilteredFields, ...mappedPersistentFields],
   };
 };
 
@@ -359,6 +370,7 @@ export const setFieldsForDocument = async ({
  */
 type FieldData = {
   id?: number | null;
+  formId?: string;
   envelopeItemId: string;
   type: FieldType;
   recipientId: number;

packages/lib/server-only/field/set-fields-for-template.ts

@@ -27,6 +27,7 @@ export type SetFieldsForTemplateOptions = {
   id: EnvelopeIdOptions;
   fields: {
     id?: number | null;
+    formId?: string;
     envelopeItemId: string;
     type: FieldType;
     recipientId: number;
@@ -111,10 +112,10 @@ export const setFieldsForTemplate = async ({
     };
   });
 
-  const persistedFields = await prisma.$transaction(
+  const persistedFields = await Promise.all(
     // Disabling as wrapping promises here causes type issues
     // eslint-disable-next-line @typescript-eslint/promise-function-async
-    linkedFields.map((field) => {
+    linkedFields.map(async (field) => {
       const parsedFieldMeta = field.fieldMeta ? ZFieldMetaSchema.parse(field.fieldMeta) : undefined;
 
       if (field.type === FieldType.TEXT && field.fieldMeta) {
@@ -176,7 +177,7 @@ export const setFieldsForTemplate = async ({
       }
 
       // Proceed with upsert operation
-      return prisma.field.upsert({
+      const upsertedField = await prisma.field.upsert({
         where: {
           id: field._persisted?.id ?? -1,
           envelopeId: envelope.id,
@@ -219,6 +220,11 @@ export const setFieldsForTemplate = async ({
           },
         },
       });
+
+      return {
+        ...upsertedField,
+        formId: field.formId,
+      };
     }),
   );
 
@@ -240,9 +246,17 @@ export const setFieldsForTemplate = async ({
     return !isRemoved && !isUpdated;
   });
 
+  const mappedFilteredFields = filteredFields.map((field) => ({
+    ...mapFieldToLegacyField(field, envelope),
+    formId: undefined,
+  }));
+
+  const mappedPersistentFields = persistedFields.map((field) => ({
+    ...mapFieldToLegacyField(field, envelope),
+    formId: field?.formId,
+  }));
+
   return {
-    fields: [...filteredFields, ...persistedFields].map((field) =>
-      mapFieldToLegacyField(field, envelope),
-    ),
+    fields: [...mappedFilteredFields, ...mappedPersistentFields],
   };
 };

packages/lib/server-only/pdf/normalize-pdf.ts

@@ -1,22 +1,13 @@
 import { PDFDocument } from '@cantoo/pdf-lib';
 
-import { AppError } from '../../errors/app-error';
 import { flattenAnnotations } from './flatten-annotations';
 import { flattenForm, removeOptionalContentGroups } from './flatten-form';
 
 export const normalizePdf = async (pdf: Buffer) => {
-  const pdfDoc = await PDFDocument.load(pdf).catch((e) => {
-    console.error(`PDF normalization error: ${e.message}`);
+  const pdfDoc = await PDFDocument.load(pdf).catch(() => null);
 
-    throw new AppError('INVALID_DOCUMENT_FILE', {
-      message: 'The document is not a valid PDF',
-    });
-  });
-
-  if (pdfDoc.isEncrypted) {
-    throw new AppError('INVALID_DOCUMENT_FILE', {
-      message: 'The document is encrypted',
-    });
+  if (!pdfDoc) {
+    return pdf;
   }
 
   removeOptionalContentGroups(pdfDoc);

packages/lib/translations/de/web.po

@@ -262,10 +262,20 @@ msgstr "{prefix} hat ein Feld hinzugefügt"
 msgid "{prefix} added a recipient"
 msgstr "{prefix} hat einen Empfänger hinzugefügt"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "{prefix} hat das Dokument erstellt"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "{prefix} hat das Dokument gelöscht"
@@ -356,6 +366,7 @@ msgstr "{recipientActionVerb} Dokument"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "{recipientActionVerb} das Dokument, um den Prozess abzuschließen."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} Empfänger"
@@ -1742,8 +1753,9 @@ msgstr ""
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr ""
+msgstr "<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2158,6 +2170,10 @@ msgstr "Filter löschen"
 msgid "Clear Signature"
 msgstr "Unterschrift löschen"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr ""
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Klicken Sie hier, um zu beginnen"
@@ -2280,6 +2296,7 @@ msgstr "Abgeschlossene Dokumente"
 msgid "Completed Documents"
 msgstr "Abgeschlossene Dokumente"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Abgeschlossen am {formattedDate}"
@@ -2479,7 +2496,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Bestimmt, welche Signaturen beim Unterschreiben eines Dokuments verwendet werden dürfen."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Kopiert"
@@ -2497,14 +2513,12 @@ msgstr "Kopiert"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "In die Zwischenablage kopiert"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Kopieren"
@@ -2522,6 +2536,7 @@ msgid "Copy Shareable Link"
 msgstr "Kopiere den teilbaren Link"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Signierlinks kopieren"
 
@@ -3646,7 +3661,6 @@ msgstr "Legen Sie Ihr Dokument hier ab"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Dropdown"
 
@@ -4035,6 +4049,14 @@ msgstr ""
 msgid "Envelope Item Count"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr ""
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr ""
@@ -5544,7 +5566,6 @@ msgstr "Kein passender Empfänger mit dieser Beschreibung gefunden."
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "Keine Empfänger"
@@ -7066,6 +7087,10 @@ msgstr "Wählen Sie Mitglieder oder Gruppen von Mitgliedern, die dem Team hinzug
 msgid "Select members to add to this team"
 msgstr "Wählen Sie Mitglieder aus, die diesem Team hinzugefügt werden sollen"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr ""
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Passkey auswählen"
@@ -7870,6 +7895,15 @@ msgstr "E-Mail-Domains synchronisieren"
 msgid "Sync failed, changes not saved"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr ""
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "Systemanforderungen"
@@ -8412,7 +8446,6 @@ msgstr "Der Name des Unterzeichners"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "Der Signierlink wurde in die Zwischenablage kopiert."

packages/lib/translations/en/web.po

@@ -257,10 +257,20 @@ msgstr "{prefix} added a field"
 msgid "{prefix} added a recipient"
 msgstr "{prefix} added a recipient"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr "{prefix} created an envelope item with title {0}"
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "{prefix} created the document"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr "{prefix} deleted an envelope item with title {0}"
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "{prefix} deleted the document"
@@ -351,6 +361,7 @@ msgstr "{recipientActionVerb} document"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "{recipientActionVerb} the document to complete the process."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} recipients"
@@ -1737,8 +1748,9 @@ msgstr "Attachment added successfully."
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr "Attachment removed successfully."
+msgstr "Attachment removed successfully.<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2153,6 +2165,10 @@ msgstr "Clear filters"
 msgid "Clear Signature"
 msgstr "Clear Signature"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr "Click here to add a recipient"
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Click here to get started"
@@ -2275,6 +2291,7 @@ msgstr "Completed documents"
 msgid "Completed Documents"
 msgstr "Completed Documents"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Completed on {formattedDate}"
@@ -2474,7 +2491,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Controls which signatures are allowed to be used when signing a document."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Copied"
@@ -2492,14 +2508,12 @@ msgstr "Copied"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "Copied to clipboard"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Copy"
@@ -2517,6 +2531,7 @@ msgid "Copy Shareable Link"
 msgstr "Copy Shareable Link"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Copy Signing Links"
 
@@ -3641,7 +3656,6 @@ msgstr "Drop your document here"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Dropdown"
 
@@ -4030,6 +4044,14 @@ msgstr "Envelope ID"
 msgid "Envelope Item Count"
 msgstr "Envelope Item Count"
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr "Envelope item created"
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr "Envelope item deleted"
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr "Envelope resent"
@@ -5539,7 +5561,6 @@ msgstr "No recipient matching this description was found."
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "No recipients"
@@ -7061,6 +7082,10 @@ msgstr "Select members or groups of members to add to the team."
 msgid "Select members to add to this team"
 msgstr "Select members to add to this team"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr "Select Option"
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Select passkey"
@@ -7865,6 +7890,15 @@ msgstr "Sync Email Domains"
 msgid "Sync failed, changes not saved"
 msgstr "Sync failed, changes not saved"
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr "System auto inserted fields"
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr "System auto inserted fields"
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "System Requirements"
@@ -8417,7 +8451,6 @@ msgstr "The signer's name"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "The signing link has been copied to your clipboard."

packages/lib/translations/es/web.po

@@ -262,10 +262,20 @@ msgstr "{prefix} agregó un campo"
 msgid "{prefix} added a recipient"
 msgstr "{prefix} agregó un destinatario"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "{prefix} creó el documento"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "{prefix} eliminó el documento"
@@ -356,6 +366,7 @@ msgstr "{recipientActionVerb} documento"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "{recipientActionVerb} el documento para completar el proceso."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} destinatarios"
@@ -1742,8 +1753,9 @@ msgstr ""
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr ""
+msgstr "<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2158,6 +2170,10 @@ msgstr "Limpiar filtros"
 msgid "Clear Signature"
 msgstr "Limpiar firma"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr ""
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Haga clic aquí para comenzar"
@@ -2280,6 +2296,7 @@ msgstr "Documentos completados"
 msgid "Completed Documents"
 msgstr "Documentos Completados"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Completado el {formattedDate}"
@@ -2479,7 +2496,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Controla qué firmas están permitidas al firmar un documento."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Copiado"
@@ -2497,14 +2513,12 @@ msgstr "Copiado"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "Copiado al portapapeles"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Copiar"
@@ -2522,6 +2536,7 @@ msgid "Copy Shareable Link"
 msgstr "Copiar enlace compartible"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Copiar enlaces de firma"
 
@@ -3646,7 +3661,6 @@ msgstr "Suelta tu documento aquí"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Menú desplegable"
 
@@ -4035,6 +4049,14 @@ msgstr ""
 msgid "Envelope Item Count"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr ""
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr ""
@@ -5544,7 +5566,6 @@ msgstr "No se encontró ningún destinatario que coincidiera con esta descripci
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "Sin destinatarios"
@@ -7066,6 +7087,10 @@ msgstr "Seleccione miembros o grupos de miembros para agregar al equipo."
 msgid "Select members to add to this team"
 msgstr "Seleccione los miembros para añadir a este equipo"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr ""
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Seleccionar clave de acceso"
@@ -7870,6 +7895,15 @@ msgstr "Sincronizar dominios de correo electrónico"
 msgid "Sync failed, changes not saved"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr ""
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "Requisitos del Sistema"
@@ -8412,7 +8446,6 @@ msgstr "El nombre del firmante"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "El enlace de firma ha sido copiado a tu portapapeles."

packages/lib/translations/fr/web.po

@@ -262,10 +262,20 @@ msgstr "{prefix} a ajouté un champ"
 msgid "{prefix} added a recipient"
 msgstr "{prefix} a ajouté un destinataire"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "{prefix} a créé le document"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "{prefix} a supprimé le document"
@@ -356,6 +366,7 @@ msgstr "{recipientActionVerb} document"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "{recipientActionVerb} the document to complete the process."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} destinataires"
@@ -1742,8 +1753,9 @@ msgstr ""
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr ""
+msgstr "<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2158,6 +2170,10 @@ msgstr "Effacer les filtres"
 msgid "Clear Signature"
 msgstr "Effacer la signature"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr ""
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Cliquez ici pour commencer"
@@ -2280,6 +2296,7 @@ msgstr "Documents complétés"
 msgid "Completed Documents"
 msgstr "Documents Complétés"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Terminé le {formattedDate}"
@@ -2479,7 +2496,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Contrôle quelles signatures sont autorisées lors de la signature d'un document."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Copié"
@@ -2497,14 +2513,12 @@ msgstr "Copié"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "Copié dans le presse-papiers"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Copier"
@@ -2522,6 +2536,7 @@ msgid "Copy Shareable Link"
 msgstr "Copier le lien partageable"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Copier les liens de signature"
 
@@ -3646,7 +3661,6 @@ msgstr "Déposez votre document ici"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Liste déroulante"
 
@@ -4035,6 +4049,14 @@ msgstr ""
 msgid "Envelope Item Count"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr ""
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr ""
@@ -5544,7 +5566,6 @@ msgstr "Aucun destinataire correspondant à cette description n'a été trouvé.
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "Aucun destinataire"
@@ -7066,6 +7087,10 @@ msgstr "Sélectionnez des membres ou groupes de membres à ajouter à l'équipe.
 msgid "Select members to add to this team"
 msgstr "Sélectionnez des membres à ajouter à cette équipe"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr ""
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Sélectionner la clé d'authentification"
@@ -7870,6 +7895,15 @@ msgstr "Synchroniser les domaines de messagerie"
 msgid "Sync failed, changes not saved"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr ""
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "Exigences du système"
@@ -8412,7 +8446,6 @@ msgstr "Le nom du signataire"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "Le lien de signature a été copié dans votre presse-papiers."

packages/lib/translations/it/web.po

@@ -262,10 +262,20 @@ msgstr "{prefix} ha aggiunto un campo"
 msgid "{prefix} added a recipient"
 msgstr "{prefix} ha aggiunto un destinatario"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "{prefix} ha creato il documento"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "{prefix} ha eliminato il documento"
@@ -356,6 +366,7 @@ msgstr "{recipientActionVerb} documento"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "{recipientActionVerb} il documento per completare il processo."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} destinatari"
@@ -1742,8 +1753,9 @@ msgstr ""
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr ""
+msgstr "<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2158,6 +2170,10 @@ msgstr "Cancella filtri"
 msgid "Clear Signature"
 msgstr "Cancella firma"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr ""
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Clicca qui per iniziare"
@@ -2280,6 +2296,7 @@ msgstr "Documenti Completati"
 msgid "Completed Documents"
 msgstr "Documenti Completati"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Completato il {formattedDate}"
@@ -2479,7 +2496,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Controlla quali firme sono consentite per firmare un documento."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Copiato"
@@ -2497,14 +2513,12 @@ msgstr "Copiato"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "Copiato negli appunti"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Copia"
@@ -2522,6 +2536,7 @@ msgid "Copy Shareable Link"
 msgstr "Copia il Link Condivisibile"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Copia link di firma"
 
@@ -3646,7 +3661,6 @@ msgstr "Rilascia qui il tuo documento"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Menu a tendina"
 
@@ -4035,6 +4049,14 @@ msgstr ""
 msgid "Envelope Item Count"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr ""
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr ""
@@ -5544,7 +5566,6 @@ msgstr "Nessun destinatario corrispondente a questa descrizione è stato trovato
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "Nessun destinatario"
@@ -7066,6 +7087,10 @@ msgstr "Seleziona membri o gruppi di membri da aggiungere al team."
 msgid "Select members to add to this team"
 msgstr "Seleziona membri da aggiungere a questo team"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr ""
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Seleziona una chiave di accesso"
@@ -7870,6 +7895,15 @@ msgstr "Sincronizza Domini Email"
 msgid "Sync failed, changes not saved"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr ""
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "Requisiti di sistema"
@@ -8420,7 +8454,6 @@ msgstr "Il nome del firmatario"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "Il link di firma è stato copiato negli appunti."

packages/lib/translations/pl/web.po

@@ -262,10 +262,20 @@ msgstr "Użytkownik {prefix} dodał pole"
 msgid "{prefix} added a recipient"
 msgstr "Użytkownik {prefix} dodał odbiorcę"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} created an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} created the document"
 msgstr "Użytkownik {prefix} utworzył dokument"
 
+#. placeholder {0}: data.envelopeItemTitle
+#: packages/lib/utils/document-audit-logs.ts
+msgid "{prefix} deleted an envelope item with title {0}"
+msgstr ""
+
 #: packages/lib/utils/document-audit-logs.ts
 msgid "{prefix} deleted the document"
 msgstr "Użytkownik {prefix} usunął dokument"
@@ -356,6 +366,7 @@ msgstr "{recipientActionVerb} dokument"
 msgid "{recipientActionVerb} the document to complete the process."
 msgstr "Sprawdź i {recipientActionVerb} dokument, aby zakończyć proces."
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "{recipientCount} recipients"
 msgstr "{recipientCount} odbiorców"
@@ -1742,8 +1753,9 @@ msgstr ""
 
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
 msgid "Attachment removed successfully."
-msgstr ""
+msgstr "<<<<<<< Updated upstream======="
 
+#: apps/remix/app/components/general/document-signing/document-signing-page-view-v2.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
 #: apps/remix/app/components/general/document/document-attachments-popover.tsx
@@ -2158,6 +2170,10 @@ msgstr "Wyczyść filtry"
 msgid "Clear Signature"
 msgstr "Wyczyść podpis"
 
+#: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-page.tsx
+msgid "Click here to add a recipient"
+msgstr ""
+
 #: apps/remix/app/components/tables/settings-public-profile-templates-table.tsx
 msgid "Click here to get started"
 msgstr "Kliknij, aby rozpocząć"
@@ -2280,6 +2296,7 @@ msgstr "Dokumenty zakończone"
 msgid "Completed Documents"
 msgstr "Zakończone dokumenty"
 
+#: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 #: apps/remix/app/components/general/document/document-certificate-qr-view.tsx
 msgid "Completed on {formattedDate}"
 msgstr "Zakończono {formattedDate}"
@@ -2479,7 +2496,6 @@ msgid "Controls which signatures are allowed to be used when signing a document.
 msgstr "Kontroluje, które podpisy są dozwolone do użycia podczas podpisywania dokumentu."
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copied"
 msgstr "Skopiowano"
@@ -2497,14 +2513,12 @@ msgstr "Skopiowano"
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
 #: apps/remix/app/components/dialogs/organisation-email-domain-records-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 #: packages/ui/components/document/document-share-button.tsx
 msgid "Copied to clipboard"
 msgstr "Skopiowano do schowka"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "Copy"
 msgstr "Kopiuj"
@@ -2522,6 +2536,7 @@ msgid "Copy Shareable Link"
 msgstr "Kopiuj udostępniany link"
 
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+#: apps/remix/app/components/general/document/document-page-view-recipients.tsx
 msgid "Copy Signing Links"
 msgstr "Kopiuj linki do podpisania"
 
@@ -3646,7 +3661,6 @@ msgstr "Upuść swój dokument tutaj"
 #: apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
 #: packages/ui/primitives/template-flow/add-template-fields.tsx
 #: packages/ui/primitives/document-flow/add-fields.tsx
-#: packages/lib/utils/fields.ts
 msgid "Dropdown"
 msgstr "Lista rozwijana"
 
@@ -4035,6 +4049,14 @@ msgstr ""
 msgid "Envelope Item Count"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item created"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "Envelope item deleted"
+msgstr ""
+
 #: apps/remix/app/components/dialogs/envelope-redistribute-dialog.tsx
 msgid "Envelope resent"
 msgstr ""
@@ -5544,7 +5566,6 @@ msgstr "Nie znaleziono odbiorcy pasującego do tego opisu."
 #: apps/remix/app/components/general/template/template-page-view-recipients.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "No recipients"
 msgstr "Brak odbiorców"
@@ -7066,6 +7087,10 @@ msgstr "Wybierz członków lub grupy członków, aby dodać do zespołu."
 msgid "Select members to add to this team"
 msgstr "Wybierz członków, aby dodać do tego zespołu"
 
+#: packages/lib/utils/fields.ts
+msgid "Select Option"
+msgstr ""
+
 #: apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx
 msgid "Select passkey"
 msgstr "Wybierz klucz uwierzytelniający"
@@ -7870,6 +7895,15 @@ msgstr "Synchronizuj domeny e-mail"
 msgid "Sync failed, changes not saved"
 msgstr ""
 
+#: packages/lib/utils/document-audit-logs.ts
+msgctxt "Audit log format"
+msgid "System auto inserted fields"
+msgstr ""
+
+#: packages/lib/utils/document-audit-logs.ts
+msgid "System auto inserted fields"
+msgstr ""
+
 #: apps/remix/app/routes/_unauthenticated+/articles.signature-disclosure.tsx
 msgid "System Requirements"
 msgstr "Wymagania systemowe"
@@ -8412,7 +8446,6 @@ msgstr "Nazwa podpisującego"
 #: apps/remix/app/components/general/avatar-with-recipient.tsx
 #: apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
 #: apps/remix/app/components/general/document/document-page-view-recipients.tsx
-#: apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx
 #: packages/ui/primitives/document-flow/add-subject.tsx
 msgid "The signing link has been copied to your clipboard."
 msgstr "Link do podpisu został skopiowany do schowka."

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

@@ -21,10 +21,14 @@ export const ZDocumentAuditLogTypeSchema = z.enum([
   'RECIPIENT_DELETED',
   'RECIPIENT_UPDATED',
 
+  'ENVELOPE_ITEM_CREATED',
+  'ENVELOPE_ITEM_DELETED',
+
   // Document events.
   'DOCUMENT_COMPLETED', // When the document is sealed and fully completed.
   'DOCUMENT_CREATED', // When the document is created.
   'DOCUMENT_DELETED', // When the document is soft deleted.
+  'DOCUMENT_FIELDS_AUTO_INSERTED', // When a field is auto inserted during send due to default values (radio/dropdown/checkbox).
   'DOCUMENT_FIELD_INSERTED', // When a field is inserted (signed/approved/etc) by a recipient.
   'DOCUMENT_FIELD_UNINSERTED', // When a field is uninserted by a recipient.
   'DOCUMENT_FIELD_PREFILLED', // When a field is prefilled by an assistant.
@@ -181,6 +185,28 @@ const ZBaseRecipientDataSchema = z.object({
   recipientRole: z.string(),
 });
 
+/**
+ * Event: Envelope item created.
+ */
+export const ZDocumentAuditLogEventEnvelopeItemCreatedSchema = z.object({
+  type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_CREATED),
+  data: z.object({
+    envelopeItemId: z.string(),
+    envelopeItemTitle: z.string(),
+  }),
+});
+
+/**
+ * Event: Envelope item deleted.
+ */
+export const ZDocumentAuditLogEventEnvelopeItemDeletedSchema = z.object({
+  type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_DELETED),
+  data: z.object({
+    envelopeItemId: z.string(),
+    envelopeItemTitle: z.string(),
+  }),
+});
+
 /**
  * Event: Email sent.
  */
@@ -315,6 +341,22 @@ export const ZDocumentAuditLogEventDocumentFieldInsertedSchema = z.object({
   }),
 });
 
+/**
+ * Event: Document field auto inserted.
+ */
+export const ZDocumentAuditLogEventDocumentFieldsAutoInsertedSchema = z.object({
+  type: z.literal(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELDS_AUTO_INSERTED),
+  data: z.object({
+    fields: z.array(
+      z.object({
+        fieldId: z.number(),
+        fieldType: z.nativeEnum(FieldType),
+        recipientId: z.number(),
+      }),
+    ),
+  }),
+});
+
 /**
  * Event: Document field uninserted.
  */
@@ -652,11 +694,14 @@ export const ZDocumentAuditLogBaseSchema = z.object({
 
 export const ZDocumentAuditLogSchema = ZDocumentAuditLogBaseSchema.and(
   z.union([
+    ZDocumentAuditLogEventEnvelopeItemCreatedSchema,
+    ZDocumentAuditLogEventEnvelopeItemDeletedSchema,
     ZDocumentAuditLogEventEmailSentSchema,
     ZDocumentAuditLogEventDocumentCompletedSchema,
     ZDocumentAuditLogEventDocumentCreatedSchema,
     ZDocumentAuditLogEventDocumentDeletedSchema,
     ZDocumentAuditLogEventDocumentMovedToTeamSchema,
+    ZDocumentAuditLogEventDocumentFieldsAutoInsertedSchema,
     ZDocumentAuditLogEventDocumentFieldInsertedSchema,
     ZDocumentAuditLogEventDocumentFieldUninsertedSchema,
     ZDocumentAuditLogEventDocumentFieldPrefilledSchema,

packages/lib/types/field.ts

@@ -71,7 +71,6 @@ export const ZFieldHeightSchema = z.number().min(1).describe('The height of the
 
 // ---------------------------------------------
 
-// Todo: Envelopes - dunno man
 const PrismaDecimalSchema = z.preprocess(
   (val) => (typeof val === 'string' ? new Prisma.Decimal(val) : val),
   z.instanceof(Prisma.Decimal, { message: 'Must be a Decimal' }),

packages/lib/universal/field-renderer/field-generic-items.ts

@@ -129,3 +129,58 @@ export const createSpinner = ({
 
   return loadingGroup;
 };
+
+type CreateFieldHoverInteractionOptions = {
+  options: RenderFieldElementOptions;
+  fieldGroup: Konva.Group;
+  fieldRect: Konva.Rect;
+};
+
+/**
+ * Adds smooth transition-like behavior for hover effects to the field group and rectangle.
+ */
+export const createFieldHoverInteraction = ({
+  options,
+  fieldGroup,
+  fieldRect,
+}: CreateFieldHoverInteractionOptions) => {
+  const { mode } = options;
+
+  if (mode === 'export' || !options.color) {
+    return;
+  }
+
+  const hoverColor = RECIPIENT_COLOR_STYLES[options.color].baseRingHover;
+
+  fieldGroup.on('mouseover', () => {
+    new Konva.Tween({
+      node: fieldRect,
+      duration: 0.3,
+      fill: hoverColor,
+    }).play();
+  });
+
+  fieldGroup.on('mouseout', () => {
+    new Konva.Tween({
+      node: fieldRect,
+      duration: 0.3,
+      fill: DEFAULT_RECT_BACKGROUND,
+    }).play();
+  });
+
+  fieldGroup.on('transformstart', () => {
+    new Konva.Tween({
+      node: fieldRect,
+      duration: 0.3,
+      fill: hoverColor,
+    }).play();
+  });
+
+  fieldGroup.on('transformend', () => {
+    new Konva.Tween({
+      node: fieldRect,
+      duration: 0.3,
+      fill: DEFAULT_RECT_BACKGROUND,
+    }).play();
+  });
+};

packages/lib/universal/field-renderer/render-checkbox-field.ts

@@ -4,6 +4,7 @@ import { match } from 'ts-pattern';
 import { DEFAULT_STANDARD_FONT_SIZE } from '../../constants/pdf';
 import type { TCheckboxFieldMeta } from '../../types/field-meta';
 import {
+  createFieldHoverInteraction,
   konvaTextFill,
   konvaTextFontFamily,
   upsertFieldGroup,
@@ -26,25 +27,27 @@ export const renderCheckboxFieldElement = (
 ) => {
   const { pageWidth, pageHeight, pageLayer, mode } = options;
 
-  const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
-
-  const fieldGroup = upsertFieldGroup(field, options);
-
-  // Clear previous children and listeners to re-render fresh.
-  fieldGroup.removeChildren();
-  fieldGroup.off('transform');
-
-  fieldGroup.add(upsertFieldRect(field, options));
+  const { fieldWidth, fieldHeight } = calculateFieldPosition(field, pageWidth, pageHeight);
 
   const checkboxMeta: TCheckboxFieldMeta | null = (field.fieldMeta as TCheckboxFieldMeta) || null;
   const checkboxValues = checkboxMeta?.values || [];
 
-  const fontSize = checkboxMeta?.fontSize || DEFAULT_STANDARD_FONT_SIZE;
+  const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
+
+  // Clear previous children and listeners to re-render fresh.
+  const fieldGroup = upsertFieldGroup(field, options);
+  fieldGroup.removeChildren();
+  fieldGroup.off('transform');
 
   if (isFirstRender) {
     pageLayer.add(fieldGroup);
   }
 
+  const fieldRect = upsertFieldRect(field, options);
+  fieldGroup.add(fieldRect);
+
+  const fontSize = checkboxMeta?.fontSize || DEFAULT_STANDARD_FONT_SIZE;
+
   // Handle rescaling items during transforms.
   fieldGroup.on('transform', () => {
     const groupScaleX = fieldGroup.scaleX();
@@ -127,11 +130,9 @@ export const renderCheckboxFieldElement = (
     pageLayer.batchDraw();
   });
 
-  const { fieldWidth, fieldHeight } = calculateFieldPosition(field, pageWidth, pageHeight);
-
   const checkedValues: number[] = field.customText ? JSON.parse(field.customText) : [];
 
-  checkboxValues.forEach(({ id, value, checked }, index) => {
+  checkboxValues.forEach(({ value, checked }, index) => {
     const isCheckboxChecked = match(mode)
       .with('edit', () => checked)
       .with('sign', () => checkedValues.includes(index))
@@ -145,8 +146,6 @@ export const renderCheckboxFieldElement = (
       })
       .exhaustive();
 
-    console.log('wtf?');
-
     const itemSize = calculateCheckboxSize(fontSize);
 
     const { itemInputX, itemInputY, textX, textY, textWidth, textHeight } =
@@ -211,6 +210,8 @@ export const renderCheckboxFieldElement = (
     fieldGroup.add(text);
   });
 
+  createFieldHoverInteraction({ fieldGroup, fieldRect, options });
+
   return {
     fieldGroup,
     isFirstRender,

packages/lib/universal/field-renderer/render-dropdown-field.ts

@@ -1,8 +1,10 @@
+import { FieldType } from '@prisma/client';
 import Konva from 'konva';
 
 import { DEFAULT_STANDARD_FONT_SIZE } from '../../constants/pdf';
 import type { TDropdownFieldMeta } from '../../types/field-meta';
 import {
+  createFieldHoverInteraction,
   konvaTextFill,
   konvaTextFontFamily,
   upsertFieldGroup,
@@ -48,79 +50,30 @@ export const renderDropdownFieldElement = (
   field: FieldToRender,
   options: RenderFieldElementOptions,
 ) => {
-  const { pageWidth, pageHeight, pageLayer, mode } = options;
+  const { pageWidth, pageHeight, pageLayer, mode, translations } = options;
+
+  const { fieldWidth, fieldHeight } = calculateFieldPosition(field, pageWidth, pageHeight);
+
+  const dropdownMeta: TDropdownFieldMeta | null = (field.fieldMeta as TDropdownFieldMeta) || null;
+
+  let selectedValue = translations?.[FieldType.DROPDOWN] || 'Select Option';
 
   const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
 
-  const fieldGroup = upsertFieldGroup(field, options);
-
   // Clear previous children to re-render fresh.
+  const fieldGroup = upsertFieldGroup(field, options);
   fieldGroup.removeChildren();
+  fieldGroup.off('transform');
 
-  fieldGroup.add(upsertFieldRect(field, options));
+  const fieldRect = upsertFieldRect(field, options);
+  fieldGroup.add(fieldRect);
 
   if (isFirstRender) {
     pageLayer.add(fieldGroup);
-
-    fieldGroup.on('transform', () => {
-      const groupScaleX = fieldGroup.scaleX();
-      const groupScaleY = fieldGroup.scaleY();
-
-      const fieldRect = fieldGroup.findOne('.field-rect');
-      const text = fieldGroup.findOne('.dropdown-selected-text');
-      const arrow = fieldGroup.findOne('.dropdown-arrow');
-
-      if (!fieldRect || !text || !arrow) {
-        console.log('fieldRect or text or arrow not found');
-        return;
-      }
-
-      const rectWidth = fieldRect.width() * groupScaleX;
-      const rectHeight = fieldRect.height() * groupScaleY;
-
-      const { arrowX, arrowY, textX, textY, textWidth, textHeight } = calculateDropdownPosition({
-        fieldWidth: rectWidth,
-        fieldHeight: rectHeight,
-      });
-
-      arrow.setAttrs({
-        x: arrowX,
-        y: arrowY,
-        scaleX: 1,
-        scaleY: 1,
-      });
-
-      text.setAttrs({
-        scaleX: 1,
-        scaleY: 1,
-        x: textX,
-        y: textY,
-        width: textWidth,
-        height: textHeight,
-      });
-
-      fieldRect.setAttrs({
-        width: rectWidth,
-        height: rectHeight,
-      });
-
-      fieldGroup.scale({
-        x: 1,
-        y: 1,
-      });
-
-      pageLayer.batchDraw();
-    });
   }
 
-  const dropdownMeta: TDropdownFieldMeta | null = (field.fieldMeta as TDropdownFieldMeta) || null;
-  const { fieldWidth, fieldHeight } = calculateFieldPosition(field, pageWidth, pageHeight);
-
   const fontSize = dropdownMeta?.fontSize || DEFAULT_STANDARD_FONT_SIZE;
 
-  // Todo: Envelopes - Translations
-  let selectedValue = 'Select Option';
-
   if (field.inserted) {
     selectedValue = field.customText;
   }
@@ -158,27 +111,63 @@ export const renderDropdownFieldElement = (
     visible: mode !== 'export',
   });
 
-  // Add hover state for dropdown
-  fieldGroup.on('mouseenter', () => {
-    // dropdownContainer.stroke('#2563EB');
-    // dropdownContainer.strokeWidth(2);
-    document.body.style.cursor = 'pointer';
-    pageLayer.batchDraw();
-  });
-
-  fieldGroup.on('mouseleave', () => {
-    // dropdownContainer.stroke('#374151');
-    // dropdownContainer.strokeWidth(2);
-    document.body.style.cursor = 'default';
-    pageLayer.batchDraw();
-  });
-
   fieldGroup.add(selectedText);
 
   if (!field.inserted || mode === 'export') {
     fieldGroup.add(arrow);
   }
 
+  fieldGroup.on('transform', () => {
+    const groupScaleX = fieldGroup.scaleX();
+    const groupScaleY = fieldGroup.scaleY();
+
+    const fieldRect = fieldGroup.findOne('.field-rect');
+    const text = fieldGroup.findOne('.dropdown-selected-text');
+    const arrow = fieldGroup.findOne('.dropdown-arrow');
+
+    if (!fieldRect || !text || !arrow) {
+      return;
+    }
+
+    const rectWidth = fieldRect.width() * groupScaleX;
+    const rectHeight = fieldRect.height() * groupScaleY;
+
+    const { arrowX, arrowY, textX, textY, textWidth, textHeight } = calculateDropdownPosition({
+      fieldWidth: rectWidth,
+      fieldHeight: rectHeight,
+    });
+
+    arrow.setAttrs({
+      x: arrowX,
+      y: arrowY,
+      scaleX: 1,
+      scaleY: 1,
+    });
+
+    text.setAttrs({
+      scaleX: 1,
+      scaleY: 1,
+      x: textX,
+      y: textY,
+      width: textWidth,
+      height: textHeight,
+    });
+
+    fieldRect.setAttrs({
+      width: rectWidth,
+      height: rectHeight,
+    });
+
+    fieldGroup.scale({
+      x: 1,
+      y: 1,
+    });
+
+    pageLayer.batchDraw();
+  });
+
+  createFieldHoverInteraction({ fieldGroup, fieldRect, options });
+
   return {
     fieldGroup,
     isFirstRender,

packages/lib/universal/field-renderer/render-radio-field.ts

@@ -4,6 +4,7 @@ import { match } from 'ts-pattern';
 import { DEFAULT_STANDARD_FONT_SIZE } from '../../constants/pdf';
 import type { TRadioFieldMeta } from '../../types/field-meta';
 import {
+  createFieldHoverInteraction,
   konvaTextFill,
   konvaTextFontFamily,
   upsertFieldGroup,
@@ -26,25 +27,24 @@ export const renderRadioFieldElement = (
 ) => {
   const { pageWidth, pageHeight, pageLayer, mode } = options;
 
-  const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
-
-  const fieldGroup = upsertFieldGroup(field, options);
-
-  // Clear previous children to re-render fresh
-  fieldGroup.removeChildren();
-
-  fieldGroup.add(upsertFieldRect(field, options));
-
   const radioMeta: TRadioFieldMeta | null = (field.fieldMeta as TRadioFieldMeta) || null;
   const radioValues = radioMeta?.values || [];
 
-  const fontSize = radioMeta?.fontSize || DEFAULT_STANDARD_FONT_SIZE;
+  const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
+
+  // Clear previous children and listeners to re-render fresh
+  const fieldGroup = upsertFieldGroup(field, options);
+  fieldGroup.removeChildren();
+  fieldGroup.off('transform');
 
   if (isFirstRender) {
     pageLayer.add(fieldGroup);
   }
 
-  fieldGroup.off('transform');
+  const fieldRect = upsertFieldRect(field, options);
+  fieldGroup.add(fieldRect);
+
+  const fontSize = radioMeta?.fontSize || DEFAULT_STANDARD_FONT_SIZE;
 
   // Handle rescaling items during transforms.
   fieldGroup.on('transform', () => {
@@ -195,6 +195,8 @@ export const renderRadioFieldElement = (
     fieldGroup.add(text);
   });
 
+  createFieldHoverInteraction({ fieldGroup, fieldRect, options });
+
   return {
     fieldGroup,
     isFirstRender,

packages/lib/universal/field-renderer/render-signature-field.ts

@@ -1,13 +1,12 @@
 import Konva from 'konva';
 
-import {
-  DEFAULT_RECT_BACKGROUND,
-  RECIPIENT_COLOR_STYLES,
-} from '@documenso/ui/lib/recipient-colors';
-
 import { DEFAULT_SIGNATURE_TEXT_FONT_SIZE } from '../../constants/pdf';
 import { AppError } from '../../errors/app-error';
-import { upsertFieldGroup, upsertFieldRect } from './field-generic-items';
+import {
+  createFieldHoverInteraction,
+  upsertFieldGroup,
+  upsertFieldRect,
+} from './field-generic-items';
 import { calculateFieldPosition } from './field-renderer';
 import type { FieldToRender, RenderFieldElementOptions } from './field-renderer';
 
@@ -212,33 +211,7 @@ export const renderSignatureFieldElement = (
     fieldRect.opacity(0);
   }
 
-  // Todo: Doesn't work.
-  if (mode !== 'export') {
-    const hoverColor = options.color
-      ? RECIPIENT_COLOR_STYLES[options.color].baseRingHover
-      : '#e5e7eb';
-
-    // Todo: Envelopes - On hover add text color
-
-    // Add smooth transition-like behavior for hover effects
-    fieldGroup.on('mouseover', () => {
-      new Konva.Tween({
-        node: fieldRect,
-        duration: 0.3,
-        fill: hoverColor,
-      }).play();
-    });
-
-    fieldGroup.on('mouseout', () => {
-      new Konva.Tween({
-        node: fieldRect,
-        duration: 0.3,
-        fill: DEFAULT_RECT_BACKGROUND,
-      }).play();
-    });
-
-    fieldGroup.add(fieldRect);
-  }
+  createFieldHoverInteraction({ fieldGroup, fieldRect, options });
 
   return {
     fieldGroup,

packages/lib/universal/field-renderer/render-text-field.ts

@@ -1,13 +1,9 @@
 import Konva from 'konva';
 
-import {
-  DEFAULT_RECT_BACKGROUND,
-  RECIPIENT_COLOR_STYLES,
-} from '@documenso/ui/lib/recipient-colors';
-
 import { DEFAULT_STANDARD_FONT_SIZE } from '../../constants/pdf';
 import type { TTextFieldMeta } from '../../types/field-meta';
 import {
+  createFieldHoverInteraction,
   konvaTextFill,
   konvaTextFontFamily,
   upsertFieldGroup,
@@ -19,12 +15,12 @@ import { calculateFieldPosition } from './field-renderer';
 const upsertFieldText = (field: FieldToRender, options: RenderFieldElementOptions): Konva.Text => {
   const { pageWidth, pageHeight, mode = 'edit', pageLayer, translations } = options;
 
-  const fieldTypeName = translations?.[field.type] || field.type;
-
   const { fieldWidth, fieldHeight } = calculateFieldPosition(field, pageWidth, pageHeight);
 
   const textMeta = field.fieldMeta as TTextFieldMeta | undefined;
 
+  const fieldTypeName = translations?.[field.type] || field.type;
+
   const fieldText: Konva.Text =
     pageLayer.findOne(`#${field.renderId}-text`) ||
     new Konva.Text({
@@ -118,9 +114,8 @@ export const renderTextFieldElement = (
 
   const isFirstRender = !pageLayer.findOne(`#${field.renderId}`);
 
-  const fieldGroup = upsertFieldGroup(field, options);
-
   // Clear previous children and listeners to re-render fresh.
+  const fieldGroup = upsertFieldGroup(field, options);
   fieldGroup.removeChildren();
   fieldGroup.off('transform');
 
@@ -183,33 +178,7 @@ export const renderTextFieldElement = (
     fieldRect.opacity(0);
   }
 
-  // Todo: Doesn't work.
-  if (mode !== 'export') {
-    const hoverColor = options.color
-      ? RECIPIENT_COLOR_STYLES[options.color].baseRingHover
-      : '#e5e7eb';
-
-    // Todo: Envelopes - On hover add text color
-
-    // Add smooth transition-like behavior for hover effects
-    fieldGroup.on('mouseover', () => {
-      new Konva.Tween({
-        node: fieldRect,
-        duration: 0.3,
-        fill: hoverColor,
-      }).play();
-    });
-
-    fieldGroup.on('mouseout', () => {
-      new Konva.Tween({
-        node: fieldRect,
-        duration: 0.3,
-        fill: DEFAULT_RECT_BACKGROUND,
-      }).play();
-    });
-
-    fieldGroup.add(fieldRect);
-  }
+  createFieldHoverInteraction({ fieldGroup, fieldRect, options });
 
   return {
     fieldGroup,

packages/lib/universal/upload/put-file.server.ts

@@ -7,7 +7,6 @@ import { env } from '@documenso/lib/utils/env';
 
 import { AppError } from '../../errors/app-error';
 import { createDocumentData } from '../../server-only/document-data/create-document-data';
-import { normalizePdf } from '../../server-only/pdf/normalize-pdf';
 import { uploadS3File } from './server-actions';
 
 type File = {
@@ -44,28 +43,6 @@ export const putPdfFileServerSide = async (file: File) => {
   return await createDocumentData({ type, data });
 };
 
-/**
- * Uploads a pdf file and normalizes it.
- */
-export const putNormalizedPdfFileServerSide = async (file: File) => {
-  const buffer = Buffer.from(await file.arrayBuffer());
-
-  const normalized = await normalizePdf(buffer);
-
-  const fileName = file.name.endsWith('.pdf') ? file.name : `${file.name}.pdf`;
-
-  const documentData = await putFileServerSide({
-    name: fileName,
-    type: 'application/pdf',
-    arrayBuffer: async () => Promise.resolve(normalized),
-  });
-
-  return await createDocumentData({
-    type: documentData.type,
-    data: documentData.data,
-  });
-};
-
 /**
  * Uploads a file to the appropriate storage location.
  */

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

@@ -353,6 +353,13 @@ export const formatDocumentAuditLogAction = (
       }),
       identified: msg`${prefix} deleted the document`,
     }))
+    .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELDS_AUTO_INSERTED }, () => ({
+      anonymous: msg({
+        message: `System auto inserted fields`,
+        context: `Audit log format`,
+      }),
+      identified: msg`System auto inserted fields`,
+    }))
     .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELD_INSERTED }, () => ({
       anonymous: msg({
         message: `Field signed`,
@@ -515,6 +522,14 @@ export const formatDocumentAuditLogAction = (
         context: `Audit log format`,
       }),
     }))
+    .with({ type: DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_CREATED }, ({ data }) => ({
+      anonymous: msg`Envelope item created`,
+      identified: msg`${prefix} created an envelope item with title ${data.envelopeItemTitle}`,
+    }))
+    .with({ type: DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_DELETED }, ({ data }) => ({
+      anonymous: msg`Envelope item deleted`,
+      identified: msg`${prefix} deleted an envelope item with title ${data.envelopeItemTitle}`,
+    }))
     .exhaustive();
 
   return {

packages/lib/utils/fields.ts

@@ -101,7 +101,7 @@ export const getClientSideFieldTranslations = ({ t }: I18n): Record<FieldType, s
     [FieldType.TEXT]: t(msg`Text`),
     [FieldType.CHECKBOX]: t(msg`Checkbox`),
     [FieldType.RADIO]: t(msg`Radio`),
-    [FieldType.DROPDOWN]: t(msg`Dropdown`),
+    [FieldType.DROPDOWN]: t(msg`Select Option`),
     [FieldType.SIGNATURE]: t(msg`Signature`),
     [FieldType.FREE_SIGNATURE]: t(msg`Free Signature`),
     [FieldType.INITIALS]: t(msg`Initials`),

packages/prisma/package.json

@@ -21,14 +21,14 @@
     "seed": "tsx ./seed-database.ts"
   },
   "dependencies": {
-    "@prisma/client": "^6.18.0",
+    "@prisma/client": "^6.8.2",
     "kysely": "0.26.3",
-    "prisma": "^6.18.0",
+    "prisma": "^6.8.2",
     "prisma-extension-kysely": "^3.0.0",
     "prisma-kysely": "^1.8.0",
-    "prisma-json-types-generator": "^3.6.2",
+    "prisma-json-types-generator": "^3.2.2",
     "ts-pattern": "^5.0.6",
-    "zod-prisma-types": "3.3.5"
+    "zod-prisma-types": "3.2.4"
   },
   "devDependencies": {
     "dotenv": "^16.5.0",

packages/prisma/schema.prisma

@@ -134,8 +134,8 @@ model Passkey {
   createdAt            DateTime  @default(now())
   updatedAt            DateTime  @default(now())
   lastUsedAt           DateTime?
-  credentialId         Bytes /// @zod.custom.use(z.instanceof(Uint8Array))
-  credentialPublicKey  Bytes /// @zod.custom.use(z.instanceof(Uint8Array))
+  credentialId         Bytes
+  credentialPublicKey  Bytes
   counter              BigInt
   credentialDeviceType String
   credentialBackedUp   Boolean

packages/trpc/client/index.ts

@@ -1,23 +1,17 @@
-import {
-  createTRPCClient,
-  httpBatchLink,
-  httpLink,
-  isNonJsonSerializable,
-  splitLink,
-} from '@trpc/client';
+import { createTRPCClient, httpBatchLink, httpLink, splitLink } from '@trpc/client';
+import SuperJSON from 'superjson';
 
 import { getBaseUrl } from '@documenso/lib/universal/get-base-url';
 
 import type { AppRouter } from '../server/router';
-import { dataTransformer } from '../utils/data-transformer';
 
 export const trpc = createTRPCClient<AppRouter>({
   links: [
     splitLink({
-      condition: (op) => op.context.skipBatch === true || isNonJsonSerializable(op.input),
+      condition: (op) => op.context.skipBatch === true,
       true: httpLink({
         url: `${getBaseUrl()}/api/trpc`,
-        transformer: dataTransformer,
+        transformer: SuperJSON,
         headers: (opts) => {
           if (typeof opts.op.context.teamId === 'string') {
             return {
@@ -30,7 +24,7 @@ export const trpc = createTRPCClient<AppRouter>({
       }),
       false: httpBatchLink({
         url: `${getBaseUrl()}/api/trpc`,
-        transformer: dataTransformer,
+        transformer: SuperJSON,
         headers: (opts) => {
           const operationWithTeamId = opts.opList.find(
             (op) => op.context.teamId && typeof op.context.teamId === 'string',

packages/trpc/package.json

@@ -12,21 +12,15 @@
   "dependencies": {
     "@documenso/lib": "*",
     "@documenso/prisma": "*",
-    "@tanstack/react-query": "5.90.5",
-    "@trpc/client": "11.7.0",
-    "@trpc/react-query": "11.7.0",
-    "@trpc/server": "11.7.0",
-    "@ts-rest/core": "^3.52.0",
-    "formidable": "^3.5.4",
+    "@tanstack/react-query": "5.59.15",
+    "@trpc/client": "11.0.0-rc.648",
+    "@trpc/react-query": "11.0.0-rc.648",
+    "@trpc/server": "11.0.0-rc.648",
+    "@ts-rest/core": "^3.30.5",
     "luxon": "^3.4.0",
-    "superjson": "^2.2.5",
-    "trpc-to-openapi": "2.4.0",
+    "superjson": "^1.13.1",
+    "trpc-to-openapi": "2.0.4",
     "ts-pattern": "^5.0.5",
-    "zod": "^3.25.76",
-    "zod-form-data": "^2.0.8",
-    "zod-openapi": "^4.2.4"
-  },
-  "devDependencies": {
-    "@types/formidable": "^3.4.6"
+    "zod": "3.24.1"
   }
 }

packages/trpc/react/index.tsx

@@ -1,13 +1,13 @@
 import { useMemo, useState } from 'react';
 
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { httpBatchLink, httpLink, isNonJsonSerializable, splitLink } from '@trpc/client';
+import { httpBatchLink, httpLink, splitLink } from '@trpc/client';
 import { createTRPCReact } from '@trpc/react-query';
+import SuperJSON from 'superjson';
 
 import { getBaseUrl } from '@documenso/lib/universal/get-base-url';
 
 import type { AppRouter } from '../server/router';
-import { dataTransformer } from '../utils/data-transformer';
 
 export { getQueryKey } from '@trpc/react-query';
 
@@ -44,16 +44,16 @@ export function TrpcProvider({ children, headers }: TrpcProviderProps) {
       trpc.createClient({
         links: [
           splitLink({
-            condition: (op) => op.context.skipBatch === true || isNonJsonSerializable(op.input),
+            condition: (op) => op.context.skipBatch === true,
             true: httpLink({
               url: `${getBaseUrl()}/api/trpc`,
               headers,
-              transformer: dataTransformer,
+              transformer: SuperJSON,
             }),
             false: httpBatchLink({
               url: `${getBaseUrl()}/api/trpc`,
               headers,
-              transformer: dataTransformer,
+              transformer: SuperJSON,
             }),
           }),
         ],

packages/trpc/server/admin-router/get-admin-organisation.ts

@@ -39,6 +39,11 @@ export const getAdminOrganisation = async ({ organisationId }: GetOrganisationOp
       teams: true,
       members: {
         include: {
+          organisationGroupMembers: {
+            include: {
+              group: true,
+            },
+          },
           user: {
             select: {
               id: true,

packages/trpc/server/admin-router/get-admin-organisation.types.ts

@@ -3,6 +3,8 @@ import { z } from 'zod';
 import { ZOrganisationSchema } from '@documenso/lib/types/organisation';
 import OrganisationClaimSchema from '@documenso/prisma/generated/zod/modelSchema/OrganisationClaimSchema';
 import OrganisationGlobalSettingsSchema from '@documenso/prisma/generated/zod/modelSchema/OrganisationGlobalSettingsSchema';
+import OrganisationGroupMemberSchema from '@documenso/prisma/generated/zod/modelSchema/OrganisationGroupMemberSchema';
+import OrganisationGroupSchema from '@documenso/prisma/generated/zod/modelSchema/OrganisationGroupSchema';
 import OrganisationMemberSchema from '@documenso/prisma/generated/zod/modelSchema/OrganisationMemberSchema';
 import SubscriptionSchema from '@documenso/prisma/generated/zod/modelSchema/SubscriptionSchema';
 import TeamSchema from '@documenso/prisma/generated/zod/modelSchema/TeamSchema';
@@ -30,6 +32,18 @@ export const ZGetAdminOrganisationResponseSchema = ZOrganisationSchema.extend({
       email: true,
       name: true,
     }),
+    organisationGroupMembers: z.array(
+      OrganisationGroupMemberSchema.pick({
+        id: true,
+        groupId: true,
+      }).extend({
+        group: OrganisationGroupSchema.pick({
+          id: true,
+          type: true,
+          organisationRole: true,
+        }),
+      }),
+    ),
   }).array(),
   subscription: SubscriptionSchema.nullable(),
   organisationClaim: OrganisationClaimSchema,

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

@@ -17,6 +17,7 @@ import { promoteMemberToOwnerRoute } from './promote-member-to-owner';
 import { resealDocumentRoute } from './reseal-document';
 import { resetTwoFactorRoute } from './reset-two-factor-authentication';
 import { updateAdminOrganisationRoute } from './update-admin-organisation';
+import { updateOrganisationMemberRoleRoute } from './update-organisation-member-role';
 import { updateRecipientRoute } from './update-recipient';
 import { updateSiteSettingRoute } from './update-site-setting';
 import { updateSubscriptionClaimRoute } from './update-subscription-claim';
@@ -31,6 +32,7 @@ export const adminRouter = router({
   },
   organisationMember: {
     promoteToOwner: promoteMemberToOwnerRoute,
+    updateRole: updateOrganisationMemberRoleRoute,
   },
   claims: {
     find: findSubscriptionClaimsRoute,

packages/trpc/server/admin-router/update-organisation-member-role.ts

@@ -0,0 +1,220 @@
+import { OrganisationGroupType, OrganisationMemberRole } from '@prisma/client';
+
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { generateDatabaseId } from '@documenso/lib/universal/id';
+import { getHighestOrganisationRoleInGroup } from '@documenso/lib/utils/organisations';
+import { prisma } from '@documenso/prisma';
+
+import { adminProcedure } from '../trpc';
+import {
+  ZUpdateOrganisationMemberRoleRequestSchema,
+  ZUpdateOrganisationMemberRoleResponseSchema,
+} from './update-organisation-member-role.types';
+
+/**
+ * Admin mutation to update organisation member role or transfer ownership.
+ *
+ * This mutation handles two scenarios:
+ * 1. When role='OWNER': Transfers organisation ownership and promotes to ADMIN
+ * 2. When role=ADMIN/MANAGER/MEMBER: Updates group membership
+ *
+ * Admin privileges bypass normal hierarchy restrictions.
+ */
+export const updateOrganisationMemberRoleRoute = adminProcedure
+  .input(ZUpdateOrganisationMemberRoleRequestSchema)
+  .output(ZUpdateOrganisationMemberRoleResponseSchema)
+  .mutation(async ({ input, ctx }) => {
+    const { organisationId, userId, role } = input;
+
+    ctx.logger.info({
+      input: {
+        organisationId,
+        userId,
+        role,
+      },
+    });
+
+    const organisation = await prisma.organisation.findUnique({
+      where: {
+        id: organisationId,
+      },
+      include: {
+        groups: {
+          where: {
+            type: OrganisationGroupType.INTERNAL_ORGANISATION,
+          },
+        },
+        members: {
+          where: {
+            userId,
+          },
+          include: {
+            organisationGroupMembers: {
+              include: {
+                group: true,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    if (!organisation) {
+      throw new AppError(AppErrorCode.NOT_FOUND, {
+        message: 'Organisation not found',
+      });
+    }
+
+    const [member] = organisation.members;
+
+    if (!member) {
+      throw new AppError(AppErrorCode.NOT_FOUND, {
+        message: 'User is not a member of this organisation',
+      });
+    }
+
+    const currentOrganisationRole = getHighestOrganisationRoleInGroup(
+      member.organisationGroupMembers.flatMap((member) => member.group),
+    );
+
+    if (role === 'OWNER') {
+      if (organisation.ownerUserId === userId) {
+        throw new AppError(AppErrorCode.INVALID_REQUEST, {
+          message: 'User is already the owner of this organisation',
+        });
+      }
+
+      const currentMemberGroup = organisation.groups.find(
+        (group) => group.organisationRole === currentOrganisationRole,
+      );
+
+      const adminGroup = organisation.groups.find(
+        (group) => group.organisationRole === OrganisationMemberRole.ADMIN,
+      );
+
+      if (!currentMemberGroup) {
+        ctx.logger.error({
+          message: '[CRITICAL]: Missing internal group',
+          organisationId,
+          userId,
+          role: currentOrganisationRole,
+        });
+
+        throw new AppError(AppErrorCode.UNKNOWN_ERROR, {
+          message: 'Current member group not found',
+        });
+      }
+
+      if (!adminGroup) {
+        ctx.logger.error({
+          message: '[CRITICAL]: Missing internal group',
+          organisationId,
+          userId,
+          targetRole: 'ADMIN',
+        });
+
+        throw new AppError(AppErrorCode.UNKNOWN_ERROR, {
+          message: 'Admin group not found',
+        });
+      }
+
+      await prisma.$transaction(async (tx) => {
+        await tx.organisation.update({
+          where: {
+            id: organisationId,
+          },
+          data: {
+            ownerUserId: userId,
+          },
+        });
+
+        if (currentOrganisationRole !== OrganisationMemberRole.ADMIN) {
+          await tx.organisationGroupMember.delete({
+            where: {
+              organisationMemberId_groupId: {
+                organisationMemberId: member.id,
+                groupId: currentMemberGroup.id,
+              },
+            },
+          });
+
+          await tx.organisationGroupMember.create({
+            data: {
+              id: generateDatabaseId('group_member'),
+              organisationMemberId: member.id,
+              groupId: adminGroup.id,
+            },
+          });
+        }
+      });
+
+      return;
+    }
+
+    const targetRole = role as OrganisationMemberRole;
+
+    if (currentOrganisationRole === targetRole) {
+      throw new AppError(AppErrorCode.INVALID_REQUEST, {
+        message: 'User already has this role',
+      });
+    }
+
+    if (userId === organisation.ownerUserId && targetRole !== OrganisationMemberRole.ADMIN) {
+      throw new AppError(AppErrorCode.INVALID_REQUEST, {
+        message: 'Organisation owner must be an admin. Transfer ownership first.',
+      });
+    }
+
+    const currentMemberGroup = organisation.groups.find(
+      (group) => group.organisationRole === currentOrganisationRole,
+    );
+
+    const newMemberGroup = organisation.groups.find(
+      (group) => group.organisationRole === targetRole,
+    );
+
+    if (!currentMemberGroup) {
+      ctx.logger.error({
+        message: '[CRITICAL]: Missing internal group',
+        organisationId,
+        userId,
+        role: currentOrganisationRole,
+      });
+
+      throw new AppError(AppErrorCode.UNKNOWN_ERROR, {
+        message: 'Current member group not found',
+      });
+    }
+
+    if (!newMemberGroup) {
+      ctx.logger.error({
+        message: '[CRITICAL]: Missing internal group',
+        organisationId,
+        userId,
+        targetRole,
+      });
+
+      throw new AppError(AppErrorCode.UNKNOWN_ERROR, {
+        message: 'New member group not found',
+      });
+    }
+
+    await prisma.$transaction(async (tx) => {
+      await tx.organisationGroupMember.delete({
+        where: {
+          organisationMemberId_groupId: {
+            organisationMemberId: member.id,
+            groupId: currentMemberGroup.id,
+          },
+        },
+      });
+
+      await tx.organisationGroupMember.create({
+        data: {
+          id: generateDatabaseId('group_member'),
+          organisationMemberId: member.id,
+          groupId: newMemberGroup.id,
+        },
+      });
+    });
+  });

packages/trpc/server/admin-router/update-organisation-member-role.types.ts

@@ -0,0 +1,30 @@
+import { OrganisationMemberRole } from '@prisma/client';
+import { z } from 'zod';
+
+/**
+ * Admin-only role selection that includes OWNER as a special case.
+ * OWNER is not a database role but triggers ownership transfer.
+ */
+export const ZAdminRoleSelection = z.enum([
+  'OWNER',
+  OrganisationMemberRole.ADMIN,
+  OrganisationMemberRole.MANAGER,
+  OrganisationMemberRole.MEMBER,
+]);
+
+export type TAdminRoleSelection = z.infer<typeof ZAdminRoleSelection>;
+
+export const ZUpdateOrganisationMemberRoleRequestSchema = z.object({
+  organisationId: z.string().min(1),
+  userId: z.number().min(1),
+  role: ZAdminRoleSelection,
+});
+
+export const ZUpdateOrganisationMemberRoleResponseSchema = z.void();
+
+export type TUpdateOrganisationMemberRoleRequest = z.infer<
+  typeof ZUpdateOrganisationMemberRoleRequestSchema
+>;
+export type TUpdateOrganisationMemberRoleResponse = z.infer<
+  typeof ZUpdateOrganisationMemberRoleResponseSchema
+>;

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

@@ -1,136 +0,0 @@
-import { EnvelopeType } from '@prisma/client';
-
-import { getServerLimits } from '@documenso/ee/server-only/limits/server';
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import { createEnvelope } from '@documenso/lib/server-only/envelope/create-envelope';
-import { putPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
-import { mapSecondaryIdToDocumentId } from '@documenso/lib/utils/envelope';
-import { prisma } from '@documenso/prisma';
-
-import { authenticatedProcedure } from '../trpc';
-import {
-  ZCreateDocumentFormDataRequestSchema,
-  ZCreateDocumentFormDataResponseSchema,
-  createDocumentFormDataMeta,
-} from './create-document-formdata.types';
-
-/**
- * Temporary endpoint for V2 Beta until we allow passthrough documents on create.
- *
- * @public
- */
-export const createDocumentFormDataRoute = authenticatedProcedure
-  .meta(createDocumentFormDataMeta)
-  .input(ZCreateDocumentFormDataRequestSchema)
-  .output(ZCreateDocumentFormDataResponseSchema)
-  .mutation(async ({ input, ctx }) => {
-    const { teamId, user } = ctx;
-
-    const { payload, file } = input;
-
-    const {
-      title,
-      externalId,
-      visibility,
-      globalAccessAuth,
-      globalActionAuth,
-      recipients,
-      meta,
-      folderId,
-      attachments,
-    } = payload;
-
-    const { remaining } = await getServerLimits({ userId: user.id, teamId });
-
-    if (remaining.documents <= 0) {
-      throw new AppError(AppErrorCode.LIMIT_EXCEEDED, {
-        message: 'You have reached your document limit for this month. Please upgrade your plan.',
-        statusCode: 400,
-      });
-    }
-
-    const documentData = await putPdfFileServerSide(file);
-
-    const createdEnvelope = await createEnvelope({
-      userId: ctx.user.id,
-      teamId,
-      normalizePdf: false, // Not normalizing because of presigned URL.
-      internalVersion: 1,
-      data: {
-        type: EnvelopeType.DOCUMENT,
-        title,
-        externalId,
-        visibility,
-        globalAccessAuth,
-        globalActionAuth,
-        recipients: (recipients || []).map((recipient) => ({
-          ...recipient,
-          fields: (recipient.fields || []).map((field) => ({
-            ...field,
-            page: field.pageNumber,
-            positionX: field.pageX,
-            positionY: field.pageY,
-            documentDataId: documentData.id,
-          })),
-        })),
-        folderId,
-        envelopeItems: [
-          {
-            // If you ever allow more than 1 in this endpoint, make sure to use `maximumEnvelopeItemCount` to limit it.
-            documentDataId: documentData.id,
-          },
-        ],
-      },
-      attachments,
-      meta: {
-        ...meta,
-        emailSettings: meta?.emailSettings ?? undefined,
-      },
-      requestMetadata: ctx.metadata,
-    });
-
-    const envelopeItems = await prisma.envelopeItem.findMany({
-      where: {
-        envelopeId: createdEnvelope.id,
-      },
-      include: {
-        documentData: true,
-      },
-    });
-
-    const legacyDocumentId = mapSecondaryIdToDocumentId(createdEnvelope.secondaryId);
-
-    const firstDocumentData = envelopeItems[0].documentData;
-
-    if (!firstDocumentData) {
-      throw new Error('Document data not found');
-    }
-
-    return {
-      document: {
-        ...createdEnvelope,
-        envelopeId: createdEnvelope.id,
-        documentDataId: firstDocumentData.id,
-        documentData: {
-          ...firstDocumentData,
-          envelopeItemId: envelopeItems[0].id,
-        },
-        documentMeta: {
-          ...createdEnvelope.documentMeta,
-          documentId: legacyDocumentId,
-        },
-        id: legacyDocumentId,
-        fields: createdEnvelope.fields.map((field) => ({
-          ...field,
-          documentId: legacyDocumentId,
-          templateId: null,
-        })),
-        recipients: createdEnvelope.recipients.map((recipient) => ({
-          ...recipient,
-          documentId: legacyDocumentId,
-          templateId: null,
-        })),
-      },
-      folder: createdEnvelope.folder, // Todo: Remove this prior to api-v2 release.
-    };
-  });

packages/trpc/server/document-router/create-document-formdata.types.ts

@@ -1,97 +0,0 @@
-import { z } from 'zod';
-import { zfd } from 'zod-form-data';
-
-import { ZDocumentSchema } from '@documenso/lib/types/document';
-import {
-  ZDocumentAccessAuthTypesSchema,
-  ZDocumentActionAuthTypesSchema,
-} from '@documenso/lib/types/document-auth';
-import { ZDocumentFormValuesSchema } from '@documenso/lib/types/document-form-values';
-import { ZDocumentMetaCreateSchema } from '@documenso/lib/types/document-meta';
-import { ZEnvelopeAttachmentTypeSchema } from '@documenso/lib/types/envelope-attachment';
-import {
-  ZFieldHeightSchema,
-  ZFieldPageNumberSchema,
-  ZFieldPageXSchema,
-  ZFieldPageYSchema,
-  ZFieldWidthSchema,
-} from '@documenso/lib/types/field';
-import { ZFieldAndMetaSchema } from '@documenso/lib/types/field-meta';
-
-import { zodFormData } from '../../utils/zod-form-data';
-import { ZCreateRecipientSchema } from '../recipient-router/schema';
-import type { TrpcRouteMeta } from '../trpc';
-import {
-  ZDocumentExternalIdSchema,
-  ZDocumentTitleSchema,
-  ZDocumentVisibilitySchema,
-} from './schema';
-
-export const createDocumentFormDataMeta: TrpcRouteMeta = {
-  openapi: {
-    method: 'POST',
-    path: '/document/create/formdata',
-    contentTypes: ['multipart/form-data'],
-    summary: 'Create document',
-    description: 'Create a document using form data.',
-    tags: ['Document'],
-  },
-};
-
-const ZCreateDocumentFormDataPayloadRequestSchema = z.object({
-  title: ZDocumentTitleSchema,
-  externalId: ZDocumentExternalIdSchema.optional(),
-  visibility: ZDocumentVisibilitySchema.optional(),
-  globalAccessAuth: z.array(ZDocumentAccessAuthTypesSchema).optional(),
-  globalActionAuth: z.array(ZDocumentActionAuthTypesSchema).optional(),
-  formValues: ZDocumentFormValuesSchema.optional(),
-  folderId: z
-    .string()
-    .describe(
-      'The ID of the folder to create the document in. If not provided, the document will be created in the root folder.',
-    )
-    .optional(),
-  recipients: z
-    .array(
-      ZCreateRecipientSchema.extend({
-        fields: ZFieldAndMetaSchema.and(
-          z.object({
-            pageNumber: ZFieldPageNumberSchema,
-            pageX: ZFieldPageXSchema,
-            pageY: ZFieldPageYSchema,
-            width: ZFieldWidthSchema,
-            height: ZFieldHeightSchema,
-          }),
-        )
-          .array()
-          .optional(),
-      }),
-    )
-
-    .optional(),
-  attachments: z
-    .array(
-      z.object({
-        label: z.string().min(1, 'Label is required'),
-        data: z.string().url('Must be a valid URL'),
-        type: ZEnvelopeAttachmentTypeSchema.optional().default('link'),
-      }),
-    )
-    .optional(),
-  meta: ZDocumentMetaCreateSchema.optional(),
-});
-
-// !: Can't use zfd.formData() here because it receives `undefined`
-// !: somewhere in the pipeline of our openapi schema generation and throws
-// !: an error.
-export const ZCreateDocumentFormDataRequestSchema = zodFormData({
-  payload: zfd.json(ZCreateDocumentFormDataPayloadRequestSchema),
-  file: zfd.file(),
-});
-
-export const ZCreateDocumentFormDataResponseSchema = z.object({
-  document: ZDocumentSchema,
-});
-
-export type TCreateDocumentFormDataRequest = z.infer<typeof ZCreateDocumentFormDataRequestSchema>;
-export type TCreateDocumentFormDataResponse = z.infer<typeof ZCreateDocumentFormDataResponseSchema>;

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

@@ -3,7 +3,6 @@ import { EnvelopeType } from '@prisma/client';
 import { getServerLimits } from '@documenso/ee/server-only/limits/server';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { createEnvelope } from '@documenso/lib/server-only/envelope/create-envelope';
-import { putNormalizedPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
 import { mapSecondaryIdToDocumentId } from '@documenso/lib/utils/envelope';
 
 import { authenticatedProcedure } from '../trpc';
@@ -17,12 +16,7 @@ export const createDocumentRoute = authenticatedProcedure
   .output(ZCreateDocumentResponseSchema)
   .mutation(async ({ input, ctx }) => {
     const { user, teamId } = ctx;
-
-    const { payload, file } = input;
-
-    const { title, timezone, folderId, attachments } = payload;
-
-    const { id: documentDataId } = await putNormalizedPdfFileServerSide(file);
+    const { title, documentDataId, timezone, folderId, attachments } = input;
 
     ctx.logger.info({
       input: {
@@ -61,7 +55,6 @@ export const createDocumentRoute = authenticatedProcedure
     });
 
     return {
-      envelopeId: document.id,
       legacyDocumentId: mapSecondaryIdToDocumentId(document.secondaryId),
     };
   });

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

@@ -1,27 +1,23 @@
 import { z } from 'zod';
-import { zfd } from 'zod-form-data';
 
 import { ZDocumentMetaTimezoneSchema } from '@documenso/lib/types/document-meta';
 import { ZEnvelopeAttachmentTypeSchema } from '@documenso/lib/types/envelope-attachment';
 
-import { zodFormData } from '../../utils/zod-form-data';
-import type { TrpcRouteMeta } from '../trpc';
 import { ZDocumentTitleSchema } from './schema';
 
 // Currently not in use until we allow passthrough documents on create.
-export const createDocumentMeta: TrpcRouteMeta = {
-  openapi: {
-    method: 'POST',
-    path: '/document/create',
-    contentTypes: ['multipart/form-data'],
-    summary: 'Create document',
-    description: 'Create a document using form data.',
-    tags: ['Document'],
-  },
-};
+// export const createDocumentMeta: TrpcRouteMeta = {
+//   openapi: {
+//     method: 'POST',
+//     path: '/document/create',
+//     summary: 'Create document',
+//     tags: ['Document'],
+//   },
+// };
 
-export const ZCreateDocumentPayloadSchema = z.object({
+export const ZCreateDocumentRequestSchema = z.object({
   title: ZDocumentTitleSchema,
+  documentDataId: z.string().min(1),
   timezone: ZDocumentMetaTimezoneSchema.optional(),
   folderId: z.string().describe('The ID of the folder to create the document in').optional(),
   attachments: z
@@ -35,16 +31,9 @@ export const ZCreateDocumentPayloadSchema = z.object({
     .optional(),
 });
 
-export const ZCreateDocumentRequestSchema = zodFormData({
-  payload: zfd.json(ZCreateDocumentPayloadSchema),
-  file: zfd.file(),
-});
-
 export const ZCreateDocumentResponseSchema = z.object({
-  envelopeId: z.string(),
   legacyDocumentId: z.number(),
 });
 
-export type TCreateDocumentPayloadSchema = z.infer<typeof ZCreateDocumentPayloadSchema>;
 export type TCreateDocumentRequest = z.infer<typeof ZCreateDocumentRequestSchema>;
 export type TCreateDocumentResponse = z.infer<typeof ZCreateDocumentResponseSchema>;

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

@@ -5,7 +5,6 @@ import { deleteAttachmentRoute } from './attachment/delete-attachment';
 import { findAttachmentsRoute } from './attachment/find-attachments';
 import { updateAttachmentRoute } from './attachment/update-attachment';
 import { createDocumentRoute } from './create-document';
-import { createDocumentFormDataRoute } from './create-document-formdata';
 import { createDocumentTemporaryRoute } from './create-document-temporary';
 import { deleteDocumentRoute } from './delete-document';
 import { distributeDocumentRoute } from './distribute-document';
@@ -41,7 +40,6 @@ export const documentRouter = router({
   // Temporary v2 beta routes to be removed once V2 is fully released.
   download: downloadDocumentRoute,
   createDocumentTemporary: createDocumentTemporaryRoute,
-  createDocumentFormData: createDocumentFormDataRoute,
 
   // Internal document routes for custom frontend requests.
   getDocumentByToken: getDocumentByTokenRoute,

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

@@ -1,6 +1,8 @@
 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 { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { canEnvelopeItemsBeModified } from '@documenso/lib/utils/envelope';
 import { prisma } from '@documenso/prisma';
 
@@ -14,7 +16,7 @@ export const createEnvelopeItemsRoute = authenticatedProcedure
   .input(ZCreateEnvelopeItemsRequestSchema)
   .output(ZCreateEnvelopeItemsResponseSchema)
   .mutation(async ({ input, ctx }) => {
-    const { user, teamId } = ctx;
+    const { user, teamId, metadata } = ctx;
     const { envelopeId, items } = input;
 
     ctx.logger.info({
@@ -110,17 +112,39 @@ export const createEnvelopeItemsRoute = authenticatedProcedure
     const currentHighestOrderValue =
       envelope.envelopeItems[envelope.envelopeItems.length - 1]?.order ?? 1;
 
-    const result = await prisma.envelopeItem.createManyAndReturn({
-      data: items.map((item) => ({
-        id: prefixedId('envelope_item'),
-        envelopeId,
-        title: item.title,
-        documentDataId: item.documentDataId,
-        order: currentHighestOrderValue + 1,
-      })),
-      include: {
-        documentData: true,
-      },
+    const result = await prisma.$transaction(async (tx) => {
+      const createdItems = await tx.envelopeItem.createManyAndReturn({
+        data: items.map((item) => ({
+          id: prefixedId('envelope_item'),
+          envelopeId,
+          title: item.title,
+          documentDataId: item.documentDataId,
+          order: currentHighestOrderValue + 1,
+        })),
+        include: {
+          documentData: true,
+        },
+      });
+
+      await tx.documentAuditLog.createMany({
+        data: createdItems.map((item) =>
+          createDocumentAuditLogData({
+            type: DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_CREATED,
+            envelopeId: envelope.id,
+            data: {
+              envelopeItemId: item.id,
+              envelopeItemTitle: item.title,
+            },
+            user: {
+              name: user.name,
+              email: user.email,
+            },
+            requestMetadata: metadata.requestMetadata,
+          }),
+        ),
+      });
+
+      return createdItems;
     });
 
     return {

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

@@ -1,7 +1,6 @@
 import { getServerLimits } from '@documenso/ee/server-only/limits/server';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { createEnvelope } from '@documenso/lib/server-only/envelope/create-envelope';
-import { putNormalizedPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
 
 import { authenticatedProcedure } from '../trpc';
 import {
@@ -14,9 +13,6 @@ export const createEnvelopeRoute = authenticatedProcedure
   .output(ZCreateEnvelopeResponseSchema)
   .mutation(async ({ input, ctx }) => {
     const { user, teamId } = ctx;
-
-    const { payload, files } = input;
-
     const {
       title,
       type,
@@ -26,9 +22,10 @@ export const createEnvelopeRoute = authenticatedProcedure
       globalActionAuth,
       recipients,
       folderId,
+      items,
       meta,
       attachments,
-    } = payload;
+    } = input;
 
     ctx.logger.info({
       input: {
@@ -48,62 +45,13 @@ export const createEnvelopeRoute = authenticatedProcedure
       });
     }
 
-    if (files.length > maximumEnvelopeItemCount) {
+    if (items.length > maximumEnvelopeItemCount) {
       throw new AppError('ENVELOPE_ITEM_LIMIT_EXCEEDED', {
         message: `You cannot upload more than ${maximumEnvelopeItemCount} envelope items per envelope`,
         statusCode: 400,
       });
     }
 
-    // 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);
-
-        return {
-          title: file.name,
-          documentDataId,
-        };
-      }),
-    );
-
-    const recipientsToCreate = recipients?.map((recipient) => ({
-      email: recipient.email,
-      name: recipient.name,
-      role: recipient.role,
-      signingOrder: recipient.signingOrder,
-      accessAuth: recipient.accessAuth,
-      actionAuth: recipient.actionAuth,
-      fields: recipient.fields?.map((field) => {
-        let documentDataId: string | undefined = undefined;
-
-        if (typeof field.identifier === 'string') {
-          documentDataId = envelopeItems.find(
-            (item) => item.title === field.identifier,
-          )?.documentDataId;
-        }
-
-        if (typeof field.identifier === 'number') {
-          documentDataId = envelopeItems.at(field.identifier)?.documentDataId;
-        }
-
-        if (field.identifier === undefined) {
-          documentDataId = envelopeItems[0]?.documentDataId;
-        }
-
-        if (!documentDataId) {
-          throw new AppError(AppErrorCode.NOT_FOUND, {
-            message: 'Document data not found',
-          });
-        }
-
-        return {
-          ...field,
-          documentDataId,
-        };
-      }),
-    }));
-
     const envelope = await createEnvelope({
       userId: user.id,
       teamId,
@@ -115,9 +63,9 @@ export const createEnvelopeRoute = authenticatedProcedure
         visibility,
         globalAccessAuth,
         globalActionAuth,
-        recipients: recipientsToCreate,
+        recipients,
         folderId,
-        envelopeItems,
+        envelopeItems: items,
       },
       attachments,
       meta,

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

@@ -1,6 +1,5 @@
 import { EnvelopeType } from '@prisma/client';
 import { z } from 'zod';
-import { zfd } from 'zod-form-data';
 
 import {
   ZDocumentAccessAuthTypesSchema,
@@ -18,28 +17,24 @@ import {
 } from '@documenso/lib/types/field';
 import { ZFieldAndMetaSchema } from '@documenso/lib/types/field-meta';
 
-import { zodFormData } from '../../utils/zod-form-data';
 import {
   ZDocumentExternalIdSchema,
   ZDocumentTitleSchema,
   ZDocumentVisibilitySchema,
 } from '../document-router/schema';
 import { ZCreateRecipientSchema } from '../recipient-router/schema';
-import type { TrpcRouteMeta } from '../trpc';
 
 // Currently not in use until we allow passthrough documents on create.
-export const createEnvelopeMeta: TrpcRouteMeta = {
-  openapi: {
-    method: 'POST',
-    path: '/envelope/create',
-    contentTypes: ['multipart/form-data'],
-    summary: 'Create envelope',
-    description: 'Create a envelope using form data.',
-    tags: ['Envelope'],
-  },
-};
+// export const createEnvelopeMeta: TrpcRouteMeta = {
+//   openapi: {
+//     method: 'POST',
+//     path: '/envelope/create',
+//     summary: 'Create envelope',
+//     tags: ['Envelope'],
+//   },
+// };
 
-export const ZCreateEnvelopePayloadSchema = z.object({
+export const ZCreateEnvelopeRequestSchema = z.object({
   title: ZDocumentTitleSchema,
   type: z.nativeEnum(EnvelopeType),
   externalId: ZDocumentExternalIdSchema.optional(),
@@ -47,6 +42,12 @@ export const ZCreateEnvelopePayloadSchema = z.object({
   globalAccessAuth: z.array(ZDocumentAccessAuthTypesSchema).optional(),
   globalActionAuth: z.array(ZDocumentActionAuthTypesSchema).optional(),
   formValues: ZDocumentFormValuesSchema.optional(),
+  items: z
+    .object({
+      title: ZDocumentTitleSchema.optional(),
+      documentDataId: z.string(),
+    })
+    .array(),
   folderId: z
     .string()
     .describe(
@@ -58,12 +59,11 @@ export const ZCreateEnvelopePayloadSchema = z.object({
       ZCreateRecipientSchema.extend({
         fields: ZFieldAndMetaSchema.and(
           z.object({
-            identifier: z
-              .union([z.string(), z.number()])
+            documentDataId: z
+              .string()
               .describe(
-                'Either the filename or the index of the file that was uploaded to attach the field to.',
-              )
-              .optional(),
+                'The ID of the document data to create the field on. If empty, the first document data will be used.',
+              ),
             page: ZFieldPageNumberSchema,
             positionX: ZFieldPageXSchema,
             positionY: ZFieldPageYSchema,
@@ -88,15 +88,9 @@ export const ZCreateEnvelopePayloadSchema = z.object({
     .optional(),
 });
 
-export const ZCreateEnvelopeRequestSchema = zodFormData({
-  payload: zfd.json(ZCreateEnvelopePayloadSchema),
-  files: zfd.repeatableOfType(zfd.file()),
-});
-
 export const ZCreateEnvelopeResponseSchema = z.object({
   id: z.string(),
 });
 
-export type TCreateEnvelopePayload = z.infer<typeof ZCreateEnvelopePayloadSchema>;
 export type TCreateEnvelopeRequest = z.infer<typeof ZCreateEnvelopeRequestSchema>;
 export type TCreateEnvelopeResponse = z.infer<typeof ZCreateEnvelopeResponseSchema>;

packages/trpc/server/envelope-router/delete-envelope-item.ts

@@ -1,5 +1,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 { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { canEnvelopeItemsBeModified } from '@documenso/lib/utils/envelope';
 import { prisma } from '@documenso/prisma';
 
@@ -13,7 +15,7 @@ export const deleteEnvelopeItemRoute = authenticatedProcedure
   .input(ZDeleteEnvelopeItemRequestSchema)
   .output(ZDeleteEnvelopeItemResponseSchema)
   .mutation(async ({ input, ctx }) => {
-    const { user, teamId } = ctx;
+    const { user, teamId, metadata } = ctx;
     const { envelopeId, envelopeItemId } = input;
 
     ctx.logger.info({
@@ -52,29 +54,48 @@ export const deleteEnvelopeItemRoute = authenticatedProcedure
       });
     }
 
-    const deletedEnvelopeItem = await prisma.envelopeItem.delete({
-      where: {
-        id: envelopeItemId,
-        envelopeId: envelope.id,
-      },
-      select: {
-        documentData: {
-          select: {
-            id: true,
+    const result = await prisma.$transaction(async (tx) => {
+      const deletedEnvelopeItem = await tx.envelopeItem.delete({
+        where: {
+          id: envelopeItemId,
+          envelopeId: envelope.id,
+        },
+        select: {
+          id: true,
+          title: true,
+          documentData: {
+            select: {
+              id: true,
+            },
           },
         },
-      },
+      });
+
+      await tx.documentAuditLog.create({
+        data: createDocumentAuditLogData({
+          type: DOCUMENT_AUDIT_LOG_TYPE.ENVELOPE_ITEM_DELETED,
+          envelopeId: envelope.id,
+          data: {
+            envelopeItemId: deletedEnvelopeItem.id,
+            envelopeItemTitle: deletedEnvelopeItem.title,
+          },
+          user: {
+            name: user.name,
+            email: user.email,
+          },
+          requestMetadata: metadata.requestMetadata,
+        }),
+      });
+
+      return deletedEnvelopeItem;
     });
 
-    // Todo: Envelopes [ASK] - Should we delete the document data?
     await prisma.documentData.delete({
       where: {
-        id: deletedEnvelopeItem.documentData.id,
+        id: result.documentData.id,
         envelopeItem: {
           is: null,
         },
       },
     });
-
-    // Todo: Envelope [AUDIT_LOGS]
   });

packages/trpc/server/envelope-router/set-envelope-fields.ts

@@ -24,7 +24,7 @@ export const setEnvelopeFieldsRoute = authenticatedProcedure
       },
     });
 
-    await match(envelopeType)
+    const result = await match(envelopeType)
       .with(EnvelopeType.DOCUMENT, async () =>
         setFieldsForDocument({
           userId: ctx.user.id,
@@ -63,4 +63,11 @@ export const setEnvelopeFieldsRoute = authenticatedProcedure
         }),
       )
       .exhaustive();
+
+    return {
+      fields: result.fields.map((field) => ({
+        id: field.id,
+        formId: field.formId,
+      })),
+    };
   });

packages/trpc/server/envelope-router/set-envelope-fields.types.ts

@@ -12,6 +12,7 @@ export const ZSetEnvelopeFieldsRequestSchema = z.object({
         .number()
         .optional()
         .describe('The id of the field. If not provided, a new field will be created.'),
+      formId: z.string().optional().describe('A temporary ID to keep track of new fields created'),
       envelopeItemId: z.string().describe('The id of the envelope item to put the field on'),
       recipientId: z.number(),
       type: z.nativeEnum(FieldType),
@@ -45,7 +46,14 @@ export const ZSetEnvelopeFieldsRequestSchema = z.object({
   ),
 });
 
-export const ZSetEnvelopeFieldsResponseSchema = z.void();
+export const ZSetEnvelopeFieldsResponseSchema = z.object({
+  fields: z
+    .object({
+      id: z.number(),
+      formId: z.string().optional(),
+    })
+    .array(),
+});
 
 export type TSetEnvelopeFieldsRequest = z.infer<typeof ZSetEnvelopeFieldsRequestSchema>;
 export type TSetEnvelopeFieldsResponse = z.infer<typeof ZSetEnvelopeFieldsResponseSchema>;

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

@@ -21,7 +21,6 @@ import { deleteTemplateDirectLink } from '@documenso/lib/server-only/template/de
 import { findTemplates } from '@documenso/lib/server-only/template/find-templates';
 import { getTemplateById } from '@documenso/lib/server-only/template/get-template-by-id';
 import { toggleTemplateDirectLink } from '@documenso/lib/server-only/template/toggle-template-direct-link';
-import { putNormalizedPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
 import { getPresignPostUrl } from '@documenso/lib/universal/upload/server-actions';
 import { mapSecondaryIdToTemplateId } from '@documenso/lib/utils/envelope';
 import { mapFieldToLegacyField } from '@documenso/lib/utils/fields';
@@ -160,27 +159,20 @@ export const templateRouter = router({
    * @private
    */
   createTemplate: authenticatedProcedure
-    .meta({
-      // Note before releasing this to public, update the response schema to be correct.
-      openapi: {
-        method: 'POST',
-        path: '/template/create',
-        contentTypes: ['multipart/form-data'],
-        summary: 'Create template',
-        description: 'Create a new template',
-        tags: ['Template'],
-      },
-    })
+    // .meta({ // Note before releasing this to public, update the response schema to be correct.
+    //   openapi: {
+    //     method: 'POST',
+    //     path: '/template/create',
+    //     summary: 'Create template',
+    //     description: 'Create a new template',
+    //     tags: ['Template'],
+    //   },
+    // })
     .input(ZCreateTemplateMutationSchema)
     .output(ZCreateTemplateResponseSchema)
     .mutation(async ({ input, ctx }) => {
       const { teamId } = ctx;
-
-      const { payload, file } = input;
-
-      const { title, folderId } = payload;
-
-      const { id: templateDocumentDataId } = await putNormalizedPdfFileServerSide(file);
+      const { title, templateDocumentDataId, folderId } = input;
 
       ctx.logger.info({
         input: {
@@ -206,7 +198,6 @@ export const templateRouter = router({
       });
 
       return {
-        envelopeId: envelope.id,
         legacyTemplateId: mapSecondaryIdToTemplateId(envelope.secondaryId),
       };
     }),

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

@@ -1,6 +1,5 @@
 import { DocumentSigningOrder, DocumentVisibility, TemplateType } from '@prisma/client';
 import { z } from 'zod';
-import { zfd } from 'zod-form-data';
 
 import { ZDocumentSchema } from '@documenso/lib/types/document';
 import {
@@ -30,7 +29,6 @@ import {
 } from '@documenso/lib/types/template';
 import { LegacyTemplateDirectLinkSchema } from '@documenso/prisma/types/template-legacy-schema';
 
-import { zodFormData } from '../../utils/zod-form-data';
 import { ZSignFieldWithTokenMutationSchema } from '../field-router/schema';
 
 export const MAX_TEMPLATE_PUBLIC_TITLE_LENGTH = 50;
@@ -79,16 +77,12 @@ export const ZTemplateMetaUpsertSchema = z.object({
   allowDictateNextSigner: z.boolean().optional(),
 });
 
-export const ZCreateTemplatePayloadSchema = z.object({
+export const ZCreateTemplateMutationSchema = z.object({
   title: z.string().min(1).trim(),
+  templateDocumentDataId: z.string().min(1),
   folderId: z.string().optional(),
 });
 
-export const ZCreateTemplateMutationSchema = zodFormData({
-  payload: zfd.json(ZCreateTemplatePayloadSchema),
-  file: zfd.file(),
-});
-
 export const ZCreateDocumentFromDirectTemplateRequestSchema = z.object({
   directRecipientName: z.string().max(255).optional(),
   directRecipientEmail: z.string().email().max(254),
@@ -224,7 +218,6 @@ export const ZCreateTemplateV2ResponseSchema = z.object({
 });
 
 export const ZCreateTemplateResponseSchema = z.object({
-  envelopeId: z.string(),
   legacyTemplateId: z.number(),
 });
 
@@ -274,7 +267,6 @@ export const ZBulkSendTemplateMutationSchema = z.object({
   sendImmediately: z.boolean(),
 });
 
-export type TCreateTemplatePayloadSchema = z.infer<typeof ZCreateTemplatePayloadSchema>;
 export type TCreateTemplateMutationSchema = z.infer<typeof ZCreateTemplateMutationSchema>;
 export type TDuplicateTemplateMutationSchema = z.infer<typeof ZDuplicateTemplateMutationSchema>;
 export type TDeleteTemplateMutationSchema = z.infer<typeof ZDeleteTemplateMutationSchema>;