extend webhook triggers

.devcontainer/devcontainer.json

@@ -10,13 +10,7 @@
     "ghcr.io/devcontainers/features/node:1": {}
   },
   "onCreateCommand": "./.devcontainer/on-create.sh",
-  "forwardPorts": [
-    3000,
-    54320,
-    9000,
-    2500,
-    1100
-  ],
+  "forwardPorts": [3000, 54320, 9000, 2500, 1100],
   "customizations": {
     "vscode": {
       "extensions": [
@@ -31,8 +25,8 @@
         "GitHub.copilot",
         "GitHub.vscode-pull-request-github",
         "Prisma.prisma",
-        "VisualStudioExptTeam.vscodeintellicode"
+        "VisualStudioExptTeam.vscodeintellicode",
       ]
     }
   }
-}
+}

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

@@ -256,7 +256,6 @@ export const SinglePlayerClient = () => {
                 fields={fields}
                 onSubmit={onSignSubmit}
                 requireName={Boolean(fields.find((field) => field.type === 'NAME'))}
-                requireCustomText={Boolean(fields.find((field) => field.type === 'TEXT'))}
                 requireSignature={Boolean(fields.find((field) => field.type === 'SIGNATURE'))}
               />
             </Stepper>

apps/marketing/src/app/layout.tsx

@@ -2,8 +2,6 @@ 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 { NEXT_PUBLIC_MARKETING_URL } from '@documenso/lib/constants/app';
 import { getAllAnonymousFlags } from '@documenso/lib/universal/get-feature-flag';
@@ -64,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/marketing/src/components/(marketing)/pricing-table.tsx

@@ -114,9 +114,7 @@ export const PricingTable = ({ className, ...props }: PricingTableProps) => {
           </p>
 
           <Button className="mt-6 rounded-full text-base" asChild>
-            <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`} target="_blank">
-              Signup Now
-            </Link>
+            <Link href={`${NEXT_PUBLIC_WEBAPP_URL()}/signup`}>Signup Now</Link>
           </Button>
 
           <div className="mt-8 flex w-full flex-col divide-y">

apps/web/package.json

@@ -43,7 +43,6 @@
     "react-hotkeys-hook": "^4.4.1",
     "react-icons": "^4.11.0",
     "react-rnd": "^10.4.1",
-    "remeda": "^1.27.1",
     "sharp": "0.33.1",
     "ts-pattern": "^5.0.5",
     "typescript": "5.2.2",

apps/web/src/app/(dashboard)/admin/nav.tsx

@@ -1,11 +1,11 @@
 'use client';
 
-import type { HTMLAttributes } from 'react';
+import { HTMLAttributes } from 'react';
 
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 
-import { BarChart3, FileStack, Settings, User2, Wallet2 } from 'lucide-react';
+import { BarChart3, FileStack, User2, Wallet2 } from 'lucide-react';
 
 import { cn } from '@documenso/ui/lib/utils';
 import { Button } from '@documenso/ui/primitives/button';
@@ -78,20 +78,6 @@ export const AdminNav = ({ className, ...props }: AdminNavProps) => {
           Subscriptions
         </Link>
       </Button>
-
-      <Button
-        variant="ghost"
-        className={cn(
-          'justify-start md:w-full',
-          pathname?.startsWith('/admin/banner') && 'bg-secondary',
-        )}
-        asChild
-      >
-        <Link href="/admin/site-settings">
-          <Settings className="mr-2 h-5 w-5" />
-          Site Settings
-        </Link>
-      </Button>
     </div>
   );
 };

apps/web/src/app/(dashboard)/admin/site-settings/banner-form.tsx

@@ -1,200 +0,0 @@
-'use client';
-
-import { useRouter } from 'next/navigation';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { useForm } from 'react-hook-form';
-import type { z } from 'zod';
-
-import type { TSiteSettingsBannerSchema } from '@documenso/lib/server-only/site-settings/schemas/banner';
-import {
-  SITE_SETTINGS_BANNER_ID,
-  ZSiteSettingsBannerSchema,
-} from '@documenso/lib/server-only/site-settings/schemas/banner';
-import { TRPCClientError } from '@documenso/trpc/client';
-import { trpc as trpcReact } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { ColorPicker } from '@documenso/ui/primitives/color-picker';
-import {
-  Form,
-  FormControl,
-  FormDescription,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from '@documenso/ui/primitives/form/form';
-import { Switch } from '@documenso/ui/primitives/switch';
-import { Textarea } from '@documenso/ui/primitives/textarea';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-const ZBannerFormSchema = ZSiteSettingsBannerSchema;
-
-type TBannerFormSchema = z.infer<typeof ZBannerFormSchema>;
-
-export type BannerFormProps = {
-  banner?: TSiteSettingsBannerSchema;
-};
-
-export function BannerForm({ banner }: BannerFormProps) {
-  const router = useRouter();
-  const { toast } = useToast();
-
-  const form = useForm<TBannerFormSchema>({
-    resolver: zodResolver(ZBannerFormSchema),
-    defaultValues: {
-      id: SITE_SETTINGS_BANNER_ID,
-      enabled: banner?.enabled ?? false,
-      data: {
-        content: banner?.data?.content ?? '',
-        bgColor: banner?.data?.bgColor ?? '#000000',
-        textColor: banner?.data?.textColor ?? '#FFFFFF',
-      },
-    },
-  });
-
-  const enabled = form.watch('enabled');
-
-  const { mutateAsync: updateSiteSetting, isLoading: isUpdateSiteSettingLoading } =
-    trpcReact.admin.updateSiteSetting.useMutation();
-
-  const onBannerUpdate = async ({ id, enabled, data }: TBannerFormSchema) => {
-    try {
-      await updateSiteSetting({
-        id,
-        enabled,
-        data,
-      });
-
-      toast({
-        title: 'Banner Updated',
-        description: 'Your banner has been updated successfully.',
-        duration: 5000,
-      });
-
-      router.refresh();
-    } catch (err) {
-      if (err instanceof TRPCClientError && err.data?.code === 'BAD_REQUEST') {
-        toast({
-          title: 'An error occurred',
-          description: err.message,
-          variant: 'destructive',
-        });
-      } else {
-        toast({
-          title: 'An unknown error occurred',
-          variant: 'destructive',
-          description:
-            'We encountered an unknown error while attempting to update the banner. Please try again later.',
-        });
-      }
-    }
-  };
-
-  return (
-    <div>
-      <h2 className="font-semibold">Site Banner</h2>
-      <p className="text-muted-foreground mt-2 text-sm">
-        The site banner is a message that is shown at the top of the site. It can be used to display
-        important information to your users.
-      </p>
-
-      <Form {...form}>
-        <form
-          className="mt-4 flex flex-col rounded-md"
-          onSubmit={form.handleSubmit(onBannerUpdate)}
-        >
-          <div className="mt-4 flex flex-col gap-4 md:flex-row">
-            <FormField
-              control={form.control}
-              name="enabled"
-              render={({ field }) => (
-                <FormItem className="flex-1">
-                  <FormLabel>Enabled</FormLabel>
-
-                  <FormControl>
-                    <div>
-                      <Switch checked={field.value} onCheckedChange={field.onChange} />
-                    </div>
-                  </FormControl>
-                </FormItem>
-              )}
-            />
-
-            <fieldset
-              className="flex flex-col gap-4 md:flex-row"
-              disabled={!enabled}
-              aria-disabled={!enabled}
-            >
-              <FormField
-                control={form.control}
-                name="data.bgColor"
-                render={({ field }) => (
-                  <FormItem>
-                    <FormLabel>Background Color</FormLabel>
-
-                    <FormControl>
-                      <div>
-                        <ColorPicker {...field} />
-                      </div>
-                    </FormControl>
-
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-
-              <FormField
-                control={form.control}
-                name="data.textColor"
-                render={({ field }) => (
-                  <FormItem>
-                    <FormLabel>Text Color</FormLabel>
-
-                    <FormControl>
-                      <div>
-                        <ColorPicker {...field} />
-                      </div>
-                    </FormControl>
-
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-            </fieldset>
-          </div>
-
-          <fieldset disabled={!enabled} aria-disabled={!enabled}>
-            <FormField
-              control={form.control}
-              name="data.content"
-              render={({ field }) => (
-                <FormItem>
-                  <FormLabel>Content</FormLabel>
-
-                  <FormControl>
-                    <Textarea className="h-32 resize-none" {...field} />
-                  </FormControl>
-
-                  <FormDescription>
-                    The content to show in the banner, HTML is allowed
-                  </FormDescription>
-
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-          </fieldset>
-
-          <Button
-            type="submit"
-            loading={isUpdateSiteSettingLoading}
-            className="mt-4 justify-end self-end"
-          >
-            Update Banner
-          </Button>
-        </form>
-      </Form>
-    </div>
-  );
-}

apps/web/src/app/(dashboard)/admin/site-settings/page.tsx

@@ -1,24 +0,0 @@
-import { getSiteSettings } from '@documenso/lib/server-only/site-settings/get-site-settings';
-import { SITE_SETTINGS_BANNER_ID } from '@documenso/lib/server-only/site-settings/schemas/banner';
-
-import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
-
-import { BannerForm } from './banner-form';
-
-// import { BannerForm } from './banner-form';
-
-export default async function AdminBannerPage() {
-  const banner = await getSiteSettings().then((settings) =>
-    settings.find((setting) => setting.id === SITE_SETTINGS_BANNER_ID),
-  );
-
-  return (
-    <div>
-      <SettingsHeader title="Site Settings" subtitle="Manage your site settings here" />
-
-      <div className="mt-8">
-        <BannerForm banner={banner} />
-      </div>
-    </div>
-  );
-}

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

@@ -1,110 +0,0 @@
-'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

@@ -1,160 +0,0 @@
-'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

@@ -1,72 +0,0 @@
-'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

@@ -1,153 +0,0 @@
-'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',
-      },
-      perPage: 10,
-    },
-    {
-      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="bg-border w-px" />
-                </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.length === 0 && (
-              <div className="flex items-center justify-center py-4">
-                <p className="text-muted-foreground/70 text-sm">No recent activity</p>
-              </div>
-            )}
-
-            {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

@@ -1,115 +0,0 @@
-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,34 +1,22 @@
 import Link from 'next/link';
 import { redirect } from 'next/navigation';
 
-import { ChevronLeft, Clock9, Users2 } from 'lucide-react';
-import { match } from 'ts-pattern';
+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 { getServerComponentFlag } from '@documenso/lib/server-only/feature-flags/get-server-component-feature-flag';
+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 { Button } from '@documenso/ui/primitives/button';
-import { Card, CardContent } from '@documenso/ui/primitives/card';
+import { DocumentStatus as InternalDocumentStatus } from '@documenso/prisma/client';
 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 { 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';
+import { DocumentStatus } from '~/components/formatter/document-status';
 
 export type DocumentPageViewProps = {
   params: {
@@ -56,10 +44,6 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
     teamId: team?.id,
   }).catch(() => null);
 
-  const isDocumentHistoryEnabled = await getServerComponentFlag(
-    'app_document_page_view_history_sheet',
-  );
-
   if (!document || !document.documentData) {
     redirect(documentRootPath);
   }
@@ -83,16 +67,16 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
     documentMeta.password = securePassword;
   }
 
-  const recipients = await getRecipientsForDocument({
-    documentId,
-    teamId: team?.id,
-    userId: user.id,
-  });
-
-  const documentWithRecipients = {
-    ...document,
-    Recipient: recipients,
-  };
+  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">
@@ -101,105 +85,47 @@ export const DocumentPageView = async ({ params, team }: DocumentPageViewProps)
         Documents
       </Link>
 
-      <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>
+      <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">
-            <DocumentStatusComponent
-              inheritColor
-              status={document.status}
-              className="text-muted-foreground"
-            />
+      <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" />
+        {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>
-        </div>
-
-        {isDocumentHistoryEnabled && (
-          <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>
+            <StackAvatarsWithTooltip recipients={recipients} position="bottom">
+              <span>{recipients.length} Recipient(s)</span>
+            </StackAvatarsWithTooltip>
           </div>
         )}
       </div>
 
-      <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 && (
+        <EditDocumentForm
+          className="mt-8"
+          document={document}
+          user={user}
+          documentMeta={documentMeta}
+          recipients={recipients}
+          fields={fields}
+          documentData={documentData}
+          documentRootPath={documentRootPath}
+        />
+      )}
 
-        <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>
+      {document.status === InternalDocumentStatus.COMPLETED && (
+        <div className="mx-auto mt-12 max-w-2xl">
+          <LazyPDFViewer
+            document={document}
+            key={documentData.id}
+            documentMeta={documentMeta}
+            documentData={documentData}
+          />
         </div>
-      </div>
+      )}
     </div>
   );
 };

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

@@ -2,16 +2,10 @@
 
 import { useState } from 'react';
 
-import { useRouter, useSearchParams } from 'next/navigation';
+import { useRouter } from 'next/navigation';
 
-import {
-  type DocumentData,
-  type DocumentMeta,
-  DocumentStatus,
-  type Field,
-  type Recipient,
-  type User,
-} from '@documenso/prisma/client';
+import type { DocumentData, DocumentMeta, Field, Recipient, User } from '@documenso/prisma/client';
+import { DocumentStatus } from '@documenso/prisma/client';
 import type { DocumentWithData } from '@documenso/prisma/types/document-with-data';
 import { trpc } from '@documenso/trpc/react';
 import { cn } from '@documenso/ui/lib/utils';
@@ -30,8 +24,6 @@ import { LazyPDFViewer } from '@documenso/ui/primitives/lazy-pdf-viewer';
 import { Stepper } from '@documenso/ui/primitives/stepper';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-import { useOptionalCurrentTeam } from '~/providers/team';
-
 export type EditDocumentFormProps = {
   className?: string;
   user: User;
@@ -57,10 +49,12 @@ export const EditDocumentForm = ({
   documentRootPath,
 }: EditDocumentFormProps) => {
   const { toast } = useToast();
-
   const router = useRouter();
-  const searchParams = useSearchParams();
-  const team = useOptionalCurrentTeam();
+
+  // controlled stepper state
+  const [step, setStep] = useState<EditDocumentStep>(
+    document.status === DocumentStatus.DRAFT ? 'title' : 'signers',
+  );
 
   const { mutateAsync: addTitle } = trpc.document.setTitleForDocument.useMutation();
   const { mutateAsync: addFields } = trpc.field.addFields.useMutation();
@@ -92,30 +86,11 @@ 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
       await addTitle({
         documentId: document.id,
-        teamId: team?.id,
         title: data.title,
       });
 
@@ -138,7 +113,6 @@ export const EditDocumentForm = ({
       // Custom invocation server action
       await addSigners({
         documentId: document.id,
-        teamId: team?.id,
         signers: data.signers,
       });
 
@@ -182,7 +156,6 @@ export const EditDocumentForm = ({
     try {
       await sendDocument({
         documentId: document.id,
-        teamId: team?.id,
         meta: {
           subject,
           message,

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

@@ -1,122 +0,0 @@
-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,
-      teamId: team?.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

@@ -1,11 +0,0 @@
-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/[id]/logs/document-logs-data-table.tsx

@@ -1,165 +0,0 @@
-'use client';
-
-import { useSearchParams } from 'next/navigation';
-
-import { DateTime } from 'luxon';
-import type { DateTimeFormatOptions } from 'luxon';
-import { UAParser } from 'ua-parser-js';
-
-import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
-import { ZBaseTableSearchParamsSchema } from '@documenso/lib/types/search-params';
-import { formatDocumentAuditLogAction } from '@documenso/lib/utils/document-audit-logs';
-import { trpc } from '@documenso/trpc/react';
-import { DataTable } from '@documenso/ui/primitives/data-table';
-import { DataTablePagination } from '@documenso/ui/primitives/data-table-pagination';
-import { Skeleton } from '@documenso/ui/primitives/skeleton';
-import { TableCell } from '@documenso/ui/primitives/table';
-
-import { LocaleDate } from '~/components/formatter/locale-date';
-
-export type DocumentLogsDataTableProps = {
-  documentId: number;
-};
-
-const dateFormat: DateTimeFormatOptions = {
-  ...DateTime.DATETIME_SHORT,
-  hourCycle: 'h12',
-};
-
-export const DocumentLogsDataTable = ({ documentId }: DocumentLogsDataTableProps) => {
-  const parser = new UAParser();
-
-  const searchParams = useSearchParams();
-  const updateSearchParams = useUpdateSearchParams();
-
-  const parsedSearchParams = ZBaseTableSearchParamsSchema.parse(
-    Object.fromEntries(searchParams ?? []),
-  );
-
-  const { data, isLoading, isInitialLoading, isLoadingError } =
-    trpc.document.findDocumentAuditLogs.useQuery(
-      {
-        documentId,
-        page: parsedSearchParams.page,
-        perPage: parsedSearchParams.perPage,
-      },
-      {
-        keepPreviousData: true,
-      },
-    );
-
-  const onPaginationChange = (page: number, perPage: number) => {
-    updateSearchParams({
-      page,
-      perPage,
-    });
-  };
-
-  const uppercaseFistLetter = (text: string) => {
-    return text.charAt(0).toUpperCase() + text.slice(1);
-  };
-
-  const results = data ?? {
-    data: [],
-    perPage: 10,
-    currentPage: 1,
-    totalPages: 1,
-  };
-
-  return (
-    <DataTable
-      columns={[
-        {
-          header: 'Time',
-          accessorKey: 'createdAt',
-          cell: ({ row }) => <LocaleDate format={dateFormat} date={row.original.createdAt} />,
-        },
-        {
-          header: 'User',
-          accessorKey: 'name',
-          cell: ({ row }) =>
-            row.original.name || row.original.email ? (
-              <div>
-                {row.original.name && (
-                  <p className="truncate" title={row.original.name}>
-                    {row.original.name}
-                  </p>
-                )}
-
-                {row.original.email && (
-                  <p className="truncate" title={row.original.email}>
-                    {row.original.email}
-                  </p>
-                )}
-              </div>
-            ) : (
-              <p>N/A</p>
-            ),
-        },
-        {
-          header: 'Action',
-          accessorKey: 'type',
-          cell: ({ row }) => (
-            <span>
-              {uppercaseFistLetter(formatDocumentAuditLogAction(row.original).description)}
-            </span>
-          ),
-        },
-        {
-          header: 'IP Address',
-          accessorKey: 'ipAddress',
-        },
-        {
-          header: 'Browser',
-          cell: ({ row }) => {
-            if (!row.original.userAgent) {
-              return 'N/A';
-            }
-
-            parser.setUA(row.original.userAgent);
-
-            const result = parser.getResult();
-
-            return result.browser.name ?? 'N/A';
-          },
-        },
-      ]}
-      data={results.data}
-      perPage={results.perPage}
-      currentPage={results.currentPage}
-      totalPages={results.totalPages}
-      onPaginationChange={onPaginationChange}
-      error={{
-        enable: isLoadingError,
-      }}
-      skeleton={{
-        enable: isLoading && isInitialLoading,
-        rows: 3,
-        component: (
-          <>
-            <TableCell>
-              <Skeleton className="h-4 w-12 rounded-full" />
-            </TableCell>
-            <TableCell className="w-1/2 py-4 pr-4">
-              <div className="ml-2 flex flex-grow flex-col">
-                <Skeleton className="h-4 w-1/3 max-w-[8rem]" />
-                <Skeleton className="mt-1 h-4 w-1/2 max-w-[12rem]" />
-              </div>
-            </TableCell>
-            <TableCell>
-              <Skeleton className="h-4 w-12 rounded-full" />
-            </TableCell>
-            <TableCell>
-              <Skeleton className="h-4 w-10 rounded-full" />
-            </TableCell>
-            <TableCell>
-              <Skeleton className="h-4 w-10 rounded-full" />
-            </TableCell>
-          </>
-        ),
-      }}
-    >
-      {(table) => <DataTablePagination additionalInformation="VisibleCount" table={table} />}
-    </DataTable>
-  );
-};

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

@@ -1,151 +0,0 @@
-import Link from 'next/link';
-import { redirect } from 'next/navigation';
-
-import { ChevronLeft, DownloadIcon } from 'lucide-react';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { getDocumentById } from '@documenso/lib/server-only/document/get-document-by-id';
-import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/get-recipients-for-document';
-import { formatDocumentsPath } from '@documenso/lib/utils/teams';
-import type { Recipient, Team } from '@documenso/prisma/client';
-import { Button } from '@documenso/ui/primitives/button';
-import { Card } from '@documenso/ui/primitives/card';
-
-import { FRIENDLY_STATUS_MAP } from '~/components/formatter/document-status';
-
-import { DocumentLogsDataTable } from './document-logs-data-table';
-
-export type DocumentLogsPageViewProps = {
-  params: {
-    id: string;
-  };
-  team?: Team;
-};
-
-export const DocumentLogsPageView = async ({ params, team }: DocumentLogsPageViewProps) => {
-  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, recipients] = await Promise.all([
-    getDocumentById({
-      id: documentId,
-      userId: user.id,
-      teamId: team?.id,
-    }).catch(() => null),
-    getRecipientsForDocument({
-      documentId,
-      userId: user.id,
-      teamId: team?.id,
-    }),
-  ]);
-
-  if (!document || !document.documentData) {
-    redirect(documentRootPath);
-  }
-
-  const documentInformation: { description: string; value: string }[] = [
-    {
-      description: 'Document title',
-      value: document.title,
-    },
-    {
-      description: 'Document ID',
-      value: document.id.toString(),
-    },
-    {
-      description: 'Document status',
-      value: FRIENDLY_STATUS_MAP[document.status].label,
-    },
-    {
-      description: 'Created by',
-      value: document.User.name ?? document.User.email,
-    },
-    {
-      description: 'Date created',
-      value: document.createdAt.toISOString(),
-    },
-    {
-      description: 'Last updated',
-      value: document.updatedAt.toISOString(),
-    },
-    {
-      description: 'Time zone',
-      value: document.documentMeta?.timezone ?? 'N/A',
-    },
-  ];
-
-  const formatRecipientText = (recipient: Recipient) => {
-    let text = recipient.email;
-
-    if (recipient.name) {
-      text = `${recipient.name} (${recipient.email})`;
-    }
-
-    return `${text} - ${recipient.role}`;
-  };
-
-  return (
-    <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
-      <Link
-        href={`${documentRootPath}/${document.id}`}
-        className="flex items-center text-[#7AC455] hover:opacity-80"
-      >
-        <ChevronLeft className="mr-2 inline-block h-5 w-5" />
-        Document
-      </Link>
-
-      <div className="flex flex-col justify-between sm:flex-row">
-        <h1 className="mt-4 truncate text-2xl font-semibold md:text-3xl" title={document.title}>
-          {document.title}
-        </h1>
-
-        <div className="mt-4 flex w-full flex-row sm:mt-0 sm:w-auto sm:self-end">
-          <Button variant="outline" className="mr-2 w-full sm:w-auto">
-            <DownloadIcon className="mr-1.5 h-4 w-4" />
-            Download certificate
-          </Button>
-
-          <Button className="w-full sm:w-auto">
-            <DownloadIcon className="mr-1.5 h-4 w-4" />
-            Download PDF
-          </Button>
-        </div>
-      </div>
-
-      <section className="mt-6">
-        <Card className="grid grid-cols-1 gap-4 p-4 sm:grid-cols-2" degrees={45} gradient>
-          {documentInformation.map((info, i) => (
-            <div className="text-foreground text-sm" key={i}>
-              <h3 className="font-semibold">{info.description}</h3>
-              <p className="text-muted-foreground">{info.value}</p>
-            </div>
-          ))}
-
-          <div className="text-foreground text-sm">
-            <h3 className="font-semibold">Recipients</h3>
-            <ul className="text-muted-foreground list-inside list-disc">
-              {recipients.map((recipient) => (
-                <li key={`recipient-${recipient.id}`}>
-                  <span className="-ml-2">{formatRecipientText(recipient)}</span>
-                </li>
-              ))}
-            </ul>
-          </div>
-        </Card>
-      </section>
-
-      <section className="mt-6">
-        <DocumentLogsDataTable documentId={document.id} />
-      </section>
-    </div>
-  );
-};

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

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

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

@@ -118,7 +118,7 @@ export const ResendDocumentActionItem = ({
 
       <DialogContent className="sm:max-w-sm" hideClose>
         <DialogHeader>
-          <DialogTitle asChild>
+          <DialogTitle>
             <h1 className="text-center text-xl">Who do you want to remind?</h1>
           </DialogTitle>
         </DialogHeader>

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}/edit`}>
+          <Link href={`${documentsPath}/${row.id}`}>
             <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}/edit`}>
+          <Link href={`${documentsPath}/${row.id}`}>
             <Edit className="mr-2 h-4 w-4" />
             Edit
           </Link>
@@ -193,7 +193,6 @@ export const DataTableActionDropdown = ({ row, team }: DataTableActionDropdownPr
           documentTitle={row.title}
           open={isDeleteDialogOpen}
           onOpenChange={setDeleteDialogOpen}
-          teamId={team?.id}
         />
       )}
       {isDuplicateDialogOpen && (

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

@@ -5,19 +5,16 @@ import Link from 'next/link';
 import { useSession } from 'next-auth/react';
 import { match } from 'ts-pattern';
 
-import { formatDocumentsPath } from '@documenso/lib/utils/teams';
-import type { Document, Recipient, Team, User } from '@documenso/prisma/client';
+import { Document, Recipient, 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, teamUrl }: DataTableTitleProps) => {
+export const DataTableTitle = ({ row }: DataTableTitleProps) => {
   const { data: session } = useSession();
 
   if (!session) {
@@ -28,18 +25,14 @@ export const DataTableTitle = ({ row, teamUrl }: 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 }, { isCurrentTeamDocument: true }, () => (
+    .with({ isOwner: true }, () => (
       <Link
-        href={`${documentsPath}/${row.id}`}
+        href={`/documents/${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} teamUrl={team?.url} />,
+            cell: ({ row }) => <DataTableTitle row={row.original} />,
           },
           {
             id: 'sender',

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

@@ -16,13 +16,12 @@ import {
 import { Input } from '@documenso/ui/primitives/input';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
-type DeleteDocumentDialogProps = {
+type DeleteDraftDocumentDialogProps = {
   id: number;
   open: boolean;
   onOpenChange: (_open: boolean) => void;
   status: DocumentStatus;
   documentTitle: string;
-  teamId?: number;
 };
 
 export const DeleteDocumentDialog = ({
@@ -31,8 +30,7 @@ export const DeleteDocumentDialog = ({
   onOpenChange,
   status,
   documentTitle,
-  teamId,
-}: DeleteDocumentDialogProps) => {
+}: DeleteDraftDocumentDialogProps) => {
   const router = useRouter();
 
   const { toast } = useToast();
@@ -63,7 +61,7 @@ export const DeleteDocumentDialog = ({
 
   const onDelete = async () => {
     try {
-      await deleteDocument({ id, teamId });
+      await deleteDocument({ id, status });
     } catch {
       toast({
         title: 'Something went wrong',

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}/edit`);
+        router.push(`${documentsPath}/${newId}`);
 
         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}/edit`);
+      router.push(`${formatDocumentsPath(team?.url)}/${id}`);
     } catch (error) {
       console.error(error);
 

apps/web/src/app/(dashboard)/layout.tsx

@@ -9,7 +9,6 @@ import { NEXT_AUTH_OPTIONS } from '@documenso/lib/next-auth/auth-options';
 import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
 import { getTeams } from '@documenso/lib/server-only/team/get-teams';
 
-import { Banner } from '~/components/(dashboard)/layout/banner';
 import { Header } from '~/components/(dashboard)/layout/header';
 import { VerifyEmailBanner } from '~/components/(dashboard)/layout/verify-email-banner';
 import { RefreshOnFocus } from '~/components/(dashboard)/refresh-on-focus/refresh-on-focus';
@@ -38,8 +37,6 @@ export default async function AuthenticatedDashboardLayout({
       <LimitsProvider>
         {!user.emailVerified && <VerifyEmailBanner email={user.email} />}
 
-        <Banner />
-
         <Header user={user} teams={teams} />
 
         <main className="mt-8 pb-8 md:mt-12 md:pb-12">{children}</main>

apps/web/src/app/(dashboard)/settings/profile/delete-account-dialog.tsx

@@ -1,124 +0,0 @@
-'use client';
-
-import { signOut } from 'next-auth/react';
-
-import type { User } from '@documenso/prisma/client';
-import { TRPCClientError } from '@documenso/trpc/client';
-import { trpc } from '@documenso/trpc/react';
-import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '@documenso/ui/primitives/dialog';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-export type DeleteAccountDialogProps = {
-  className?: string;
-  user: User;
-};
-
-export const DeleteAccountDialog = ({ className, user }: DeleteAccountDialogProps) => {
-  const { toast } = useToast();
-
-  const hasTwoFactorAuthentication = user.twoFactorEnabled;
-
-  const { mutateAsync: deleteAccount, isLoading: isDeletingAccount } =
-    trpc.profile.deleteAccount.useMutation();
-
-  const onDeleteAccount = async () => {
-    try {
-      await deleteAccount();
-
-      toast({
-        title: 'Account deleted',
-        description: 'Your account has been deleted successfully.',
-        duration: 5000,
-      });
-
-      return await signOut({ callbackUrl: '/' });
-    } catch (err) {
-      if (err instanceof TRPCClientError && err.data?.code === 'BAD_REQUEST') {
-        toast({
-          title: 'An error occurred',
-          description: err.message,
-          variant: 'destructive',
-        });
-      } else {
-        toast({
-          title: 'An unknown error occurred',
-          variant: 'destructive',
-          description:
-            err.message ??
-            'We encountered an unknown error while attempting to delete your account. Please try again later.',
-        });
-      }
-    }
-  };
-
-  return (
-    <div className={className}>
-      <Alert
-        className="flex flex-col items-center justify-between gap-4 p-6 md:flex-row "
-        variant="neutral"
-      >
-        <div>
-          <AlertTitle>Delete Account</AlertTitle>
-          <AlertDescription className="mr-2">
-            Delete your account and all its contents, including completed documents. This action is
-            irreversible and will cancel your subscription, so proceed with caution.
-          </AlertDescription>
-        </div>
-
-        <div className="flex-shrink-0">
-          <Dialog>
-            <DialogTrigger asChild>
-              <Button variant="destructive">Delete Account</Button>
-            </DialogTrigger>
-            <DialogContent>
-              <DialogHeader className="space-y-4">
-                <DialogTitle>Delete Account</DialogTitle>
-
-                <Alert variant="destructive">
-                  <AlertDescription className="selection:bg-red-100">
-                    This action is not reversible. Please be certain.
-                  </AlertDescription>
-                </Alert>
-
-                {hasTwoFactorAuthentication && (
-                  <Alert variant="destructive">
-                    <AlertDescription className="selection:bg-red-100">
-                      Disable Two Factor Authentication before deleting your account.
-                    </AlertDescription>
-                  </Alert>
-                )}
-
-                <DialogDescription>
-                  Documenso will delete <span className="font-semibold">all of your documents</span>
-                  , along with all of your completed documents, signatures, and all other resources
-                  belonging to your Account.
-                </DialogDescription>
-              </DialogHeader>
-
-              <DialogFooter>
-                <Button
-                  onClick={onDeleteAccount}
-                  loading={isDeletingAccount}
-                  variant="destructive"
-                  disabled={hasTwoFactorAuthentication}
-                >
-                  {isDeletingAccount ? 'Deleting account...' : 'Delete Account'}
-                </Button>
-              </DialogFooter>
-            </DialogContent>
-          </Dialog>
-        </div>
-      </Alert>
-    </div>
-  );
-};

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

@@ -5,8 +5,6 @@ import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-
 import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
 import { ProfileForm } from '~/components/forms/profile';
 
-import { DeleteAccountDialog } from './delete-account-dialog';
-
 export const metadata: Metadata = {
   title: 'Profile',
 };
@@ -18,9 +16,7 @@ export default async function ProfileSettingsPage() {
     <div>
       <SettingsHeader title="Profile" subtitle="Here you can edit your personal details." />
 
-      <ProfileForm className="max-w-xl" user={user} />
-
-      <DeleteAccountDialog className="mt-8 max-w-xl" user={user} />
+      <ProfileForm user={user} className="max-w-xl" />
     </div>
   );
 }

apps/web/src/app/(dashboard)/settings/webhooks/[id]/page.tsx

@@ -0,0 +1,169 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { Loader } from 'lucide-react';
+import { useForm } from 'react-hook-form';
+import type { z } from 'zod';
+
+import { trpc } from '@documenso/trpc/react';
+import { ZEditWebhookMutationSchema } from '@documenso/trpc/server/webhook-router/schema';
+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 { PasswordInput } from '@documenso/ui/primitives/password-input';
+import { Switch } from '@documenso/ui/primitives/switch';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
+import { MultiSelectCombobox } from '~/components/(dashboard)/settings/webhooks/multiselect-combobox';
+
+const ZEditWebhookFormSchema = ZEditWebhookMutationSchema.omit({ id: true });
+
+type TEditWebhookFormSchema = z.infer<typeof ZEditWebhookFormSchema>;
+
+export type WebhookPageOptions = {
+  params: {
+    id: number;
+  };
+};
+
+export default function WebhookPage({ params }: WebhookPageOptions) {
+  const { toast } = useToast();
+  const router = useRouter();
+
+  const { data: webhook, isLoading } = trpc.webhook.getWebhookById.useQuery(
+    {
+      id: Number(params.id),
+    },
+    { enabled: !!params.id },
+  );
+
+  const { mutateAsync: updateWebhook } = trpc.webhook.editWebhook.useMutation();
+
+  const form = useForm<TEditWebhookFormSchema>({
+    resolver: zodResolver(ZEditWebhookFormSchema),
+    values: {
+      webhookUrl: webhook?.webhookUrl ?? '',
+      eventTriggers: webhook?.eventTriggers ?? [],
+      secret: webhook?.secret ?? '',
+      enabled: webhook?.enabled ?? true,
+    },
+  });
+
+  const onSubmit = async (data: TEditWebhookFormSchema) => {
+    try {
+      await updateWebhook({
+        id: Number(params.id),
+        ...data,
+      });
+
+      toast({
+        title: 'Webhook updated',
+        description: 'The webhook has been updated successfully.',
+        duration: 5000,
+      });
+
+      router.refresh();
+    } catch (err) {
+      toast({
+        title: 'Failed to update webhook',
+        description: 'We encountered an error while updating the webhook. Please try again later.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  return (
+    <div>
+      <SettingsHeader
+        title="Edit webhook"
+        subtitle="On this page, you can edit the webhook and its settings."
+      />
+      {isLoading && (
+        <div className="absolute inset-0 z-50 flex items-center justify-center bg-white/50">
+          <Loader className="h-8 w-8 animate-spin text-gray-500" />
+        </div>
+      )}
+      <Form {...form}>
+        <form onSubmit={form.handleSubmit(onSubmit)}>
+          <fieldset className="flex h-full flex-col gap-y-6" disabled={form.formState.isSubmitting}>
+            <FormField
+              control={form.control}
+              name="webhookUrl"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel htmlFor="webhookUrl">Webhook URL</FormLabel>
+                  <Input {...field} id="webhookUrl" type="text" />
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+            <FormField
+              control={form.control}
+              name="eventTriggers"
+              render={({ field: { onChange, value } }) => (
+                <FormItem className="flex flex-col">
+                  <FormLabel required>Event triggers</FormLabel>
+                  <FormControl>
+                    <MultiSelectCombobox
+                      listValues={value}
+                      onChange={(values: string[]) => {
+                        onChange(values);
+                      }}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+            <FormField
+              control={form.control}
+              name="secret"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Secret</FormLabel>
+                  <FormControl>
+                    <PasswordInput className="bg-background" {...field} value={field.value ?? ''} />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="enabled"
+              render={({ field }) => (
+                <FormItem className="flex items-center gap-x-2">
+                  <FormLabel className="mt-2">Active</FormLabel>
+                  <FormControl>
+                    <Switch
+                      className="bg-background"
+                      checked={field.value}
+                      onCheckedChange={field.onChange}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+            <div className="mt-4">
+              <Button type="submit" loading={form.formState.isSubmitting}>
+                Update webhook
+              </Button>
+            </div>
+          </fieldset>
+        </form>
+      </Form>
+    </div>
+  );
+}

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

@@ -0,0 +1,82 @@
+'use client';
+
+import Link from 'next/link';
+
+import { Zap } from 'lucide-react';
+import { ToggleLeft, ToggleRight } from 'lucide-react';
+import { Loader } from 'lucide-react';
+
+import { trpc } from '@documenso/trpc/react';
+import { Button } from '@documenso/ui/primitives/button';
+
+import { SettingsHeader } from '~/components/(dashboard)/settings/layout/header';
+import { CreateWebhookDialog } from '~/components/(dashboard)/settings/webhooks/create-webhook-dialog';
+import { DeleteWebhookDialog } from '~/components/(dashboard)/settings/webhooks/delete-webhook-dialog';
+
+export default function WebhookPage() {
+  const { data: webhooks, isLoading } = trpc.webhook.getWebhooks.useQuery();
+
+  return (
+    <div>
+      <SettingsHeader
+        title="Webhooks"
+        subtitle="On this page, you can create new Webhooks and manage the existing ones."
+      >
+        <CreateWebhookDialog />
+      </SettingsHeader>
+
+      {isLoading && (
+        <div className="absolute inset-0 flex items-center justify-center bg-white/50">
+          <Loader className="h-8 w-8 animate-spin text-gray-500" />
+        </div>
+      )}
+
+      {webhooks && webhooks.length === 0 && (
+        // TODO: Perhaps add some illustrations here to make the page more engaging
+        <div className="mb-4">
+          <p className="text-muted-foreground mt-2 text-sm italic">
+            You have no webhooks yet. Your webhooks will be shown here once you create them.
+          </p>
+        </div>
+      )}
+
+      {webhooks && webhooks.length > 0 && (
+        <div className="mt-4 flex max-w-xl flex-col gap-y-4">
+          {webhooks?.map((webhook) => (
+            <div key={webhook.id} className="border-border rounded-lg border p-4">
+              <div className="flex items-center justify-between gap-x-4">
+                <div>
+                  <h4 className="text-lg font-semibold">Webhook URL</h4>
+                  <p className="text-muted-foreground">{webhook.webhookUrl}</p>
+                  <h4 className="mt-4 text-lg font-semibold">Event triggers</h4>
+                  {webhook.eventTriggers.map((trigger, index) => (
+                    <span key={index} className="text-muted-foreground flex flex-row items-center">
+                      <Zap className="mr-1 h-4 w-4" /> {trigger}
+                    </span>
+                  ))}
+                  {webhook.enabled ? (
+                    <h4 className="mt-4 flex items-center gap-2 text-lg">
+                      Active <ToggleRight className="h-6 w-6 fill-green-200 stroke-green-400" />
+                    </h4>
+                  ) : (
+                    <h4 className="mt-4 flex items-center gap-2 text-lg">
+                      Inactive <ToggleLeft className="h-6 w-6 fill-slate-200 stroke-slate-400" />
+                    </h4>
+                  )}
+                </div>
+              </div>
+              <div className="mt-6 flex flex-col-reverse space-y-2 space-y-reverse sm:mt-0 sm:flex-row sm:justify-end sm:space-x-2 sm:space-y-0">
+                <Button asChild variant="outline">
+                  <Link href={`/settings/webhooks/${webhook.id}`}>Edit</Link>
+                </Button>
+                <DeleteWebhookDialog webhook={webhook}>
+                  <Button variant="destructive">Delete</Button>
+                </DeleteWebhookDialog>
+              </div>
+            </div>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}

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

@@ -1,31 +1,30 @@
 'use client';
 
-import { useTransition } from 'react';
+import { useState, useTransition } from 'react';
 
 import Link from 'next/link';
+import { useRouter } from 'next/navigation';
 
-import { AlertTriangle, Loader } from 'lucide-react';
+import { AlertTriangle, Loader, Plus } from 'lucide-react';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
 import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
-import type { Recipient, Template } from '@documenso/prisma/client';
+import type { Template } from '@documenso/prisma/client';
+import { trpc } from '@documenso/trpc/react';
 import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
 import { DataTable } from '@documenso/ui/primitives/data-table';
 import { DataTablePagination } from '@documenso/ui/primitives/data-table-pagination';
+import { useToast } from '@documenso/ui/primitives/use-toast';
 
 import { LocaleDate } from '~/components/formatter/locale-date';
 import { TemplateType } from '~/components/formatter/template-type';
 
 import { DataTableActionDropdown } from './data-table-action-dropdown';
 import { DataTableTitle } from './data-table-title';
-import { UseTemplateDialog } from './use-template-dialog';
-
-type TemplateWithRecipient = Template & {
-  Recipient: Recipient[];
-};
 
 type TemplatesDataTableProps = {
-  templates: TemplateWithRecipient[];
+  templates: Template[];
   perPage: number;
   page: number;
   totalPages: number;
@@ -48,6 +47,14 @@ export const TemplatesDataTable = ({
 
   const { remaining } = useLimits();
 
+  const router = useRouter();
+
+  const { toast } = useToast();
+  const [loadingStates, setLoadingStates] = useState<{ [key: string]: boolean }>({});
+
+  const { mutateAsync: createDocumentFromTemplate } =
+    trpc.template.createDocumentFromTemplate.useMutation();
+
   const onPaginationChange = (page: number, perPage: number) => {
     startTransition(() => {
       updateSearchParams({
@@ -57,6 +64,28 @@ export const TemplatesDataTable = ({
     });
   };
 
+  const onUseButtonClick = async (templateId: number) => {
+    try {
+      const { id } = await createDocumentFromTemplate({
+        templateId,
+      });
+
+      toast({
+        title: 'Document created',
+        description: 'Your document has been created from the template successfully.',
+        duration: 5000,
+      });
+
+      router.push(`${documentRootPath}/${id}`);
+    } catch (err) {
+      toast({
+        title: 'Error',
+        description: 'An error occurred while creating document from template.',
+        variant: 'destructive',
+      });
+    }
+  };
+
   return (
     <div className="relative">
       {remaining.documents === 0 && (
@@ -92,13 +121,22 @@ export const TemplatesDataTable = ({
             header: 'Actions',
             accessorKey: 'actions',
             cell: ({ row }) => {
+              const isRowLoading = loadingStates[row.original.id];
+
               return (
                 <div className="flex items-center gap-x-4">
-                  <UseTemplateDialog
-                    templateId={row.original.id}
-                    recipients={row.original.Recipient}
-                    documentRootPath={documentRootPath}
-                  />
+                  <Button
+                    disabled={isRowLoading || remaining.documents === 0}
+                    loading={isRowLoading}
+                    onClick={async () => {
+                      setLoadingStates((prev) => ({ ...prev, [row.original.id]: true }));
+                      await onUseButtonClick(row.original.id);
+                      setLoadingStates((prev) => ({ ...prev, [row.original.id]: false }));
+                    }}
+                  >
+                    {!isRowLoading && <Plus className="-ml-1 mr-2 h-4 w-4" />}
+                    Use Template
+                  </Button>
 
                   <DataTableActionDropdown
                     row={row.original}

apps/web/src/app/(dashboard)/templates/use-template-dialog.tsx

@@ -1,247 +0,0 @@
-import { useRouter } from 'next/navigation';
-
-import { zodResolver } from '@hookform/resolvers/zod';
-import { Plus } from 'lucide-react';
-import { Controller, useFieldArray, useForm } from 'react-hook-form';
-import * as z from 'zod';
-
-import type { Recipient } from '@documenso/prisma/client';
-import { RecipientRole } from '@documenso/prisma/client';
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import {
-  Dialog,
-  DialogClose,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '@documenso/ui/primitives/dialog';
-import { FormErrorMessage } from '@documenso/ui/primitives/form/form-error-message';
-import { Input } from '@documenso/ui/primitives/input';
-import { Label } from '@documenso/ui/primitives/label';
-import { ROLE_ICONS } from '@documenso/ui/primitives/recipient-role-icons';
-import { Select, SelectContent, SelectItem, SelectTrigger } from '@documenso/ui/primitives/select';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-import { useOptionalCurrentTeam } from '~/providers/team';
-
-const ZAddRecipientsForNewDocumentSchema = z.object({
-  recipients: z.array(
-    z.object({
-      email: z.string().email(),
-      name: z.string(),
-      role: z.nativeEnum(RecipientRole),
-    }),
-  ),
-});
-
-type TAddRecipientsForNewDocumentSchema = z.infer<typeof ZAddRecipientsForNewDocumentSchema>;
-
-export type UseTemplateDialogProps = {
-  templateId: number;
-  recipients: Recipient[];
-  documentRootPath: string;
-};
-
-export function UseTemplateDialog({
-  recipients,
-  documentRootPath,
-  templateId,
-}: UseTemplateDialogProps) {
-  const router = useRouter();
-  const { toast } = useToast();
-
-  const team = useOptionalCurrentTeam();
-
-  const {
-    control,
-    handleSubmit,
-    formState: { errors, isSubmitting },
-  } = useForm<TAddRecipientsForNewDocumentSchema>({
-    resolver: zodResolver(ZAddRecipientsForNewDocumentSchema),
-    defaultValues: {
-      recipients:
-        recipients.length > 0
-          ? recipients.map((recipient) => ({
-              nativeId: recipient.id,
-              formId: String(recipient.id),
-              name: recipient.name,
-              email: recipient.email,
-              role: recipient.role,
-            }))
-          : [
-              {
-                name: '',
-                email: '',
-                role: RecipientRole.SIGNER,
-              },
-            ],
-    },
-  });
-
-  const { mutateAsync: createDocumentFromTemplate, isLoading: isCreatingDocumentFromTemplate } =
-    trpc.template.createDocumentFromTemplate.useMutation();
-
-  const onSubmit = async (data: TAddRecipientsForNewDocumentSchema) => {
-    try {
-      const { id } = await createDocumentFromTemplate({
-        templateId,
-        teamId: team?.id,
-        recipients: data.recipients,
-      });
-
-      toast({
-        title: 'Document created',
-        description: 'Your document has been created from the template successfully.',
-        duration: 5000,
-      });
-
-      router.push(`${documentRootPath}/${id}`);
-    } catch (err) {
-      toast({
-        title: 'Error',
-        description: 'An error occurred while creating document from template.',
-        variant: 'destructive',
-      });
-    }
-  };
-
-  const onCreateDocumentFromTemplate = handleSubmit(onSubmit);
-
-  const { fields: formRecipients } = useFieldArray({
-    control,
-    name: 'recipients',
-  });
-
-  return (
-    <Dialog>
-      <DialogTrigger asChild>
-        <Button className="cursor-pointer">
-          <Plus className="-ml-1 mr-2 h-4 w-4" />
-          Use Template
-        </Button>
-      </DialogTrigger>
-      <DialogContent className="sm:max-w-lg">
-        <DialogHeader>
-          <DialogTitle>Document Recipients</DialogTitle>
-          <DialogDescription>Add the recipients to create the template with.</DialogDescription>
-        </DialogHeader>
-        <div className="flex flex-col space-y-4">
-          {formRecipients.map((recipient, index) => (
-            <div
-              key={recipient.id}
-              data-native-id={recipient.id}
-              className="flex flex-wrap items-end gap-x-4"
-            >
-              <div className="flex-1">
-                <Label htmlFor={`recipient-${recipient.id}-email`}>
-                  Email
-                  <span className="text-destructive ml-1 inline-block font-medium">*</span>
-                </Label>
-
-                <Controller
-                  control={control}
-                  name={`recipients.${index}.email`}
-                  render={({ field }) => (
-                    <Input
-                      id={`recipient-${recipient.id}-email`}
-                      type="email"
-                      className="bg-background mt-2"
-                      disabled={isSubmitting}
-                      {...field}
-                    />
-                  )}
-                />
-              </div>
-
-              <div className="flex-1">
-                <Label htmlFor={`recipient-${recipient.id}-name`}>Name</Label>
-
-                <Controller
-                  control={control}
-                  name={`recipients.${index}.name`}
-                  render={({ field }) => (
-                    <Input
-                      id={`recipient-${recipient.id}-name`}
-                      type="text"
-                      className="bg-background mt-2"
-                      disabled={isSubmitting}
-                      {...field}
-                    />
-                  )}
-                />
-              </div>
-
-              <div className="w-[60px]">
-                <Controller
-                  control={control}
-                  name={`recipients.${index}.role`}
-                  render={({ field: { value, onChange } }) => (
-                    <Select value={value} onValueChange={(x) => onChange(x)}>
-                      <SelectTrigger className="bg-background">{ROLE_ICONS[value]}</SelectTrigger>
-
-                      <SelectContent className="" align="end">
-                        <SelectItem value={RecipientRole.SIGNER}>
-                          <div className="flex items-center">
-                            <span className="mr-2">{ROLE_ICONS[RecipientRole.SIGNER]}</span>
-                            Signer
-                          </div>
-                        </SelectItem>
-
-                        <SelectItem value={RecipientRole.CC}>
-                          <div className="flex items-center">
-                            <span className="mr-2">{ROLE_ICONS[RecipientRole.CC]}</span>
-                            Receives copy
-                          </div>
-                        </SelectItem>
-
-                        <SelectItem value={RecipientRole.APPROVER}>
-                          <div className="flex items-center">
-                            <span className="mr-2">{ROLE_ICONS[RecipientRole.APPROVER]}</span>
-                            Approver
-                          </div>
-                        </SelectItem>
-
-                        <SelectItem value={RecipientRole.VIEWER}>
-                          <div className="flex items-center">
-                            <span className="mr-2">{ROLE_ICONS[RecipientRole.VIEWER]}</span>
-                            Viewer
-                          </div>
-                        </SelectItem>
-                      </SelectContent>
-                    </Select>
-                  )}
-                />
-              </div>
-
-              <div className="w-full">
-                <FormErrorMessage className="mt-2" error={errors.recipients?.[index]?.email} />
-                <FormErrorMessage className="mt-2" error={errors.recipients?.[index]?.name} />
-              </div>
-            </div>
-          ))}
-        </div>
-
-        <DialogFooter className="justify-end">
-          <DialogClose asChild>
-            <Button type="button" variant="secondary">
-              Close
-            </Button>
-          </DialogClose>
-
-          <Button
-            type="button"
-            loading={isCreatingDocumentFromTemplate}
-            disabled={isCreatingDocumentFromTemplate}
-            onClick={onCreateDocumentFromTemplate}
-          >
-            Create Document
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}

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

@@ -29,7 +29,6 @@ import { NameField } from './name-field';
 import { NoLongerAvailable } from './no-longer-available';
 import { SigningProvider } from './provider';
 import { SignatureField } from './signature-field';
-import { TextField } from './text-field';
 
 export type SigningPageProps = {
   params: {
@@ -169,9 +168,6 @@ export default async function SigningPage({ params: { token } }: SigningPageProp
               .with(FieldType.EMAIL, () => (
                 <EmailField key={field.id} field={field} recipient={recipient} />
               ))
-              .with(FieldType.TEXT, () => (
-                <TextField key={field.id} field={field} recipient={recipient} />
-              ))
               .otherwise(() => null),
           )}
         </ElementVisible>

apps/web/src/app/(signing)/sign/[token]/text-field.tsx

@@ -1,166 +0,0 @@
-'use client';
-
-import { useEffect, useState, useTransition } from 'react';
-
-import { useRouter } from 'next/navigation';
-
-import { Loader } from 'lucide-react';
-
-import type { Recipient } from '@documenso/prisma/client';
-import type { FieldWithSignature } from '@documenso/prisma/types/field-with-signature';
-import { trpc } from '@documenso/trpc/react';
-import { Button } from '@documenso/ui/primitives/button';
-import { Dialog, DialogContent, DialogFooter, DialogTitle } from '@documenso/ui/primitives/dialog';
-import { Input } from '@documenso/ui/primitives/input';
-import { Label } from '@documenso/ui/primitives/label';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-
-import { SigningFieldContainer } from './signing-field-container';
-
-export type TextFieldProps = {
-  field: FieldWithSignature;
-  recipient: Recipient;
-};
-
-export const TextField = ({ field, recipient }: TextFieldProps) => {
-  const router = useRouter();
-
-  const { toast } = useToast();
-
-  const [isPending, startTransition] = useTransition();
-
-  const { mutateAsync: signFieldWithToken, isLoading: isSignFieldWithTokenLoading } =
-    trpc.field.signFieldWithToken.useMutation();
-
-  const {
-    mutateAsync: removeSignedFieldWithToken,
-    isLoading: isRemoveSignedFieldWithTokenLoading,
-  } = trpc.field.removeSignedFieldWithToken.useMutation();
-
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
-
-  const [showCustomTextModal, setShowCustomTextModal] = useState(false);
-  const [localText, setLocalCustomText] = useState('');
-  const [isLocalSignatureSet, setIsLocalSignatureSet] = useState(false);
-
-  useEffect(() => {
-    if (!showCustomTextModal && !isLocalSignatureSet) {
-      setLocalCustomText('');
-    }
-  }, [showCustomTextModal, isLocalSignatureSet]);
-
-  const onSign = async () => {
-    try {
-      if (!localText) {
-        setIsLocalSignatureSet(false);
-        setShowCustomTextModal(true);
-        return;
-      }
-
-      if (!localText) {
-        return;
-      }
-
-      await signFieldWithToken({
-        token: recipient.token,
-        fieldId: field.id,
-        value: localText,
-        isBase64: true,
-      });
-
-      setLocalCustomText('');
-
-      startTransition(() => router.refresh());
-    } catch (err) {
-      console.error(err);
-
-      toast({
-        title: 'Error',
-        description: 'An error occurred while signing the document.',
-        variant: 'destructive',
-      });
-    }
-  };
-
-  const onRemove = async () => {
-    try {
-      await removeSignedFieldWithToken({
-        token: recipient.token,
-        fieldId: field.id,
-      });
-
-      startTransition(() => router.refresh());
-    } catch (err) {
-      console.error(err);
-
-      toast({
-        title: 'Error',
-        description: 'An error occurred while removing the text.',
-        variant: 'destructive',
-      });
-    }
-  };
-
-  return (
-    <SigningFieldContainer field={field} onSign={onSign} onRemove={onRemove} type="Signature">
-      {isLoading && (
-        <div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
-          <Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
-        </div>
-      )}
-
-      {!field.inserted && (
-        <p className="group-hover:text-primary text-muted-foreground text-lg duration-200">Text</p>
-      )}
-
-      {field.inserted && <p className="text-muted-foreground duration-200">{field.customText}</p>}
-
-      <Dialog open={showCustomTextModal} onOpenChange={setShowCustomTextModal}>
-        <DialogContent>
-          <DialogTitle>
-            Enter your Text <span className="text-muted-foreground">({recipient.email})</span>
-          </DialogTitle>
-
-          <div className="">
-            <Label htmlFor="custom-text">Custom Text</Label>
-
-            <Input
-              id="custom-text"
-              className="border-border mt-2 w-full rounded-md border"
-              onChange={(e) => setLocalCustomText(e.target.value)}
-            />
-          </div>
-
-          <DialogFooter>
-            <div className="mt-4 flex w-full flex-1 flex-nowrap gap-4">
-              <Button
-                type="button"
-                className="dark:bg-muted dark:hover:bg-muted/80 flex-1  bg-black/5 hover:bg-black/10"
-                variant="secondary"
-                onClick={() => {
-                  setShowCustomTextModal(false);
-                  setLocalCustomText('');
-                }}
-              >
-                Cancel
-              </Button>
-
-              <Button
-                type="button"
-                className="flex-1"
-                disabled={!localText}
-                onClick={() => {
-                  setShowCustomTextModal(false);
-                  setIsLocalSignatureSet(true);
-                  void onSign();
-                }}
-              >
-                Save Text
-              </Button>
-            </div>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </SigningFieldContainer>
-  );
-};

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

@@ -1,21 +0,0 @@
-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]/documents/[id]/logs/page.tsx

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

apps/web/src/app/(teams)/t/[teamUrl]/layout.tsx

@@ -11,7 +11,6 @@ import { SubscriptionStatus } from '@documenso/prisma/client';
 import { Header } from '~/components/(dashboard)/layout/header';
 import { RefreshOnFocus } from '~/components/(dashboard)/refresh-on-focus/refresh-on-focus';
 import { NextAuthProvider } from '~/providers/next-auth';
-import { TeamProvider } from '~/providers/team';
 
 import { LayoutBillingBanner } from './layout-billing-banner';
 
@@ -57,9 +56,7 @@ export default async function AuthenticatedTeamsLayout({
 
         <Header user={user} teams={teams} />
 
-        <TeamProvider team={team}>
-          <main className="mt-8 pb-8 md:mt-12 md:pb-12">{children}</main>
-        </TeamProvider>
+        <main className="mt-8 pb-8 md:mt-12 md:pb-12">{children}</main>
 
         <RefreshOnFocus />
       </LimitsProvider>

apps/web/src/app/(teams)/t/[teamUrl]/settings/tokens/page.tsx

@@ -1,85 +0,0 @@
-import { DateTime } from 'luxon';
-
-import { getRequiredServerComponentSession } from '@documenso/lib/next-auth/get-server-component-session';
-import { getTeamTokens } from '@documenso/lib/server-only/public-api/get-all-team-tokens';
-import { getTeamByUrl } from '@documenso/lib/server-only/team/get-team';
-import { Button } from '@documenso/ui/primitives/button';
-
-import DeleteTokenDialog from '~/components/(dashboard)/settings/token/delete-token-dialog';
-import { LocaleDate } from '~/components/formatter/locale-date';
-import { ApiTokenForm } from '~/components/forms/token';
-
-type ApiTokensPageProps = {
-  params: {
-    teamUrl: string;
-  };
-};
-
-export default async function ApiTokensPage({ params }: ApiTokensPageProps) {
-  const { teamUrl } = params;
-
-  const { user } = await getRequiredServerComponentSession();
-
-  const team = await getTeamByUrl({ userId: user.id, teamUrl });
-
-  const tokens = await getTeamTokens({ userId: user.id, teamId: team.id });
-
-  return (
-    <div>
-      <h3 className="text-2xl font-semibold">API Tokens</h3>
-
-      <p className="text-muted-foreground mt-2 text-sm">
-        On this page, you can create new API tokens and manage the existing ones.
-      </p>
-
-      <hr className="my-4" />
-
-      <ApiTokenForm className="max-w-xl" teamId={team.id} />
-
-      <hr className="mb-4 mt-8" />
-
-      <h4 className="text-xl font-medium">Your existing tokens</h4>
-
-      {tokens.length === 0 && (
-        <div className="mb-4">
-          <p className="text-muted-foreground mt-2 text-sm italic">
-            Your tokens will be shown here once you create them.
-          </p>
-        </div>
-      )}
-
-      {tokens.length > 0 && (
-        <div className="mt-4 flex max-w-xl flex-col gap-y-4">
-          {tokens.map((token) => (
-            <div key={token.id} className="border-border rounded-lg border p-4">
-              <div className="flex items-center justify-between gap-x-4">
-                <div>
-                  <h5 className="text-base">{token.name}</h5>
-
-                  <p className="text-muted-foreground mt-2 text-xs">
-                    Created on <LocaleDate date={token.createdAt} format={DateTime.DATETIME_FULL} />
-                  </p>
-                  {token.expires ? (
-                    <p className="text-muted-foreground mt-1 text-xs">
-                      Expires on <LocaleDate date={token.expires} format={DateTime.DATETIME_FULL} />
-                    </p>
-                  ) : (
-                    <p className="text-muted-foreground mt-1 text-xs">
-                      Token doesn't have an expiration date
-                    </p>
-                  )}
-                </div>
-
-                <div>
-                  <DeleteTokenDialog token={token} teamId={team.id}>
-                    <Button variant="destructive">Delete</Button>
-                  </DeleteTokenDialog>
-                </div>
-              </div>
-            </div>
-          ))}
-        </div>
-      )}
-    </div>
-  );
-}

apps/web/src/components/(dashboard)/layout/banner.tsx

@@ -1,29 +0,0 @@
-import { getSiteSettings } from '@documenso/lib/server-only/site-settings/get-site-settings';
-import { SITE_SETTINGS_BANNER_ID } from '@documenso/lib/server-only/site-settings/schemas/banner';
-
-export const Banner = async () => {
-  const banner = await getSiteSettings().then((settings) =>
-    settings.find((setting) => setting.id === SITE_SETTINGS_BANNER_ID),
-  );
-
-  return (
-    <>
-      {banner && banner.enabled && (
-        <div className="mb-2" style={{ background: banner.data.bgColor }}>
-          <div
-            className="mx-auto flex h-auto max-w-screen-xl items-center justify-center px-4 py-3 text-sm font-medium"
-            style={{ color: banner.data.textColor }}
-          >
-            <div className="flex items-center">
-              <span dangerouslySetInnerHTML={{ __html: banner.data.content }} />
-            </div>
-          </div>
-        </div>
-      )}
-    </>
-  );
-};
-
-// Banner
-// Custom Text
-// Custom Text with Custom Icon

apps/web/src/components/(dashboard)/layout/menu-switcher.tsx

@@ -166,24 +166,22 @@ export const MenuSwitcher = ({ user, teams: initialTeamsData }: MenuSwitcherProp
               </div>
             </DropdownMenuLabel>
 
-            <div className="custom-scrollbar max-h-[40vh] overflow-auto">
-              {teams.map((team) => (
-                <DropdownMenuItem asChild key={team.id}>
-                  <Link href={formatRedirectUrlOnSwitch(team.url)}>
-                    <AvatarWithText
-                      avatarFallback={formatAvatarFallback(team.name)}
-                      primaryText={team.name}
-                      secondaryText={formatSecondaryAvatarText(team)}
-                      rightSideComponent={
-                        isPathTeamUrl(team.url) && (
-                          <CheckCircle2 className="ml-auto fill-black text-white dark:fill-white dark:text-black" />
-                        )
-                      }
-                    />
-                  </Link>
-                </DropdownMenuItem>
-              ))}
-            </div>
+            {teams.map((team) => (
+              <DropdownMenuItem asChild key={team.id}>
+                <Link href={formatRedirectUrlOnSwitch(team.url)}>
+                  <AvatarWithText
+                    avatarFallback={formatAvatarFallback(team.name)}
+                    primaryText={team.name}
+                    secondaryText={formatSecondaryAvatarText(team)}
+                    rightSideComponent={
+                      isPathTeamUrl(team.url) && (
+                        <CheckCircle2 className="ml-auto fill-black text-white dark:fill-white dark:text-black" />
+                      )
+                    }
+                  />
+                </Link>
+              </DropdownMenuItem>
+            ))}
           </>
         ) : (
           <DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>

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

@@ -5,7 +5,7 @@ import type { HTMLAttributes } from 'react';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 
-import { Braces, CreditCard, Lock, User, Users } from 'lucide-react';
+import { Braces, CreditCard, Lock, User, Users, Webhook } from 'lucide-react';
 
 import { useFeatureFlags } from '@documenso/lib/client-only/providers/feature-flag';
 import { cn } from '@documenso/ui/lib/utils';
@@ -51,6 +51,19 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => {
         </Link>
       )}
 
+      <Link href="/settings/webhooks">
+        <Button
+          variant="ghost"
+          className={cn(
+            'w-full justify-start',
+            pathname?.startsWith('/settings/webhooks') && 'bg-secondary',
+          )}
+        >
+          <Webhook className="mr-2 h-5 w-5" />
+          Webhooks
+        </Button>
+      </Link>
+
       <Link href="/settings/security">
         <Button
           variant="ghost"

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

@@ -5,7 +5,7 @@ import type { HTMLAttributes } from 'react';
 import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 
-import { Braces, CreditCard, Lock, User, Users } from 'lucide-react';
+import { Braces, CreditCard, Lock, User, Users, Webhook } from 'lucide-react';
 
 import { useFeatureFlags } from '@documenso/lib/client-only/providers/feature-flag';
 import { cn } from '@documenso/ui/lib/utils';
@@ -54,6 +54,19 @@ export const MobileNav = ({ className, ...props }: MobileNavProps) => {
         </Link>
       )}
 
+      <Link href="/settings/webhooks">
+        <Button
+          variant="ghost"
+          className={cn(
+            'w-full justify-start',
+            pathname?.startsWith('/settings/webhooks') && 'bg-secondary',
+          )}
+        >
+          <Webhook className="mr-2 h-5 w-5" />
+          Webhooks
+        </Button>
+      </Link>
+
       <Link href="/settings/security">
         <Button
           variant="ghost"

apps/web/src/components/(dashboard)/settings/token/delete-token-dialog.tsx

@@ -32,18 +32,12 @@ import { Input } from '@documenso/ui/primitives/input';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
 export type DeleteTokenDialogProps = {
-  teamId?: number;
   token: Pick<ApiToken, 'id' | 'name'>;
   onDelete?: () => void;
   children?: React.ReactNode;
 };
 
-export default function DeleteTokenDialog({
-  teamId,
-  token,
-  onDelete,
-  children,
-}: DeleteTokenDialogProps) {
+export default function DeleteTokenDialog({ token, onDelete, children }: DeleteTokenDialogProps) {
   const router = useRouter();
   const { toast } = useToast();
 
@@ -76,7 +70,6 @@ export default function DeleteTokenDialog({
     try {
       await deleteTokenMutation({
         id: token.id,
-        teamId,
       });
 
       toast({

apps/web/src/components/(dashboard)/settings/webhooks/create-webhook-dialog.tsx

@@ -0,0 +1,192 @@
+'use client';
+
+import { useState } from 'react';
+
+import { useRouter } from 'next/navigation';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import type * as DialogPrimitive from '@radix-ui/react-dialog';
+import { useForm } from 'react-hook-form';
+import type { z } from 'zod';
+
+import { trpc } from '@documenso/trpc/react';
+import { ZCreateWebhookFormSchema } from '@documenso/trpc/server/webhook-router/schema';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import { Input } from '@documenso/ui/primitives/input';
+import { PasswordInput } from '@documenso/ui/primitives/password-input';
+import { Switch } from '@documenso/ui/primitives/switch';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+import { MultiSelectCombobox } from './multiselect-combobox';
+
+type TCreateWebhookFormSchema = z.infer<typeof ZCreateWebhookFormSchema>;
+
+export type CreateWebhookDialogProps = {
+  trigger?: React.ReactNode;
+} & Omit<DialogPrimitive.DialogProps, 'children'>;
+
+export const CreateWebhookDialog = ({ trigger, ...props }: CreateWebhookDialogProps) => {
+  const router = useRouter();
+  const { toast } = useToast();
+  const [open, setOpen] = useState(false);
+
+  const form = useForm<TCreateWebhookFormSchema>({
+    resolver: zodResolver(ZCreateWebhookFormSchema),
+    values: {
+      webhookUrl: '',
+      eventTriggers: [],
+      secret: '',
+      enabled: true,
+    },
+  });
+
+  const { mutateAsync: createWebhook } = trpc.webhook.createWebhook.useMutation();
+
+  const onSubmit = async (values: TCreateWebhookFormSchema) => {
+    try {
+      await createWebhook(values);
+
+      setOpen(false);
+
+      toast({
+        title: 'Webhook created',
+        description: 'The webhook was successfully created.',
+      });
+
+      form.reset();
+
+      router.refresh();
+    } catch (err) {
+      toast({
+        title: 'Error',
+        description: 'An error occurred while creating the webhook. Please try again.',
+        variant: 'destructive',
+      });
+    }
+  };
+
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={(value) => !form.formState.isSubmitting && setOpen(value)}
+      {...props}
+    >
+      <DialogTrigger onClick={(e) => e.stopPropagation()} asChild>
+        {trigger ?? <Button className="flex-shrink-0">Create Webhook</Button>}
+      </DialogTrigger>
+
+      <DialogContent position="center">
+        <DialogHeader>
+          <DialogTitle>Create webhook</DialogTitle>
+          <DialogDescription>On this page, you can create a new webhook.</DialogDescription>
+        </DialogHeader>
+
+        <Form {...form}>
+          <form onSubmit={form.handleSubmit(onSubmit)}>
+            <fieldset
+              className="flex h-full flex-col space-y-4"
+              disabled={form.formState.isSubmitting}
+            >
+              <FormField
+                control={form.control}
+                name="webhookUrl"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel required>Webhook URL</FormLabel>
+                    <FormControl>
+                      <Input className="bg-background" {...field} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <FormField
+                control={form.control}
+                name="eventTriggers"
+                render={({ field: { onChange, value } }) => (
+                  <FormItem className="flex flex-col gap-2">
+                    <FormLabel required>Event triggers</FormLabel>
+                    <FormControl>
+                      <MultiSelectCombobox
+                        listValues={value}
+                        onChange={(values: string[]) => {
+                          onChange(values);
+                        }}
+                      />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <FormField
+                control={form.control}
+                name="secret"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>Secret</FormLabel>
+                    <FormControl>
+                      <PasswordInput
+                        className="bg-background"
+                        {...field}
+                        value={field.value ?? ''}
+                      />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <FormField
+                control={form.control}
+                name="enabled"
+                render={({ field }) => (
+                  <FormItem className="flex items-center gap-2">
+                    <FormLabel className="mt-2">Active</FormLabel>
+                    <FormControl>
+                      <Switch
+                        className="bg-background"
+                        checked={field.value}
+                        onCheckedChange={field.onChange}
+                      />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <DialogFooter>
+                <div className="flex w-full flex-nowrap gap-4">
+                  <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
+                    Cancel
+                  </Button>
+                  <Button type="submit" loading={form.formState.isSubmitting}>
+                    Create
+                  </Button>
+                </div>
+              </DialogFooter>
+            </fieldset>
+          </form>
+        </Form>
+      </DialogContent>
+    </Dialog>
+  );
+};

apps/web/src/components/(dashboard)/settings/webhooks/delete-webhook-dialog.tsx

@@ -0,0 +1,167 @@
+'use effect';
+
+import { useEffect, useState } from 'react';
+
+import { useRouter } from 'next/navigation';
+
+import { zodResolver } from '@hookform/resolvers/zod';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+
+import type { Webhook } from '@documenso/prisma/client';
+import { trpc } from '@documenso/trpc/react';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import { Input } from '@documenso/ui/primitives/input';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+export type DeleteWebhookDialogProps = {
+  webhook: Pick<Webhook, 'id' | 'webhookUrl'>;
+  onDelete?: () => void;
+  children: React.ReactNode;
+};
+
+export const DeleteWebhookDialog = ({ webhook, children }: DeleteWebhookDialogProps) => {
+  const router = useRouter();
+  const { toast } = useToast();
+  const [open, setOpen] = useState(false);
+
+  const deleteMessage = `delete ${webhook.webhookUrl}`;
+
+  const ZDeleteWebhookFormSchema = z.object({
+    webhookUrl: z.literal(deleteMessage, {
+      errorMap: () => ({ message: `You must enter '${deleteMessage}' to proceed` }),
+    }),
+  });
+
+  type TDeleteWebhookFormSchema = z.infer<typeof ZDeleteWebhookFormSchema>;
+
+  const { mutateAsync: deleteWebhook } = trpc.webhook.deleteWebhook.useMutation();
+
+  const form = useForm<TDeleteWebhookFormSchema>({
+    resolver: zodResolver(ZDeleteWebhookFormSchema),
+    values: {
+      webhookUrl: '',
+    },
+  });
+
+  const onSubmit = async () => {
+    try {
+      await deleteWebhook({ id: webhook.id });
+
+      toast({
+        title: 'Webhook deleted',
+        duration: 5000,
+        description: 'The webhook has been successfully deleted.',
+      });
+
+      setOpen(false);
+
+      router.refresh();
+    } catch (error) {
+      toast({
+        title: 'An unknown error occurred',
+        variant: 'destructive',
+        duration: 5000,
+        description:
+          'We encountered an unknown error while attempting to delete it. Please try again later.',
+      });
+    }
+  };
+
+  useEffect(() => {
+    if (!open) {
+      form.reset();
+    }
+  }, [open, form]);
+
+  return (
+    <Dialog open={open} onOpenChange={(value) => !form.formState.isSubmitting && setOpen(value)}>
+      <DialogTrigger asChild>
+        {children ?? (
+          <Button className="mr-4" variant="destructive">
+            Delete
+          </Button>
+        )}
+      </DialogTrigger>
+
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>Delete Webhook</DialogTitle>
+
+          <DialogDescription>
+            Please note that this action is irreversible. Once confirmed, your webhook will be
+            permanently deleted.
+          </DialogDescription>
+        </DialogHeader>
+
+        <Form {...form}>
+          <form onSubmit={form.handleSubmit(onSubmit)}>
+            <fieldset
+              className="flex h-full flex-col space-y-4"
+              disabled={form.formState.isSubmitting}
+            >
+              <FormField
+                control={form.control}
+                name="webhookUrl"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>
+                      Confirm by typing:{' '}
+                      <span className="font-sm text-destructive font-semibold">
+                        {deleteMessage}
+                      </span>
+                    </FormLabel>
+                    <FormControl>
+                      <Input className="bg-background" type="text" {...field} />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <DialogFooter>
+                <div className="flex w-full flex-nowrap gap-4">
+                  <Button
+                    type="button"
+                    variant="secondary"
+                    className="flex-1"
+                    onClick={() => setOpen(false)}
+                  >
+                    Cancel
+                  </Button>
+
+                  <Button
+                    type="submit"
+                    variant="destructive"
+                    className="flex-1"
+                    disabled={!form.formState.isValid}
+                    loading={form.formState.isSubmitting}
+                  >
+                    I'm sure! Delete it
+                  </Button>
+                </div>
+              </DialogFooter>
+            </fieldset>
+          </form>
+        </Form>
+      </DialogContent>
+    </Dialog>
+  );
+};

apps/web/src/components/(dashboard)/settings/webhooks/multiselect-combobox.tsx

@@ -0,0 +1,85 @@
+import * as React from 'react';
+
+import { WebhookTriggerEvents } from '@prisma/client/';
+import { Check, ChevronsUpDown } from 'lucide-react';
+
+import { cn } from '@documenso/ui/lib/utils';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+} from '@documenso/ui/primitives/command';
+import { Popover, PopoverContent, PopoverTrigger } from '@documenso/ui/primitives/popover';
+
+import { truncateTitle } from '~/helpers/truncate-title';
+
+type ComboboxProps = {
+  listValues: string[];
+  onChange: (_values: string[]) => void;
+};
+
+const MultiSelectCombobox = ({ listValues, onChange }: ComboboxProps) => {
+  const [isOpen, setIsOpen] = React.useState(false);
+  const [selectedValues, setSelectedValues] = React.useState<string[]>([]);
+
+  const triggerEvents = Object.values(WebhookTriggerEvents);
+
+  React.useEffect(() => {
+    setSelectedValues(listValues);
+  }, [listValues]);
+
+  const allEvents = [...new Set([...triggerEvents, ...selectedValues])];
+
+  const handleSelect = (currentValue: string) => {
+    let newSelectedValues;
+    if (selectedValues.includes(currentValue)) {
+      newSelectedValues = selectedValues.filter((value) => value !== currentValue);
+    } else {
+      newSelectedValues = [...selectedValues, currentValue];
+    }
+
+    setSelectedValues(newSelectedValues);
+    onChange(newSelectedValues);
+    setIsOpen(false);
+  };
+
+  return (
+    <Popover open={isOpen} onOpenChange={setIsOpen}>
+      <PopoverTrigger asChild>
+        <Button
+          variant="outline"
+          role="combobox"
+          aria-expanded={isOpen}
+          className="w-[200px] justify-between"
+        >
+          {selectedValues.length > 0 ? selectedValues.length + ' selected...' : 'Select values...'}
+          <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+        </Button>
+      </PopoverTrigger>
+      <PopoverContent className="z-9999 w-[200px] p-0">
+        <Command>
+          <CommandInput placeholder={truncateTitle(selectedValues.join(', '), 15)} />
+          <CommandEmpty>No value found.</CommandEmpty>
+          <CommandGroup>
+            {allEvents.map((value: string, i: number) => (
+              <CommandItem key={i} onSelect={() => handleSelect(value)}>
+                <Check
+                  className={cn(
+                    'mr-2 h-4 w-4',
+                    selectedValues.includes(value) ? 'opacity-100' : 'opacity-0',
+                  )}
+                />
+                {value}
+              </CommandItem>
+            ))}
+          </CommandGroup>
+        </Command>
+      </PopoverContent>
+    </Popover>
+  );
+};
+
+export { MultiSelectCombobox };

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

@@ -5,7 +5,7 @@ import type { HTMLAttributes } from 'react';
 import Link from 'next/link';
 import { useParams, usePathname } from 'next/navigation';
 
-import { Braces, CreditCard, Settings, Users } from 'lucide-react';
+import { CreditCard, Settings, Users } from 'lucide-react';
 
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
 import { cn } from '@documenso/ui/lib/utils';
@@ -21,7 +21,6 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => {
 
   const settingsPath = `/t/${teamUrl}/settings`;
   const membersPath = `/t/${teamUrl}/settings/members`;
-  const tokensPath = `/t/${teamUrl}/settings/tokens`;
   const billingPath = `/t/${teamUrl}/settings/billing`;
 
   return (
@@ -49,16 +48,6 @@ export const DesktopNav = ({ className, ...props }: DesktopNavProps) => {
         </Button>
       </Link>
 
-      <Link href={tokensPath}>
-        <Button
-          variant="ghost"
-          className={cn('w-full justify-start', pathname?.startsWith(tokensPath) && 'bg-secondary')}
-        >
-          <Braces className="mr-2 h-5 w-5" />
-          API Tokens
-        </Button>
-      </Link>
-
       {IS_BILLING_ENABLED() && (
         <Link href={billingPath}>
           <Button

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

@@ -5,7 +5,7 @@ import type { HTMLAttributes } from 'react';
 import Link from 'next/link';
 import { useParams, usePathname } from 'next/navigation';
 
-import { Braces, CreditCard, Key, User } from 'lucide-react';
+import { CreditCard, Key, User } from 'lucide-react';
 
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
 import { cn } from '@documenso/ui/lib/utils';
@@ -21,7 +21,6 @@ export const MobileNav = ({ className, ...props }: MobileNavProps) => {
 
   const settingsPath = `/t/${teamUrl}/settings`;
   const membersPath = `/t/${teamUrl}/settings/members`;
-  const tokensPath = `/t/${teamUrl}/settings/tokens`;
   const billingPath = `/t/${teamUrl}/settings/billing`;
 
   return (
@@ -57,16 +56,6 @@ export const MobileNav = ({ className, ...props }: MobileNavProps) => {
         </Button>
       </Link>
 
-      <Link href={tokensPath}>
-        <Button
-          variant="ghost"
-          className={cn('w-full justify-start', pathname?.startsWith(tokensPath) && 'bg-secondary')}
-        >
-          <Braces className="mr-2 h-5 w-5" />
-          API Tokens
-        </Button>
-      </Link>
-
       {IS_BILLING_ENABLED() && (
         <Link href={billingPath}>
           <Button

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

@@ -1,28 +0,0 @@
-'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

@@ -1,318 +0,0 @@
-'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,
-      keepPreviousData: true,
-    },
-  );
-
-  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),
-                        },
-                      ];
-
-                      // Insert the name to the start of the array if available.
-                      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;
 };
 
-export const FRIENDLY_STATUS_MAP: Record<ExtendedDocumentStatus, FriendlyStatus> = {
+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 { useCallback, useEffect, useState } from 'react';
+import { 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 | string;
+  format?: DateTimeFormatOptions;
 };
 
 /**
@@ -22,24 +22,13 @@ 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(() =>
-    formatDateTime(DateTime.fromJSDate(new Date(date)).setLocale(locale)),
+    DateTime.fromJSDate(new Date(date)).setLocale(locale).toLocaleString(format),
   );
 
   useEffect(() => {
-    setLocaleDate(formatDateTime(DateTime.fromJSDate(new Date(date))));
-  }, [date, format, formatDateTime]);
+    setLocaleDate(DateTime.fromJSDate(new Date(date)).toLocaleString(format));
+  }, [date, format]);
 
   return (
     <span className={className} {...props}>

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

@@ -29,11 +29,6 @@ export const ZProfileFormSchema = z.object({
   signature: z.string().min(1, 'Signature Pad cannot be empty'),
 });
 
-export const ZTwoFactorAuthTokenSchema = z.object({
-  token: z.string(),
-});
-
-export type TTwoFactorAuthTokenSchema = z.infer<typeof ZTwoFactorAuthTokenSchema>;
 export type TProfileFormSchema = z.infer<typeof ZProfileFormSchema>;
 
 export type ProfileFormProps = {
@@ -55,11 +50,8 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
   });
 
   const isSubmitting = form.formState.isSubmitting;
-  const hasTwoFactorAuthentication = user.twoFactorEnabled;
 
   const { mutateAsync: updateProfile } = trpc.profile.updateProfile.useMutation();
-  const { mutateAsync: deleteAccount, isLoading: isDeletingAccount } =
-    trpc.profile.deleteAccount.useMutation();
 
   const onFormSubmit = async ({ name, signature }: TProfileFormSchema) => {
     try {
@@ -141,7 +133,7 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
           />
         </fieldset>
 
-        <Button type="submit" loading={isSubmitting} className="self-end">
+        <Button type="submit" loading={isSubmitting}>
           {isSubmitting ? 'Updating profile...' : 'Update profile'}
         </Button>
       </form>

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

@@ -46,10 +46,9 @@ type TCreateTokenFormSchema = z.infer<typeof ZCreateTokenFormSchema>;
 
 export type ApiTokenFormProps = {
   className?: string;
-  teamId?: number;
 };
 
-export const ApiTokenForm = ({ className, teamId }: ApiTokenFormProps) => {
+export const ApiTokenForm = ({ className }: ApiTokenFormProps) => {
   const router = useRouter();
 
   const [, copy] = useCopyToClipboard();
@@ -97,7 +96,6 @@ export const ApiTokenForm = ({ className, teamId }: ApiTokenFormProps) => {
   const onSubmit = async ({ tokenName, expirationDate }: TCreateTokenMutationSchema) => {
     try {
       await createTokenMutation({
-        teamId,
         tokenName,
         expirationDate: noExpirationDate ? null : expirationDate,
       });

apps/web/src/pages/api/v1/me/index.ts

@@ -0,0 +1,3 @@
+import { testCredentialsHandler } from '@documenso/lib/server-only/public-api/test-credentials';
+
+export default testCredentialsHandler;

apps/web/src/pages/api/v1/zapier/list-documents/index.ts

@@ -0,0 +1,3 @@
+import { listDocumentsHandler } from '@documenso/lib/server-only/webhooks/zapier/list-documents';
+
+export default listDocumentsHandler;

apps/web/src/pages/api/v1/zapier/signed-document/index.ts

@@ -0,0 +1,3 @@
+import { signedDocumentHandler } from '@documenso/lib/server-only/webhooks/zapier/signed-document';
+
+export default signedDocumentHandler;

apps/web/src/pages/api/v1/zapier/subscribe/index.ts

@@ -0,0 +1,3 @@
+import { subscribeHandler } from '@documenso/lib/server-only/webhooks/zapier/subscribe';
+
+export default subscribeHandler;

apps/web/src/pages/api/v1/zapier/unsubscribe/index.ts

@@ -0,0 +1,3 @@
+import { unsubscribeHandler } from '@documenso/lib/server-only/webhooks/zapier/unsubscribe';
+
+export default unsubscribeHandler;

apps/web/src/providers/team.tsx

@@ -1,31 +0,0 @@
-'use client';
-
-import { createContext, useContext } from 'react';
-import React from 'react';
-
-import type { Team } from '@documenso/prisma/client';
-
-interface TeamProviderProps {
-  children: React.ReactNode;
-  team: Team;
-}
-
-const TeamContext = createContext<Team | null>(null);
-
-export const useCurrentTeam = (): Team | null => {
-  const context = useContext(TeamContext);
-
-  if (!context) {
-    throw new Error('useCurrentTeam must be used within a TeamProvider');
-  }
-
-  return context;
-};
-
-export const useOptionalCurrentTeam = (): Team | null => {
-  return useContext(TeamContext);
-};
-
-export const TeamProvider = ({ children, team }: TeamProviderProps) => {
-  return <TeamContext.Provider value={team}>{children}</TeamContext.Provider>;
-};

package-lock.json

@@ -159,7 +159,6 @@
         "react-hotkeys-hook": "^4.4.1",
         "react-icons": "^4.11.0",
         "react-rnd": "^10.4.1",
-        "remeda": "^1.27.1",
         "sharp": "0.33.1",
         "ts-pattern": "^5.0.5",
         "typescript": "5.2.2",
@@ -16676,15 +16675,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/react-colorful": {
-      "version": "5.6.1",
-      "resolved": "https://registry.npmjs.org/react-colorful/-/react-colorful-5.6.1.tgz",
-      "integrity": "sha512-1exovf0uGTGyq5mXQT0zgQ80uvj2PCwvF8zY1RN9/vbJVSjSo3fsB/4L3ObbF7u70NduSiK4xu4Y6q1MHoUGEw==",
-      "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
-      }
-    },
     "node_modules/react-confetti": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/react-confetti/-/react-confetti-6.1.0.tgz",
@@ -21783,7 +21773,6 @@
         "luxon": "^3.4.2",
         "next": "14.0.3",
         "pdfjs-dist": "3.6.172",
-        "react-colorful": "^5.6.1",
         "react-day-picker": "^8.7.1",
         "react-hook-form": "^7.45.4",
         "react-pdf": "7.3.3",

package.json

@@ -47,9 +47,6 @@
     "apps/*",
     "packages/*"
   ],
-  "dependencies": {
-    "next-runtime-env": "^3.2.0"
-  },
   "overrides": {
     "next-auth": {
       "next": "14.0.3"
@@ -57,5 +54,8 @@
     "next-contentlayer": {
       "next": "14.0.3"
     }
+  },
+  "dependencies": {
+    "next-runtime-env": "^3.2.0"
   }
 }

packages/api/v1/contract.ts

@@ -1,6 +1,7 @@
 import { initContract } from '@ts-rest/core';
 
 import {
+  ZSendDocumentForSigningMutationSchema as SendDocumentMutationSchema,
   ZAuthorizationHeadersSchema,
   ZCreateDocumentFromTemplateMutationResponseSchema,
   ZCreateDocumentFromTemplateMutationSchema,
@@ -12,7 +13,6 @@ import {
   ZDeleteFieldMutationSchema,
   ZDeleteRecipientMutationSchema,
   ZGetDocumentsQuerySchema,
-  ZSendDocumentForSigningMutationSchema,
   ZSuccessfulDocumentResponseSchema,
   ZSuccessfulFieldResponseSchema,
   ZSuccessfulGetDocumentResponseSchema,
@@ -72,13 +72,13 @@ export const ApiContractV1 = c.router(
         401: ZUnsuccessfulResponseSchema,
         404: ZUnsuccessfulResponseSchema,
       },
-      summary: 'Create a new document from an existing template',
+      summary: 'Upload a new document and get a presigned URL',
     },
 
     sendDocument: {
       method: 'POST',
       path: '/api/v1/documents/:id/send',
-      body: ZSendDocumentForSigningMutationSchema,
+      body: SendDocumentMutationSchema,
       responses: {
         200: ZSuccessfulSigningResponseSchema,
         400: ZUnsuccessfulResponseSchema,

packages/api/v1/implementation.ts

@@ -1,6 +1,5 @@
 import { createNextRoute } from '@ts-rest/next';
 
-import { getServerLimits } from '@documenso/ee/server-only/limits/server';
 import { createDocumentData } from '@documenso/lib/server-only/document-data/create-document-data';
 import { upsertDocumentMeta } from '@documenso/lib/server-only/document-meta/upsert-document-meta';
 import { createDocument } from '@documenso/lib/server-only/document/create-document';
@@ -19,7 +18,6 @@ import { getRecipientsForDocument } from '@documenso/lib/server-only/recipient/g
 import { setRecipientsForDocument } from '@documenso/lib/server-only/recipient/set-recipients-for-document';
 import { updateRecipient } from '@documenso/lib/server-only/recipient/update-recipient';
 import { createDocumentFromTemplate } from '@documenso/lib/server-only/template/create-document-from-template';
-import { extractNextApiRequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { getPresignPostUrl } from '@documenso/lib/universal/upload/server-actions';
 import { DocumentDataType, DocumentStatus, SigningStatus } from '@documenso/prisma/client';
 
@@ -27,16 +25,11 @@ import { ApiContractV1 } from './contract';
 import { authenticatedMiddleware } from './middleware/authenticated';
 
 export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
-  getDocuments: authenticatedMiddleware(async (args, user, team) => {
+  getDocuments: authenticatedMiddleware(async (args, user) => {
     const page = Number(args.query.page) || 1;
     const perPage = Number(args.query.perPage) || 10;
 
-    const { data: documents, totalPages } = await findDocuments({
-      page,
-      perPage,
-      userId: user.id,
-      teamId: team?.id,
-    });
+    const { data: documents, totalPages } = await findDocuments({ page, perPage, userId: user.id });
 
     return {
       status: 200,
@@ -47,19 +40,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  getDocument: authenticatedMiddleware(async (args, user, team) => {
+  getDocument: authenticatedMiddleware(async (args, user) => {
     const { id: documentId } = args.params;
 
     try {
-      const document = await getDocumentById({
-        id: Number(documentId),
-        userId: user.id,
-        teamId: team?.id,
-      });
-
+      const document = await getDocumentById({ id: Number(documentId), userId: user.id });
       const recipients = await getRecipientsForDocument({
         documentId: Number(documentId),
-        teamId: team?.id,
         userId: user.id,
       });
 
@@ -80,29 +67,16 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     }
   }),
 
-  deleteDocument: authenticatedMiddleware(async (args, user, team) => {
+  deleteDocument: authenticatedMiddleware(async (args, user) => {
     const { id: documentId } = args.params;
 
     try {
-      const document = await getDocumentById({
-        id: Number(documentId),
-        userId: user.id,
-        teamId: team?.id,
-      });
-
-      if (!document) {
-        return {
-          status: 404,
-          body: {
-            message: 'Document not found',
-          },
-        };
-      }
+      const document = await getDocumentById({ id: Number(documentId), userId: user.id });
 
       const deletedDocument = await deleteDocument({
-        id: document.id,
+        id: Number(documentId),
         userId: user.id,
-        teamId: team?.id,
+        status: document.status,
       });
 
       return {
@@ -119,7 +93,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     }
   }),
 
-  createDocument: authenticatedMiddleware(async (args, user, team) => {
+  createDocument: authenticatedMiddleware(async (args, user) => {
     const { body } = args;
 
     try {
@@ -132,17 +106,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
         };
       }
 
-      const { remaining } = await getServerLimits({ email: user.email, teamId: team?.id });
-
-      if (remaining.documents <= 0) {
-        return {
-          status: 400,
-          body: {
-            message: 'You have reached the maximum number of documents allowed for this month',
-          },
-        };
-      }
-
       const fileName = body.title.endsWith('.pdf') ? body.title : `${body.title}.pdf`;
 
       const { url, key } = await getPresignPostUrl(fileName, 'application/pdf');
@@ -155,17 +118,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       const document = await createDocument({
         title: body.title,
         userId: user.id,
-        teamId: team?.id,
         documentDataId: documentData.id,
-        requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
       const recipients = await setRecipientsForDocument({
         userId: user.id,
-        teamId: team?.id,
         documentId: document.id,
         recipients: body.recipients,
-        requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
       return {
@@ -192,20 +151,9 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     }
   }),
 
-  createDocumentFromTemplate: authenticatedMiddleware(async (args, user, team) => {
+  createDocumentFromTemplate: authenticatedMiddleware(async (args, user) => {
     const { body, params } = args;
 
-    const { remaining } = await getServerLimits({ email: user.email, teamId: team?.id });
-
-    if (remaining.documents <= 0) {
-      return {
-        status: 400,
-        body: {
-          message: 'You have reached the maximum number of documents allowed for this month',
-        },
-      };
-    }
-
     const templateId = Number(params.templateId);
 
     const fileName = body.title.endsWith('.pdf') ? body.title : `${body.title}.pdf`;
@@ -213,16 +161,14 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const document = await createDocumentFromTemplate({
       templateId,
       userId: user.id,
-      teamId: team?.id,
       recipients: body.recipients,
     });
 
     await updateDocument({
       documentId: document.id,
       userId: user.id,
-      teamId: team?.id,
       data: {
-        title: fileName,
+        title: body.title,
       },
     });
 
@@ -234,7 +180,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
         message: body.meta.message,
         dateFormat: body.meta.dateFormat,
         timezone: body.meta.timezone,
-        requestMetadata: extractNextApiRequestMetadata(args.req),
       });
     }
 
@@ -253,10 +198,10 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  sendDocument: authenticatedMiddleware(async (args, user, team) => {
+  sendDocument: authenticatedMiddleware(async (args, user) => {
     const { id } = args.params;
 
-    const document = await getDocumentById({ id: Number(id), userId: user.id, teamId: team?.id });
+    const document = await getDocumentById({ id: Number(id), userId: user.id });
 
     if (!document) {
       return {
@@ -267,11 +212,11 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       };
     }
 
-    if (document.status === DocumentStatus.COMPLETED) {
+    if (document.status === 'PENDING') {
       return {
         status: 400,
         body: {
-          message: 'Document is already complete',
+          message: 'Document is already waiting for signing',
         },
       };
     }
@@ -313,8 +258,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       await sendDocument({
         documentId: Number(id),
         userId: user.id,
-        teamId: team?.id,
-        requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
       return {
@@ -333,14 +276,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     }
   }),
 
-  createRecipient: authenticatedMiddleware(async (args, user, team) => {
+  createRecipient: authenticatedMiddleware(async (args, user) => {
     const { id: documentId } = args.params;
     const { name, email, role } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     if (!document) {
@@ -364,7 +306,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const recipients = await getRecipientsForDocument({
       documentId: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     const recipientAlreadyExists = recipients.some((recipient) => recipient.email === email);
@@ -382,7 +323,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       const newRecipients = await setRecipientsForDocument({
         documentId: Number(documentId),
         userId: user.id,
-        teamId: team?.id,
         recipients: [
           ...recipients,
           {
@@ -391,7 +331,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
             role,
           },
         ],
-        requestMetadata: extractNextApiRequestMetadata(args.req),
       });
 
       const newRecipient = newRecipients.find((recipient) => recipient.email === email);
@@ -417,14 +356,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     }
   }),
 
-  updateRecipient: authenticatedMiddleware(async (args, user, team) => {
+  updateRecipient: authenticatedMiddleware(async (args, user) => {
     const { id: documentId, recipientId } = args.params;
     const { name, email, role } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     if (!document) {
@@ -448,12 +386,9 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const updatedRecipient = await updateRecipient({
       documentId: Number(documentId),
       recipientId: Number(recipientId),
-      userId: user.id,
-      teamId: team?.id,
       email,
       name,
       role,
-      requestMetadata: extractNextApiRequestMetadata(args.req),
     }).catch(() => null);
 
     if (!updatedRecipient) {
@@ -474,13 +409,12 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  deleteRecipient: authenticatedMiddleware(async (args, user, team) => {
+  deleteRecipient: authenticatedMiddleware(async (args, user) => {
     const { id: documentId, recipientId } = args.params;
 
     const document = await getDocumentById({
       id: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     if (!document) {
@@ -504,9 +438,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const deletedRecipient = await deleteRecipient({
       documentId: Number(documentId),
       recipientId: Number(recipientId),
-      userId: user.id,
-      teamId: team?.id,
-      requestMetadata: extractNextApiRequestMetadata(args.req),
     }).catch(() => null);
 
     if (!deletedRecipient) {
@@ -527,14 +458,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  createField: authenticatedMiddleware(async (args, user, team) => {
+  createField: authenticatedMiddleware(async (args, user) => {
     const { id: documentId } = args.params;
     const { recipientId, type, pageNumber, pageWidth, pageHeight, pageX, pageY } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     if (!document) {
@@ -581,15 +511,12 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const field = await createField({
       documentId: Number(documentId),
       recipientId: Number(recipientId),
-      userId: user.id,
-      teamId: team?.id,
       type,
       pageNumber,
       pageX,
       pageY,
       pageWidth,
       pageHeight,
-      requestMetadata: extractNextApiRequestMetadata(args.req),
     });
 
     const remappedField = {
@@ -615,14 +542,13 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  updateField: authenticatedMiddleware(async (args, user, team) => {
+  updateField: authenticatedMiddleware(async (args, user) => {
     const { id: documentId, fieldId } = args.params;
     const { recipientId, type, pageNumber, pageWidth, pageHeight, pageX, pageY } = args.body;
 
     const document = await getDocumentById({
       id: Number(documentId),
       userId: user.id,
-      teamId: team?.id,
     });
 
     if (!document) {
@@ -668,8 +594,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
 
     const updatedField = await updateField({
       fieldId: Number(fieldId),
-      userId: user.id,
-      teamId: team?.id,
       documentId: Number(documentId),
       recipientId: recipientId ? Number(recipientId) : undefined,
       type,
@@ -678,7 +602,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
       pageY,
       pageWidth,
       pageHeight,
-      requestMetadata: extractNextApiRequestMetadata(args.req),
     });
 
     const remappedField = {
@@ -704,7 +627,7 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     };
   }),
 
-  deleteField: authenticatedMiddleware(async (args, user, team) => {
+  deleteField: authenticatedMiddleware(async (args, user) => {
     const { id: documentId, fieldId } = args.params;
 
     const document = await getDocumentById({
@@ -761,9 +684,6 @@ export const ApiContractV1Implementation = createNextRoute(ApiContractV1, {
     const deletedField = await deleteField({
       documentId: Number(documentId),
       fieldId: Number(fieldId),
-      userId: user.id,
-      teamId: team?.id,
-      requestMetadata: extractNextApiRequestMetadata(args.req),
     }).catch(() => null);
 
     if (!deletedField) {

packages/api/v1/middleware/authenticated.ts

@@ -1,7 +1,7 @@
 import type { NextApiRequest } from 'next';
 
-import { getApiTokenByToken } from '@documenso/lib/server-only/public-api/get-api-token-by-token';
-import type { Team, User } from '@documenso/prisma/client';
+import { getUserByApiToken } from '@documenso/lib/server-only/public-api/get-user-by-token';
+import type { User } from '@documenso/prisma/client';
 
 export const authenticatedMiddleware = <
   T extends {
@@ -12,7 +12,7 @@ export const authenticatedMiddleware = <
     body: unknown;
   },
 >(
-  handler: (args: T, user: User, team?: Team | null) => Promise<R>,
+  handler: (args: T, user: User) => Promise<R>,
 ) => {
   return async (args: T) => {
     try {
@@ -25,9 +25,9 @@ export const authenticatedMiddleware = <
         throw new Error('Token was not provided for authenticated middleware');
       }
 
-      const apiToken = await getApiTokenByToken({ token });
+      const user = await getUserByApiToken({ token });
 
-      return await handler(args, apiToken.user, apiToken.team);
+      return await handler(args, user);
     } catch (_err) {
       console.log({ _err });
       return {

packages/api/v1/schema.ts

@@ -25,7 +25,6 @@ export type TDeleteDocumentMutationSchema = typeof ZDeleteDocumentMutationSchema
 export const ZSuccessfulDocumentResponseSchema = z.object({
   id: z.number(),
   userId: z.number(),
-  teamId: z.number().nullish(),
   title: z.string(),
   status: z.string(),
   documentDataId: z.string(),

packages/app-tests/e2e/pr-713-add-document-search-to-command-menu.spec.ts

@@ -15,7 +15,7 @@ test('[PR-713]: should see sent documents', async ({ page }) => {
 
   await page.keyboard.press('Meta+K');
 
-  await page.getByPlaceholder('Type a command or search...').first().fill('sent');
+  await page.getByPlaceholder('Type a command or search...').fill('sent');
   await expect(page.getByRole('option', { name: '[713] Document - Sent' })).toBeVisible();
 });
 
@@ -32,7 +32,7 @@ test('[PR-713]: should see received documents', async ({ page }) => {
 
   await page.keyboard.press('Meta+K');
 
-  await page.getByPlaceholder('Type a command or search...').first().fill('received');
+  await page.getByPlaceholder('Type a command or search...').fill('received');
   await expect(page.getByRole('option', { name: '[713] Document - Received' })).toBeVisible();
 });
 
@@ -49,6 +49,6 @@ test('[PR-713]: should be able to search by recipient', async ({ page }) => {
 
   await page.keyboard.press('Meta+K');
 
-  await page.getByPlaceholder('Type a command or search...').first().fill(recipient.email);
+  await page.getByPlaceholder('Type a command or search...').fill(recipient.email);
   await expect(page.getByRole('option', { name: '[713] Document - Sent' })).toBeVisible();
 });

packages/app-tests/e2e/templates/manage-templates.spec.ts

@@ -107,8 +107,6 @@ test('[TEMPLATES]: delete template', async ({ page }) => {
     await page.getByRole('menuitem', { name: 'Delete' }).click();
     await page.getByRole('button', { name: 'Delete' }).click();
     await expect(page.getByText('Template deleted').first()).toBeVisible();
-
-    await page.waitForTimeout(1000);
   }
 
   await unseedTeam(team.url);
@@ -189,18 +187,15 @@ test('[TEMPLATES]: use template', async ({ page }) => {
 
   // Use personal template.
   await page.getByRole('button', { name: 'Use Template' }).click();
-  await page.getByRole('button', { name: 'Create Document' }).click();
   await page.waitForURL(/documents/);
   await page.getByRole('main').getByRole('link', { name: 'Documents' }).click();
   await page.waitForURL('/documents');
   await expect(page.getByRole('main')).toContainText('Showing 1 result');
 
   await page.goto(`${WEBAPP_BASE_URL}/t/${team.url}/templates`);
-  await page.waitForTimeout(1000);
 
   // Use team template.
   await page.getByRole('button', { name: 'Use Template' }).click();
-  await page.getByRole('button', { name: 'Create Document' }).click();
   await page.waitForURL(/\/t\/.+\/documents/);
   await page.getByRole('main').getByRole('link', { name: 'Documents' }).click();
   await page.waitForURL(`/t/${team.url}/documents`);

packages/app-tests/e2e/test-auth-flow.spec.ts

@@ -1,19 +1,20 @@
 import { type Page, expect, test } from '@playwright/test';
 
-import {
-  extractUserVerificationToken,
-  seedUser,
-  unseedUser,
-  unseedUserByEmail,
-} from '@documenso/prisma/seed/users';
+import { deleteUser } from '@documenso/lib/server-only/user/delete-user';
 
 test.use({ storageState: { cookies: [], origins: [] } });
 
-test('user can sign up with email and password', async ({ page }: { page: Page }) => {
-  const username = 'Test User';
-  const email = `test-user-${Date.now()}@auth-flow.documenso.com`;
-  const password = 'Password123#';
+/*
+  Using them sequentially so the 2nd test
+  uses the details from the 1st (registration) test
+*/
+test.describe.configure({ mode: 'serial' });
 
+const username = 'Test User';
+const email = 'test-user@auth-flow.documenso.com';
+const password = 'Password123#';
+
+test('user can sign up with email and password', async ({ page }: { page: Page }) => {
   await page.goto('/signup');
   await page.getByLabel('Name').fill(username);
   await page.getByLabel('Email').fill(email);
@@ -30,33 +31,25 @@ test('user can sign up with email and password', async ({ page }: { page: Page }
   }
 
   await page.getByRole('button', { name: 'Sign Up', exact: true }).click();
-
-  await page.waitForURL('/unverified-account');
-
-  const { token } = await extractUserVerificationToken(email);
-
-  await page.goto(`/verify-email/${token}`);
-
-  await expect(page.getByRole('heading')).toContainText('Email Confirmed!');
-
-  await page.getByRole('link', { name: 'Go back home' }).click();
-
   await page.waitForURL('/documents');
 
   await expect(page).toHaveURL('/documents');
-  await unseedUserByEmail(email);
 });
 
 test('user can login with user and password', async ({ page }: { page: Page }) => {
-  const user = await seedUser();
-
   await page.goto('/signin');
-  await page.getByLabel('Email').fill(user.email);
-  await page.getByLabel('Password', { exact: true }).fill('password');
+  await page.getByLabel('Email').fill(email);
+  await page.getByLabel('Password', { exact: true }).fill(password);
   await page.getByRole('button', { name: 'Sign In' }).click();
 
   await page.waitForURL('/documents');
   await expect(page).toHaveURL('/documents');
-
-  await unseedUser(user.id);
+});
+
+test.afterAll('Teardown', async () => {
+  try {
+    await deleteUser({ email });
+  } catch (e) {
+    throw new Error(`Error deleting user: ${e}`);
+  }
 });

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

@@ -1,19 +0,0 @@
-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

@@ -22,8 +22,6 @@ export const FEATURE_FLAG_POLL_INTERVAL = 30000;
  */
 export const LOCAL_FEATURE_FLAGS: Record<string, boolean> = {
   app_billing: NEXT_PUBLIC_FEATURE_BILLING_ENABLED() === 'true',
-  app_teams: true,
-  app_document_page_view_history_sheet: false,
   marketing_header_single_player_mode: false,
 } as const;
 

packages/lib/constants/recipient-roles.ts

@@ -1,31 +1,29 @@
 import { RecipientRole } from '@documenso/prisma/client';
 
-export const RECIPIENT_ROLES_DESCRIPTION = {
+export const RECIPIENT_ROLES_DESCRIPTION: {
+  [key in RecipientRole]: { actionVerb: string; progressiveVerb: string; roleName: string };
+} = {
   [RecipientRole.APPROVER]: {
     actionVerb: 'Approve',
-    actioned: 'Approved',
     progressiveVerb: 'Approving',
     roleName: 'Approver',
   },
   [RecipientRole.CC]: {
     actionVerb: 'CC',
-    actioned: `CC'd`,
     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/server-only/2fa/validate-2fa.ts

@@ -1,4 +1,4 @@
-import type { User } from '@documenso/prisma/client';
+import { User } from '@documenso/prisma/client';
 
 import { ErrorCode } from '../../next-auth/error-codes';
 import { verifyTwoFactorAuthenticationToken } from './verify-2fa-token';

packages/lib/server-only/2fa/verify-2fa-token.ts

@@ -1,7 +1,7 @@
 import { base32 } from '@scure/base';
 import { TOTPController } from 'oslo/otp';
 
-import type { User } from '@documenso/prisma/client';
+import { User } from '@documenso/prisma/client';
 
 import { DOCUMENSO_ENCRYPTION_KEY } from '../../constants/crypto';
 import { symmetricDecrypt } from '../../universal/crypto';

packages/lib/server-only/admin/get-all-documents.ts

@@ -1,5 +1,5 @@
 import { prisma } from '@documenso/prisma';
-import type { Prisma } from '@documenso/prisma/client';
+import { Prisma } from '@documenso/prisma/client';
 
 export interface FindDocumentsOptions {
   term?: string;

packages/lib/server-only/admin/update-user.ts

@@ -1,5 +1,5 @@
 import { prisma } from '@documenso/prisma';
-import type { Role } from '@documenso/prisma/client';
+import { Role } from '@documenso/prisma/client';
 
 export type UpdateUserOptions = {
   id: number;

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

@@ -89,21 +89,17 @@ export const upsertDocumentMeta = async ({
       },
     });
 
-    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),
-          },
-        }),
-      });
-    }
+    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/complete-document-with-token.ts

@@ -5,7 +5,9 @@ import type { RequestMetadata } from '@documenso/lib/universal/extract-request-m
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
 import { DocumentStatus, SigningStatus } from '@documenso/prisma/client';
+import { WebhookTriggerEvents } from '@documenso/prisma/client';
 
+import { triggerWebhook } from '../../universal/trigger-webhook';
 import { sealDocument } from './seal-document';
 import { sendPendingEmail } from './send-pending-email';
 
@@ -15,14 +17,8 @@ export type CompleteDocumentWithTokenOptions = {
   requestMetadata?: RequestMetadata;
 };
 
-export const completeDocumentWithToken = async ({
-  token,
-  documentId,
-  requestMetadata,
-}: CompleteDocumentWithTokenOptions) => {
-  'use server';
-
-  const document = await prisma.document.findFirstOrThrow({
+const getDocument = async ({ token, documentId }: CompleteDocumentWithTokenOptions) => {
+  return await prisma.document.findFirstOrThrow({
     where: {
       id: documentId,
       Recipient: {
@@ -39,6 +35,16 @@ export const completeDocumentWithToken = async ({
       },
     },
   });
+};
+
+export const completeDocumentWithToken = async ({
+  token,
+  documentId,
+  requestMetadata,
+}: CompleteDocumentWithTokenOptions) => {
+  'use server';
+
+  const document = await getDocument({ token, documentId });
 
   if (document.status === DocumentStatus.COMPLETED) {
     throw new Error(`Document ${document.id} has already been completed`);
@@ -124,4 +130,11 @@ export const completeDocumentWithToken = async ({
   if (documents.count > 0) {
     await sealDocument({ documentId: document.id, requestMetadata });
   }
+
+  const updatedDocument = await getDocument({ token, documentId });
+
+  await triggerWebhook({
+    eventTrigger: WebhookTriggerEvents.DOCUMENT_SIGNED,
+    documentData: updatedDocument,
+  });
 };

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

@@ -5,6 +5,9 @@ import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-log
 import type { RequestMetadata } from '@documenso/lib/universal/extract-request-metadata';
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
+import { WebhookTriggerEvents } from '@documenso/prisma/client';
+
+import { triggerWebhook } from '../../universal/trigger-webhook';
 
 export type CreateDocumentOptions = {
   title: string;
@@ -63,6 +66,11 @@ export const createDocument = async ({
       }),
     });
 
+    await triggerWebhook({
+      eventTrigger: WebhookTriggerEvents.DOCUMENT_CREATED,
+      documentData: document,
+    });
+
     return document;
   });
 };

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

@@ -10,127 +10,80 @@ 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;
-  teamId?: number;
-  requestMetadata?: RequestMetadata;
+  status: DocumentStatus;
 };
 
-export const deleteDocument = async ({
-  id,
-  userId,
-  teamId,
-  requestMetadata,
-}: DeleteDocumentOptions) => {
-  const document = await prisma.document.findUnique({
-    where: {
-      id,
-      ...(teamId
-        ? {
-            team: {
-              id: teamId,
-              members: {
-                some: {
-                  userId,
-                },
-              },
-            },
-          }
-        : {
-            userId,
-            teamId: null,
-          }),
-    },
-    include: {
-      Recipient: true,
-      documentMeta: true,
-      User: true,
-    },
-  });
-
-  if (!document) {
-    throw new Error('Document not found');
-  }
-
-  const { status, User: user } = document;
-
+export const deleteDocument = async ({ id, userId, status }: DeleteDocumentOptions) => {
   // if the document is a draft, hard-delete
   if (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 } });
-    });
+    return await prisma.document.delete({ where: { id, userId, status: DocumentStatus.DRAFT } });
   }
 
   // if the document is pending, send cancellation emails to all recipients
-  if (status === DocumentStatus.PENDING && document.Recipient.length > 0) {
-    await Promise.all(
-      document.Recipient.map(async (recipient) => {
-        const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+  if (status === DocumentStatus.PENDING) {
+    const user = await prisma.user.findFirstOrThrow({
+      where: {
+        id: userId,
+      },
+    });
 
-        const template = createElement(DocumentCancelTemplate, {
-          documentName: document.title,
-          inviterName: user.name || undefined,
-          inviterEmail: user.email,
-          assetBaseUrl,
-        });
+    const document = await prisma.document.findUnique({
+      where: {
+        id,
+        status,
+        userId,
+      },
+      include: {
+        Recipient: true,
+        documentMeta: true,
+      },
+    });
 
-        await mailer.sendMail({
-          to: {
-            address: recipient.email,
-            name: recipient.name,
-          },
-          from: {
-            name: FROM_NAME,
-            address: FROM_ADDRESS,
-          },
-          subject: 'Document Cancelled',
-          html: render(template),
-          text: render(template, { plainText: true }),
-        });
-      }),
-    );
+    if (!document) {
+      throw new Error('Document not found');
+    }
+
+    if (document.Recipient.length > 0) {
+      await Promise.all(
+        document.Recipient.map(async (recipient) => {
+          const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
+
+          const template = createElement(DocumentCancelTemplate, {
+            documentName: document.title,
+            inviterName: user.name || undefined,
+            inviterEmail: user.email,
+            assetBaseUrl,
+          });
+
+          await mailer.sendMail({
+            to: {
+              address: recipient.email,
+              name: recipient.name,
+            },
+            from: {
+              name: FROM_NAME,
+              address: FROM_ADDRESS,
+            },
+            subject: 'Document Cancelled',
+            html: render(template),
+            text: render(template, { plainText: true }),
+          });
+        }),
+      );
+    }
   }
 
   // If the document is not a draft, only soft-delete.
-  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(),
-      },
-    });
+  return await prisma.document.update({
+    where: {
+      id,
+    },
+    data: {
+      deletedAt: new Date().toISOString(),
+    },
   });
 };

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

@@ -1,115 +0,0 @@
-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,19 +21,6 @@ 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

@@ -110,43 +110,40 @@ export const resendDocument = async ({
 
       const { actionVerb } = RECIPIENT_ROLES_DESCRIPTION[recipient.role];
 
-      await prisma.$transaction(
-        async (tx) => {
-          await mailer.sendMail({
-            to: {
-              address: email,
-              name,
-            },
-            from: {
-              name: FROM_NAME,
-              address: FROM_ADDRESS,
-            },
-            subject: customEmail?.subject
-              ? renderCustomEmailTemplate(customEmail.subject, customEmailTemplate)
-              : `Please ${actionVerb.toLowerCase()} this document`,
-            html: render(template),
-            text: render(template, { plainText: true }),
-          });
+      await prisma.$transaction(async (tx) => {
+        await mailer.sendMail({
+          to: {
+            address: email,
+            name,
+          },
+          from: {
+            name: FROM_NAME,
+            address: FROM_ADDRESS,
+          },
+          subject: customEmail?.subject
+            ? renderCustomEmailTemplate(customEmail.subject, customEmailTemplate)
+            : `Please ${actionVerb.toLowerCase()} this document`,
+          html: render(template),
+          text: render(template, { plainText: true }),
+        });
 
-          await tx.documentAuditLog.create({
-            data: createDocumentAuditLogData({
-              type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
-              documentId: document.id,
-              user,
-              requestMetadata,
-              data: {
-                emailType: recipientEmailType,
-                recipientEmail: recipient.email,
-                recipientName: recipient.name,
-                recipientRole: recipient.role,
-                recipientId: recipient.id,
-                isResending: true,
-              },
-            }),
-          });
-        },
-        { timeout: 30_000 },
-      );
+        await tx.documentAuditLog.create({
+          data: createDocumentAuditLogData({
+            type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
+            documentId: document.id,
+            user,
+            requestMetadata,
+            data: {
+              emailType: recipientEmailType,
+              recipientEmail: recipient.email,
+              recipientName: recipient.name,
+              recipientRole: recipient.role,
+              recipientId: recipient.id,
+              isResending: true,
+            },
+          }),
+        });
+      });
     }),
   );
 };

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

@@ -9,9 +9,11 @@ import { DOCUMENT_AUDIT_LOG_TYPE } from '@documenso/lib/types/document-audit-log
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
 import { DocumentStatus, RecipientRole, SigningStatus } from '@documenso/prisma/client';
+import { WebhookTriggerEvents } from '@documenso/prisma/client';
 import { signPdf } from '@documenso/signing';
 
 import type { RequestMetadata } from '../../universal/extract-request-metadata';
+import { triggerWebhook } from '../../universal/trigger-webhook';
 import { getFile } from '../../universal/upload/get-file';
 import { putFile } from '../../universal/upload/put-file';
 import { insertFieldInPDF } from '../pdf/insert-field-in-pdf';
@@ -134,4 +136,9 @@ export const sealDocument = async ({
   if (sendEmail) {
     await sendCompletedEmail({ documentId, requestMetadata });
   }
+
+  await triggerWebhook({
+    eventTrigger: WebhookTriggerEvents.DOCUMENT_COMPLETED,
+    documentData: document,
+  });
 };

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

@@ -49,47 +49,44 @@ export const sendCompletedEmail = async ({ documentId, requestMetadata }: SendDo
         downloadLink: `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${token}/complete`,
       });
 
-      await prisma.$transaction(
-        async (tx) => {
-          await mailer.sendMail({
-            to: {
-              address: email,
-              name,
+      await prisma.$transaction(async (tx) => {
+        await mailer.sendMail({
+          to: {
+            address: email,
+            name,
+          },
+          from: {
+            name: process.env.NEXT_PRIVATE_SMTP_FROM_NAME || 'Documenso',
+            address: process.env.NEXT_PRIVATE_SMTP_FROM_ADDRESS || 'noreply@documenso.com',
+          },
+          subject: 'Signing Complete!',
+          html: render(template),
+          text: render(template, { plainText: true }),
+          attachments: [
+            {
+              filename: document.title,
+              content: Buffer.from(buffer),
             },
-            from: {
-              name: process.env.NEXT_PRIVATE_SMTP_FROM_NAME || 'Documenso',
-              address: process.env.NEXT_PRIVATE_SMTP_FROM_ADDRESS || 'noreply@documenso.com',
-            },
-            subject: 'Signing Complete!',
-            html: render(template),
-            text: render(template, { plainText: true }),
-            attachments: [
-              {
-                filename: document.title,
-                content: Buffer.from(buffer),
-              },
-            ],
-          });
+          ],
+        });
 
-          await tx.documentAuditLog.create({
-            data: createDocumentAuditLogData({
-              type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
-              documentId: document.id,
-              user: null,
-              requestMetadata,
-              data: {
-                emailType: 'DOCUMENT_COMPLETED',
-                recipientEmail: recipient.email,
-                recipientName: recipient.name,
-                recipientId: recipient.id,
-                recipientRole: recipient.role,
-                isResending: false,
-              },
-            }),
-          });
-        },
-        { timeout: 30_000 },
-      );
+        await tx.documentAuditLog.create({
+          data: createDocumentAuditLogData({
+            type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
+            documentId: document.id,
+            user: null,
+            requestMetadata,
+            data: {
+              emailType: 'DOCUMENT_COMPLETED',
+              recipientEmail: recipient.email,
+              recipientName: recipient.name,
+              recipientId: recipient.id,
+              recipientRole: recipient.role,
+              isResending: false,
+            },
+          }),
+        });
+      });
     }),
   );
 };

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

@@ -10,24 +10,24 @@ import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-
 import { renderCustomEmailTemplate } from '@documenso/lib/utils/render-custom-email-template';
 import { prisma } from '@documenso/prisma';
 import { DocumentStatus, RecipientRole, SendStatus } from '@documenso/prisma/client';
+import { WebhookTriggerEvents } 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';
+import { triggerWebhook } from '../../universal/trigger-webhook';
 
 export type SendDocumentOptions = {
   documentId: number;
   userId: number;
-  teamId?: number;
   requestMetadata?: RequestMetadata;
 };
 
 export const sendDocument = async ({
   documentId,
   userId,
-  teamId,
   requestMetadata,
 }: SendDocumentOptions) => {
   const user = await prisma.user.findFirstOrThrow({
@@ -44,21 +44,20 @@ export const sendDocument = async ({
   const document = await prisma.document.findUnique({
     where: {
       id: documentId,
-      ...(teamId
-        ? {
-            team: {
-              id: teamId,
-              members: {
-                some: {
-                  userId,
-                },
+      OR: [
+        {
+          userId,
+        },
+        {
+          team: {
+            members: {
+              some: {
+                userId,
               },
             },
-          }
-        : {
-            userId,
-            teamId: null,
-          }),
+          },
+        },
+      ],
     },
     include: {
       Recipient: true,
@@ -111,76 +110,64 @@ export const sendDocument = async ({
 
       const { actionVerb } = RECIPIENT_ROLES_DESCRIPTION[recipient.role];
 
-      await prisma.$transaction(
-        async (tx) => {
-          await mailer.sendMail({
-            to: {
-              address: email,
-              name,
-            },
-            from: {
-              name: FROM_NAME,
-              address: FROM_ADDRESS,
-            },
-            subject: customEmail?.subject
-              ? renderCustomEmailTemplate(customEmail.subject, customEmailTemplate)
-              : `Please ${actionVerb.toLowerCase()} this document`,
-            html: render(template),
-            text: render(template, { plainText: true }),
-          });
+      await prisma.$transaction(async (tx) => {
+        await mailer.sendMail({
+          to: {
+            address: email,
+            name,
+          },
+          from: {
+            name: FROM_NAME,
+            address: FROM_ADDRESS,
+          },
+          subject: customEmail?.subject
+            ? renderCustomEmailTemplate(customEmail.subject, customEmailTemplate)
+            : `Please ${actionVerb.toLowerCase()} this document`,
+          html: render(template),
+          text: render(template, { plainText: true }),
+        });
 
-          await tx.recipient.update({
-            where: {
-              id: recipient.id,
-            },
+        await tx.recipient.update({
+          where: {
+            id: recipient.id,
+          },
+          data: {
+            sendStatus: SendStatus.SENT,
+          },
+        });
+
+        await tx.documentAuditLog.create({
+          data: createDocumentAuditLogData({
+            type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
+            documentId: document.id,
+            user,
+            requestMetadata,
             data: {
-              sendStatus: SendStatus.SENT,
+              emailType: recipientEmailType,
+              recipientEmail: recipient.email,
+              recipientName: recipient.name,
+              recipientRole: recipient.role,
+              recipientId: recipient.id,
+              isResending: false,
             },
-          });
-
-          await tx.documentAuditLog.create({
-            data: createDocumentAuditLogData({
-              type: DOCUMENT_AUDIT_LOG_TYPE.EMAIL_SENT,
-              documentId: document.id,
-              user,
-              requestMetadata,
-              data: {
-                emailType: recipientEmailType,
-                recipientEmail: recipient.email,
-                recipientName: recipient.name,
-                recipientRole: recipient.role,
-                recipientId: recipient.id,
-                isResending: false,
-              },
-            }),
-          });
-        },
-        { timeout: 30_000 },
-      );
+          }),
+        });
+      });
     }),
   );
 
-  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: {},
-        }),
-      });
-    }
+  const updatedDocument = await prisma.document.update({
+    where: {
+      id: documentId,
+    },
+    data: {
+      status: DocumentStatus.PENDING,
+    },
+  });
 
-    return await tx.document.update({
-      where: {
-        id: documentId,
-      },
-      data: {
-        status: DocumentStatus.PENDING,
-      },
-    });
+  await triggerWebhook({
+    eventTrigger: WebhookTriggerEvents.DOCUMENT_SENT,
+    documentData: updatedDocument,
   });
 
   return updatedDocument;

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

@@ -5,36 +5,16 @@ import type { Prisma } from '@prisma/client';
 import { prisma } from '@documenso/prisma';
 
 export type UpdateDocumentOptions = {
-  documentId: number;
   data: Prisma.DocumentUpdateInput;
   userId: number;
-  teamId?: number;
+  documentId: number;
 };
 
-export const updateDocument = async ({
-  documentId,
-  userId,
-  teamId,
-  data,
-}: UpdateDocumentOptions) => {
+export const updateDocument = async ({ documentId, userId, data }: UpdateDocumentOptions) => {
   return await prisma.document.update({
     where: {
       id: documentId,
-      ...(teamId
-        ? {
-            team: {
-              id: teamId,
-              members: {
-                some: {
-                  userId,
-                },
-              },
-            },
-          }
-        : {
-            userId,
-            teamId: null,
-          }),
+      userId,
     },
     data: {
       ...data,

packages/lib/server-only/document/update-title.ts

@@ -7,7 +7,6 @@ import { prisma } from '@documenso/prisma';
 
 export type UpdateTitleOptions = {
   userId: number;
-  teamId?: number;
   documentId: number;
   title: string;
   requestMetadata?: RequestMetadata;
@@ -15,7 +14,6 @@ export type UpdateTitleOptions = {
 
 export const updateTitle = async ({
   userId,
-  teamId,
   documentId,
   title,
   requestMetadata,
@@ -26,39 +24,34 @@ export const updateTitle = async ({
     },
   });
 
-  const document = await prisma.document.findFirstOrThrow({
-    where: {
-      id: documentId,
-      ...(teamId
-        ? {
+  return await prisma.$transaction(async (tx) => {
+    const document = await tx.document.findFirstOrThrow({
+      where: {
+        id: documentId,
+        OR: [
+          {
+            userId,
+          },
+          {
             team: {
-              id: teamId,
               members: {
                 some: {
                   userId,
                 },
               },
             },
-          }
-        : {
-            userId,
-            teamId: null,
-          }),
-    },
-  });
+          },
+        ],
+      },
+    });
 
-  if (document.title === title) {
-    return document;
-  }
+    if (document.title === title) {
+      return document;
+    }
 
-  return await prisma.$transaction(async (tx) => {
-    // Instead of doing everything in a transaction we can use our knowledge
-    // of the current document title to ensure we aren't performing a conflicting
-    // update.
     const updatedDocument = await tx.document.update({
       where: {
         id: documentId,
-        title: document.title,
       },
       data: {
         title,

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

@@ -3,6 +3,10 @@ import type { RequestMetadata } from '@documenso/lib/universal/extract-request-m
 import { createDocumentAuditLogData } from '@documenso/lib/utils/document-audit-logs';
 import { prisma } from '@documenso/prisma';
 import { ReadStatus } from '@documenso/prisma/client';
+import { WebhookTriggerEvents } from '@documenso/prisma/client';
+
+import { triggerWebhook } from '../../universal/trigger-webhook';
+import { getDocumentAndSenderByToken } from './get-document-by-token';
 
 export type ViewedDocumentOptions = {
   token: string;
@@ -23,8 +27,8 @@ export const viewedDocument = async ({ token, requestMetadata }: ViewedDocumentO
 
   const { documentId } = recipient;
 
-  await prisma.$transaction(async (tx) => {
-    await tx.recipient.update({
+  const { updatedRecipient } = await prisma.$transaction(async (tx) => {
+    const updatedRecipient = await tx.recipient.update({
       where: {
         id: recipient.id,
       },
@@ -50,5 +54,25 @@ export const viewedDocument = async ({ token, requestMetadata }: ViewedDocumentO
         },
       }),
     });
+
+    return { updatedRecipient };
+  });
+
+  const document = await getDocumentAndSenderByToken({ token });
+
+  await triggerWebhook({
+    eventTrigger: WebhookTriggerEvents.DOCUMENT_OPENED,
+    documentData: {
+      id: document.id,
+      userId: document.userId,
+      title: document.title,
+      status: document.status,
+      documentDataId: document.documentDataId,
+      createdAt: document.createdAt,
+      updatedAt: document.updatedAt,
+      completedAt: document.completedAt,
+      deletedAt: document.deletedAt,
+      teamId: document.teamId,
+    },
   });
 };

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

@@ -1,13 +1,8 @@
 import { prisma } from '@documenso/prisma';
-import type { FieldType, Team } from '@documenso/prisma/client';
-
-import type { RequestMetadata } from '../../universal/extract-request-metadata';
-import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
+import type { FieldType } from '@documenso/prisma/client';
 
 export type CreateFieldOptions = {
   documentId: number;
-  userId: number;
-  teamId?: number;
   recipientId: number;
   type: FieldType;
   pageNumber: number;
@@ -15,13 +10,10 @@ export type CreateFieldOptions = {
   pageY: number;
   pageWidth: number;
   pageHeight: number;
-  requestMetadata?: RequestMetadata;
 };
 
 export const createField = async ({
   documentId,
-  userId,
-  teamId,
   recipientId,
   type,
   pageNumber,
@@ -29,62 +21,7 @@ export const createField = async ({
   pageY,
   pageWidth,
   pageHeight,
-  requestMetadata,
 }: CreateFieldOptions) => {
-  const document = await prisma.document.findFirst({
-    select: {
-      id: true,
-    },
-    where: {
-      id: documentId,
-      ...(teamId
-        ? {
-            team: {
-              id: teamId,
-              members: {
-                some: {
-                  userId,
-                },
-              },
-            },
-          }
-        : {
-            userId,
-            teamId: null,
-          }),
-    },
-  });
-
-  if (!document) {
-    throw new Error('Document not found');
-  }
-
-  const user = await prisma.user.findFirstOrThrow({
-    where: {
-      id: userId,
-    },
-    select: {
-      id: true,
-      name: true,
-      email: true,
-    },
-  });
-
-  let team: Team | null = null;
-
-  if (teamId) {
-    team = await prisma.team.findFirst({
-      where: {
-        id: teamId,
-        members: {
-          some: {
-            userId,
-          },
-        },
-      },
-    });
-  }
-
   const field = await prisma.field.create({
     data: {
       documentId,
@@ -98,28 +35,6 @@ export const createField = async ({
       customText: '',
       inserted: false,
     },
-    include: {
-      Recipient: true,
-    },
-  });
-
-  await prisma.documentAuditLog.create({
-    data: createDocumentAuditLogData({
-      type: 'FIELD_CREATED',
-      documentId,
-      user: {
-        id: team?.id ?? user.id,
-        email: team?.name ?? user.email,
-        name: team ? '' : user.name,
-      },
-      data: {
-        fieldId: field.secondaryId,
-        fieldRecipientEmail: field.Recipient?.email ?? '',
-        fieldRecipientId: recipientId,
-        fieldType: field.type,
-      },
-      requestMetadata,
-    }),
   });
 
   return field;

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

@@ -1,89 +1,16 @@
 import { prisma } from '@documenso/prisma';
-import type { Team } from '@documenso/prisma/client';
-
-import type { RequestMetadata } from '../../universal/extract-request-metadata';
-import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
 
 export type DeleteFieldOptions = {
   fieldId: number;
   documentId: number;
-  userId: number;
-  teamId?: number;
-  requestMetadata?: RequestMetadata;
 };
 
-export const deleteField = async ({
-  fieldId,
-  userId,
-  teamId,
-  documentId,
-  requestMetadata,
-}: DeleteFieldOptions) => {
+export const deleteField = async ({ fieldId, documentId }: DeleteFieldOptions) => {
   const field = await prisma.field.delete({
     where: {
       id: fieldId,
-      Document: {
-        id: documentId,
-        ...(teamId
-          ? {
-              team: {
-                id: teamId,
-                members: {
-                  some: {
-                    userId,
-                  },
-                },
-              },
-            }
-          : {
-              userId,
-              teamId: null,
-            }),
-      },
-    },
-    include: {
-      Recipient: true,
-    },
-  });
-
-  const user = await prisma.user.findFirstOrThrow({
-    where: {
-      id: userId,
-    },
-    select: {
-      id: true,
-      name: true,
-      email: true,
-    },
-  });
-
-  let team: Team | null = null;
-
-  if (teamId) {
-    team = await prisma.team.findFirstOrThrow({
-      where: {
-        id: teamId,
-      },
-    });
-  }
-
-  await prisma.documentAuditLog.create({
-    data: createDocumentAuditLogData({
-      type: 'FIELD_DELETED',
       documentId,
-      user: {
-        id: team?.id ?? user.id,
-        email: team?.name ?? user.email,
-        name: team ? '' : user.name,
-      },
-      data: {
-        fieldId: field.secondaryId,
-        fieldRecipientEmail: field.Recipient?.email ?? '',
-        fieldRecipientId: field.recipientId ?? -1,
-        fieldType: field.type,
-      },
-      requestMetadata,
-    }),
+    },
   });
 
   return field;

packages/lib/server-only/field/update-field.ts

@@ -1,14 +1,9 @@
 import { prisma } from '@documenso/prisma';
-import type { FieldType, Team } from '@documenso/prisma/client';
-
-import type { RequestMetadata } from '../../universal/extract-request-metadata';
-import { createDocumentAuditLogData } from '../../utils/document-audit-logs';
+import type { FieldType } from '@documenso/prisma/client';
 
 export type UpdateFieldOptions = {
   fieldId: number;
   documentId: number;
-  userId: number;
-  teamId?: number;
   recipientId?: number;
   type?: FieldType;
   pageNumber?: number;
@@ -16,14 +11,11 @@ export type UpdateFieldOptions = {
   pageY?: number;
   pageWidth?: number;
   pageHeight?: number;
-  requestMetadata?: RequestMetadata;
 };
 
 export const updateField = async ({
   fieldId,
   documentId,
-  userId,
-  teamId,
   recipientId,
   type,
   pageNumber,
@@ -31,29 +23,11 @@ export const updateField = async ({
   pageY,
   pageWidth,
   pageHeight,
-  requestMetadata,
 }: UpdateFieldOptions) => {
   const field = await prisma.field.update({
     where: {
       id: fieldId,
-      Document: {
-        id: documentId,
-        ...(teamId
-          ? {
-              team: {
-                id: teamId,
-                members: {
-                  some: {
-                    userId,
-                  },
-                },
-              },
-            }
-          : {
-              userId,
-              teamId: null,
-            }),
-      },
+      documentId,
     },
     data: {
       recipientId,
@@ -64,58 +38,6 @@ export const updateField = async ({
       width: pageWidth,
       height: pageHeight,
     },
-    include: {
-      Recipient: true,
-    },
-  });
-
-  if (!field) {
-    throw new Error('Field not found');
-  }
-
-  const user = await prisma.user.findFirstOrThrow({
-    where: {
-      id: userId,
-    },
-    select: {
-      id: true,
-      name: true,
-      email: true,
-    },
-  });
-
-  let team: Team | null = null;
-
-  if (teamId) {
-    team = await prisma.team.findFirst({
-      where: {
-        id: teamId,
-        members: {
-          some: {
-            userId,
-          },
-        },
-      },
-    });
-  }
-
-  await prisma.documentAuditLog.create({
-    data: createDocumentAuditLogData({
-      type: 'FIELD_UPDATED',
-      documentId,
-      user: {
-        id: team?.id ?? user.id,
-        email: team?.name ?? user.email,
-        name: team ? '' : user.name,
-      },
-      data: {
-        fieldId: field.secondaryId,
-        fieldRecipientEmail: field.Recipient?.email ?? '',
-        fieldRecipientId: recipientId ?? -1,
-        fieldType: field.type,
-      },
-      requestMetadata,
-    }),
   });
 
   return field;

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

@@ -1,4 +1,3 @@
-// https://github.com/Hopding/pdf-lib/issues/20#issuecomment-412852821
 import fontkit from '@pdf-lib/fontkit';
 import { PDFDocument, StandardFonts } from 'pdf-lib';
 
@@ -74,17 +73,13 @@ export const insertFieldInPDF = async (pdf: PDFDocument, field: FieldWithSignatu
       height: imageHeight,
     });
   } else {
-    const longestLineInTextForWidth = field.customText
-      .split('\n')
-      .sort((a, b) => b.length - a.length)[0];
-
-    let textWidth = font.widthOfTextAtSize(longestLineInTextForWidth, fontSize);
+    let textWidth = font.widthOfTextAtSize(field.customText, fontSize);
     const textHeight = font.heightAtSize(fontSize);
 
     const scalingFactor = Math.min(fieldWidth / textWidth, fieldHeight / textHeight, 1);
 
     fontSize = Math.max(Math.min(fontSize * scalingFactor, maxFontSize), minFontSize);
-    textWidth = font.widthOfTextAtSize(longestLineInTextForWidth, fontSize);
+    textWidth = font.widthOfTextAtSize(field.customText, fontSize);
 
     const textX = fieldX + (fieldWidth - textWidth) / 2;
     let textY = fieldY + (fieldHeight - textHeight) / 2;

packages/lib/server-only/public-api/create-api-token.ts

@@ -2,7 +2,6 @@ import type { Duration } from 'luxon';
 import { DateTime } from 'luxon';
 
 import { prisma } from '@documenso/prisma';
-import { TeamMemberRole } from '@documenso/prisma/client';
 
 // temporary choice for testing only
 import * as timeConstants from '../../constants/time';
@@ -15,16 +14,14 @@ type TimeConstants = typeof timeConstants & {
 
 type CreateApiTokenInput = {
   userId: number;
-  teamId?: number;
   tokenName: string;
-  expiresIn: string | null;
+  expirationDate: string | null;
 };
 
 export const createApiToken = async ({
   userId,
-  teamId,
   tokenName,
-  expiresIn,
+  expirationDate,
 }: CreateApiTokenInput) => {
   const apiToken = `api_${alphaid(16)}`;
 
@@ -32,36 +29,23 @@ export const createApiToken = async ({
 
   const timeConstantsRecords: TimeConstants = timeConstants;
 
-  if (teamId) {
-    const member = await prisma.teamMember.findFirst({
-      where: {
-        userId,
-        teamId,
-        role: TeamMemberRole.ADMIN,
-      },
-    });
-
-    if (!member) {
-      throw new Error('You do not have permission to create a token for this team');
-    }
-  }
-
-  const storedToken = await prisma.apiToken.create({
+  const dbToken = await prisma.apiToken.create({
     data: {
-      name: tokenName,
       token: hashedToken,
-      expires: expiresIn ? DateTime.now().plus(timeConstantsRecords[expiresIn]).toJSDate() : null,
-      userId: teamId ? null : userId,
-      teamId,
+      name: tokenName,
+      userId,
+      expires: expirationDate
+        ? DateTime.now().plus(timeConstantsRecords[expirationDate]).toJSDate()
+        : null,
     },
   });
 
-  if (!storedToken) {
+  if (!dbToken) {
     throw new Error('Failed to create the API token');
   }
 
   return {
-    id: storedToken.id,
+    id: dbToken.id,
     token: apiToken,
   };
 };

packages/lib/server-only/public-api/delete-api-token-by-id.ts

@@ -1,32 +1,15 @@
 import { prisma } from '@documenso/prisma';
-import { TeamMemberRole } from '@documenso/prisma/client';
 
 export type DeleteTokenByIdOptions = {
   id: number;
   userId: number;
-  teamId?: number;
 };
 
-export const deleteTokenById = async ({ id, userId, teamId }: DeleteTokenByIdOptions) => {
-  if (teamId) {
-    const member = await prisma.teamMember.findFirst({
-      where: {
-        userId,
-        teamId,
-        role: TeamMemberRole.ADMIN,
-      },
-    });
-
-    if (!member) {
-      throw new Error('You do not have permission to delete this token');
-    }
-  }
-
+export const deleteTokenById = async ({ id, userId }: DeleteTokenByIdOptions) => {
   return await prisma.apiToken.delete({
     where: {
       id,
-      userId: teamId ? null : userId,
-      teamId,
+      userId,
     },
   });
 };

packages/lib/server-only/public-api/get-all-team-tokens.ts

@@ -1,36 +0,0 @@
-import { prisma } from '@documenso/prisma';
-import { TeamMemberRole } from '@documenso/prisma/client';
-
-export type GetUserTokensOptions = {
-  userId: number;
-  teamId: number;
-};
-
-export const getTeamTokens = async ({ userId, teamId }: GetUserTokensOptions) => {
-  const teamMember = await prisma.teamMember.findFirst({
-    where: {
-      userId,
-      teamId,
-    },
-  });
-
-  if (teamMember?.role !== TeamMemberRole.ADMIN) {
-    throw new Error('You do not have permission to view tokens for this team');
-  }
-
-  return await prisma.apiToken.findMany({
-    where: {
-      teamId,
-    },
-    select: {
-      id: true,
-      name: true,
-      algorithm: true,
-      createdAt: true,
-      expires: true,
-    },
-    orderBy: {
-      createdAt: 'desc',
-    },
-  });
-};