fix: add email reporting (#2918)

apps/remix/app/components/general/organisation-usage-panel.tsx

@@ -1,13 +1,19 @@
+import { currentMonthlyPeriod } from '@documenso/lib/universal/monthly-period';
 import { Progress } from '@documenso/ui/primitives/progress';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@documenso/ui/primitives/select';
 
 import { Trans } from '@lingui/react/macro';
 import type { OrganisationClaim, OrganisationMonthlyStat } from '@prisma/client';
+import { useState } from 'react';
 import { match } from 'ts-pattern';
 import { OrganisationUsageResetButton } from './organisation-usage-reset-button';
 
 type OrganisationUsagePanelProps = {
   organisationId: string;
-  monthlyStats: Pick<OrganisationMonthlyStat, 'period' | 'documentCount' | 'emailCount' | 'apiCount'>[];
+  monthlyStats: Pick<
+    OrganisationMonthlyStat,
+    'period' | 'documentCount' | 'emailCount' | 'apiCount' | 'emailReports'
+  >[];
   organisationClaim: OrganisationClaim;
 };
 
@@ -16,34 +22,56 @@ export const OrganisationUsagePanel = ({
   monthlyStats,
   organisationClaim,
 }: OrganisationUsagePanelProps) => {
+  const [selectedPeriod, setSelectedPeriod] = useState<string | undefined>(() => monthlyStats[0]?.period);
+
+  const selectedStat = monthlyStats.find((stat) => stat.period === selectedPeriod) ?? monthlyStats[0];
+
+  // Resetting a counter only affects the current month (the server hardcodes the
+  // current period), so only offer the reset action when viewing the current month.
+  const isCurrentPeriod = selectedStat?.period === currentMonthlyPeriod();
+
   const rows = [
     {
       counter: 'document' as const,
       label: <Trans>Documents</Trans>,
-      used: monthlyStats[0]?.documentCount ?? 0,
+      used: selectedStat?.documentCount ?? 0,
       effectiveLimit: organisationClaim.documentQuota,
     },
     {
       counter: 'email' as const,
       label: <Trans>Emails</Trans>,
-      used: monthlyStats[0]?.emailCount ?? 0,
+      used: selectedStat?.emailCount ?? 0,
       effectiveLimit: organisationClaim.emailQuota,
     },
     {
       counter: 'api' as const,
       label: <Trans>API requests</Trans>,
-      used: monthlyStats[0]?.apiCount ?? 0,
+      used: selectedStat?.apiCount ?? 0,
       effectiveLimit: organisationClaim.apiQuota,
     },
   ];
 
-  // Todo: This may not show if the organisation has no usage data for the current month.
   return (
     <div className="space-y-4 rounded-md border p-4">
-      <div>
+      <div className="flex items-center justify-between gap-2">
         <h3 className="font-medium text-sm">
-          <Trans>Usage for period: {monthlyStats[0]?.period || 'N/A'}</Trans>
+          <Trans>Usage for period: {selectedStat?.period || 'N/A'}</Trans>
         </h3>
+
+        {monthlyStats.length > 0 && (
+          <Select value={selectedStat?.period} onValueChange={setSelectedPeriod}>
+            <SelectTrigger className="w-40">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              {monthlyStats.map((stat) => (
+                <SelectItem key={stat.period} value={stat.period}>
+                  {stat.period}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+        )}
       </div>
 
       {rows.map((row) => {
@@ -67,7 +95,7 @@ export const OrganisationUsagePanel = ({
 
             {row.effectiveLimit && row.effectiveLimit > 0 ? <Progress className="h-2 w-full" value={percent} /> : null}
 
-            {monthlyStats[0] && (
+            {selectedStat && isCurrentPeriod && (
               <div className="flex w-full justify-end pt-1">
                 <OrganisationUsageResetButton organisationId={organisationId} counter={row.counter} />
               </div>
@@ -75,6 +103,15 @@ export const OrganisationUsagePanel = ({
           </div>
         );
       })}
+
+      <div className="space-y-1">
+        <div className="flex items-center justify-between text-sm">
+          <span>
+            <Trans>Reports</Trans>
+          </span>
+          <span className="text-muted-foreground">{selectedStat?.emailReports ?? 0}</span>
+        </div>
+      </div>
     </div>
   );
 };

apps/remix/app/components/tables/admin-organisation-stats-table.tsx

@@ -12,11 +12,17 @@ import { ChevronDownIcon, ChevronsUpDownIcon, ChevronUpIcon } from 'lucide-react
 import { useMemo } from 'react';
 import { Link, useSearchParams } from 'react-router';
 
-type OrderByColumn = 'documentCount' | 'emailCount' | 'apiCount' | 'totalCount';
+type OrderByColumn = 'documentCount' | 'emailCount' | 'apiCount' | 'emailReports' | 'totalCount';
 type OrderByDirection = 'asc' | 'desc';
 
 const parseOrderByColumn = (value: string | undefined): OrderByColumn | undefined => {
-  if (value === 'documentCount' || value === 'emailCount' || value === 'apiCount' || value === 'totalCount') {
+  if (
+    value === 'documentCount' ||
+    value === 'emailCount' ||
+    value === 'apiCount' ||
+    value === 'emailReports' ||
+    value === 'totalCount'
+  ) {
     return value;
   }
 
@@ -27,10 +33,38 @@ const parseOrderByDirection = (value: string | undefined): OrderByDirection => {
   return value === 'asc' ? 'asc' : 'desc';
 };
 
-export const AdminOrganisationStatsTable = () => {
+/**
+ * Number of days to divide the period's usage by to get a per-day average.
+ *
+ * For the in-progress (current) month we divide by today's UTC day-of-month so the
+ * average reflects elapsed days only. For a fully-elapsed past month we divide by the
+ * total number of days in that month.
+ */
+const getPeriodDivisor = (period: string): number => {
+  if (period === currentMonthlyPeriod()) {
+    return new Date().getUTCDate();
+  }
+
+  const [yearStr, monthStr] = period.split('-');
+  const year = Number(yearStr);
+  const month = Number(monthStr);
+
+  if (Number.isNaN(year) || Number.isNaN(month)) {
+    return new Date().getUTCDate();
+  }
+
+  // Day 0 of the following month resolves to the last day of `month`.
+  return new Date(Date.UTC(year, month, 0)).getUTCDate();
+};
+
+type AdminOrganisationStatsTableProps = {
+  showDailyAverages?: boolean;
+};
+
+export const AdminOrganisationStatsTable = ({ showDailyAverages = true }: AdminOrganisationStatsTableProps) => {
   const { t } = useLingui();
 
-  const [searchParams] = useSearchParams();
+  const [searchParams, setSearchParams] = useSearchParams();
   const updateSearchParams = useUpdateSearchParams();
 
   const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
@@ -61,10 +95,17 @@ export const AdminOrganisationStatsTable = () => {
   const handleColumnSort = (column: OrderByColumn) => {
     const nextDirection = orderByColumn === column && orderByDirection === 'desc' ? 'asc' : 'desc';
 
-    updateSearchParams({
+    // Use the functional updater so we merge onto the latest params. Reading the
-      orderByColumn: column,
+    // captured `searchParams` here would drop filters (e.g. claimId) that changed
-      orderByDirection: nextDirection,
+    // after this handler was memoised into the column definitions.
-      page: 1,
+    setSearchParams((previous) => {
+      const next = new URLSearchParams(previous);
+
+      next.set('orderByColumn', column);
+      next.set('orderByDirection', nextDirection);
+      next.set('page', '1');
+
+      return next;
     });
   };
 
@@ -76,6 +117,27 @@ export const AdminOrganisationStatsTable = () => {
   };
 
   const columns = useMemo(() => {
+    const divisor = getPeriodDivisor(period);
+
+    const formatPerDay = (used: number) => {
+      const perDay = divisor > 0 ? used / divisor : 0;
+      const rounded = Math.round(perDay * 10) / 10;
+
+      return Number.isInteger(rounded) ? String(rounded) : rounded.toFixed(1);
+    };
+
+    const renderUsageCell = (used: number, quota: number | null) => {
+      if (showDailyAverages) {
+        return <span>~{formatPerDay(used)}/day</span>;
+      }
+
+      return (
+        <span>
+          {used} / {quota === null ? '∞' : quota}
+        </span>
+      );
+    };
+
     const sortableHeader = (label: string, column: OrderByColumn) => (
       <button
         type="button"
@@ -100,7 +162,7 @@ export const AdminOrganisationStatsTable = () => {
         header: t`Organisation`,
         accessorKey: 'organisationName',
         cell: ({ row }) => (
-          <Link to={`/admin/organisations/${row.original.organisationId}`} className="hover:underline">
+          <Link to={`/admin/organisations/${row.original.organisationId}`} className="text-xs hover:underline">
             {row.original.organisationName}
           </Link>
         ),
@@ -108,27 +170,32 @@ export const AdminOrganisationStatsTable = () => {
       {
         header: t`Claim`,
         accessorKey: 'originalClaimId',
-        cell: ({ row }) => <span className="text-muted-foreground">{row.original.originalClaimId ?? '—'}</span>,
+        cell: ({ row }) => <span className="text-muted-foreground text-xs">{row.original.originalClaimId ?? '—'}</span>,
       },
       {
         header: t`Period`,
         accessorKey: 'period',
-        cell: ({ row }) => row.original.period,
+        cell: ({ row }) => <span className="text-xs">{row.original.period}</span>,
       },
       {
         header: () => sortableHeader(t`Documents`, 'documentCount'),
         accessorKey: 'documentCount',
-        cell: ({ row }) => row.original.documentCount,
+        cell: ({ row }) => renderUsageCell(row.original.documentCount, row.original.documentQuota),
       },
       {
         header: () => sortableHeader(t`Emails`, 'emailCount'),
         accessorKey: 'emailCount',
-        cell: ({ row }) => row.original.emailCount,
+        cell: ({ row }) => renderUsageCell(row.original.emailCount, row.original.emailQuota),
       },
       {
         header: () => sortableHeader(t`API`, 'apiCount'),
         accessorKey: 'apiCount',
-        cell: ({ row }) => row.original.apiCount,
+        cell: ({ row }) => renderUsageCell(row.original.apiCount, row.original.apiQuota),
+      },
+      {
+        header: () => sortableHeader(t`Reports`, 'emailReports'),
+        accessorKey: 'emailReports',
+        cell: ({ row }) => row.original.emailReports,
       },
       {
         header: () => sortableHeader(t`Total`, 'totalCount'),
@@ -136,14 +203,19 @@ export const AdminOrganisationStatsTable = () => {
         cell: ({ row }) => <span className="font-medium">{row.original.totalCount}</span>,
       },
     ] satisfies DataTableColumnDef<(typeof results)['data'][number]>[];
+    // `searchParams` must be a dependency: `handleColumnSort` closes over `setSearchParams`,
+    // whose functional updater is bound to the `searchParams` captured at creation time.
+    // Without this, changing a filter (e.g. claimId) wouldn't refresh the memoised handler,
+    // and sorting would merge onto stale params and drop the active filter.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [t, orderByColumn, orderByDirection]);
+  }, [t, orderByColumn, orderByDirection, period, showDailyAverages, searchParams]);
 
   return (
     <div>
       <DataTable
         columns={columns}
         data={results.data}
+        rowClassName="text-xs"
         perPage={results.perPage}
         currentPage={results.currentPage}
         totalPages={results.totalPages}
@@ -177,6 +249,9 @@ export const AdminOrganisationStatsTable = () => {
               <TableCell>
                 <Skeleton className="h-4 w-10 rounded-full" />
               </TableCell>
+              <TableCell>
+                <Skeleton className="h-4 w-10 rounded-full" />
+              </TableCell>
             </>
           ),
         }}

apps/remix/app/routes/_authenticated+/admin+/documents._index.tsx

@@ -131,7 +131,7 @@ export default function AdminDocumentsPage() {
         <div>
           <Input
             type="search"
-            placeholder={_(msg`Search by document title`)}
+            placeholder={_(msg`Search by document title, team:123 or user:123`)}
             value={term}
             onChange={(e) => setTerm(e.target.value)}
           />

apps/remix/app/routes/_authenticated+/admin+/organisation-stats._index.tsx

@@ -3,6 +3,7 @@ import { currentMonthlyPeriod } from '@documenso/lib/universal/monthly-period';
 import { trpc } from '@documenso/trpc/react';
 import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
 import { Input } from '@documenso/ui/primitives/input';
+import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@documenso/ui/primitives/select';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { useEffect, useMemo, useState } from 'react';
@@ -52,6 +53,8 @@ export default function OrganisationStats() {
 
   const [searchQuery, setSearchQuery] = useState(() => searchParams?.get('query') ?? '');
 
+  const [displayMode, setDisplayMode] = useState<'quotas' | 'averages'>('quotas');
+
   const debouncedSearchQuery = useDebouncedValue(searchQuery, 500);
 
   const periodOptions = useMemo(() => generatePeriodOptions(), []);
@@ -157,9 +160,29 @@ export default function OrganisationStats() {
       </div>
 
       <div className="mt-4">
-        <AdminOrganisationStatsTable />
+        <AdminOrganisationStatsTable showDailyAverages={displayMode === 'averages'} />
       </div>
 
+      <RadioGroup
+        value={displayMode}
+        onValueChange={(value) => setDisplayMode(value === 'averages' ? 'averages' : 'quotas')}
+        className="mt-4 flex flex-col gap-3 rounded-lg border border-border p-4"
+      >
+        <div className="flex items-center gap-2">
+          <RadioGroupItem id="display-quotas" value="quotas" />
+          <label htmlFor="display-quotas" className="text-muted-foreground text-sm">
+            <Trans>Show quotas for documents, emails and API usages</Trans>
+          </label>
+        </div>
+
+        <div className="flex items-center gap-2">
+          <RadioGroupItem id="display-averages" value="averages" />
+          <label htmlFor="display-averages" className="text-muted-foreground text-sm">
+            <Trans>Show daily averages for documents, emails and API usages</Trans>
+          </label>
+        </div>
+      </RadioGroup>
+
       <Alert variant="neutral" className="mt-4">
         <AlertDescription>
           <Trans>

apps/remix/app/routes/_recipient+/report.$token.tsx

@@ -0,0 +1,92 @@
+import { SUPPORT_EMAIL } from '@documenso/lib/constants/app';
+import { prisma } from '@documenso/prisma';
+import { trpc } from '@documenso/trpc/react';
+import { Button } from '@documenso/ui/primitives/button';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+import { Trans, useLingui } from '@lingui/react/macro';
+import { useState } from 'react';
+
+import type { Route } from './+types/report.$token';
+
+export async function loader({ params }: Route.LoaderArgs) {
+  const { token } = params;
+
+  if (!token) {
+    throw new Response('Not Found', { status: 404 });
+  }
+
+  // Only validate the token on GET. The report itself is performed by an explicit
+  // mutation (triggered by the recipient clicking the button), so an automated email
+  // link scanner / prefetcher cannot register a report simply by fetching the URL.
+  const recipient = await prisma.recipient.findFirst({
+    where: { token },
+    select: { id: true },
+  });
+
+  if (!recipient) {
+    throw new Response('Not Found', { status: 404 });
+  }
+
+  return {
+    token,
+  };
+}
+
+export default function ReportSenderPage({ loaderData }: Route.ComponentProps) {
+  const { token } = loaderData;
+
+  const { t } = useLingui();
+  const { toast } = useToast();
+
+  const [isReported, setIsReported] = useState(false);
+
+  const { mutate: reportSender, isPending } = trpc.envelope.recipient.report.useMutation({
+    onSuccess: () => setIsReported(true),
+    onError: () => {
+      toast({
+        title: t`Something went wrong`,
+        description: t`We were unable to report this sender at this time. Please try again later.`,
+        variant: 'destructive',
+      });
+    },
+  });
+
+  if (isReported) {
+    return (
+      <div className="-mx-4 flex flex-col items-center px-4 pt-16 md:-mx-8 md:px-8 lg:pt-20 xl:pt-28">
+        <h1 className="max-w-[35ch] text-center font-semibold text-2xl leading-normal md:text-3xl">
+          <Trans>Sender reported</Trans>
+        </h1>
+
+        <p className="mt-4 max-w-[60ch] text-center text-muted-foreground leading-normal">
+          <Trans>
+            Thank you for letting us know, we have flagged this sender for review. If you have any concerns please feel
+            free to reach out to our{' '}
+            <a className="text-documenso-700 underline" href={`mailto:${SUPPORT_EMAIL}`}>
+              support team
+            </a>
+            .
+          </Trans>
+        </p>
+      </div>
+    );
+  }
+
+  return (
+    <div className="-mx-4 flex flex-col items-center px-4 pt-16 md:-mx-8 md:px-8 lg:pt-20 xl:pt-28">
+      <h1 className="max-w-[35ch] text-center font-semibold text-2xl leading-normal md:text-3xl">
+        <Trans>Report this sender?</Trans>
+      </h1>
+
+      <p className="mt-4 max-w-[60ch] text-center text-muted-foreground leading-normal">
+        <Trans>
+          If you did not expect this email or believe it is spam, you can report the sender to our team for review.
+        </Trans>
+      </p>
+
+      <Button className="mt-6" loading={isPending} onClick={() => reportSender({ token })}>
+        <Trans>Report sender</Trans>
+      </Button>
+    </div>
+  );
+}

packages/app-tests/e2e/recipient/report-sender.spec.ts

@@ -0,0 +1,65 @@
+import { currentMonthlyPeriod } from '@documenso/lib/universal/monthly-period';
+import { prisma } from '@documenso/prisma';
+import { seedPendingDocument } from '@documenso/prisma/seed/documents';
+import { seedUser } from '@documenso/prisma/seed/users';
+import { expect, test } from '@playwright/test';
+
+const getEmailReports = async (organisationId: string) => {
+  const stat = await prisma.organisationMonthlyStat.findUnique({
+    where: {
+      organisationId_period: {
+        organisationId,
+        period: currentMonthlyPeriod(),
+      },
+    },
+    select: { emailReports: true },
+  });
+
+  return stat?.emailReports ?? 0;
+};
+
+test('[REPORT_SENDER]: only reports the sender after the button is clicked', async ({ page }) => {
+  const { user, team, organisation } = await seedUser();
+
+  const document = await seedPendingDocument(user, team.id, ['recipient@documenso.com']);
+  const token = document.recipients[0].token;
+
+  expect(await getEmailReports(organisation.id)).toBe(0);
+
+  await page.goto(`/report/${token}`);
+
+  // Visiting the page (GET) must not register a report.
+  await expect(page.getByRole('heading', { name: 'Report this sender?' })).toBeVisible();
+  expect(await getEmailReports(organisation.id)).toBe(0);
+
+  await page.getByRole('button', { name: 'Report sender' }).click();
+
+  await expect(page.getByRole('heading', { name: 'Sender reported' })).toBeVisible();
+
+  expect(await getEmailReports(organisation.id)).toBe(1);
+});
+
+test('[REPORT_SENDER]: does not double count within the rate limit window', async ({ page }) => {
+  test.skip(process.env.DANGEROUS_BYPASS_RATE_LIMITS === 'true', 'Rate limits are bypassed');
+
+  const { user, team, organisation } = await seedUser();
+
+  const document = await seedPendingDocument(user, team.id, ['recipient@documenso.com']);
+  const token = document.recipients[0].token;
+
+  await page.goto(`/report/${token}`);
+  await page.getByRole('button', { name: 'Report sender' }).click();
+  await expect(page.getByRole('heading', { name: 'Sender reported' })).toBeVisible();
+
+  await page.goto(`/report/${token}`);
+  await page.getByRole('button', { name: 'Report sender' }).click();
+  await expect(page.getByRole('heading', { name: 'Sender reported' })).toBeVisible();
+
+  expect(await getEmailReports(organisation.id)).toBe(1);
+});
+
+test('[REPORT_SENDER]: returns 404 for an invalid token', async ({ page }) => {
+  const response = await page.goto('/report/not-a-real-token');
+
+  expect(response?.status()).toBe(404);
+});

packages/email/template-components/template-footer.tsx

@@ -5,13 +5,26 @@ import { useBranding } from '../providers/branding';
 
 export type TemplateFooterProps = {
   isDocument?: boolean;
+  reportUrl?: string;
 };
 
-export const TemplateFooter = ({ isDocument = true }: TemplateFooterProps) => {
+export const TemplateFooter = ({ isDocument = true, reportUrl }: TemplateFooterProps) => {
   const branding = useBranding();
 
   return (
     <Section>
+      {reportUrl && (
+        <Text className="my-4 text-base text-slate-400">
+          <Trans>
+            Did not expect this email?{' '}
+            <Link className="text-[#7AC455]" href={reportUrl}>
+              Click here to report the sender
+            </Link>
+            . Never sign a document you don't recognize or weren't expecting.
+          </Trans>
+        </Text>
+      )}
+
       {isDocument && !branding.brandingHidePoweredBy && (
         <Text className="my-4 text-base text-slate-400">
           <Trans>

packages/email/templates/document-completed.tsx

@@ -9,6 +9,7 @@ import { TemplateFooter } from '../template-components/template-footer';
 
 export type DocumentCompletedEmailTemplateProps = Partial<TemplateDocumentCompletedProps> & {
   customBody?: string;
+  reportUrl?: string;
 };
 
 export const DocumentCompletedEmailTemplate = ({
@@ -16,6 +17,7 @@ export const DocumentCompletedEmailTemplate = ({
   documentName = 'Open Source Pledge.pdf',
   assetBaseUrl = 'http://localhost:3002',
   customBody,
+  reportUrl,
 }: DocumentCompletedEmailTemplateProps) => {
   const { _ } = useLingui();
   const branding = useBranding();
@@ -51,7 +53,7 @@ export const DocumentCompletedEmailTemplate = ({
           </Container>
 
           <Container className="mx-auto max-w-xl">
-            <TemplateFooter />
+            <TemplateFooter reportUrl={reportUrl} />
           </Container>
         </Section>
       </Body>

packages/email/templates/document-invite.tsx

@@ -20,6 +20,7 @@ export type DocumentInviteEmailTemplateProps = Partial<TemplateDocumentInvitePro
   teamEmail?: string;
   includeSenderDetails?: boolean;
   organisationType?: OrganisationType;
+  reportUrl?: string;
 };
 
 export const DocumentInviteEmailTemplate = ({
@@ -34,6 +35,7 @@ export const DocumentInviteEmailTemplate = ({
   teamName = '',
   includeSenderDetails,
   organisationType,
+  reportUrl,
 }: DocumentInviteEmailTemplateProps) => {
   const { _ } = useLingui();
   const branding = useBranding();
@@ -114,7 +116,7 @@ export const DocumentInviteEmailTemplate = ({
           <Hr className="mx-auto mt-12 max-w-xl" />
 
           <Container className="mx-auto max-w-xl">
-            <TemplateFooter />
+            <TemplateFooter reportUrl={reportUrl} />
           </Container>
         </Section>
       </Body>

packages/email/templates/document-reminder.tsx

@@ -16,6 +16,7 @@ export type DocumentReminderEmailTemplateProps = {
   assetBaseUrl?: string;
   customBody?: string;
   role: RecipientRole;
+  reportUrl?: string;
 };
 
 export const DocumentReminderEmailTemplate = ({
@@ -25,6 +26,7 @@ export const DocumentReminderEmailTemplate = ({
   assetBaseUrl = 'http://localhost:3002',
   customBody,
   role = RecipientRole.SIGNER,
+  reportUrl,
 }: DocumentReminderEmailTemplateProps) => {
   const { _ } = useLingui();
   const branding = useBranding();
@@ -75,7 +77,7 @@ export const DocumentReminderEmailTemplate = ({
           <Hr className="mx-auto mt-12 max-w-xl" />
 
           <Container className="mx-auto max-w-xl">
-            <TemplateFooter />
+            <TemplateFooter reportUrl={reportUrl} />
           </Container>
         </Section>
       </Body>

packages/lib/jobs/definitions/emails/send-document-completed-emails.handler.ts

@@ -211,6 +211,8 @@ export const run = async ({ payload, io }: { payload: TSendDocumentCompletedEmai
       };
 
       const downloadLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}/complete`;
+      const reportUrl =
+        recipient.role === RecipientRole.CC ? `${NEXT_PUBLIC_WEBAPP_URL()}/report/${recipient.token}` : undefined;
 
       const template = createElement(DocumentCompletedEmailTemplate, {
         documentName: envelope.title,
@@ -220,6 +222,7 @@ export const run = async ({ payload, io }: { payload: TSendDocumentCompletedEmai
           isDirectTemplate && envelope.documentMeta?.message
             ? renderCustomEmailTemplate(envelope.documentMeta.message, customEmailTemplate)
             : undefined,
+        reportUrl,
       });
 
       const [html, text] = await Promise.all([

packages/lib/jobs/definitions/emails/send-signing-email.handler.ts

@@ -165,6 +165,7 @@ export const run = async ({ payload, io }: { payload: TSendSigningEmailJobDefini
 
   const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
   const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
+  const reportUrl = `${NEXT_PUBLIC_WEBAPP_URL()}/report/${recipient.token}`;
 
   const template = createElement(DocumentInviteEmailTemplate, {
     documentName: envelope.title,
@@ -180,6 +181,7 @@ export const run = async ({ payload, io }: { payload: TSendSigningEmailJobDefini
     teamName: team?.name,
     teamEmail: team?.teamEmail?.email,
     includeSenderDetails: settings.includeSenderDetails,
+    reportUrl,
   });
 
   if (isRecipientEmailValidForSending(recipient)) {

packages/lib/jobs/definitions/internal/process-signing-reminder.handler.ts

@@ -154,6 +154,7 @@ export const run = async ({ payload, io }: { payload: TProcessSigningReminderJob
 
   const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
   const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
+  const reportUrl = `${NEXT_PUBLIC_WEBAPP_URL()}/report/${recipient.token}`;
 
   // Meter reminder emails against the organisation email quota/stats. Reminders
   // are unsolicited (the recipient didn't opt in to them) and can recur, so they
@@ -188,6 +189,7 @@ export const run = async ({ payload, io }: { payload: TProcessSigningReminderJob
       signDocumentLink,
       customBody: emailMessage,
       role: recipient.role,
+      reportUrl,
     });
 
     const [html, text] = await Promise.all([

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

@@ -1,5 +1,6 @@
 import { prisma } from '@documenso/prisma';
 import { EnvelopeType, type Prisma } from '@prisma/client';
+import { z } from 'zod';
 
 import type { FindResultResponse } from '../../types/search-params';
 
@@ -9,6 +10,16 @@ export interface AdminFindDocumentsOptions {
   perPage?: number;
 }
 
+const ZPositiveIntegerSchema = z.coerce.number().int().positive();
+
+const emptyResponse = {
+  data: [],
+  count: 0,
+  currentPage: 1,
+  perPage: 10,
+  totalPages: 0,
+};
+
 export const adminFindDocuments = async ({ query, page = 1, perPage = 10 }: AdminFindDocumentsOptions) => {
   let termFilters: Prisma.EnvelopeWhereInput | undefined = !query
     ? undefined
@@ -19,7 +30,35 @@ export const adminFindDocuments = async ({ query, page = 1, perPage = 10 }: Admi
         },
       };
 
-  if (query && query.startsWith('envelope_')) {
+  if (query?.startsWith('user:')) {
+    const parsedUserId = ZPositiveIntegerSchema.safeParse(query.slice('user:'.length));
+
+    if (parsedUserId.success) {
+      termFilters = {
+        userId: {
+          equals: parsedUserId.data,
+        },
+      };
+    } else {
+      return emptyResponse;
+    }
+  }
+
+  if (query?.startsWith('team:')) {
+    const parsedTeamId = ZPositiveIntegerSchema.safeParse(query.slice('team:'.length));
+
+    if (parsedTeamId.success) {
+      termFilters = {
+        teamId: {
+          equals: parsedTeamId.data,
+        },
+      };
+    } else {
+      return emptyResponse;
+    }
+  }
+
+  if (query && query?.startsWith('envelope_')) {
     termFilters = {
       id: {
         equals: query,
@@ -27,7 +66,7 @@ export const adminFindDocuments = async ({ query, page = 1, perPage = 10 }: Admi
     };
   }
 
-  if (query && query.startsWith('document_')) {
+  if (query && query?.startsWith('document_')) {
     termFilters = {
       secondaryId: {
         equals: query,

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

@@ -210,6 +210,7 @@ export const resendDocument = async ({ id, userId, recipients, teamId, requestMe
 
       const assetBaseUrl = NEXT_PUBLIC_WEBAPP_URL() || 'http://localhost:3000';
       const signDocumentLink = `${NEXT_PUBLIC_WEBAPP_URL()}/sign/${recipient.token}`;
+      const reportUrl = `${NEXT_PUBLIC_WEBAPP_URL()}/report/${recipient.token}`;
 
       const template = createElement(DocumentInviteEmailTemplate, {
         documentName: envelope.title,
@@ -225,6 +226,7 @@ export const resendDocument = async ({ id, userId, recipients, teamId, requestMe
         selfSigner,
         organisationType,
         teamName: envelope.team?.name,
+        reportUrl,
       });
 
       const [html, text] = await Promise.all([

packages/lib/server-only/rate-limit/rate-limits.ts

@@ -66,6 +66,12 @@ export const linkOrgAccountRateLimit = createRateLimit({
   window: '1h',
 });
 
+export const reportSenderRateLimit = createRateLimit({
+  action: 'recipient.report-sender',
+  max: 1,
+  window: '7d',
+});
+
 // ---- API (Tier 4 - Standard) ----
 
 export const apiV1RateLimit = createRateLimit({

packages/prisma/migrations/20260603015431_add_email_reports_stat/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "OrganisationMonthlyStat" ADD COLUMN     "emailReports" INTEGER NOT NULL DEFAULT 0;

packages/prisma/schema.prisma

@@ -322,6 +322,7 @@ model OrganisationMonthlyStat {
   documentCount Int @default(0)
   emailCount    Int @default(0)
   apiCount      Int @default(0)
+  emailReports  Int @default(0)
 
   @@unique([organisationId, period])
   @@index([organisationId])

packages/trpc/server/admin-router/find-organisation-stats.ts

@@ -32,7 +32,7 @@ type FindOrganisationStatsOptions = {
   claimId?: string;
   page?: number;
   perPage?: number;
-  orderByColumn?: 'documentCount' | 'emailCount' | 'apiCount' | 'totalCount';
+  orderByColumn?: 'documentCount' | 'emailCount' | 'apiCount' | 'emailReports' | 'totalCount';
   orderByDirection?: 'asc' | 'desc';
 };
 
@@ -91,6 +91,10 @@ export const findOrganisationStats = async ({
       'OrganisationMonthlyStat.documentCount as documentCount',
       'OrganisationMonthlyStat.emailCount as emailCount',
       'OrganisationMonthlyStat.apiCount as apiCount',
+      'OrganisationMonthlyStat.emailReports as emailReports',
+      'OrganisationClaim.documentQuota as documentQuota',
+      'OrganisationClaim.emailQuota as emailQuota',
+      'OrganisationClaim.apiQuota as apiQuota',
       totalCountExpression.as('totalCount'),
       eb.fn.countAll().over().as('totalRows'),
     ])
@@ -99,6 +103,7 @@ export const findOrganisationStats = async ({
         .with('documentCount', () => qb.orderBy('OrganisationMonthlyStat.documentCount', orderByDirection))
         .with('emailCount', () => qb.orderBy('OrganisationMonthlyStat.emailCount', orderByDirection))
         .with('apiCount', () => qb.orderBy('OrganisationMonthlyStat.apiCount', orderByDirection))
+        .with('emailReports', () => qb.orderBy('OrganisationMonthlyStat.emailReports', orderByDirection))
         .with('totalCount', () => qb.orderBy(totalCountExpression, orderByDirection))
         .with(undefined, () =>
           // Default ordering mirrors the desired SQL: email, api, document descending.
@@ -126,6 +131,10 @@ export const findOrganisationStats = async ({
     documentCount: Number(row.documentCount),
     emailCount: Number(row.emailCount),
     apiCount: Number(row.apiCount),
+    emailReports: Number(row.emailReports),
+    documentQuota: row.documentQuota === null ? null : Number(row.documentQuota),
+    emailQuota: row.emailQuota === null ? null : Number(row.emailQuota),
+    apiQuota: row.apiQuota === null ? null : Number(row.apiQuota),
     totalCount: Number(row.totalCount),
   }));
 

packages/trpc/server/admin-router/find-organisation-stats.types.ts

@@ -9,7 +9,7 @@ export const ZFindOrganisationStatsRequestSchema = ZFindSearchParamsSchema.exten
     .optional(),
   claimId: z.string().describe('Filter stats by the original subscription claim ID.').optional(),
   orderByColumn: z
-    .enum(['documentCount', 'emailCount', 'apiCount', 'totalCount'])
+    .enum(['documentCount', 'emailCount', 'apiCount', 'emailReports', 'totalCount'])
     .describe('The column to sort by.')
     .optional(),
   orderByDirection: z.enum(['asc', 'desc']).describe('Sort direction.').default('desc'),
@@ -26,6 +26,10 @@ export const ZFindOrganisationStatsResponseSchema = ZFindResultResponse.extend({
       documentCount: z.number(),
       emailCount: z.number(),
       apiCount: z.number(),
+      emailReports: z.number(),
+      documentQuota: z.number().nullable(),
+      emailQuota: z.number().nullable(),
+      apiQuota: z.number().nullable(),
       totalCount: z.number(),
     })
     .array(),

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

@@ -53,6 +53,7 @@ export const ZGetAdminOrganisationResponseSchema = ZOrganisationSchema.extend({
       documentCount: true,
       emailCount: true,
       apiCount: true,
+      emailReports: true,
     }),
   ),
 });

packages/trpc/server/envelope-router/envelope-recipients/report-recipient.ts

@@ -0,0 +1,95 @@
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { reportSenderRateLimit } from '@documenso/lib/server-only/rate-limit/rate-limits';
+import { generateDatabaseId } from '@documenso/lib/universal/id';
+import { currentMonthlyPeriod } from '@documenso/lib/universal/monthly-period';
+import { prisma } from '@documenso/prisma';
+import { procedure } from '../../trpc';
+import { ZReportRecipientRequestSchema, ZReportRecipientResponseSchema } from './report-recipient.types';
+
+/**
+ * NOTE: THIS IS A PUBLIC (UNAUTHENTICATED) PROCEDURE.
+ * Recipients report a sender directly from a link in their email, so no session or
+ * API token is required.
+ */
+export const reportRecipientRoute = procedure
+  .input(ZReportRecipientRequestSchema)
+  .output(ZReportRecipientResponseSchema)
+  .mutation(async ({ input, ctx }) => {
+    const { token } = input;
+
+    if (!token) {
+      throw new AppError(AppErrorCode.INVALID_REQUEST, {
+        message: 'Token is required',
+      });
+    }
+
+    const { ipAddress } = ctx.metadata.requestMetadata;
+
+    const recipient = await prisma.recipient.findFirst({
+      where: { token },
+      select: {
+        id: true,
+        envelopeId: true,
+        envelope: {
+          select: {
+            team: {
+              select: {
+                id: true,
+                organisationId: true,
+              },
+            },
+          },
+        },
+      },
+    });
+
+    if (!recipient) {
+      throw new AppError(AppErrorCode.NOT_FOUND, {
+        message: 'Recipient could not be found',
+      });
+    }
+
+    // Rate limit to ensure we aren't double reporting by accident.
+    const rateLimitResult = await reportSenderRateLimit.check({
+      ip: ipAddress ?? 'unknown',
+      identifier: `${recipient.envelopeId}:${recipient.id}`,
+    });
+
+    if (rateLimitResult.isLimited) {
+      return;
+    }
+
+    const period = currentMonthlyPeriod();
+    const { organisationId } = recipient.envelope.team;
+
+    // Incrementing the stat is a non-critical side effect; fail soft so a transient
+    // DB error never turns reporting into a user-facing error.
+    await prisma.organisationMonthlyStat
+      .upsert({
+        where: {
+          organisationId_period: {
+            organisationId,
+            period,
+          },
+        },
+        update: {
+          emailReports: { increment: 1 },
+        },
+        create: {
+          id: generateDatabaseId('org_monthly_stat'),
+          organisationId,
+          period,
+          emailReports: 1,
+        },
+      })
+      .catch((error) => {
+        ctx.logger.error({
+          msg: 'Failed to increment organisation emailReports stat',
+          error,
+        });
+      });
+
+    ctx.logger.info({
+      msg: `Email reported. Recipient: ${recipient.id}. Envelope: ${recipient.envelopeId}.`,
+    });
+  });

packages/trpc/server/envelope-router/envelope-recipients/report-recipient.types.ts

@@ -0,0 +1,9 @@
+import { z } from 'zod';
+
+export const ZReportRecipientRequestSchema = z.object({
+  token: z.string().min(1).describe('The recipient token from the email link used to report the sender.'),
+});
+
+export const ZReportRecipientResponseSchema = z.void();
+
+export type TReportRecipientRequest = z.infer<typeof ZReportRecipientRequestSchema>;

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

@@ -20,6 +20,7 @@ import { updateEnvelopeFieldsRoute } from './envelope-fields/update-envelope-fie
 import { createEnvelopeRecipientsRoute } from './envelope-recipients/create-envelope-recipients';
 import { deleteEnvelopeRecipientRoute } from './envelope-recipients/delete-envelope-recipient';
 import { getEnvelopeRecipientRoute } from './envelope-recipients/get-envelope-recipient';
+import { reportRecipientRoute } from './envelope-recipients/report-recipient';
 import { updateEnvelopeRecipientsRoute } from './envelope-recipients/update-envelope-recipients';
 import { findEnvelopeAuditLogsRoute } from './find-envelope-audit-logs';
 import { findEnvelopesRoute } from './find-envelopes';
@@ -66,6 +67,7 @@ export const envelopeRouter = router({
     updateMany: updateEnvelopeRecipientsRoute,
     delete: deleteEnvelopeRecipientRoute,
     set: setEnvelopeRecipientsRoute,
+    report: reportRecipientRoute,
   },
   field: {
     get: getEnvelopeFieldRoute,