feat: add document version history UI

.husky/pre-commit

@@ -1,16 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-SCRIPT_DIR="$(readlink -f "$(dirname "$0")")"
-MONOREPO_ROOT="$(readlink -f "$SCRIPT_DIR/../")"
-
-echo "Copying pdf.js"
-npm run copy:pdfjs --workspace apps/**
-
-echo "Copying .well-known/ contents"
-node "$MONOREPO_ROOT/scripts/copy-wellknown.cjs"
-
-git add "$MONOREPO_ROOT/apps/web/public/"
-git add "$MONOREPO_ROOT/apps/marketing/public/"
-
 npx lint-staged

.well-known/security.txt

@@ -1,7 +0,0 @@
-# General Issues
-Contact: https://github.com/documenso/documenso/issues/new?assignees=&labels=bug&projects=&template=bug-report.yml
-
-# Report critical issues privately to let us take appropriate action before publishing.
-Contact: mailto:security@documenso.com
-Preferred-Languages: en
-Canonical: https://documenso.com/.well-known/security.txt

apps/marketing/content/blog/commodifying-signing.mdx

@@ -5,7 +5,7 @@ authorName: 'Timur Ercan'
 authorImage: '/blog/blog-author-timur.jpeg'
 authorRole: 'Co-Founder'
 date: 2024-01-25
-tags:
+Tags:
   - Vision
   - Mission
   - Open Source

apps/marketing/content/blog/linear-gh.mdx

@@ -5,7 +5,7 @@ authorName: 'Timur Ercan'
 authorImage: '/blog/blog-author-timur.jpeg'
 authorRole: 'Co-Founder'
 date: 2024-01-10
-tags:
+Tags:
   - GitHub
   - Backlog
   - Roadmap

apps/marketing/content/blog/why-i-started-documenso.mdx

@@ -5,7 +5,7 @@ authorName: 'Timur Ercan'
 authorImage: '/blog/blog-author-timur.jpeg'
 authorRole: 'Co-Founder'
 date: 2024-02-06
-tags:
+Tags:
   - Founders
   - Mission
   - Open Source

apps/marketing/public/.well-known/security.txt

@@ -1,7 +0,0 @@
-# General Issues
-Contact: https://github.com/documenso/documenso/issues/new?assignees=&labels=bug&projects=&template=bug-report.yml
-
-# Report critical issues privately to let us take appropriate action before publishing.
-Contact: mailto:security@documenso.com
-Preferred-Languages: en
-Canonical: https://documenso.com/.well-known/security.txt

apps/marketing/src/app/(marketing)/[content]/page.tsx

@@ -12,7 +12,7 @@ export const generateMetadata = ({ params }: { params: { content: string } }) =>
   const document = allDocuments.find((post) => post._raw.flattenedPath === params.content);
 
   if (!document) {
-    return { title: 'Not Found' };
+    notFound();
   }
 
   return { title: document.title };

apps/marketing/src/app/(marketing)/blog/[post]/page.tsx

@@ -7,8 +7,6 @@ import { ChevronLeft } from 'lucide-react';
 import type { MDXComponents } from 'mdx/types';
 import { useMDXComponent } from 'next-contentlayer/hooks';
 
-export const dynamic = 'force-dynamic';
-
 export const generateStaticParams = () =>
   allBlogPosts.map((post) => ({ post: post._raw.flattenedPath }));
 
@@ -16,9 +14,7 @@ export const generateMetadata = ({ params }: { params: { post: string } }) => {
   const blogPost = allBlogPosts.find((post) => post._raw.flattenedPath === `blog/${params.post}`);
 
   if (!blogPost) {
-    return {
-      title: 'Not Found',
-    };
+    notFound();
   }
 
   return {

apps/marketing/src/app/(marketing)/claimed/page.tsx

@@ -4,7 +4,6 @@ import { redirect } from 'next/navigation';
 
 import { ArrowRight } from 'lucide-react';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { redis } from '@documenso/lib/server-only/redis';
 import { stripe } from '@documenso/lib/server-only/stripe';
 import { prisma } from '@documenso/prisma';
@@ -13,8 +12,6 @@ import { Button } from '@documenso/ui/primitives/button';
 
 import { PasswordReveal } from '~/components/(marketing)/password-reveal';
 
-export const dynamic = 'force-dynamic';
-
 const fontCaveat = Caveat({
   weight: ['500'],
   subsets: ['latin'],
@@ -178,7 +175,11 @@ export default async function ClaimedPlanPage({ searchParams = {} }: ClaimedPlan
           This is a temporary password. Please change it as soon as possible.
         </p>
 
-        <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signin`} target="_blank" className="mt-4 block">
+        <Link
+          href={`${process.env.NEXT_PUBLIC_WEBAPP_URL}/signin`}
+          target="_blank"
+          className="mt-4 block"
+        >
           <Button size="lg" className="text-base">
             Let's get started!
             <ArrowRight className="ml-2 h-5 w-5" />

apps/marketing/src/app/(marketing)/open/page.tsx

@@ -147,12 +147,7 @@ export default async function OpenPage() {
         <p className="text-muted-foreground mt-4 max-w-[60ch] text-center text-lg leading-normal">
           All our metrics, finances, and learnings are public. We believe in transparency and want
           to share our journey with you. You can read more about why here:{' '}
-          <a
-            className="font-bold"
-            href="https://documenso.com/blog/pre-seed"
-            target="_blank"
-            rel="noreferrer"
-          >
+          <a className="font-bold" href="https://documenso.com/blog/pre-seed" target="_blank">
             Announcing Open Metrics
           </a>
         </p>

apps/marketing/src/app/(marketing)/pricing/page.tsx

@@ -15,8 +15,6 @@ export const metadata: Metadata = {
   title: 'Pricing',
 };
 
-export const dynamic = 'force-dynamic';
-
 export type PricingPageProps = {
   searchParams?: {
     planId?: string;
@@ -55,7 +53,7 @@ export default function PricingPage() {
 
         <div className="mt-4 flex justify-center">
           <Button variant="outline" size="lg" className="rounded-full hover:cursor-pointer" asChild>
-            <Link href="https://github.com/documenso/documenso" target="_blank" rel="noreferrer">
+            <Link href="https://github.com/documenso/documenso" target="_blank">
               Get Started
             </Link>
           </Button>
@@ -168,7 +166,6 @@ export default function PricingPage() {
               <Link
                 className="text-documenso-700 font-bold"
                 target="_blank"
-                rel="noreferrer"
                 href="mailto:support@documenso.com"
               >
                 support@documenso.com
@@ -178,7 +175,6 @@ export default function PricingPage() {
                 className="text-documenso-700 font-bold"
                 href="https://documen.so/discord"
                 target="_blank"
-                rel="noreferrer"
               >
                 in our Discord-Support-Channel
               </a>{' '}

apps/marketing/src/app/(marketing)/singleplayer/client.tsx

@@ -6,7 +6,6 @@ import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 
 import { useAnalytics } from '@documenso/lib/client-only/hooks/use-analytics';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { base64 } from '@documenso/lib/universal/base64';
 import { putFile } from '@documenso/lib/universal/upload/put-file';
 import type { Field, Recipient } from '@documenso/prisma/client';
@@ -191,7 +190,7 @@ export const SinglePlayerClient = () => {
         <p className="text-foreground mx-auto mt-4 max-w-[50ch] text-lg leading-normal">
           Create a{' '}
           <Link
-            href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`}
+            href={`${process.env.NEXT_PUBLIC_WEBAPP_URL}/signup`}
             target="_blank"
             className="hover:text-foreground/80 font-semibold transition-colors"
           >

apps/marketing/src/app/(marketing)/singleplayer/page.tsx

@@ -7,7 +7,6 @@ export const metadata: Metadata = {
 };
 
 export const revalidate = 0;
-export const dynamic = 'force-dynamic';
 
 // !: This entire file is a hack to get around failed prerendering of
 // !: the Single Player Mode page. This regression was introduced during

apps/marketing/src/app/layout.tsx

@@ -3,7 +3,6 @@ import { Suspense } from 'react';
 import { Caveat, Inter } from 'next/font/google';
 
 import { FeatureFlagProvider } from '@documenso/lib/client-only/providers/feature-flag';
-import { NEXT_PUBLIC_MARKETING_URL } from '@documenso/lib/constants/app';
 import { getAllAnonymousFlags } from '@documenso/lib/universal/get-feature-flag';
 import { TrpcProvider } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -18,35 +17,32 @@ import './globals.css';
 const fontInter = Inter({ subsets: ['latin'], variable: '--font-sans' });
 const fontCaveat = Caveat({ subsets: ['latin'], variable: '--font-signature' });
 
-export function generateMetadata() {
-  return {
-    title: {
-      template: '%s - Documenso',
-      default: 'Documenso',
-    },
+export const metadata = {
+  title: {
+    template: '%s - Documenso',
+    default: 'Documenso',
+  },
+  description:
+    'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
+  keywords:
+    'Documenso, open source, DocuSign alternative, document signing, open signing infrastructure, open-source community, fast signing, beautiful signing, smart templates',
+  authors: { name: 'Documenso, Inc.' },
+  robots: 'index, follow',
+  openGraph: {
+    title: 'Documenso - The Open Source DocuSign Alternative',
     description:
       'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-    keywords:
-      'Documenso, open source, DocuSign alternative, document signing, open signing infrastructure, open-source community, fast signing, beautiful signing, smart templates',
-    authors: { name: 'Documenso, Inc.' },
-    robots: 'index, follow',
-    metadataBase: new URL(NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3000'),
-    openGraph: {
-      title: 'Documenso - The Open Source DocuSign Alternative',
-      description:
-        'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-      type: 'website',
-      images: ['/opengraph-image.jpg'],
-    },
-    twitter: {
-      site: '@documenso',
-      card: 'summary_large_image',
-      images: ['/opengraph-image.jpg'],
-      description:
-        'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-    },
-  };
-}
+    type: 'website',
+    images: [`${process.env.NEXT_PUBLIC_MARKETING_URL}/opengraph-image.jpg`],
+  },
+  twitter: {
+    site: '@documenso',
+    card: 'summary_large_image',
+    images: [`${process.env.NEXT_PUBLIC_MARKETING_URL}/opengraph-image.jpg`],
+    description:
+      'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
+  },
+};
 
 export default async function RootLayout({ children }: { children: React.ReactNode }) {
   const flags = await getAllAnonymousFlags();

apps/marketing/src/components/(marketing)/pricing-table.tsx

@@ -8,7 +8,6 @@ import Link from 'next/link';
 import { AnimatePresence, motion } from 'framer-motion';
 import { usePlausible } from 'next-plausible';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
 
@@ -83,7 +82,11 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
           </p>
 
           <Button className="rounded-full text-base" asChild>
-            <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`} target="_blank" className="mt-6">
+            <Link
+              href={`${process.env.NEXT_PUBLIC_WEBAPP_URL}/signup`}
+              target="_blank"
+              className="mt-6"
+            >
               Signup Now
             </Link>
           </Button>
@@ -114,13 +117,13 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
           </p>
 
           <Button className="mt-6 rounded-full text-base" asChild>
-            <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`}>Signup Now</Link>
+            <Link href={`${process.env.NEXT_PUBLIC_WEBAPP_URL}/signup`}>Signup Now</Link>
           </Button>
 
           <div className="mt-8 flex w-full flex-col divide-y">
             <p className="text-foreground py-4 font-medium">
               {' '}
-              <a href="https://documenso.com/blog/early-adopters" target="_blank" rel="noreferrer">
+              <a href="https://documenso.com/blog/early-adopters" target="_blank">
                 The Early Adopter Deal:
               </a>
             </p>
@@ -130,11 +133,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
             <p className="text-foreground py-4">
               <strong>
                 {' '}
-                <a
-                  href="https://documenso.com/blog/early-adopters"
-                  target="_blank"
-                  rel="noreferrer"
-                >
+                <a href="https://documenso.com/blog/early-adopters" target="_blank">
                   Includes all upcoming features
                 </a>
               </strong>

apps/marketing/src/components/(marketing)/single-player-mode/single-player-mode-success.tsx

@@ -6,7 +6,6 @@ import Link from 'next/link';
 
 import signingCelebration from '@documenso/assets/images/signing-celebration.png';
 import { useFeatureFlags } from '@documenso/lib/client-only/providers/feature-flag';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import type { Signature } from '@documenso/prisma/client';
 import { DocumentStatus } from '@documenso/prisma/client';
 import type { DocumentWithRecipient } from '@documenso/prisma/types/document-with-recipient';
@@ -86,7 +85,7 @@ export const SinglePlayerModeSuccess = ({
       <p className="text-muted-foreground/60 mt-16 text-center text-sm">
         Create a{' '}
         <Link
-          href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`}
+          href={`${process.env.NEXT_PUBLIC_WEBAPP_URL}/signup`}
           target="_blank"
           className="text-documenso-700 hover:text-documenso-600 whitespace-nowrap"
         >

apps/marketing/src/components/(marketing)/widget.tsx

@@ -7,7 +7,6 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { AnimatePresence, motion } from 'framer-motion';
 import { Loader } from 'lucide-react';
 import { usePlausible } from 'next-plausible';
-import { env } from 'next-runtime-env';
 import { Controller, useForm } from 'react-hook-form';
 import { z } from 'zod';
 
@@ -145,11 +144,7 @@ export const Widget = ({ className, children, ...props }: WidgetProps) => {
         setTimeout(resolve, 1000);
       });
 
-      const planId = env('NEXT_PUBLIC_STRIPE_COMMUNITY_PLAN_MONTHLY_PRICE_ID');
-
-      if (!planId) {
-        throw new Error('No plan ID found.');
-      }
+      const planId = process.env.NEXT_PUBLIC_STRIPE_COMMUNITY_PLAN_MONTHLY_PRICE_ID;
 
       const claimPlanInput = signatureDataUrl
         ? {

apps/marketing/src/pages/api/claim-plan/index.ts

@@ -1,15 +1,13 @@
-import type { NextApiRequest, NextApiResponse } from 'next';
+import { NextApiRequest, NextApiResponse } from 'next';
 
 import { randomUUID } from 'crypto';
 
-import type { TEarlyAdopterCheckoutMetadataSchema } from '@documenso/ee/server-only/stripe/webhook/early-adopter-checkout-metadata';
-import { NEXT_PUBLIC_MARKETING_URL, NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { TEarlyAdopterCheckoutMetadataSchema } from '@documenso/ee/server-only/stripe/webhook/early-adopter-checkout-metadata';
 import { redis } from '@documenso/lib/server-only/redis';
 import { stripe } from '@documenso/lib/server-only/stripe';
 import { prisma } from '@documenso/prisma';
 
-import type { TClaimPlanResponseSchema } from '~/api/claim-plan/types';
-import { ZClaimPlanRequestSchema } from '~/api/claim-plan/types';
+import { TClaimPlanResponseSchema, ZClaimPlanRequestSchema } from '~/api/claim-plan/types';
 
 export default async function handler(
   req: NextApiRequest,
@@ -42,7 +40,7 @@ export default async function handler(
 
     if (user) {
       return res.status(200).json({
-        redirectUrl: `${NEXT_PUBLIC_WEBAPP_URL()}/signin`,
+        redirectUrl: `${process.env.NEXT_PUBLIC_WEBAPP_URL}/signin`,
       });
     }
 
@@ -79,8 +77,8 @@ export default async function handler(
       mode: 'subscription',
       metadata,
       allow_promotion_codes: true,
-      success_url: `${NEXT_PUBLIC_MARKETING_URL()}/claimed?sessionId={CHECKOUT_SESSION_ID}`,
-      cancel_url: `${NEXT_PUBLIC_MARKETING_URL()}`,
+      success_url: `${process.env.NEXT_PUBLIC_MARKETING_URL}/claimed?sessionId={CHECKOUT_SESSION_ID}`,
+      cancel_url: `${process.env.NEXT_PUBLIC_MARKETING_URL}`,
     });
 
     if (!checkout.url) {

apps/web/public/.well-known/security.txt

@@ -1,7 +0,0 @@
-# General Issues
-Contact: https://github.com/documenso/documenso/issues/new?assignees=&labels=bug&projects=&template=bug-report.yml
-
-# Report critical issues privately to let us take appropriate action before publishing.
-Contact: mailto:security@documenso.com
-Preferred-Languages: en
-Canonical: https://documenso.com/.well-known/security.txt

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

@@ -0,0 +1,110 @@
+'use client';
+
+import Link from 'next/link';
+
+import { CheckCircle, Download, EyeIcon, Pencil } from 'lucide-react';
+import { useSession } from 'next-auth/react';
+import { match } from 'ts-pattern';
+
+import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
+import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import type { Document, Recipient, Team, User } from '@documenso/prisma/client';
+import { DocumentStatus, RecipientRole, SigningStatus } from '@documenso/prisma/client';
+import { trpc as trpcClient } from '@documenso/trpc/client';
+import { Button } from '@documenso/ui/primitives/button';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+export type DocumentPageViewButtonProps = {
+  document: Document & {
+    User: Pick<User, 'id' | 'name' | 'email'>;
+    Recipient: Recipient[];
+    team: Pick<Team, 'id' | 'url'> | null;
+  };
+  team?: Pick<Team, 'id' | 'url'>;
+};
+
+export const DocumentPageViewButton = ({ document, team }: DocumentPageViewButtonProps) => {
+  const { data: session } = useSession();
+  const { toast } = useToast();
+
+  if (!session) {
+    return null;
+  }
+
+  const recipient = document.Recipient.find((recipient) => recipient.email === session.user.email);
+
+  const isRecipient = !!recipient;
+  const isPending = document.status === DocumentStatus.PENDING;
+  const isComplete = document.status === DocumentStatus.COMPLETED;
+  const isSigned = recipient?.signingStatus === SigningStatus.SIGNED;
+  const role = recipient?.role;
+
+  const documentsPath = formatDocumentsPath(document.team?.url);
+
+  const onDownloadClick = async () => {
+    try {
+      const documentWithData = await trpcClient.document.getDocumentById.query({
+        id: document.id,
+        teamId: team?.id,
+      });
+
+      const documentData = documentWithData?.documentData;
+
+      if (!documentData) {
+        throw new Error('No document available');
+      }
+
+      await downloadPDF({ documentData, fileName: documentWithData.title });
+    } catch (err) {
+      toast({
+        title: 'Something went wrong',
+        description: 'An error occurred while downloading your document.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  return match({
+    isRecipient,
+    isPending,
+    isComplete,
+    isSigned,
+  })
+    .with({ isRecipient: true, isPending: true, isSigned: false }, () => (
+      <Button className="w-full" asChild>
+        <Link href={`/sign/${recipient?.token}`}>
+          {match(role)
+            .with(RecipientRole.SIGNER, () => (
+              <>
+                <Pencil className="-ml-1 mr-2 h-4 w-4" />
+                Sign
+              </>
+            ))
+            .with(RecipientRole.APPROVER, () => (
+              <>
+                <CheckCircle className="-ml-1 mr-2 h-4 w-4" />
+                Approve
+              </>
+            ))
+            .otherwise(() => (
+              <>
+                <EyeIcon className="-ml-1 mr-2 h-4 w-4" />
+                View
+              </>
+            ))}
+        </Link>
+      </Button>
+    ))
+    .with({ isComplete: false }, () => (
+      <Button className="w-full" asChild>
+        <Link href={`${documentsPath}/${document.id}/edit`}>Edit</Link>
+      </Button>
+    ))
+    .with({ isComplete: true }, () => (
+      <Button className="w-full" onClick={onDownloadClick}>
+        <Download className="-ml-1 mr-2 inline h-4 w-4" />
+        Download
+      </Button>
+    ))
+    .otherwise(() => null);
+};

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

@@ -0,0 +1,160 @@
+'use client';
+
+import { useState } from 'react';
+
+import Link from 'next/link';
+
+import { Copy, Download, Edit, Loader, MoreHorizontal, Share, Trash2 } from 'lucide-react';
+import { useSession } from 'next-auth/react';
+
+import { downloadPDF } from '@documenso/lib/client-only/download-pdf';
+import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import { DocumentStatus } from '@documenso/prisma/client';
+import type { Document, Recipient, Team, User } from '@documenso/prisma/client';
+import { trpc as trpcClient } from '@documenso/trpc/client';
+import { DocumentShareButton } from '@documenso/ui/components/document/document-share-button';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuTrigger,
+} from '@documenso/ui/primitives/dropdown-menu';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+import { ResendDocumentActionItem } from '../_action-items/resend-document';
+import { DeleteDocumentDialog } from '../delete-document-dialog';
+import { DuplicateDocumentDialog } from '../duplicate-document-dialog';
+
+export type DocumentPageViewDropdownProps = {
+  document: Document & {
+    User: Pick<User, 'id' | 'name' | 'email'>;
+    Recipient: Recipient[];
+    team: Pick<Team, 'id' | 'url'> | null;
+  };
+  team?: Pick<Team, 'id' | 'url'>;
+};
+
+export const DocumentPageViewDropdown = ({ document, team }: DocumentPageViewDropdownProps) => {
+  const { data: session } = useSession();
+  const { toast } = useToast();
+
+  const [isDeleteDialogOpen, setDeleteDialogOpen] = useState(false);
+  const [isDuplicateDialogOpen, setDuplicateDialogOpen] = useState(false);
+
+  if (!session) {
+    return null;
+  }
+
+  const recipient = document.Recipient.find((recipient) => recipient.email === session.user.email);
+
+  const isOwner = document.User.id === session.user.id;
+  const isDraft = document.status === DocumentStatus.DRAFT;
+  const isComplete = document.status === DocumentStatus.COMPLETED;
+  const isDocumentDeletable = isOwner;
+  const isCurrentTeamDocument = team && document.team?.url === team.url;
+
+  const documentsPath = formatDocumentsPath(team?.url);
+
+  const onDownloadClick = async () => {
+    try {
+      const documentWithData = await trpcClient.document.getDocumentById.query({
+        id: document.id,
+        teamId: team?.id,
+      });
+
+      const documentData = documentWithData?.documentData;
+
+      if (!documentData) {
+        return;
+      }
+
+      await downloadPDF({ documentData, fileName: document.title });
+    } catch (err) {
+      toast({
+        title: 'Something went wrong',
+        description: 'An error occurred while downloading your document.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  const nonSignedRecipients = document.Recipient.filter((item) => item.signingStatus !== 'SIGNED');
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger>
+        <MoreHorizontal className="text-muted-foreground h-5 w-5" />
+      </DropdownMenuTrigger>
+
+      <DropdownMenuContent className="w-52" align="end" forceMount>
+        <DropdownMenuLabel>Action</DropdownMenuLabel>
+
+        {(isOwner || isCurrentTeamDocument) && !isComplete && (
+          <DropdownMenuItem asChild>
+            <Link href={`${documentsPath}/${document.id}/edit`}>
+              <Edit className="mr-2 h-4 w-4" />
+              Edit
+            </Link>
+          </DropdownMenuItem>
+        )}
+
+        {isComplete && (
+          <DropdownMenuItem onClick={onDownloadClick}>
+            <Download className="mr-2 h-4 w-4" />
+            Download
+          </DropdownMenuItem>
+        )}
+
+        <DropdownMenuItem onClick={() => setDuplicateDialogOpen(true)}>
+          <Copy className="mr-2 h-4 w-4" />
+          Duplicate
+        </DropdownMenuItem>
+
+        <DropdownMenuItem onClick={() => setDeleteDialogOpen(true)} disabled={!isDocumentDeletable}>
+          <Trash2 className="mr-2 h-4 w-4" />
+          Delete
+        </DropdownMenuItem>
+
+        <DropdownMenuLabel>Share</DropdownMenuLabel>
+
+        <ResendDocumentActionItem
+          document={document}
+          recipients={nonSignedRecipients}
+          team={team}
+        />
+
+        <DocumentShareButton
+          documentId={document.id}
+          token={isOwner ? undefined : recipient?.token}
+          trigger={({ loading, disabled }) => (
+            <DropdownMenuItem disabled={disabled || isDraft} onSelect={(e) => e.preventDefault()}>
+              <div className="flex items-center">
+                {loading ? <Loader className="mr-2 h-4 w-4" /> : <Share className="mr-2 h-4 w-4" />}
+                Share Signing Card
+              </div>
+            </DropdownMenuItem>
+          )}
+        />
+      </DropdownMenuContent>
+
+      {isDocumentDeletable && (
+        <DeleteDocumentDialog
+          id={document.id}
+          status={document.status}
+          documentTitle={document.title}
+          open={isDeleteDialogOpen}
+          onOpenChange={setDeleteDialogOpen}
+        />
+      )}
+      {isDuplicateDialogOpen && (
+        <DuplicateDocumentDialog
+          id={document.id}
+          open={isDuplicateDialogOpen}
+          onOpenChange={setDuplicateDialogOpen}
+          team={team}
+        />
+      )}
+    </DropdownMenu>
+  );
+};

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

@@ -0,0 +1,71 @@
+'use client';
+
+import { useMemo } from 'react';
+
+import { DateTime } from 'luxon';
+
+import { useIsMounted } from '@documenso/lib/client-only/hooks/use-is-mounted';
+import { useLocale } from '@documenso/lib/client-only/providers/locale';
+import type { Document, Recipient, User } from '@documenso/prisma/client';
+
+export type DocumentPageViewInformationProps = {
+  userId: number;
+  document: Document & {
+    User: Pick<User, 'id' | 'name' | 'email'>;
+    Recipient: Recipient[];
+  };
+};
+
+export const DocumentPageViewInformation = ({
+  document,
+  userId,
+}: DocumentPageViewInformationProps) => {
+  const isMounted = useIsMounted();
+  const { locale } = useLocale();
+
+  const documentInformation = useMemo(() => {
+    let createdValue = DateTime.fromJSDate(document.createdAt).toFormat('MMMM d, yyyy');
+    let lastModifiedValue = DateTime.fromJSDate(document.updatedAt).toRelative();
+
+    if (!isMounted) {
+      createdValue = DateTime.fromJSDate(document.createdAt)
+        .setLocale(locale)
+        .toFormat('MMMM d, yyyy');
+
+      lastModifiedValue = DateTime.fromJSDate(document.updatedAt).setLocale(locale).toRelative();
+    }
+
+    return [
+      {
+        description: 'Uploaded by',
+        value: userId === document.userId ? 'You' : document.User.name ?? document.User.email,
+      },
+      {
+        description: 'Created',
+        value: createdValue,
+      },
+      {
+        description: 'Last modified',
+        value: lastModifiedValue,
+      },
+    ];
+  }, [isMounted, document, locale, userId]);
+
+  return (
+    <section className="dark:bg-background text-foreground border-border bg-widget flex flex-col rounded-xl border">
+      <h1 className="px-4 py-3 font-medium">Information</h1>
+
+      <ul className="divide-y border-t">
+        {documentInformation.map((item) => (
+          <li
+            key={item.description}
+            className="flex items-center justify-between px-4 py-2.5 text-sm last:border-b"
+          >
+            <span className="text-muted-foreground">{item.description}</span>
+            <span>{item.value}</span>
+          </li>
+        ))}
+      </ul>
+    </section>
+  );
+};

apps/web/src/app/(dashboard)/documents/[id]/document-page-view-recent-activity.tsx

@@ -0,0 +1,146 @@
+'use client';
+
+import { useMemo } from 'react';
+
+import { CheckCheckIcon, CheckIcon, Loader, MailOpen } from 'lucide-react';
+import { DateTime } from 'luxon';
+import { match } from 'ts-pattern';
+
+import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
+import { formatDocumentAuditLogAction } from '@documenso/lib/utils/document-audit-logs';
+import { trpc } from '@documenso/trpc/react';
+import { AnimateGenericFadeInOut } from '@documenso/ui/components/animate/animate-generic-fade-in-out';
+import { cn } from '@documenso/ui/lib/utils';
+
+export type DocumentPageViewRecentActivityProps = {
+  documentId: number;
+  userId: number;
+};
+
+export const DocumentPageViewRecentActivity = ({
+  documentId,
+  userId,
+}: DocumentPageViewRecentActivityProps) => {
+  const {
+    data,
+    isLoading,
+    isLoadingError,
+    refetch,
+    hasNextPage,
+    fetchNextPage,
+    isFetchingNextPage,
+  } = trpc.document.findDocumentAuditLogs.useInfiniteQuery(
+    {
+      documentId,
+      filterForRecentActivity: true,
+      orderBy: {
+        column: 'createdAt',
+        direction: 'asc',
+      },
+    },
+    {
+      getNextPageParam: (lastPage) => lastPage.nextCursor,
+    },
+  );
+
+  const documentAuditLogs = useMemo(() => (data?.pages ?? []).flatMap((page) => page.data), [data]);
+
+  return (
+    <section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
+      <div className="flex flex-row items-center justify-between border-b px-4 py-3">
+        <h1 className="text-foreground font-medium">Recent activity</h1>
+
+        {/* Can add dropdown menu here for additional options. */}
+      </div>
+
+      {isLoading && (
+        <div className="flex h-full items-center justify-center py-16">
+          <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+        </div>
+      )}
+
+      {isLoadingError && (
+        <div className="flex h-full flex-col items-center justify-center py-16">
+          <p className="text-foreground/80 text-sm">Unable to load document history</p>
+          <button
+            onClick={async () => refetch()}
+            className="text-foreground/70 hover:text-muted-foreground mt-2 text-sm"
+          >
+            Click here to retry
+          </button>
+        </div>
+      )}
+
+      <AnimateGenericFadeInOut>
+        {data && (
+          <ul role="list" className="space-y-6 p-4">
+            {hasNextPage && (
+              <li className="relative flex gap-x-4">
+                <div className="absolute -bottom-6 left-0 top-0 flex w-6 justify-center">
+                  <div className="w-px bg-gray-200" />
+                </div>
+
+                <div className="bg-widget relative flex h-6 w-6 flex-none items-center justify-center">
+                  <div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
+                </div>
+
+                <button
+                  onClick={async () => fetchNextPage()}
+                  className="text-foreground/70 hover:text-muted-foreground text-xs"
+                >
+                  {isFetchingNextPage ? 'Loading...' : 'Load older activity'}
+                </button>
+              </li>
+            )}
+
+            {documentAuditLogs.map((auditLog, auditLogIndex) => (
+              <li key={auditLog.id} className="relative flex gap-x-4">
+                <div
+                  className={cn(
+                    auditLogIndex === documentAuditLogs.length - 1 ? 'h-6' : '-bottom-6',
+                    'absolute left-0 top-0 flex w-6 justify-center',
+                  )}
+                >
+                  <div className="bg-border w-px" />
+                </div>
+
+                <div className="bg-widget text-foreground/40 relative flex h-6 w-6 flex-none items-center justify-center">
+                  {match(auditLog.type)
+                    .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_COMPLETED, () => (
+                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                        <CheckCheckIcon className="h-3 w-3" aria-hidden="true" />
+                      </div>
+                    ))
+                    .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED, () => (
+                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                        <CheckIcon className="h-3 w-3" aria-hidden="true" />
+                      </div>
+                    ))
+                    .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_OPENED, () => (
+                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                        <MailOpen className="h-3 w-3" aria-hidden="true" />
+                      </div>
+                    ))
+                    .otherwise(() => (
+                      <div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
+                    ))}
+                </div>
+
+                <p className="text-muted-foreground dark:text-muted-foreground/70 flex-auto py-0.5 text-xs leading-5">
+                  <span className="text-foreground font-medium">
+                    {formatDocumentAuditLogAction(auditLog, userId).prefix}
+                  </span>{' '}
+                  {formatDocumentAuditLogAction(auditLog, userId).description}
+                </p>
+
+                <time className="text-muted-foreground dark:text-muted-foreground/70 flex-none py-0.5 text-xs leading-5">
+                  {DateTime.fromJSDate(auditLog.createdAt).toRelative({ style: 'short' })}
+                </time>
+              </li>
+            ))}
+          </ul>
+        )}
+      </AnimateGenericFadeInOut>
+    </section>
+  );
+};

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

@@ -0,0 +1,115 @@
+import Link from 'next/link';
+
+import { CheckIcon, Clock, MailIcon, MailOpenIcon, PenIcon, PlusIcon } from 'lucide-react';
+import { match } from 'ts-pattern';
+
+import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
+import { DocumentStatus, RecipientRole, SigningStatus } from '@documenso/prisma/client';
+import type { Document, Recipient } from '@documenso/prisma/client';
+import { SignatureIcon } from '@documenso/ui/icons/signature';
+import { AvatarWithText } from '@documenso/ui/primitives/avatar';
+import { Badge } from '@documenso/ui/primitives/badge';
+
+export type DocumentPageViewRecipientsProps = {
+  document: Document & {
+    Recipient: Recipient[];
+  };
+  documentRootPath: string;
+};
+
+export const DocumentPageViewRecipients = ({
+  document,
+  documentRootPath,
+}: DocumentPageViewRecipientsProps) => {
+  const recipients = document.Recipient;
+
+  return (
+    <section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
+      <div className="flex flex-row items-center justify-between px-4 py-3">
+        <h1 className="text-foreground font-medium">Recipients</h1>
+
+        {document.status !== DocumentStatus.COMPLETED && (
+          <Link
+            href={`${documentRootPath}/${document.id}/edit?step=signers`}
+            title="Modify recipients"
+            className="flex flex-row items-center justify-between"
+          >
+            {recipients.length === 0 ? (
+              <PlusIcon className="ml-2 h-4 w-4" />
+            ) : (
+              <PenIcon className="ml-2 h-3 w-3" />
+            )}
+          </Link>
+        )}
+      </div>
+
+      <ul className="text-muted-foreground divide-y border-t">
+        {recipients.length === 0 && (
+          <li className="flex flex-col items-center justify-center py-6 text-sm">No recipients</li>
+        )}
+
+        {recipients.map((recipient) => (
+          <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()}
+              primaryText={<p className="text-muted-foreground text-sm">{recipient.email}</p>}
+              secondaryText={
+                <p className="text-muted-foreground/70 text-xs">
+                  {RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName}
+                </p>
+              }
+            />
+
+            {document.status !== DocumentStatus.DRAFT &&
+              recipient.signingStatus === SigningStatus.SIGNED && (
+                <Badge variant="default">
+                  {match(recipient.role)
+                    .with(RecipientRole.APPROVER, () => (
+                      <>
+                        <CheckIcon className="mr-1 h-3 w-3" />
+                        Approved
+                      </>
+                    ))
+                    .with(RecipientRole.CC, () =>
+                      document.status === DocumentStatus.COMPLETED ? (
+                        <>
+                          <MailIcon className="mr-1 h-3 w-3" />
+                          Sent
+                        </>
+                      ) : (
+                        <>
+                          <CheckIcon className="mr-1 h-3 w-3" />
+                          Ready
+                        </>
+                      ),
+                    )
+
+                    .with(RecipientRole.SIGNER, () => (
+                      <>
+                        <SignatureIcon className="mr-1 h-3 w-3" />
+                        Signed
+                      </>
+                    ))
+                    .with(RecipientRole.VIEWER, () => (
+                      <>
+                        <MailOpenIcon className="mr-1 h-3 w-3" />
+                        Viewed
+                      </>
+                    ))
+                    .exhaustive()}
+                </Badge>
+              )}
+
+            {document.status !== DocumentStatus.DRAFT &&
+              recipient.signingStatus === SigningStatus.NOT_SIGNED && (
+                <Badge variant="secondary">
+                  <Clock className="mr-1 h-3 w-3" />
+                  Pending
+                </Badge>
+              )}
+          </li>
+        ))}
+      </ul>
+    </section>
+  );
+};

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

@@ -1,22 +1,33 @@
 import Link from 'next/link';
 import { redirect } from 'next/navigation';
 
-import { ChevronLeft, Users2 } from 'lucide-react';
+import { ChevronLeft, Clock9, Users2 } from 'lucide-react';
+import { match } from 'ts-pattern';
 
 import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
-import { getFieldsForDocument } from '@documenso/lib/server-only/field/get-fields-for-document';
 import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
 import { symmetricDecrypt } from '@documenso/lib/universal/crypto';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import { DocumentStatus } from '@documenso/prisma/client';
 import type { Team } from '@documenso/prisma/client';
-import { DocumentStatus as InternalDocumentStatus } from '@documenso/prisma/client';
+import { Button } from '@documenso/ui/primitives/button';
+import { Card, CardContent } from '@documenso/ui/primitives/card';
 import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 
-import { EditDocumentForm } from '~/app/(dashboard)/documents/[id]/edit-document';
 import { StackAvatarsWithTooltip } from '~/components/(dashboard)/avatar/stack-avatars-with-tooltip';
-import { DocumentStatus } from '~/components/formatter/document-status';
+import { DocumentHistorySheet } from '~/components/document/document-history-sheet';
+import {
+  DocumentStatus as DocumentStatusComponent,
+  FRIENDLY_STATUS_MAP,
+} from '~/components/formatter/document-status';
+
+import { DocumentPageViewButton } from './document-page-view-button';
+import { DocumentPageViewDropdown } from './document-page-view-dropdown';
+import { DocumentPageViewInformation } from './document-page-view-information';
+import { DocumentPageViewRecentActivity } from './document-page-view-recent-activity';
+import { DocumentPageViewRecipients } from './document-page-view-recipients';
 
 export type DocumentPageViewProps = {
   params: {
@@ -67,65 +78,120 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
     documentMeta.password = securePassword;
   }
 
-  const [recipients, fields] = await Promise.all([
-    getRecipientsForDocument({
-      documentId,
-      userId: user.id,
-    }),
-    getFieldsForDocument({
-      documentId,
-      userId: user.id,
-    }),
-  ]);
+  const recipients = await getRecipientsForDocument({
+    documentId,
+    userId: user.id,
+  });
+
+  const documentWithRecipients = {
+    ...document,
+    Recipient: recipients,
+  };
 
   return (
     <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
-      <Link href={documentRootPath} className="flex items-center text-[#7AC455] hover:opacity-80">
+      <Link href="/documents" className="flex items-center text-[#7AC455] hover:opacity-80">
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         Documents
       </Link>
 
-      <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
-        {document.title}
-      </h1>
+      <div className="flex flex-row justify-between">
+        <div>
+          <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
+            {document.title}
+          </h1>
 
-      <div className="mt-2.5 flex items-center gap-x-6">
-        <DocumentStatus inheritColor status={document.status} className="text-muted-foreground" />
+          <div className="mt-2.5 flex items-center gap-x-6">
+            <DocumentStatusComponent
+              inheritColor
+              status={document.status}
+              className="text-muted-foreground"
+            />
 
-        {recipients.length > 0 && (
-          <div className="text-muted-foreground flex items-center">
-            <Users2 className="mr-2 h-5 w-5" />
+            {recipients.length > 0 && (
+              <div className="text-muted-foreground flex items-center">
+                <Users2 className="mr-2 h-5 w-5" />
 
-            <StackAvatarsWithTooltip recipients={recipients} position="bottom">
-              <span>{recipients.length} Recipient(s)</span>
-            </StackAvatarsWithTooltip>
+                <StackAvatarsWithTooltip recipients={recipients} position="bottom">
+                  <span>{recipients.length} Recipient(s)</span>
+                </StackAvatarsWithTooltip>
+              </div>
+            )}
           </div>
-        )}
+        </div>
+
+        <div className="self-end">
+          <DocumentHistorySheet documentId={document.id} userId={user.id}>
+            <Button variant="outline">
+              <Clock9 className="mr-1.5 h-4 w-4" />
+              Document history
+            </Button>
+          </DocumentHistorySheet>
+        </div>
       </div>
 
-      {document.status !== InternalDocumentStatus.COMPLETED && (
-        <EditDocumentForm
-          className="mt-8"
-          document={document}
-          user={user}
-          documentMeta={documentMeta}
-          recipients={recipients}
-          fields={fields}
-          documentData={documentData}
-          documentRootPath={documentRootPath}
-        />
-      )}
+      <div className="mt-6 grid w-full grid-cols-12 gap-8">
+        <Card
+          className="relative col-span-12 rounded-xl before:rounded-xl lg:col-span-6 xl:col-span-7"
+          gradient
+        >
+          <CardContent className="p-2">
+            <LazyPDFViewer document={document} key={documentData.id} documentData={documentData} />
+          </CardContent>
+        </Card>
 
-      {document.status === InternalDocumentStatus.COMPLETED && (
-        <div className="mx-auto mt-12 max-w-2xl">
-          <LazyPDFViewer
-            document={document}
-            key={documentData.id}
-            documentMeta={documentMeta}
-            documentData={documentData}
-          />
+        <div className="col-span-12 lg:col-span-6 xl:col-span-5">
+          <div className="space-y-6">
+            <section className="border-border bg-widget flex flex-col rounded-xl border pb-4 pt-6">
+              <div className="flex flex-row items-center justify-between px-4">
+                <h3 className="text-foreground text-2xl font-semibold">
+                  Document {FRIENDLY_STATUS_MAP[document.status].label.toLowerCase()}
+                </h3>
+
+                <DocumentPageViewDropdown document={documentWithRecipients} team={team} />
+              </div>
+
+              <p className="text-muted-foreground mt-2 px-4 text-sm ">
+                {match(document.status)
+                  .with(
+                    DocumentStatus.COMPLETED,
+                    () => 'This document has been signed by all recipients',
+                  )
+                  .with(
+                    DocumentStatus.DRAFT,
+                    () => 'This document is currently a draft and has not been sent',
+                  )
+                  .with(DocumentStatus.PENDING, () => {
+                    const pendingRecipients = recipients.filter(
+                      (recipient) => recipient.signingStatus === 'NOT_SIGNED',
+                    );
+
+                    return `Waiting on ${pendingRecipients.length} recipient${
+                      pendingRecipients.length > 1 ? 's' : ''
+                    }`;
+                  })
+                  .exhaustive()}
+              </p>
+
+              <div className="mt-4 border-t px-4 pt-4">
+                <DocumentPageViewButton document={documentWithRecipients} team={team} />
+              </div>
+            </section>
+
+            {/* Document information section. */}
+            <DocumentPageViewInformation document={documentWithRecipients} userId={user.id} />
+
+            {/* Recipients section. */}
+            <DocumentPageViewRecipients
+              document={documentWithRecipients}
+              documentRootPath={documentRootPath}
+            />
+
+            {/* Recent activity section. */}
+            <DocumentPageViewRecentActivity documentId={document.id} userId={user.id} />
+          </div>
         </div>
-      )}
+      </div>
     </div>
   );
 };

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

@@ -2,10 +2,16 @@
 
 import { useState } from 'react';
 
-import { useRouter } from 'next/navigation';
+import { useRouter, useSearchParams } from 'next/navigation';
 
-import type { DocumentData, DocumentMeta, Field, Recipient, User } from '@documenso/prisma/client';
-import { DocumentStatus } from '@documenso/prisma/client';
+import {
+  type DocumentData,
+  type DocumentMeta,
+  DocumentStatus,
+  type Field,
+  type Recipient,
+  type User,
+} from '@documenso/prisma/client';
 import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -49,12 +55,9 @@ export const EditDocumentForm = ({
   documentRootPath,
 }: EditDocumentFormProps) => {
   const { toast } = useToast();
-  const router = useRouter();
 
-  // controlled stepper state
-  const [step, setStep] = useState<EditDocumentStep>(
-    document.status === DocumentStatus.DRAFT ? 'title' : 'signers',
-  );
+  const router = useRouter();
+  const searchParams = useSearchParams();
 
   const { mutateAsync: addTitle } = trpc.document.setTitleForDocument.useMutation();
   const { mutateAsync: addFields } = trpc.field.addFields.useMutation();
@@ -86,6 +89,24 @@ export const EditDocumentForm = ({
     },
   };
 
+  const [step, setStep] = useState<EditDocumentStep>(() => {
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+    const searchParamStep = searchParams?.get('step') as EditDocumentStep | undefined;
+
+    let initialStep: EditDocumentStep =
+      document.status === DocumentStatus.DRAFT ? 'title' : 'signers';
+
+    if (
+      searchParamStep &&
+      documentFlow[searchParamStep] !== undefined &&
+      !(recipients.length === 0 && (searchParamStep === 'subject' || searchParamStep === 'fields'))
+    ) {
+      initialStep = searchParamStep;
+    }
+
+    return initialStep;
+  });
+
   const onAddTitleFormSubmit = async (data: TAddTitleFormSchema) => {
     try {
       // Custom invocation server action

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

@@ -0,0 +1,121 @@
+import Link from 'next/link';
+import { redirect } from 'next/navigation';
+
+import { ChevronLeft, Users2 } from 'lucide-react';
+
+import { DOCUMENSO_ENCRYPTION_KEY } from '@documenso/lib/constants/crypto';
+import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
+import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
+import { getFieldsForDocument } from '@documenso/lib/server-only/field/get-fields-for-document';
+import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
+import { symmetricDecrypt } from '@documenso/lib/universal/crypto';
+import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import type { Team } from '@documenso/prisma/client';
+import { DocumentStatus as InternalDocumentStatus } from '@documenso/prisma/client';
+
+import { EditDocumentForm } from '~/app/(dashboard)/documents/[id]/edit-document';
+import { StackAvatarsWithTooltip } from '~/components/(dashboard)/avatar/stack-avatars-with-tooltip';
+import { DocumentStatus } from '~/components/formatter/document-status';
+
+export type DocumentEditPageViewProps = {
+  params: {
+    id: string;
+  };
+  team?: Team;
+};
+
+export const DocumentEditPageView = async ({ params, team }: DocumentEditPageViewProps) => {
+  const { id } = params;
+
+  const documentId = Number(id);
+
+  const documentRootPath = formatDocumentsPath(team?.url);
+
+  if (!documentId || Number.isNaN(documentId)) {
+    redirect(documentRootPath);
+  }
+
+  const { user } = await getRequiredServerComponentSession();
+
+  const document = await getDocumentById({
+    id: documentId,
+    userId: user.id,
+    teamId: team?.id,
+  }).catch(() => null);
+
+  if (!document || !document.documentData) {
+    redirect(documentRootPath);
+  }
+
+  if (document.status === InternalDocumentStatus.COMPLETED) {
+    redirect(`${documentRootPath}/${documentId}`);
+  }
+
+  const { documentData, documentMeta } = document;
+
+  if (documentMeta?.password) {
+    const key = DOCUMENSO_ENCRYPTION_KEY;
+
+    if (!key) {
+      throw new Error('Missing DOCUMENSO_ENCRYPTION_KEY');
+    }
+
+    const securePassword = Buffer.from(
+      symmetricDecrypt({
+        key,
+        data: documentMeta.password,
+      }),
+    ).toString('utf-8');
+
+    documentMeta.password = securePassword;
+  }
+
+  const [recipients, fields] = await Promise.all([
+    getRecipientsForDocument({
+      documentId,
+      userId: user.id,
+    }),
+    getFieldsForDocument({
+      documentId,
+      userId: user.id,
+    }),
+  ]);
+
+  return (
+    <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
+      <Link href={documentRootPath} className="flex items-center text-[#7AC455] hover:opacity-80">
+        <ChevronLeft className="mr-2 inline-block h-5 w-5" />
+        Documents
+      </Link>
+
+      <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
+        {document.title}
+      </h1>
+
+      <div className="mt-2.5 flex items-center gap-x-6">
+        <DocumentStatus inheritColor status={document.status} className="text-muted-foreground" />
+
+        {recipients.length > 0 && (
+          <div className="text-muted-foreground flex items-center">
+            <Users2 className="mr-2 h-5 w-5" />
+
+            <StackAvatarsWithTooltip recipients={recipients} position="bottom">
+              <span>{recipients.length} Recipient(s)</span>
+            </StackAvatarsWithTooltip>
+          </div>
+        )}
+      </div>
+
+      <EditDocumentForm
+        className="mt-8"
+        document={document}
+        user={user}
+        documentMeta={documentMeta}
+        recipients={recipients}
+        fields={fields}
+        documentData={documentData}
+        documentRootPath={documentRootPath}
+      />
+    </div>
+  );
+};

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

@@ -0,0 +1,11 @@
+import { DocumentEditPageView } from './document-edit-page-view';
+
+export type DocumentPageProps = {
+  params: {
+    id: string;
+  };
+};
+
+export default function DocumentEditPage({ params }: DocumentPageProps) {
+  return <DocumentEditPageView params={params} />;
+}

apps/web/src/app/(dashboard)/documents/_action-items/resend-document.tsx

@@ -108,86 +108,88 @@ export const ResendDocumentActionItem = ({
   };
 
   return (
-    <Dialog open={isOpen} onOpenChange={setIsOpen}>
-      <DialogTrigger asChild>
-        <DropdownMenuItem disabled={isDisabled} onSelect={(e) => e.preventDefault()}>
-          <History className="mr-2 h-4 w-4" />
-          Resend
-        </DropdownMenuItem>
-      </DialogTrigger>
+    <>
+      <Dialog open={isOpen} onOpenChange={setIsOpen}>
+        <DialogTrigger asChild>
+          <DropdownMenuItem disabled={isDisabled} onSelect={(e) => e.preventDefault()}>
+            <History className="mr-2 h-4 w-4" />
+            Resend
+          </DropdownMenuItem>
+        </DialogTrigger>
 
-      <DialogContent className="sm:max-w-sm" hideClose>
-        <DialogHeader>
-          <DialogTitle>
-            <h1 className="text-center text-xl">Who do you want to remind?</h1>
-          </DialogTitle>
-        </DialogHeader>
+        <DialogContent className="sm:max-w-sm" hideClose>
+          <DialogHeader>
+            <DialogTitle asChild>
+              <h1 className="text-center text-xl">Who do you want to remind?</h1>
+            </DialogTitle>
+          </DialogHeader>
 
-        <Form {...form}>
-          <form id={FORM_ID} onSubmit={handleSubmit(onFormSubmit)} className="px-3">
-            <FormField
-              control={form.control}
-              name="recipients"
-              render={({ field: { value, onChange } }) => (
-                <>
-                  {recipients.map((recipient) => (
-                    <FormItem
-                      key={recipient.id}
-                      className="flex flex-row items-center justify-between gap-x-3"
-                    >
-                      <FormLabel
-                        className={cn('my-2 flex items-center gap-2 font-normal', {
-                          'opacity-50': !value.includes(recipient.id),
-                        })}
+          <Form {...form}>
+            <form id={FORM_ID} onSubmit={handleSubmit(onFormSubmit)} className="px-3">
+              <FormField
+                control={form.control}
+                name="recipients"
+                render={({ field: { value, onChange } }) => (
+                  <>
+                    {recipients.map((recipient) => (
+                      <FormItem
+                        key={recipient.id}
+                        className="flex flex-row items-center justify-between gap-x-3"
                       >
-                        <StackAvatar
-                          key={recipient.id}
-                          type={getRecipientType(recipient)}
-                          fallbackText={recipientAbbreviation(recipient)}
-                        />
-                        {recipient.email}
-                      </FormLabel>
+                        <FormLabel
+                          className={cn('my-2 flex items-center gap-2 font-normal', {
+                            'opacity-50': !value.includes(recipient.id),
+                          })}
+                        >
+                          <StackAvatar
+                            key={recipient.id}
+                            type={getRecipientType(recipient)}
+                            fallbackText={recipientAbbreviation(recipient)}
+                          />
+                          {recipient.email}
+                        </FormLabel>
 
-                      <FormControl>
-                        <Checkbox
-                          className="h-5 w-5 rounded-full data-[state=checked]:border-black data-[state=checked]:bg-black "
-                          checkClassName="text-white"
-                          value={recipient.id}
-                          checked={value.includes(recipient.id)}
-                          onCheckedChange={(checked: boolean) =>
-                            checked
-                              ? onChange([...value, recipient.id])
-                              : onChange(value.filter((v) => v !== recipient.id))
-                          }
-                        />
-                      </FormControl>
-                    </FormItem>
-                  ))}
-                </>
-              )}
-            />
-          </form>
-        </Form>
+                        <FormControl>
+                          <Checkbox
+                            className="h-5 w-5 rounded-full data-[state=checked]:border-black data-[state=checked]:bg-black "
+                            checkClassName="text-white"
+                            value={recipient.id}
+                            checked={value.includes(recipient.id)}
+                            onCheckedChange={(checked: boolean) =>
+                              checked
+                                ? onChange([...value, recipient.id])
+                                : onChange(value.filter((v) => v !== recipient.id))
+                            }
+                          />
+                        </FormControl>
+                      </FormItem>
+                    ))}
+                  </>
+                )}
+              />
+            </form>
+          </Form>
 
-        <DialogFooter>
-          <div className="flex w-full flex-1 flex-nowrap gap-4">
-            <DialogClose asChild>
-              <Button
-                type="button"
-                className="dark:bg-muted dark:hover:bg-muted/80 flex-1  bg-black/5 hover:bg-black/10"
-                variant="secondary"
-                disabled={isSubmitting}
-              >
-                Cancel
+          <DialogFooter>
+            <div className="flex w-full flex-1 flex-nowrap gap-4">
+              <DialogClose asChild>
+                <Button
+                  type="button"
+                  className="dark:bg-muted dark:hover:bg-muted/80 flex-1  bg-black/5 hover:bg-black/10"
+                  variant="secondary"
+                  disabled={isSubmitting}
+                >
+                  Cancel
+                </Button>
+              </DialogClose>
+
+              <Button className="flex-1" loading={isSubmitting} type="submit" form={FORM_ID}>
+                Send reminder
               </Button>
-            </DialogClose>
-
-            <Button className="flex-1" loading={isSubmitting} type="submit" form={FORM_ID}>
-              Send reminder
-            </Button>
-          </div>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
+            </div>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </>
   );
 };

apps/web/src/app/(dashboard)/documents/data-table-action-button.tsx

@@ -94,7 +94,7 @@ export const DataTableActionButton = ({ row, team }: DataTableActionButtonProps)
       isOwner ? { isDraft: true, isOwner: true } : { isDraft: true, isCurrentTeamDocument: true },
       () => (
         <Button className="w-32" asChild>
-          <Link href={`${documentsPath}/${row.id}`}>
+          <Link href={`${documentsPath}/${row.id}/edit`}>
             <Edit className="-ml-1 mr-2 h-4 w-4" />
             Edit
           </Link>

apps/web/src/app/(dashboard)/documents/data-table-action-dropdown.tsx

@@ -142,7 +142,7 @@ export const DataTableActionDropdown = ({ row, team }: DataTableActionDropdownPr
         )}
 
         <DropdownMenuItem disabled={(!isOwner && !isCurrentTeamDocument) || isComplete} asChild>
-          <Link href={`${documentsPath}/${row.id}`}>
+          <Link href={`${documentsPath}/${row.id}/edit`}>
             <Edit className="mr-2 h-4 w-4" />
             Edit
           </Link>

apps/web/src/app/(dashboard)/documents/data-table-title.tsx

@@ -5,16 +5,19 @@ import Link from 'next/link';
 import { useSession } from 'next-auth/react';
 import { match } from 'ts-pattern';
 
-import { Document, Recipient, User } from '@documenso/prisma/client';
+import { formatDocumentsPath } from '@documenso/lib/utils/teams';
+import type { Document, Recipient, Team, User } from '@documenso/prisma/client';
 
 export type DataTableTitleProps = {
   row: Document & {
     User: Pick<User, 'id' | 'name' | 'email'>;
+    team: Pick<Team, 'url'> | null;
     Recipient: Recipient[];
   };
+  teamUrl?: string;
 };
 
-export const DataTableTitle = ({ row }: DataTableTitleProps) => {
+export const DataTableTitle = ({ row, teamUrl }: DataTableTitleProps) => {
   const { data: session } = useSession();
 
   if (!session) {
@@ -25,14 +28,18 @@ export const DataTableTitle = ({ row }: DataTableTitleProps) => {
 
   const isOwner = row.User.id === session.user.id;
   const isRecipient = !!recipient;
+  const isCurrentTeamDocument = teamUrl && row.team?.url === teamUrl;
+
+  const documentsPath = formatDocumentsPath(isCurrentTeamDocument ? teamUrl : undefined);
 
   return match({
     isOwner,
     isRecipient,
+    isCurrentTeamDocument,
   })
-    .with({ isOwner: true }, () => (
+    .with({ isOwner: true }, { isCurrentTeamDocument: true }, () => (
       <Link
-        href={`/documents/${row.id}`}
+        href={`${documentsPath}/${row.id}`}
         title={row.title}
         className="block max-w-[10rem] truncate font-medium hover:underline md:max-w-[20rem]"
       >

apps/web/src/app/(dashboard)/documents/data-table.tsx

@@ -66,7 +66,7 @@ export const DocumentsDataTable = ({
           },
           {
             header: 'Title',
-            cell: ({ row }) => <DataTableTitle row={row.original} />,
+            cell: ({ row }) => <DataTableTitle row={row.original} teamUrl={team?.url} />,
           },
           {
             id: 'sender',

apps/web/src/app/(dashboard)/documents/duplicate-document-dialog.tsx

@@ -47,7 +47,7 @@ export const DuplicateDocumentDialog = ({
   const { mutateAsync: duplicateDocument, isLoading: isDuplicateLoading } =
     trpcReact.document.duplicateDocument.useMutation({
       onSuccess: (newId) => {
-        router.push(`${documentsPath}/${newId}`);
+        router.push(`${documentsPath}/${newId}/edit`);
 
         toast({
           title: 'Document Duplicated',

apps/web/src/app/(dashboard)/documents/upload-document.tsx

@@ -83,7 +83,7 @@ export const UploadDocument = ({ className, team }: UploadDocumentProps) => {
         timestamp: new Date().toISOString(),
       });
 
-      router.push(`${formatDocumentsPath(team?.url)}/${id}`);
+      router.push(`${formatDocumentsPath(team?.url)}/${id}/edit`);
     } catch (error) {
       console.error(error);
 
@@ -117,7 +117,7 @@ export const UploadDocument = ({ className, team }: UploadDocumentProps) => {
   return (
     <div className={cn('relative', className)}>
       <DocumentDropzone
-        className="h-[min(400px,50vh)]"
+        className="min-h-[40vh]"
         disabled={remaining.documents === 0 || !session?.user.emailVerified}
         disabledMessage={disabledMessage}
         onDrop={onFileDrop}

apps/web/src/app/(dashboard)/settings/billing/create-billing-portal.action.ts

@@ -2,7 +2,6 @@
 
 import { getStripeCustomerByUser } from '@documenso/ee/server-only/stripe/get-customer';
 import { getPortalSession } from '@documenso/ee/server-only/stripe/get-portal-session';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 
 export const createBillingPortal = async () => {
@@ -12,6 +11,6 @@ export const createBillingPortal = async () => {
 
   return getPortalSession({
     customerId: stripeCustomer.id,
-    returnUrl: `${NEXT_PUBLIC_WEBAPP_URL()}/settings/billing`,
+    returnUrl: `${process.env.NEXT_PUBLIC_WEBAPP_URL}/settings/billing`,
   });
 };

apps/web/src/app/(dashboard)/settings/billing/create-checkout.action.ts

@@ -3,7 +3,6 @@
 import { getCheckoutSession } from '@documenso/ee/server-only/stripe/get-checkout-session';
 import { getStripeCustomerByUser } from '@documenso/ee/server-only/stripe/get-customer';
 import { getPortalSession } from '@documenso/ee/server-only/stripe/get-portal-session';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getSubscriptionsByUserId } from '@documenso/lib/server-only/subscription/get-subscriptions-by-user-id';
 
@@ -28,13 +27,13 @@ export const createCheckout = async ({ priceId }: CreateCheckoutOptions) => {
   if (foundSubscription) {
     return getPortalSession({
       customerId: stripeCustomer.id,
-      returnUrl: `${NEXT_PUBLIC_WEBAPP_URL()}/settings/billing`,
+      returnUrl: `${process.env.NEXT_PUBLIC_WEBAPP_URL}/settings/billing`,
     });
   }
 
   return getCheckoutSession({
     customerId: stripeCustomer.id,
     priceId,
-    returnUrl: `${NEXT_PUBLIC_WEBAPP_URL()}/settings/billing`,
+    returnUrl: `${process.env.NEXT_PUBLIC_WEBAPP_URL}/settings/billing`,
   });
 };

apps/web/src/app/(dashboard)/settings/billing/page.tsx

@@ -5,7 +5,7 @@ import { match } from 'ts-pattern';
 
 import { getStripeCustomerByUser } from '@documenso/ee/server-only/stripe/get-customer';
 import { getPricesByInterval } from '@documenso/ee/server-only/stripe/get-prices-by-interval';
-import { getPrimaryAccountPlanPrices } from '@documenso/ee/server-only/stripe/get-primary-account-plan-prices';
+import { getPricesByPlan } from '@documenso/ee/server-only/stripe/get-prices-by-plan';
 import { getProductByPriceId } from '@documenso/ee/server-only/stripe/get-product-by-price-id';
 import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
@@ -37,23 +37,23 @@ export default async function BillingSettingsPage() {
     user = await getStripeCustomerByUser(user).then((result) => result.user);
   }
 
-  const [subscriptions, prices, primaryAccountPlanPrices] = await Promise.all([
+  const [subscriptions, prices, communityPlanPrices] = await Promise.all([
     getSubscriptionsByUserId({ userId: user.id }),
     getPricesByInterval({ plan: STRIPE_PLAN_TYPE.COMMUNITY }),
-    getPrimaryAccountPlanPrices(),
+    getPricesByPlan(STRIPE_PLAN_TYPE.COMMUNITY),
   ]);
 
-  const primaryAccountPlanPriceIds = primaryAccountPlanPrices.map(({ id }) => id);
+  const communityPlanPriceIds = communityPlanPrices.map(({ id }) => id);
 
   let subscriptionProduct: Stripe.Product | null = null;
 
-  const primaryAccountPlanSubscriptions = subscriptions.filter(({ priceId }) =>
-    primaryAccountPlanPriceIds.includes(priceId),
+  const communityPlanUserSubscriptions = subscriptions.filter(({ priceId }) =>
+    communityPlanPriceIds.includes(priceId),
   );
 
   const subscription =
-    primaryAccountPlanSubscriptions.find(({ status }) => status === SubscriptionStatus.ACTIVE) ??
-    primaryAccountPlanSubscriptions[0];
+    communityPlanUserSubscriptions.find(({ status }) => status === SubscriptionStatus.ACTIVE) ??
+    communityPlanUserSubscriptions[0];
 
   if (subscription?.priceId) {
     subscriptionProduct = await getProductByPriceId({ priceId: subscription.priceId }).catch(

apps/web/src/app/(dashboard)/templates/data-table-templates.tsx

@@ -76,7 +76,7 @@ export const TemplatesDataTable = ({
         duration: 5000,
       });
 
-      router.push(`${documentRootPath}/${id}`);
+      router.push(`${documentRootPath}/${id}/edit`);
     } catch (err) {
       toast({
         title: 'Error',

apps/web/src/app/(share)/share/[slug]/opengraph/route.tsx

@@ -3,8 +3,6 @@ import { NextResponse } from 'next/server';
 
 import { P, match } from 'ts-pattern';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-
 import type { ShareHandlerAPIResponse } from '~/pages/api/share';
 
 export const runtime = 'edge';
@@ -39,7 +37,7 @@ export async function GET(_request: Request, { params: { slug } }: SharePageOpen
     ),
   ]);
 
-  const baseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  const baseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
   const recipientOrSender: ShareHandlerAPIResponse = await fetch(
     new URL(`/api/share?slug=${slug}`, baseUrl),

apps/web/src/app/(share)/share/[slug]/page.tsx

@@ -1,8 +1,8 @@
-import type { Metadata } from 'next';
+import { Metadata } from 'next';
 import { headers } from 'next/headers';
 import { redirect } from 'next/navigation';
 
-import { NEXT_PUBLIC_MARKETING_URL } from '@documenso/lib/constants/app';
+import { APP_BASE_URL } from '@documenso/lib/constants/app';
 
 type SharePageProps = {
   params: { slug: string };
@@ -16,12 +16,12 @@ export function generateMetadata({ params: { slug } }: SharePageProps) {
       title: 'Documenso - Join the open source signing revolution',
       description: 'I just signed with Documenso!',
       type: 'website',
-      images: [`/share/${slug}/opengraph`],
+      images: [`${APP_BASE_URL}/share/${slug}/opengraph`],
     },
     twitter: {
       site: '@documenso',
       card: 'summary_large_image',
-      images: [`/share/${slug}/opengraph`],
+      images: [`${APP_BASE_URL}/share/${slug}/opengraph`],
       description: 'I just signed with Documenso!',
     },
   } satisfies Metadata;
@@ -35,5 +35,5 @@ export default function SharePage() {
     return null;
   }
 
-  redirect(NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3001');
+  redirect(process.env.NEXT_PUBLIC_MARKETING_URL ?? 'http://localhost:3001');
 }

apps/web/src/app/(teams)/t/[teamUrl]/documents/[id]/edit/page.tsx

@@ -0,0 +1,21 @@
+import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
+import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
+
+import { DocumentEditPageView } from '~/app/(dashboard)/documents/[id]/edit/document-edit-page-view';
+
+export type DocumentPageProps = {
+  params: {
+    id: string;
+    teamUrl: string;
+  };
+};
+
+export default async function TeamsDocumentEditPage({ params }: DocumentPageProps) {
+  const { teamUrl } = params;
+
+  const { user } = await getRequiredServerComponentSession();
+
+  const team = await getTeamByUrl({ userId: user.id, teamUrl });
+
+  return <DocumentEditPageView params={params} team={team} />;
+}

apps/web/src/app/(teams)/t/[teamUrl]/settings/team-transfer-status.tsx

@@ -18,7 +18,7 @@ export type TeamTransferStatusProps = {
   className?: string;
   currentUserTeamRole: TeamMemberRole;
   teamId: number;
-  transferVerification: Pick<TeamTransferVerification, 'email' | 'expiresAt' | 'name'> | null;
+  transferVerification: TeamTransferVerification | null;
 };
 
 export const TeamTransferStatus = ({

apps/web/src/app/(unauthenticated)/signin/page.tsx

@@ -2,8 +2,6 @@ import type { Metadata } from 'next';
 import Link from 'next/link';
 import { redirect } from 'next/navigation';
 
-import { env } from 'next-runtime-env';
-
 import { IS_GOOGLE_SSO_ENABLED } from '@documenso/lib/constants/auth';
 import { decryptSecondaryData } from '@documenso/lib/server-only/crypto/decrypt';
 
@@ -20,8 +18,6 @@ type SignInPageProps = {
 };
 
 export default function SignInPage({ searchParams }: SignInPageProps) {
-  const NEXT_PUBLIC_DISABLE_SIGNUP = env('NEXT_PUBLIC_DISABLE_SIGNUP');
-
   const rawEmail = typeof searchParams.email === 'string' ? searchParams.email : undefined;
   const email = rawEmail ? decryptSecondaryData(rawEmail) : null;
 
@@ -43,7 +39,7 @@ export default function SignInPage({ searchParams }: SignInPageProps) {
         isGoogleSSOEnabled={IS_GOOGLE_SSO_ENABLED}
       />
 
-      {NEXT_PUBLIC_DISABLE_SIGNUP !== 'true' && (
+      {process.env.NEXT_PUBLIC_DISABLE_SIGNUP !== 'true' && (
         <p className="text-muted-foreground mt-6 text-center text-sm">
           Don't have an account?{' '}
           <Link href="/signup" className="text-primary duration-200 hover:opacity-70">

apps/web/src/app/(unauthenticated)/signup/page.tsx

@@ -2,8 +2,6 @@ import type { Metadata } from 'next';
 import Link from 'next/link';
 import { redirect } from 'next/navigation';
 
-import { env } from 'next-runtime-env';
-
 import { IS_GOOGLE_SSO_ENABLED } from '@documenso/lib/constants/auth';
 import { decryptSecondaryData } from '@documenso/lib/server-only/crypto/decrypt';
 
@@ -20,9 +18,7 @@ type SignUpPageProps = {
 };
 
 export default function SignUpPage({ searchParams }: SignUpPageProps) {
-  const NEXT_PUBLIC_DISABLE_SIGNUP = env('NEXT_PUBLIC_DISABLE_SIGNUP');
-
-  if (NEXT_PUBLIC_DISABLE_SIGNUP === 'true') {
+  if (process.env.NEXT_PUBLIC_DISABLE_SIGNUP === 'true') {
     redirect('/signin');
   }
 

apps/web/src/app/(unauthenticated)/unverified-account/page.tsx

@@ -1,27 +0,0 @@
-import { Mails } from 'lucide-react';
-
-import { SendConfirmationEmailForm } from '~/components/forms/send-confirmation-email';
-
-export default function UnverifiedAccount() {
-  return (
-    <div className="flex w-full items-start">
-      <div className="mr-4 mt-1 hidden md:block">
-        <Mails className="text-primary h-10 w-10" strokeWidth={2} />
-      </div>
-      <div className="">
-        <h2 className="text-2xl font-bold md:text-4xl">Confirm email</h2>
-
-        <p className="text-muted-foreground mt-4">
-          To gain access to your account, please confirm your email address by clicking on the
-          confirmation link from your inbox.
-        </p>
-
-        <p className="text-muted-foreground mt-4">
-          If you don't find the confirmation link in your inbox, you can request a new one below.
-        </p>
-
-        <SendConfirmationEmailForm />
-      </div>
-    </div>
-  );
-}

apps/web/src/app/layout.tsx

@@ -2,11 +2,8 @@ import { Suspense } from 'react';
 
 import { Caveat, Inter } from 'next/font/google';
 
-import { PublicEnvScript } from 'next-runtime-env';
-
 import { FeatureFlagProvider } from '@documenso/lib/client-only/providers/feature-flag';
 import { LocaleProvider } from '@documenso/lib/client-only/providers/locale';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { getServerComponentAllFlags } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
 import { getLocale } from '@documenso/lib/server-only/headers/get-locale';
 import { TrpcProvider } from '@documenso/trpc/react';
@@ -22,35 +19,32 @@ import './globals.css';
 const fontInter = Inter({ subsets: ['latin'], variable: '--font-sans' });
 const fontCaveat = Caveat({ subsets: ['latin'], variable: '--font-signature' });
 
-export function generateMetadata() {
-  return {
-    title: {
-      template: '%s - Documenso',
-      default: 'Documenso',
-    },
+export const metadata = {
+  title: {
+    template: '%s - Documenso',
+    default: 'Documenso',
+  },
+  description:
+    'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
+  keywords:
+    'Documenso, open source, DocuSign alternative, document signing, open signing infrastructure, open-source community, fast signing, beautiful signing, smart templates',
+  authors: { name: 'Documenso, Inc.' },
+  robots: 'index, follow',
+  openGraph: {
+    title: 'Documenso - The Open Source DocuSign Alternative',
     description:
       'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-    keywords:
-      'Documenso, open source, DocuSign alternative, document signing, open signing infrastructure, open-source community, fast signing, beautiful signing, smart templates',
-    authors: { name: 'Documenso, Inc.' },
-    robots: 'index, follow',
-    metadataBase: new URL(NEXT_PUBLIC_WEBAPP_URL() ?? 'http://localhost:3000'),
-    openGraph: {
-      title: 'Documenso - The Open Source DocuSign Alternative',
-      description:
-        'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-      type: 'website',
-      images: ['/opengraph-image.jpg'],
-    },
-    twitter: {
-      site: '@documenso',
-      card: 'summary_large_image',
-      images: ['/opengraph-image.jpg'],
-      description:
-        'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
-    },
-  };
-}
+    type: 'website',
+    images: [`${process.env.NEXT_PUBLIC_WEBAPP_URL}/opengraph-image.jpg`],
+  },
+  twitter: {
+    site: '@documenso',
+    card: 'summary_large_image',
+    images: [`${process.env.NEXT_PUBLIC_WEBAPP_URL}/opengraph-image.jpg`],
+    description:
+      'Join Documenso, the open signing infrastructure, and get a 10x better signing experience. Pricing starts at $30/mo. forever! Sign in now and enjoy a faster, smarter, and more beautiful document signing process. Integrates with your favorite tools, customizable, and expandable. Support our mission and become a part of our open-source community.',
+  },
+};
 
 export default async function RootLayout({ children }: { children: React.ReactNode }) {
   const flags = await getServerComponentAllFlags();
@@ -68,7 +62,6 @@ export default async function RootLayout({ children }: { children: React.ReactNo
         <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
         <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
         <link rel="manifest" href="/site.webmanifest" />
-        <PublicEnvScript />
       </head>
 
       <Suspense>

apps/web/src/components/(dashboard)/avatar/avatar-with-recipient.tsx

@@ -4,7 +4,6 @@ import React from 'react';
 
 import { useCopyToClipboard } from '@documenso/lib/client-only/hooks/use-copy-to-clipboard';
 import { getRecipientType } from '@documenso/lib/client-only/recipient-type';
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { RECIPIENT_ROLES_DESCRIPTION } from '@documenso/lib/constants/recipient-roles';
 import { recipientAbbreviation } from '@documenso/lib/utils/recipient-formatter';
 import type { Recipient } from '@documenso/prisma/client';
@@ -26,7 +25,7 @@ export function AvatarWithRecipient({ recipient }: AvatarWithRecipientProps) {
       return;
     }
 
-    void copy(`${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`).then(() => {
+    void copy(`${process.env.NEXT_PUBLIC_WEBAPP_URL}/sign/${recipient.token}`).then(() => {
       toast({
         title: 'Copied to clipboard',
         description: 'The signing link has been copied to your clipboard.',

apps/web/src/components/(teams)/dialogs/transfer-team-dialog.tsx

@@ -238,7 +238,7 @@ export const TransferTeamDialog = ({
                 <Alert variant="neutral">
                   <AlertDescription>
                     <ul className="list-outside list-disc space-y-2 pl-4">
-                      {IS_BILLING_ENABLED() && (
+                      {IS_BILLING_ENABLED && (
                         // Temporary removed.
                         // <li>
                         //   {form.getValues('clearPaymentMethods')

apps/web/src/components/(teams)/settings/layout/desktop-nav.tsx

@@ -48,7 +48,7 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => {
         </Button>
       </Link>
 
-      {IS_BILLING_ENABLED() && (
+      {IS_BILLING_ENABLED && (
         <Link href={billingPath}>
           <Button
             variant="ghost"

apps/web/src/components/(teams)/settings/layout/mobile-nav.tsx

@@ -56,7 +56,7 @@ export const MobileNav = ({ className, ...props }: MobileNavProps) => {
         </Button>
       </Link>
 
-      {IS_BILLING_ENABLED() && (
+      {IS_BILLING_ENABLED && (
         <Link href={billingPath}>
           <Button
             variant="ghost"

apps/web/src/components/(teams)/tables/teams-member-page-data-table.tsx

@@ -67,7 +67,7 @@ export const TeamsMemberPageDataTable = ({
         <Tabs value={currentTab} className="flex-shrink-0 overflow-x-auto">
           <TabsList>
             <TabsTrigger className="min-w-[60px]" value="members" asChild>
-              <Link href={pathname ?? '/'}>Active</Link>
+              <Link href={pathname ?? '/'}>All</Link>
             </TabsTrigger>
 
             <TabsTrigger className="min-w-[60px]" value="invites" asChild>

apps/web/src/components/document/document-history-sheet-changes.tsx

@@ -0,0 +1,28 @@
+'use client';
+
+import React from 'react';
+
+import { Badge } from '@documenso/ui/primitives/badge';
+
+export type DocumentHistorySheetChangesProps = {
+  values: {
+    key: string | React.ReactNode;
+    value: string | React.ReactNode;
+  }[];
+};
+
+export const DocumentHistorySheetChanges = ({ values }: DocumentHistorySheetChangesProps) => {
+  return (
+    <Badge
+      className="text-muted-foreground mt-3 block w-full space-y-0.5 text-xs"
+      variant="neutral"
+    >
+      {values.map(({ key, value }, i) => (
+        <p key={typeof key === 'string' ? key : i}>
+          <span>{key}: </span>
+          <span className="font-normal">{value}</span>
+        </p>
+      ))}
+    </Badge>
+  );
+};

apps/web/src/components/document/document-history-sheet.tsx

@@ -0,0 +1,316 @@
+'use client';
+
+import { useMemo, useState } from 'react';
+
+import { ArrowRightIcon, Loader } from 'lucide-react';
+import { match } from 'ts-pattern';
+import { UAParser } from 'ua-parser-js';
+
+import { DOCUMENT_AUDIT_LOG_EMAIL_FORMAT } from '@documenso/lib/constants/document-audit-logs';
+import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
+import { formatDocumentAuditLogActionString } from '@documenso/lib/utils/document-audit-logs';
+import { trpc } from '@documenso/trpc/react';
+import { cn } from '@documenso/ui/lib/utils';
+import { Avatar, AvatarFallback } from '@documenso/ui/primitives/avatar';
+import { Badge } from '@documenso/ui/primitives/badge';
+import { Button } from '@documenso/ui/primitives/button';
+import { Sheet, SheetContent, SheetTrigger } from '@documenso/ui/primitives/sheet';
+
+import { LocaleDate } from '~/components/formatter/locale-date';
+
+import { DocumentHistorySheetChanges } from './document-history-sheet-changes';
+
+export type DocumentHistorySheetProps = {
+  documentId: number;
+  userId: number;
+  isMenuOpen?: boolean;
+  onMenuOpenChange?: (_value: boolean) => void;
+  children?: React.ReactNode;
+};
+
+export const DocumentHistorySheet = ({
+  documentId,
+  userId,
+  isMenuOpen,
+  onMenuOpenChange,
+  children,
+}: DocumentHistorySheetProps) => {
+  const [isUserDetailsVisible, setIsUserDetailsVisible] = useState(false);
+
+  const {
+    data,
+    isLoading,
+    isLoadingError,
+    refetch,
+    hasNextPage,
+    fetchNextPage,
+    isFetchingNextPage,
+  } = trpc.document.findDocumentAuditLogs.useInfiniteQuery(
+    {
+      documentId,
+    },
+    {
+      getNextPageParam: (lastPage) => lastPage.nextCursor,
+    },
+  );
+
+  const documentAuditLogs = useMemo(() => (data?.pages ?? []).flatMap((page) => page.data), [data]);
+
+  const extractBrowser = (userAgent?: string | null) => {
+    if (!userAgent) {
+      return 'Unknown';
+    }
+
+    const parser = new UAParser(userAgent);
+
+    parser.setUA(userAgent);
+
+    const result = parser.getResult();
+
+    return result.browser.name;
+  };
+
+  /**
+   * Applies the following formatting for a given text:
+   * - Uppercase first lower, lowercase rest
+   * - Replace _ with spaces
+   *
+   * @param text The text to format
+   * @returns The formatted text
+   */
+  const formatGenericText = (text: string) => {
+    return (text.charAt(0).toUpperCase() + text.slice(1).toLowerCase()).replaceAll('_', ' ');
+  };
+
+  return (
+    <Sheet open={isMenuOpen} onOpenChange={onMenuOpenChange}>
+      {children && <SheetTrigger asChild>{children}</SheetTrigger>}
+
+      <SheetContent
+        sheetClass="backdrop-blur-none"
+        className="flex w-full max-w-[500px] flex-col overflow-y-auto p-0"
+      >
+        <div className="text-foreground px-6 pt-6">
+          <h1 className="text-lg font-medium">Document history</h1>
+          <button
+            className="text-muted-foreground text-sm"
+            onClick={() => setIsUserDetailsVisible(!isUserDetailsVisible)}
+          >
+            {isUserDetailsVisible ? 'Hide' : 'Show'} additional information
+          </button>
+        </div>
+
+        {isLoading && (
+          <div className="flex h-full items-center justify-center">
+            <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+          </div>
+        )}
+
+        {isLoadingError && (
+          <div className="flex h-full flex-col items-center justify-center">
+            <p className="text-foreground/80 text-sm">Unable to load document history</p>
+            <button
+              onClick={async () => refetch()}
+              className="text-foreground/70 hover:text-muted-foreground mt-2 text-sm"
+            >
+              Click here to retry
+            </button>
+          </div>
+        )}
+
+        {data && (
+          <ul
+            className={cn('divide-y border-t', {
+              'mb-4 border-b': !hasNextPage,
+            })}
+          >
+            {documentAuditLogs.map((auditLog) => (
+              <li className="px-4 py-2.5" key={auditLog.id}>
+                <div className="flex flex-row items-center">
+                  <Avatar className="mr-2 h-9 w-9">
+                    <AvatarFallback className="text-xs text-gray-400">
+                      {(auditLog?.email ?? auditLog?.name ?? '?').slice(0, 1).toUpperCase()}
+                    </AvatarFallback>
+                  </Avatar>
+
+                  <div>
+                    <p className="text-foreground text-xs font-bold">
+                      {formatDocumentAuditLogActionString(auditLog, userId)}
+                    </p>
+                    <p className="text-foreground/50 text-xs">
+                      <LocaleDate date={auditLog.createdAt} format="d MMM, yyyy HH:MM a" />
+                    </p>
+                  </div>
+                </div>
+
+                {match(auditLog)
+                  .with(
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_CREATED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_COMPLETED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_DELETED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_OPENED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_SENT },
+                    () => null,
+                  )
+                  .with(
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.RECIPIENT_CREATED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.RECIPIENT_DELETED },
+                    ({ data }) => {
+                      const values = [
+                        {
+                          key: 'Email',
+                          value: data.recipientEmail,
+                        },
+                        {
+                          key: 'Role',
+                          value: formatGenericText(data.recipientRole),
+                        },
+                      ];
+
+                      if (data.recipientName) {
+                        values.unshift({
+                          key: 'Name',
+                          value: data.recipientName,
+                        });
+                      }
+
+                      return <DocumentHistorySheetChanges values={values} />;
+                    },
+                  )
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.RECIPIENT_UPDATED }, ({ data }) => {
+                    if (data.changes.length === 0) {
+                      return null;
+                    }
+
+                    return (
+                      <DocumentHistorySheetChanges
+                        values={data.changes.map(({ type, from, to }) => ({
+                          key: formatGenericText(type),
+                          value: (
+                            <span className="inline-flex flex-row items-center">
+                              <span>{type === 'ROLE' ? formatGenericText(from) : from}</span>
+                              <ArrowRightIcon className="h-4 w-4" />
+                              <span>{type === 'ROLE' ? formatGenericText(to) : to}</span>
+                            </span>
+                          ),
+                        }))}
+                      />
+                    );
+                  })
+                  .with(
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.FIELD_CREATED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.FIELD_DELETED },
+                    { type: DOCUMENT_AUDIT_LOG_TYPE.FIELD_UPDATED },
+                    ({ data }) => (
+                      <DocumentHistorySheetChanges
+                        values={[
+                          {
+                            key: 'Field',
+                            value: formatGenericText(data.fieldType),
+                          },
+                          {
+                            key: 'Recipient',
+                            value: formatGenericText(data.fieldRecipientEmail),
+                          },
+                        ]}
+                      />
+                    ),
+                  )
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED }, ({ data }) => {
+                    if (data.changes.length === 0) {
+                      return null;
+                    }
+
+                    return (
+                      <DocumentHistorySheetChanges
+                        values={data.changes.map((change) => ({
+                          key: formatGenericText(change.type),
+                          value: change.type === 'PASSWORD' ? '*********' : change.to,
+                        }))}
+                      />
+                    );
+                  })
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_TITLE_UPDATED }, ({ data }) => (
+                    <DocumentHistorySheetChanges
+                      values={[
+                        {
+                          key: 'Old',
+                          value: data.from,
+                        },
+                        {
+                          key: 'New',
+                          value: data.to,
+                        },
+                      ]}
+                    />
+                  ))
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELD_INSERTED }, ({ data }) => (
+                    <DocumentHistorySheetChanges
+                      values={[
+                        {
+                          key: 'Field inserted',
+                          value: formatGenericText(data.field.type),
+                        },
+                      ]}
+                    />
+                  ))
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_FIELD_UNINSERTED }, ({ data }) => (
+                    <DocumentHistorySheetChanges
+                      values={[
+                        {
+                          key: 'Field uninserted',
+                          value: formatGenericText(data.field),
+                        },
+                      ]}
+                    />
+                  ))
+                  .with({ type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT }, ({ data }) => (
+                    <DocumentHistorySheetChanges
+                      values={[
+                        {
+                          key: 'Type',
+                          value: DOCUMENT_AUDIT_LOG_EMAIL_FORMAT[data.emailType].description,
+                        },
+                        {
+                          key: 'Sent to',
+                          value: data.recipientEmail,
+                        },
+                      ]}
+                    />
+                  ))
+                  .exhaustive()}
+
+                {isUserDetailsVisible && (
+                  <>
+                    <div className="mb-1 mt-2 flex flex-row space-x-2">
+                      <Badge variant="neutral" className="text-muted-foreground">
+                        IP: {auditLog.ipAddress ?? 'Unknown'}
+                      </Badge>
+
+                      <Badge variant="neutral" className="text-muted-foreground">
+                        Browser: {extractBrowser(auditLog.userAgent)}
+                      </Badge>
+                    </div>
+                  </>
+                )}
+              </li>
+            ))}
+
+            {hasNextPage && (
+              <div className="flex items-center justify-center py-4">
+                <Button
+                  variant="outline"
+                  loading={isFetchingNextPage}
+                  onClick={async () => fetchNextPage()}
+                >
+                  Show more
+                </Button>
+              </div>
+            )}
+          </ul>
+        )}
+      </SheetContent>
+    </Sheet>
+  );
+};

apps/web/src/components/formatter/document-status.tsx

@@ -13,7 +13,7 @@ type FriendlyStatus = {
   color: string;
 };
 
-const FRIENDLY_STATUS_MAP: Record<ExtendedDocumentStatus, FriendlyStatus> = {
+export const FRIENDLY_STATUS_MAP: Record<ExtendedDocumentStatus, FriendlyStatus> = {
   PENDING: {
     label: 'Pending',
     icon: Clock,

apps/web/src/components/formatter/locale-date.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import type { HTMLAttributes } from 'react';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 
 import type { DateTimeFormatOptions } from 'luxon';
 import { DateTime } from 'luxon';
@@ -10,7 +10,7 @@ import { useLocale } from '@documenso/lib/client-only/providers/locale';
 
 export type LocaleDateProps = HTMLAttributes<HTMLSpanElement> & {
   date: string | number | Date;
-  format?: DateTimeFormatOptions;
+  format?: DateTimeFormatOptions | string;
 };
 
 /**
@@ -22,13 +22,24 @@ export type LocaleDateProps = HTMLAttributes<HTMLSpanElement> & {
 export const LocaleDate = ({ className, date, format, ...props }: LocaleDateProps) => {
   const { locale } = useLocale();
 
+  const formatDateTime = useCallback(
+    (date: DateTime) => {
+      if (typeof format === 'string') {
+        return date.toFormat(format);
+      }
+
+      return date.toLocaleString(format);
+    },
+    [format],
+  );
+
   const [localeDate, setLocaleDate] = useState(() =>
-    DateTime.fromJSDate(new Date(date)).setLocale(locale).toLocaleString(format),
+    formatDateTime(DateTime.fromJSDate(new Date(date)).setLocale(locale)),
   );
 
   useEffect(() => {
-    setLocaleDate(DateTime.fromJSDate(new Date(date)).toLocaleString(format));
-  }, [date, format]);
+    setLocaleDate(formatDateTime(DateTime.fromJSDate(new Date(date))));
+  }, [date, format, formatDateTime]);
 
   return (
     <span className={className} {...props}>

apps/web/src/components/forms/send-confirmation-email.tsx

@@ -1,95 +0,0 @@
-'use client';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-import { z } from 'zod';
-
-import { trpc } from '@documenso/trpc/react';
-import { cn } from '@documenso/ui/lib/utils';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Form,
-  FormControl,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from '@documenso/ui/primitives/form/form';
-import { Input } from '@documenso/ui/primitives/input';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-export const ZSendConfirmationEmailFormSchema = z.object({
-  email: z.string().email().min(1),
-});
-
-export type TSendConfirmationEmailFormSchema = z.infer<typeof ZSendConfirmationEmailFormSchema>;
-
-export type SendConfirmationEmailFormProps = {
-  className?: string;
-};
-
-export const SendConfirmationEmailForm = ({ className }: SendConfirmationEmailFormProps) => {
-  const { toast } = useToast();
-
-  const form = useForm<TSendConfirmationEmailFormSchema>({
-    values: {
-      email: '',
-    },
-    resolver: zodResolver(ZSendConfirmationEmailFormSchema),
-  });
-
-  const isSubmitting = form.formState.isSubmitting;
-
-  const { mutateAsync: sendConfirmationEmail } = trpc.profile.sendConfirmationEmail.useMutation();
-
-  const onFormSubmit = async ({ email }: TSendConfirmationEmailFormSchema) => {
-    try {
-      await sendConfirmationEmail({ email });
-
-      toast({
-        title: 'Confirmation email sent',
-        description:
-          'A confirmation email has been sent, and it should arrive in your inbox shortly.',
-        duration: 5000,
-      });
-
-      form.reset();
-    } catch (err) {
-      toast({
-        title: 'An error occurred while sending your confirmation email',
-        description: 'Please try again and make sure you enter the correct email address.',
-        variant: 'destructive',
-      });
-    }
-  };
-
-  return (
-    <Form {...form}>
-      <form
-        className={cn('mt-6 flex w-full flex-col gap-y-4', className)}
-        onSubmit={form.handleSubmit(onFormSubmit)}
-      >
-        <fieldset className="flex w-full flex-col gap-y-4" disabled={isSubmitting}>
-          <FormField
-            control={form.control}
-            name="email"
-            render={({ field }) => (
-              <FormItem>
-                <FormLabel>Email address</FormLabel>
-                <FormControl>
-                  <Input type="email" {...field} />
-                </FormControl>
-              </FormItem>
-            )}
-          />
-
-          <FormMessage />
-
-          <Button size="lg" type="submit" disabled={isSubmitting} loading={isSubmitting}>
-            Send confirmation email
-          </Button>
-        </fieldset>
-      </form>
-    </Form>
-  );
-};

apps/web/src/components/forms/signin.tsx

@@ -2,8 +2,6 @@
 
 import { useState } from 'react';
 
-import { useRouter } from 'next/navigation';
-
 import { zodResolver } from '@hookform/resolvers/zod';
 import { signIn } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
@@ -40,8 +38,6 @@ const ERROR_MESSAGES: Partial<Record<keyof typeof ErrorCode, string>> = {
     'This account appears to be using a social login method, please sign in using that method',
   [ErrorCode.INCORRECT_TWO_FACTOR_CODE]: 'The two-factor authentication code provided is incorrect',
   [ErrorCode.INCORRECT_TWO_FACTOR_BACKUP_CODE]: 'The backup code provided is incorrect',
-  [ErrorCode.UNVERIFIED_EMAIL]:
-    'This account has not been verified. Please verify your account before signing in.',
 };
 
 const TwoFactorEnabledErrorCode = ErrorCode.TWO_FACTOR_MISSING_CREDENTIALS;
@@ -67,7 +63,6 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
   const { toast } = useToast();
   const [isTwoFactorAuthenticationDialogOpen, setIsTwoFactorAuthenticationDialogOpen] =
     useState(false);
-  const router = useRouter();
 
   const [twoFactorAuthenticationMethod, setTwoFactorAuthenticationMethod] = useState<
     'totp' | 'backup'
@@ -135,17 +130,6 @@ export const SignInForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
 
         const errorMessage = ERROR_MESSAGES[result.error];
 
-        if (result.error === ErrorCode.UNVERIFIED_EMAIL) {
-          router.push(`/unverified-account`);
-
-          toast({
-            title: 'Unable to sign in',
-            description: errorMessage ?? 'An unknown error occurred',
-          });
-
-          return;
-        }
-
         toast({
           variant: 'destructive',
           title: 'Unable to sign in',

apps/web/src/components/forms/signup.tsx

@@ -1,7 +1,5 @@
 'use client';
 
-import { useRouter } from 'next/navigation';
-
 import { zodResolver } from '@hookform/resolvers/zod';
 import { signIn } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
@@ -57,7 +55,6 @@ export type SignUpFormProps = {
 export const SignUpForm = ({ className, initialEmail, isGoogleSSOEnabled }: SignUpFormProps) => {
   const { toast } = useToast();
   const analytics = useAnalytics();
-  const router = useRouter();
 
   const form = useForm<TSignUpFormSchema>({
     values: {
@@ -77,13 +74,10 @@ export const SignUpForm = ({ className, initialEmail, isGoogleSSOEnabled }: Sign
     try {
       await signup({ name, email, password, signature });
 
-      router.push(`/unverified-account`);
-
-      toast({
-        title: 'Registration Successful',
-        description:
-          'You have successfully registered. Please verify your account by clicking on the link you received in the email.',
-        duration: 5000,
+      await signIn('credentials', {
+        email,
+        password,
+        callbackUrl: SIGN_UP_REDIRECT_PATH,
       });
 
       analytics.capture('App: User Sign Up', {

apps/web/src/helpers/get-asset-buffer.ts

@@ -1,5 +1,3 @@
-import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
-
 /**
  * getAssetBuffer is used to retrieve array buffers for various assets
  * that are hosted in the `public` folder.
@@ -10,7 +8,7 @@ import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
  * @param path The path to the asset, relative to the `public` folder.
  */
 export const getAssetBuffer = async (path: string) => {
-  const baseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  const baseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
   return fetch(new URL(path, baseUrl)).then(async (res) => res.arrayBuffer());
 };

lint-staged.config.cjs

@@ -1,7 +1,7 @@
 /** @type {import('lint-staged').Config} */
 module.exports = {
-  '**/*.{ts,tsx,cts,mts}': (files) => files.map((file) => `eslint --fix ${file}`),
-  '**/*.{js,jsx,cjs,mjs}': (files) => files.map((file) => `prettier --write ${file}`),
-  '**/*.{yml,mdx}': (files) => files.map((file) => `prettier --write ${file}`),
+  '**/*.{ts,tsx,cts,mts}': (files) => `eslint --fix ${files.join(' ')}`,
+  '**/*.{js,jsx,cjs,mjs}': (files) => `prettier --write ${files.join(' ')}`,
+  '**/*.{yml,mdx}': (files) => `prettier --write ${files.join(' ')}`,
   '**/*/package.json': 'npm run precommit',
 };

package-lock.json

@@ -9,9 +9,6 @@
         "apps/*",
         "packages/*"
       ],
-      "dependencies": {
-        "next-runtime-env": "^3.2.0"
-      },
       "devDependencies": {
         "@commitlint/cli": "^17.7.1",
         "@commitlint/config-conventional": "^17.7.0",
@@ -14407,19 +14404,6 @@
         "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
       }
     },
-    "node_modules/next-runtime-env": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/next-runtime-env/-/next-runtime-env-3.2.0.tgz",
-      "integrity": "sha512-rwe3flUgSRm51hzRN4Vt5MMSYMS4aDMEPJa0r+CMONA3UyUZl8Y5O8zjHSIlaNb3yquTCttZ0ahObPyPprBj9g==",
-      "dependencies": {
-        "next": "^14",
-        "react": "^18"
-      },
-      "peerDependencies": {
-        "next": "^14",
-        "react": "^18"
-      }
-    },
     "node_modules/next-themes": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.2.1.tgz",

package.json

@@ -47,9 +47,7 @@
     "apps/*",
     "packages/*"
   ],
-  "dependencies": {
-    "next-runtime-env": "^3.2.0"
-  },
+  "dependencies": {},
   "overrides": {
     "next-auth": {
       "next": "14.0.3"

packages/ee/server-only/limits/client.ts

@@ -12,7 +12,7 @@ export type GetLimitsOptions = {
 export const getLimits = async ({ headers, teamId }: GetLimitsOptions = {}) => {
   const requestHeaders = headers ?? {};
 
-  const url = new URL('/api/limits', APP_BASE_URL() ?? 'http://localhost:3000');
+  const url = new URL(`${APP_BASE_URL}/api/limits`);
 
   if (teamId) {
     requestHeaders['team-id'] = teamId.toString();

packages/ee/server-only/limits/server.ts

@@ -1,10 +1,11 @@
 import { DateTime } from 'luxon';
 
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
+import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
 import { prisma } from '@documenso/prisma';
 import { SubscriptionStatus } from '@documenso/prisma/client';
 
-import { getDocumentRelatedPrices } from '../stripe/get-document-related-prices.ts';
+import { getPricesByPlan } from '../stripe/get-prices-by-plan';
 import { FREE_PLAN_LIMITS, SELFHOSTED_PLAN_LIMITS, TEAM_PLAN_LIMITS } from './constants';
 import { ERROR_CODES } from './errors';
 import { ZLimitsSchema } from './schema';
@@ -15,7 +16,7 @@ export type GetServerLimitsOptions = {
 };
 
 export const getServerLimits = async ({ email, teamId }: GetServerLimitsOptions) => {
-  if (!IS_BILLING_ENABLED()) {
+  if (!IS_BILLING_ENABLED) {
     return {
       quota: SELFHOSTED_PLAN_LIMITS,
       remaining: SELFHOSTED_PLAN_LIMITS,
@@ -55,11 +56,10 @@ const handleUserLimits = async ({ email }: HandleUserLimitsOptions) => {
   );
 
   if (activeSubscriptions.length > 0) {
-    const documentPlanPrices = await getDocumentRelatedPrices();
+    const communityPlanPrices = await getPricesByPlan(STRIPE_PLAN_TYPE.COMMUNITY);
 
     for (const subscription of activeSubscriptions) {
-      const price = documentPlanPrices.find((price) => price.id === subscription.priceId);
-
+      const price = communityPlanPrices.find((price) => price.id === subscription.priceId);
       if (!price || typeof price.product === 'string' || price.product.deleted) {
         continue;
       }

packages/ee/server-only/stripe/get-document-related-prices.ts.ts

@@ -1,10 +0,0 @@
-import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
-
-import { getPricesByPlan } from './get-prices-by-plan';
-
-/**
- * Returns the Stripe prices of items that affect the amount of documents a user can create.
- */
-export const getDocumentRelatedPrices = async () => {
-  return await getPricesByPlan([STRIPE_PLAN_TYPE.COMMUNITY, STRIPE_PLAN_TYPE.ENTERPRISE]);
-};

packages/ee/server-only/stripe/get-enterprise-plan-prices.ts

@@ -1,13 +0,0 @@
-import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
-
-import { getPricesByPlan } from './get-prices-by-plan';
-
-export const getEnterprisePlanPrices = async () => {
-  return await getPricesByPlan(STRIPE_PLAN_TYPE.ENTERPRISE);
-};
-
-export const getEnterprisePlanPriceIds = async () => {
-  const prices = await getEnterprisePlanPrices();
-
-  return prices.map((price) => price.id);
-};

packages/ee/server-only/stripe/get-prices-by-plan.ts

@@ -1,18 +1,14 @@
 import type { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
 import { stripe } from '@documenso/lib/server-only/stripe';
 
-type PlanType = (typeof STRIPE_PLAN_TYPE)[keyof typeof STRIPE_PLAN_TYPE];
-
-export const getPricesByPlan = async (plan: PlanType | PlanType[]) => {
-  const planTypes = typeof plan === 'string' ? [plan] : plan;
-
-  const query = planTypes.map((planType) => `metadata['plan']:'${planType}'`).join(' OR ');
-
+export const getPricesByPlan = async (
+  plan: (typeof STRIPE_PLAN_TYPE)[keyof typeof STRIPE_PLAN_TYPE],
+) => {
   const { data: prices } = await stripe.prices.search({
-    query,
+    query: `metadata['plan']:'${plan}' type:'recurring'`,
     expand: ['data.product'],
     limit: 100,
   });
 
-  return prices.filter((price) => price.type === 'recurring');
+  return prices;
 };

packages/ee/server-only/stripe/get-primary-account-plan-prices.ts

@@ -1,10 +0,0 @@
-import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
-
-import { getPricesByPlan } from './get-prices-by-plan';
-
-/**
- * Returns the prices of items that count as the account's primary plan.
- */
-export const getPrimaryAccountPlanPrices = async () => {
-  return await getPricesByPlan([STRIPE_PLAN_TYPE.COMMUNITY, STRIPE_PLAN_TYPE.ENTERPRISE]);
-};

packages/ee/server-only/stripe/get-team-related-prices.ts

@@ -1,17 +0,0 @@
-import { STRIPE_PLAN_TYPE } from '@documenso/lib/constants/billing';
-
-import { getPricesByPlan } from './get-prices-by-plan';
-
-/**
- * Returns the Stripe prices of items that affect the amount of teams a user can create.
- */
-export const getTeamRelatedPrices = async () => {
-  return await getPricesByPlan([STRIPE_PLAN_TYPE.COMMUNITY, STRIPE_PLAN_TYPE.ENTERPRISE]);
-};
-
-/**
- * Returns the Stripe price IDs of items that affect the amount of teams a user can create.
- */
-export const getTeamRelatedPriceIds = async () => {
-  return await getTeamRelatedPrices().then((prices) => prices.map((price) => price.id));
-};

packages/ee/server-only/stripe/transfer-team-subscription.ts

@@ -2,13 +2,13 @@ import type Stripe from 'stripe';
 
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
 import { stripe } from '@documenso/lib/server-only/stripe';
-import { subscriptionsContainsActivePlan } from '@documenso/lib/utils/billing';
+import { subscriptionsContainsActiveCommunityPlan } from '@documenso/lib/utils/billing';
 import { prisma } from '@documenso/prisma';
 import { type Subscription, type Team, type User } from '@documenso/prisma/client';
 
 import { deleteCustomerPaymentMethods } from './delete-customer-payment-methods';
+import { getCommunityPlanPriceIds } from './get-community-plan-prices';
 import { getTeamPrices } from './get-team-prices';
-import { getTeamRelatedPriceIds } from './get-team-related-prices';
 
 type TransferStripeSubscriptionOptions = {
   /**
@@ -46,14 +46,14 @@ export const transferTeamSubscription = async ({
     throw new AppError(AppErrorCode.NOT_FOUND, 'Missing customer ID.');
   }
 
-  const [teamRelatedPlanPriceIds, teamSeatPrices] = await Promise.all([
-    getTeamRelatedPriceIds(),
+  const [communityPlanIds, teamSeatPrices] = await Promise.all([
+    getCommunityPlanPriceIds(),
     getTeamPrices(),
   ]);
 
-  const teamSubscriptionRequired = !subscriptionsContainsActivePlan(
+  const teamSubscriptionRequired = !subscriptionsContainsActiveCommunityPlan(
     user.Subscription,
-    teamRelatedPlanPriceIds,
+    communityPlanIds,
   );
 
   let teamSubscription: Stripe.Subscription | null = null;

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

@@ -1,5 +1,3 @@
-import { env } from 'next-runtime-env';
-
 import { Button, Column, Img, Link, Section, Text } from '../components';
 import { TemplateDocumentImage } from './template-document-image';
 
@@ -12,9 +10,7 @@ export const TemplateDocumentSelfSigned = ({
   documentName,
   assetBaseUrl,
 }: TemplateDocumentSelfSignedProps) => {
-  const NEXT_PUBLIC_WEBAPP_URL = env('NEXT_PUBLIC_WEBAPP_URL');
-
-  const signUpUrl = `${NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000'}/signup`;
+  const signUpUrl = `${process.env.NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000'}/signup`;
 
   const getAssetUrl = (path: string) => {
     return new URL(path, assetBaseUrl).toString();

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

@@ -1,5 +1,3 @@
-import { env } from 'next-runtime-env';
-
 import { Button, Section, Text } from '../components';
 import { TemplateDocumentImage } from './template-document-image';
 
@@ -10,8 +8,6 @@ export interface TemplateResetPasswordProps {
 }
 
 export const TemplateResetPassword = ({ assetBaseUrl }: TemplateResetPasswordProps) => {
-  const NEXT_PUBLIC_WEBAPP_URL = env('NEXT_PUBLIC_WEBAPP_URL');
-
   return (
     <>
       <TemplateDocumentImage className="mt-6" assetBaseUrl={assetBaseUrl} />
@@ -28,7 +24,7 @@ export const TemplateResetPassword = ({ assetBaseUrl }: TemplateResetPasswordPro
         <Section className="mb-6 mt-8 text-center">
           <Button
             className="bg-documenso-500 inline-flex items-center justify-center rounded-lg px-6 py-3 text-center text-sm font-medium text-black no-underline"
-            href={`${NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000'}/signin`}
+            href={`${process.env.NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000'}/signin`}
           >
             Sign In
           </Button>

packages/lib/client-only/hooks/use-effect-once.ts

@@ -1,13 +0,0 @@
-import type { EffectCallback } from 'react';
-import { useEffect } from 'react';
-
-/**
- * Dangerously runs an effect "once" by ignoring the depedencies of a given effect.
- *
- * DANGER: The effect will run twice in concurrent react and development environments.
- */
-export const unsafe_useEffectOnce = (callback: EffectCallback) => {
-  // Intentionally avoiding exhaustive deps and rule of hooks here
-  // eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/rules-of-hooks
-  return useEffect(callback, []);
-};

packages/lib/constants/app.ts

@@ -1,19 +1,16 @@
-import { env } from 'next-runtime-env';
+export const IS_APP_MARKETING = process.env.NEXT_PUBLIC_PROJECT === 'marketing';
+export const IS_APP_WEB = process.env.NEXT_PUBLIC_PROJECT === 'web';
+export const IS_BILLING_ENABLED = process.env.NEXT_PUBLIC_FEATURE_BILLING_ENABLED === 'true';
 
 export const APP_DOCUMENT_UPLOAD_SIZE_LIMIT =
   Number(process.env.NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT) || 50;
 
-export const NEXT_PUBLIC_WEBAPP_URL = () => env('NEXT_PUBLIC_WEBAPP_URL');
-export const NEXT_PUBLIC_MARKETING_URL = () => env('NEXT_PUBLIC_MARKETING_URL');
+export const APP_FOLDER = IS_APP_MARKETING ? 'marketing' : 'web';
 
-export const IS_APP_MARKETING = process.env.NEXT_PUBLIC_PROJECT === 'marketing';
-export const IS_APP_WEB = process.env.NEXT_PUBLIC_PROJECT === 'web';
-export const IS_BILLING_ENABLED = () => env('NEXT_PUBLIC_FEATURE_BILLING_ENABLED') === 'true';
+export const APP_BASE_URL = IS_APP_WEB
+  ? process.env.NEXT_PUBLIC_WEBAPP_URL
+  : process.env.NEXT_PUBLIC_MARKETING_URL;
 
-export const APP_FOLDER = () => (IS_APP_MARKETING ? 'marketing' : 'web');
+export const WEBAPP_BASE_URL = process.env.NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000';
 
-export const APP_BASE_URL = () =>
-  IS_APP_WEB ? NEXT_PUBLIC_WEBAPP_URL() : NEXT_PUBLIC_MARKETING_URL();
-
-export const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL() ?? 'http://localhost:3000';
-export const MARKETING_BASE_URL = NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3001';
+export const MARKETING_BASE_URL = process.env.NEXT_PUBLIC_MARKETING_URL ?? 'http://localhost:3001';

packages/lib/constants/billing.ts

@@ -6,5 +6,6 @@ export enum STRIPE_CUSTOMER_TYPE {
 export enum STRIPE_PLAN_TYPE {
   TEAM = 'team',
   COMMUNITY = 'community',
-  ENTERPRISE = 'enterprise',
 }
+
+export const TEAM_BILLING_DOMAIN = 'billing.team.documenso.com';

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

@@ -0,0 +1,19 @@
+import { DOCUMENT_EMAIL_TYPE } from '../types/document-audit-logs';
+
+export const DOCUMENT_AUDIT_LOG_EMAIL_FORMAT = {
+  [DOCUMENT_EMAIL_TYPE.SIGNING_REQUEST]: {
+    description: 'Signing request',
+  },
+  [DOCUMENT_EMAIL_TYPE.VIEW_REQUEST]: {
+    description: 'Viewing request',
+  },
+  [DOCUMENT_EMAIL_TYPE.APPROVE_REQUEST]: {
+    description: 'Approval request',
+  },
+  [DOCUMENT_EMAIL_TYPE.CC]: {
+    description: 'CC',
+  },
+  [DOCUMENT_EMAIL_TYPE.DOCUMENT_COMPLETED]: {
+    description: 'Document completed',
+  },
+} satisfies Record<keyof typeof DOCUMENT_EMAIL_TYPE, unknown>;

packages/lib/constants/feature-flags.ts

@@ -1,10 +1,5 @@
-import { env } from 'next-runtime-env';
-
 import { APP_BASE_URL } from './app';
 
-const NEXT_PUBLIC_FEATURE_BILLING_ENABLED = () => env('NEXT_PUBLIC_FEATURE_BILLING_ENABLED');
-const NEXT_PUBLIC_POSTHOG_KEY = () => env('NEXT_PUBLIC_POSTHOG_KEY');
-
 /**
  * The flag name for global session recording feature flag.
  */
@@ -21,7 +16,8 @@ export const FEATURE_FLAG_POLL_INTERVAL = 30000;
  * Does not take any person or group properties into account.
  */
 export const LOCAL_FEATURE_FLAGS: Record<string, boolean> = {
-  app_billing: NEXT_PUBLIC_FEATURE_BILLING_ENABLED() === 'true',
+  app_billing: process.env.NEXT_PUBLIC_FEATURE_BILLING_ENABLED === 'true',
+  app_teams: true,
   marketing_header_single_player_mode: false,
 } as const;
 
@@ -29,8 +25,8 @@ export const LOCAL_FEATURE_FLAGS: Record<string, boolean> = {
  * Extract the PostHog configuration from the environment.
  */
 export function extractPostHogConfig(): { key: string; host: string } | null {
-  const postHogKey = NEXT_PUBLIC_POSTHOG_KEY();
-  const postHogHost = `${APP_BASE_URL()}/ingest`;
+  const postHogKey = process.env.NEXT_PUBLIC_POSTHOG_KEY;
+  const postHogHost = `${APP_BASE_URL}/ingest`;
 
   if (!postHogKey || !postHogHost) {
     return null;

packages/lib/constants/pdf.ts

@@ -6,4 +6,4 @@ export const DEFAULT_HANDWRITING_FONT_SIZE = 50;
 export const MIN_STANDARD_FONT_SIZE = 8;
 export const MIN_HANDWRITING_FONT_SIZE = 20;
 
-export const CAVEAT_FONT_PATH = () => `${APP_BASE_URL()}/fonts/caveat.ttf`;
+export const CAVEAT_FONT_PATH = `${APP_BASE_URL}/fonts/caveat.ttf`;

packages/lib/constants/recipient-roles.ts

@@ -1,29 +1,31 @@
 import { RecipientRole } from '@documenso/prisma/client';
 
-export const RECIPIENT_ROLES_DESCRIPTION: {
-  [key in RecipientRole]: { actionVerb: string; progressiveVerb: string; roleName: string };
-} = {
+export const RECIPIENT_ROLES_DESCRIPTION = {
   [RecipientRole.APPROVER]: {
     actionVerb: 'Approve',
+    actioned: 'Approved',
     progressiveVerb: 'Approving',
     roleName: 'Approver',
   },
   [RecipientRole.CC]: {
     actionVerb: 'CC',
+    actioned: 'CCed',
     progressiveVerb: 'CC',
-    roleName: 'CC',
+    roleName: 'Cc',
   },
   [RecipientRole.SIGNER]: {
     actionVerb: 'Sign',
+    actioned: 'Signed',
     progressiveVerb: 'Signing',
     roleName: 'Signer',
   },
   [RecipientRole.VIEWER]: {
     actionVerb: 'View',
+    actioned: 'Viewed',
     progressiveVerb: 'Viewing',
     roleName: 'Viewer',
   },
-};
+} satisfies Record<keyof typeof RecipientRole, unknown>;
 
 export const RECIPIENT_ROLE_TO_EMAIL_TYPE = {
   [RecipientRole.SIGNER]: 'SIGNING_REQUEST',

packages/lib/next-auth/auth-options.ts

@@ -7,16 +7,13 @@ import type { JWT } from 'next-auth/jwt';
 import CredentialsProvider from 'next-auth/providers/credentials';
 import type { GoogleProfile } from 'next-auth/providers/google';
 import GoogleProvider from 'next-auth/providers/google';
-import { env } from 'next-runtime-env';
 
 import { prisma } from '@documenso/prisma';
 import { IdentityProvider, UserSecurityAuditLogType } from '@documenso/prisma/client';
 
 import { isTwoFactorAuthenticationEnabled } from '../server-only/2fa/is-2fa-availble';
 import { validateTwoFactorAuthentication } from '../server-only/2fa/validate-2fa';
-import { getMostRecentVerificationTokenByUserId } from '../server-only/user/get-most-recent-verification-token-by-user-id';
 import { getUserByEmail } from '../server-only/user/get-user-by-email';
-import { sendConfirmationToken } from '../server-only/user/send-confirmation-token';
 import { extractNextAuthRequestMetadata } from '../universal/extract-request-metadata';
 import { ErrorCode } from './error-codes';
 
@@ -93,22 +90,6 @@ export const NEXT_AUTH_OPTIONS: AuthOptions = {
           }
         }
 
-        if (!user.emailVerified) {
-          const mostRecentToken = await getMostRecentVerificationTokenByUserId({
-            userId: user.id,
-          });
-
-          if (
-            !mostRecentToken ||
-            mostRecentToken.expires.valueOf() <= Date.now() ||
-            DateTime.fromJSDate(mostRecentToken.createdAt).diffNow('minutes').minutes > -5
-          ) {
-            await sendConfirmationToken({ email });
-          }
-
-          throw new Error(ErrorCode.UNVERIFIED_EMAIL);
-        }
-
         return {
           id: Number(user.id),
           email: user.email,
@@ -222,7 +203,7 @@ export const NEXT_AUTH_OPTIONS: AuthOptions = {
     async signIn({ user }) {
       // We do this to stop OAuth providers from creating an account
       // when signups are disabled
-      if (env('NEXT_PUBLIC_DISABLE_SIGNUP') === 'true') {
+      if (process.env.NEXT_PUBLIC_DISABLE_SIGNUP === 'true') {
         const userData = await getUserByEmail({ email: user.email! });
 
         return !!userData;

packages/lib/next-auth/error-codes.ts

@@ -19,5 +19,4 @@ export const ErrorCode = {
   INCORRECT_PASSWORD: 'INCORRECT_PASSWORD',
   MISSING_ENCRYPTION_KEY: 'MISSING_ENCRYPTION_KEY',
   MISSING_BACKUP_CODE: 'MISSING_BACKUP_CODE',
-  UNVERIFIED_EMAIL: 'UNVERIFIED_EMAIL',
 } as const;

packages/lib/server-only/2fa/setup-2fa.ts

@@ -43,7 +43,7 @@ export const setupTwoFactorAuthentication = async ({
 
   const secret = crypto.randomBytes(10);
 
-  const backupCodes = Array.from({ length: 10 })
+  const backupCodes = new Array(10)
     .fill(null)
     .map(() => crypto.randomBytes(5).toString('hex'))
     .map((code) => `${code.slice(0, 5)}-${code.slice(5)}`.toUpperCase());

packages/lib/server-only/auth/send-confirmation-email.ts

@@ -5,16 +5,11 @@ import { render } from '@documenso/email/render';
 import { ConfirmEmailTemplate } from '@documenso/email/templates/confirm-email';
 import { prisma } from '@documenso/prisma';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 export interface SendConfirmationEmailProps {
   userId: number;
 }
 
 export const sendConfirmationEmail = async ({ userId }: SendConfirmationEmailProps) => {
-  const NEXT_PRIVATE_SMTP_FROM_NAME = process.env.NEXT_PRIVATE_SMTP_FROM_NAME;
-  const NEXT_PRIVATE_SMTP_FROM_ADDRESS = process.env.NEXT_PRIVATE_SMTP_FROM_ADDRESS;
-
   const user = await prisma.user.findFirstOrThrow({
     where: {
       id: userId,
@@ -35,10 +30,10 @@ export const sendConfirmationEmail = async ({ userId }: SendConfirmationEmailPro
     throw new Error('Verification token not found for the user');
   }
 
-  const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
   const confirmationLink = `${assetBaseUrl}/verify-email/${verificationToken.token}`;
-  const senderName = NEXT_PRIVATE_SMTP_FROM_NAME || 'Documenso';
-  const senderAdress = NEXT_PRIVATE_SMTP_FROM_ADDRESS || 'noreply@documenso.com';
+  const senderName = process.env.NEXT_PRIVATE_SMTP_FROM_NAME || 'Documenso';
+  const senderAdress = process.env.NEXT_PRIVATE_SMTP_FROM_ADDRESS || 'noreply@documenso.com';
 
   const confirmationTemplate = createElement(ConfirmEmailTemplate, {
     assetBaseUrl,

packages/lib/server-only/auth/send-forgot-password.ts

@@ -5,8 +5,6 @@ import { render } from '@documenso/email/render';
 import { ForgotPasswordTemplate } from '@documenso/email/templates/forgot-password';
 import { prisma } from '@documenso/prisma';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 export interface SendForgotPasswordOptions {
   userId: number;
 }
@@ -31,8 +29,8 @@ export const sendForgotPassword = async ({ userId }: SendForgotPasswordOptions)
   }
 
   const token = user.PasswordResetToken[0].token;
-  const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
-  const resetPasswordLink = `${NEXT_PUBLIC_WEBAPP_URL()}/reset-password/${token}`;
+  const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
+  const resetPasswordLink = `${process.env.NEXT_PUBLIC_WEBAPP_URL}/reset-password/${token}`;
 
   const template = createElement(ForgotPasswordTemplate, {
     assetBaseUrl,

packages/lib/server-only/auth/send-reset-password.ts

@@ -5,8 +5,6 @@ import { render } from '@documenso/email/render';
 import { ResetPasswordTemplate } from '@documenso/email/templates/reset-password';
 import { prisma } from '@documenso/prisma';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 export interface SendResetPasswordOptions {
   userId: number;
 }
@@ -18,7 +16,7 @@ export const sendResetPassword = async ({ userId }: SendResetPasswordOptions) =>
     },
   });
 
-  const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
   const template = createElement(ResetPasswordTemplate, {
     assetBaseUrl,

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

@@ -89,17 +89,21 @@ export const upsertDocumentMeta = async ({
       },
     });
 
-    await tx.documentAuditLog.create({
-      data: createDocumentAuditLogData({
-        type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED,
-        documentId,
-        user,
-        requestMetadata,
-        data: {
-          changes: diffDocumentMetaChanges(originalDocumentMeta ?? {}, upsertedDocumentMeta),
-        },
-      }),
-    });
+    const changes = diffDocumentMetaChanges(originalDocumentMeta ?? {}, upsertedDocumentMeta);
+
+    if (changes.length > 0) {
+      await tx.documentAuditLog.create({
+        data: createDocumentAuditLogData({
+          type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_META_UPDATED,
+          documentId,
+          user,
+          requestMetadata,
+          data: {
+            changes: diffDocumentMetaChanges(originalDocumentMeta ?? {}, upsertedDocumentMeta),
+          },
+        }),
+      });
+    }
 
     return upsertedDocumentMeta;
   });

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

@@ -8,29 +8,73 @@ import DocumentCancelTemplate from '@documenso/email/templates/document-cancel';
 import { prisma } from '@documenso/prisma';
 import { DocumentStatus } from '@documenso/prisma/client';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
 import { FROM_ADDRESS, FROM_NAME } from '../../constants/email';
+import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
+import type { RequestMetadata } from '../../universal/extract-request-metadata';
+import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
 
 export type DeleteDocumentOptions = {
   id: number;
   userId: number;
   status: DocumentStatus;
+  requestMetadata?: RequestMetadata;
 };
 
-export const deleteDocument = async ({ id, userId, status }: DeleteDocumentOptions) => {
+export const deleteDocument = async ({
+  id,
+  userId,
+  status,
+  requestMetadata,
+}: DeleteDocumentOptions) => {
+  await prisma.document.findFirstOrThrow({
+    where: {
+      id,
+      OR: [
+        {
+          userId,
+        },
+        {
+          team: {
+            members: {
+              some: {
+                userId,
+              },
+            },
+          },
+        },
+      ],
+    },
+  });
+
+  const user = await prisma.user.findFirstOrThrow({
+    where: {
+      id: userId,
+    },
+  });
+
   // if the document is a draft, hard-delete
   if (status === DocumentStatus.DRAFT) {
-    return await prisma.document.delete({ where: { id, userId, status: DocumentStatus.DRAFT } });
+    return await prisma.$transaction(async (tx) => {
+      // Currently redundant since deleting a document will delete the audit logs.
+      // However may be useful if we disassociate audit lgos and documents if required.
+      await tx.documentAuditLog.create({
+        data: createDocumentAuditLogData({
+          documentId: id,
+          type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_DELETED,
+          user,
+          requestMetadata,
+          data: {
+            type: 'HARD',
+          },
+        }),
+      });
+
+      return await tx.document.delete({ where: { id, status: DocumentStatus.DRAFT } });
+    });
   }
 
   // if the document is pending, send cancellation emails to all recipients
   if (status === DocumentStatus.PENDING) {
-    const user = await prisma.user.findFirstOrThrow({
-      where: {
-        id: userId,
-      },
-    });
-
     const document = await prisma.document.findUnique({
       where: {
         id,
@@ -50,7 +94,7 @@ export const deleteDocument = async ({ id, userId, status }: DeleteDocumentOptio
     if (document.Recipient.length > 0) {
       await Promise.all(
         document.Recipient.map(async (recipient) => {
-          const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+          const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
           const template = createElement(DocumentCancelTemplate, {
             documentName: document.title,
@@ -78,12 +122,26 @@ export const deleteDocument = async ({ id, userId, status }: DeleteDocumentOptio
   }
 
   // If the document is not a draft, only soft-delete.
-  return await prisma.document.update({
-    where: {
-      id,
-    },
-    data: {
-      deletedAt: new Date().toISOString(),
-    },
+  return await prisma.$transaction(async (tx) => {
+    await tx.documentAuditLog.create({
+      data: createDocumentAuditLogData({
+        documentId: id,
+        type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_DELETED,
+        user,
+        requestMetadata,
+        data: {
+          type: 'SOFT',
+        },
+      }),
+    });
+
+    return await tx.document.update({
+      where: {
+        id,
+      },
+      data: {
+        deletedAt: new Date().toISOString(),
+      },
+    });
   });
 };

packages/lib/server-only/document/find-document-audit-logs.ts

@@ -0,0 +1,115 @@
+import type { FindResultSet } from '@documenso/lib/types/find-result-set';
+import { prisma } from '@documenso/prisma';
+import type { DocumentAuditLog } from '@documenso/prisma/client';
+import type { Prisma } from '@documenso/prisma/client';
+
+import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
+import { parseDocumentAuditLogData } from '../../utils/document-audit-logs';
+
+export interface FindDocumentAuditLogsOptions {
+  userId: number;
+  documentId: number;
+  page?: number;
+  perPage?: number;
+  orderBy?: {
+    column: keyof DocumentAuditLog;
+    direction: 'asc' | 'desc';
+  };
+  cursor?: string;
+  filterForRecentActivity?: boolean;
+}
+
+export const findDocumentAuditLogs = async ({
+  userId,
+  documentId,
+  page = 1,
+  perPage = 30,
+  orderBy,
+  cursor,
+  filterForRecentActivity,
+}: FindDocumentAuditLogsOptions) => {
+  const orderByColumn = orderBy?.column ?? 'createdAt';
+  const orderByDirection = orderBy?.direction ?? 'desc';
+
+  await prisma.document.findFirstOrThrow({
+    where: {
+      id: documentId,
+      OR: [
+        {
+          userId,
+        },
+        {
+          team: {
+            members: {
+              some: {
+                userId,
+              },
+            },
+          },
+        },
+      ],
+    },
+  });
+
+  const whereClause: Prisma.DocumentAuditLogWhereInput = {
+    documentId,
+  };
+
+  // Filter events down to what we consider recent activity.
+  if (filterForRecentActivity) {
+    whereClause.OR = [
+      {
+        type: {
+          in: [
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_COMPLETED,
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_CREATED,
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_DELETED,
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_OPENED,
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED,
+            DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_SENT,
+          ],
+        },
+      },
+      {
+        type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
+        data: {
+          path: ['isResending'],
+          equals: true,
+        },
+      },
+    ];
+  }
+
+  const [data, count] = await Promise.all([
+    prisma.documentAuditLog.findMany({
+      where: whereClause,
+      skip: Math.max(page - 1, 0) * perPage,
+      take: perPage + 1,
+      orderBy: {
+        [orderByColumn]: orderByDirection,
+      },
+      cursor: cursor ? { id: cursor } : undefined,
+    }),
+    prisma.documentAuditLog.count({
+      where: whereClause,
+    }),
+  ]);
+
+  let nextCursor: string | undefined = undefined;
+
+  const parsedData = data.map((auditLog) => parseDocumentAuditLogData(auditLog));
+
+  if (parsedData.length > perPage) {
+    const nextItem = parsedData.pop();
+    nextCursor = nextItem!.id;
+  }
+
+  return {
+    data: parsedData,
+    count,
+    currentPage: Math.max(page, 1),
+    perPage,
+    totalPages: Math.ceil(count / perPage),
+    nextCursor,
+  } satisfies FindResultSet<typeof parsedData> & { nextCursor?: string };
+};

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

@@ -21,6 +21,19 @@ export const getDocumentById = async ({ id, userId, teamId }: GetDocumentByIdOpt
     include: {
       documentData: true,
       documentMeta: true,
+      User: {
+        select: {
+          id: true,
+          name: true,
+          email: true,
+        },
+      },
+      team: {
+        select: {
+          id: true,
+          url: true,
+        },
+      },
     },
   });
 };

packages/lib/server-only/document/resend-document.tsx

@@ -18,8 +18,6 @@ import type { Prisma } from '@documenso/prisma/client';
 
 import { getDocumentWhereInput } from './get-document-by-id';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 export type ResendDocumentOptions = {
   documentId: number;
   userId: number;
@@ -96,8 +94,8 @@ export const resendDocument = async ({
         'document.name': document.title,
       };
 
-      const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
-      const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
+      const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
+      const signDocumentLink = `${process.env.NEXT_PUBLIC_WEBAPP_URL}/sign/${recipient.token}`;
 
       const template = createElement(DocumentInviteEmailTemplate, {
         documentName: document.title,

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

@@ -5,7 +5,6 @@ import { render } from '@documenso/email/render';
 import { DocumentCompletedEmailTemplate } from '@documenso/email/templates/document-completed';
 import { prisma } from '@documenso/prisma';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '../../types/document-audit-logs';
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
 import { getFile } from '../../universal/upload/get-file';
@@ -41,12 +40,12 @@ export const sendCompletedEmail = async ({ documentId, requestMetadata }: SendDo
     document.Recipient.map(async (recipient) => {
       const { email, name, token } = recipient;
 
-      const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+      const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
       const template = createElement(DocumentCompletedEmailTemplate, {
         documentName: document.title,
         assetBaseUrl,
-        downloadLink: `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${token}/complete`,
+        downloadLink: `${process.env.NEXT_PUBLIC_WEBAPP_URL}/sign/${token}/complete`,
       });
 
       await prisma.$transaction(async (tx) => {

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

@@ -4,6 +4,10 @@ import { mailer } from '@documenso/email/mailer';
 import { render } from '@documenso/email/render';
 import { DocumentInviteEmailTemplate } from '@documenso/email/templates/document-invite';
 import { FROM_ADDRESS, FROM_NAME } from '@documenso/lib/constants/email';
+import {
+  RECIPIENT_ROLES_DESCRIPTION,
+  RECIPIENT_ROLE_TO_EMAIL_TYPE,
+} from '@documenso/lib/constants/recipient-roles';
 import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-logs';
 import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
@@ -11,12 +15,6 @@ import { renderCustomEmailTemplate } from '@documenso/lib/utils/render-custom-em
 import { prisma } from '@documenso/prisma';
 import { DocumentStatus, RecipientRole, SendStatus } from '@documenso/prisma/client';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-import {
-  RECIPIENT_ROLES_DESCRIPTION,
-  RECIPIENT_ROLE_TO_EMAIL_TYPE,
-} from '../../constants/recipient-roles';
-
 export type SendDocumentOptions = {
   documentId: number;
   userId: number;
@@ -93,8 +91,8 @@ export const sendDocument = async ({
         'document.name': document.title,
       };
 
-      const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
-      const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
+      const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
+      const signDocumentLink = `${process.env.NEXT_PUBLIC_WEBAPP_URL}/sign/${recipient.token}`;
 
       const template = createElement(DocumentInviteEmailTemplate, {
         documentName: document.title,
@@ -154,13 +152,27 @@ export const sendDocument = async ({
     }),
   );
 
-  const updatedDocument = await prisma.document.update({
-    where: {
-      id: documentId,
-    },
-    data: {
-      status: DocumentStatus.PENDING,
-    },
+  const updatedDocument = await prisma.$transaction(async (tx) => {
+    if (document.status === DocumentStatus.DRAFT) {
+      await tx.documentAuditLog.create({
+        data: createDocumentAuditLogData({
+          type: DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_SENT,
+          documentId: document.id,
+          requestMetadata,
+          user,
+          data: {},
+        }),
+      });
+    }
+
+    return await tx.document.update({
+      where: {
+        id: documentId,
+      },
+      data: {
+        status: DocumentStatus.PENDING,
+      },
+    });
   });
 
   return updatedDocument;

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

@@ -5,8 +5,6 @@ import { render } from '@documenso/email/render';
 import { DocumentPendingEmailTemplate } from '@documenso/email/templates/document-pending';
 import { prisma } from '@documenso/prisma';
 
-import { NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 export interface SendPendingEmailOptions {
   documentId: number;
   recipientId: number;
@@ -43,7 +41,7 @@ export const sendPendingEmail = async ({ documentId, recipientId }: SendPendingE
 
   const { email, name } = recipient;
 
-  const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  const assetBaseUrl = process.env.NEXT_PUBLIC_WEBAPP_URL || 'http://localhost:3000';
 
   const template = createElement(DocumentPendingEmailTemplate, {
     documentName: document.title,

packages/lib/server-only/feature-flags/all.ts

@@ -5,7 +5,6 @@ import { getToken } from 'next-auth/jwt';
 import { LOCAL_FEATURE_FLAGS } from '@documenso/lib/constants/feature-flags';
 import PostHogServerClient from '@documenso/lib/server-only/feature-flags/get-post-hog-server-client';
 
-import { NEXT_PUBLIC_MARKETING_URL, NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
 import { extractDistinctUserId, mapJwtToFlagProperties } from './get';
 
 /**
@@ -39,11 +38,11 @@ export default async function handlerFeatureFlagAll(req: Request) {
   const origin = req.headers.get('origin');
 
   if (origin) {
-    if (origin.startsWith(NEXT_PUBLIC_WEBAPP_URL() ?? 'http://localhost:3000')) {
+    if (origin.startsWith(process.env.NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }
 
-    if (origin.startsWith(NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3001')) {
+    if (origin.startsWith(process.env.NEXT_PUBLIC_MARKETING_URL ?? 'http://localhost:3001')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }
   }

packages/lib/server-only/feature-flags/get.ts

@@ -1,14 +1,11 @@
 import { NextRequest, NextResponse } from 'next/server';
 
 import { nanoid } from 'nanoid';
-import type { JWT } from 'next-auth/jwt';
-import { getToken } from 'next-auth/jwt';
+import { JWT, getToken } from 'next-auth/jwt';
 
 import { LOCAL_FEATURE_FLAGS, extractPostHogConfig } from '@documenso/lib/constants/feature-flags';
 import PostHogServerClient from '@documenso/lib/server-only/feature-flags/get-post-hog-server-client';
 
-import { NEXT_PUBLIC_MARKETING_URL, NEXT_PUBLIC_WEBAPP_URL } from '../../constants/app';
-
 /**
  * Evaluate a single feature flag based on the current user if possible.
  *
@@ -60,11 +57,11 @@ export default async function handleFeatureFlagGet(req: Request) {
   const origin = req.headers.get('Origin');
 
   if (origin) {
-    if (origin.startsWith(NEXT_PUBLIC_WEBAPP_URL() ?? 'http://localhost:3000')) {
+    if (origin.startsWith(process.env.NEXT_PUBLIC_WEBAPP_URL ?? 'http://localhost:3000')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }
 
-    if (origin.startsWith(NEXT_PUBLIC_MARKETING_URL() ?? 'http://localhost:3001')) {
+    if (origin.startsWith(process.env.NEXT_PUBLIC_MARKETING_URL ?? 'http://localhost:3001')) {
       res.headers.set('Access-Control-Allow-Origin', origin);
     }
   }

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

@@ -20,7 +20,6 @@ export interface SetFieldsForDocumentOptions {
     pageY: number;
     pageWidth: number;
     pageHeight: number;
-    label: string;
   }[];
   requestMetadata?: RequestMetadata;
 }

packages/lib/server-only/pdf/insert-text-in-pdf.ts

@@ -12,7 +12,7 @@ export async function insertTextInPDF(
   useHandwritingFont = true,
 ): Promise<string> {
   // Fetch the font file from the public URL.
-  const fontResponse = await fetch(CAVEAT_FONT_PATH());
+  const fontResponse = await fetch(CAVEAT_FONT_PATH);
   const fontCaveat = await fontResponse.arrayBuffer();
 
   const pdfDoc = await PDFDocument.load(pdfAsBase64);

packages/lib/server-only/team/accept-team-invitation.ts

@@ -46,7 +46,7 @@ export const acceptTeamInvitation = async ({ userId, teamId }: AcceptTeamInvitat
       },
     });
 
-    if (IS_BILLING_ENABLED() && team.subscription) {
+    if (IS_BILLING_ENABLED && team.subscription) {
       const numberOfSeats = await tx.teamMember.count({
         where: {
           teamId: teamMemberInvite.teamId,