fix(webapp): harden redirect and rendered output handling

Mono-RevId: 94d1f8a40178cfe84399d958596a96bcb83cfb70

Author: carderne

apps/webapp/app/components/dashboard-agent/RunDiagnosisCard.render.test.ts

@@ -0,0 +1,45 @@
+import { createElement } from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+import { describe, expect, it } from "vitest";
+import { OperatingSystemContextProvider } from "~/components/primitives/OperatingSystemProvider";
+import { ShortcutsProvider } from "~/components/primitives/ShortcutsProvider";
+import { DiagnosisDocsAction } from "./RunDiagnosisCard";
+
+function markup(label: string) {
+  return renderToStaticMarkup(
+    createElement(
+      OperatingSystemContextProvider,
+      { platform: "mac" },
+      createElement(
+        ShortcutsProvider,
+        null,
+        createElement(DiagnosisDocsAction, {
+          action: {
+            kind: "docs",
+            label,
+            to: "https://example.com/help",
+            destinationHost: "example.com",
+          },
+        })
+      )
+    )
+  );
+}
+
+describe("diagnosis documentation actions", () => {
+  it("bounds and isolates an untrusted label without hiding the destination host", () => {
+    const label = `${"Read documentation ".repeat(20)}\u202eevil.test`;
+    const html = markup(label);
+    const labelStart = html.indexOf('<bdi dir="auto"');
+    const hostStart = html.indexOf('<bdi dir="ltr" class="shrink-0 text-text-dimmed">');
+
+    expect(html).toContain('href="https://example.com/help"');
+    expect(html).toContain('target="_blank"');
+    expect(html).toContain('rel="noopener noreferrer"');
+    expect(html).toContain("max-w-[24ch] truncate");
+    expect(html).toContain(label);
+    expect(labelStart).toBeGreaterThan(-1);
+    expect(hostStart).toBeGreaterThan(labelStart);
+    expect(html.slice(hostStart)).toContain("(example.com)</bdi>");
+  });
+});

apps/webapp/app/components/dashboard-agent/RunDiagnosisCard.tsx

@@ -12,11 +12,9 @@ import { useOptionalOrganization } from "~/hooks/useOrganizations";
 import { useOptionalProject } from "~/hooks/useProject";
 import { cn } from "~/utils/cn";
 import { v3RunPath } from "~/utils/pathBuilder";
-import { planDiagnosisActions } from "./diagnosis-actions";
+import { planDiagnosisActions, type PlannedDiagnosisAction } from "./diagnosis-actions";
 import { isRunFriendlyId } from "./run-id";
 
-// No markup comes from the model, so only outbound URLs need checking.
-
 function Em({ children }: { children: React.ReactNode }) {
   return <span className="font-semibold text-text-bright">{children}</span>;
 }
@@ -129,6 +127,23 @@ function EvidenceReference({ reference }: { reference: string }) {
   return <span className="font-mono text-xs text-text-dimmed">{reference}</span>;
 }
 
+export function DiagnosisDocsAction({
+  action,
+}: {
+  action: Extract<PlannedDiagnosisAction, { kind: "docs" }>;
+}) {
+  return (
+    <LinkButton to={action.to} variant="docs/small" LeadingIcon={BookOpenIcon}>
+      <bdi dir="auto" className="block min-w-0 max-w-[24ch] truncate">
+        {action.label}
+      </bdi>
+      <bdi dir="ltr" className="shrink-0 text-text-dimmed">
+        ({action.destinationHost})
+      </bdi>
+    </LinkButton>
+  );
+}
+
 function DiagnosisActions({ actions }: { actions: NonNullable<DiagnosisBlock["actions"]> }) {
   const runPath = useRunPathResolver();
   const planned = planDiagnosisActions(actions, {
@@ -141,9 +156,7 @@ function DiagnosisActions({ actions }: { actions: NonNullable<DiagnosisBlock["ac
     <div className="flex flex-wrap gap-2 pt-2">
       {planned.map((action, i) =>
         action.kind === "docs" ? (
-          <LinkButton key={i} to={action.to} variant="docs/small" LeadingIcon={BookOpenIcon}>
-            {action.label}
-          </LinkButton>
+          <DiagnosisDocsAction key={i} action={action} />
         ) : (
           <LinkButton key={i} to={action.to} variant="primary/small">
             {action.label}

apps/webapp/app/components/dashboard-agent/diagnosis-actions.test.ts

@@ -27,7 +27,12 @@ describe("planDiagnosisActions", () => {
 
   it("drops only the unresolvable action, keeping the rest", () => {
     expect(planDiagnosisActions([viewRun, docs], withoutContext)).toEqual([
-      { kind: "docs", label: "Read the docs", to: docs.target },
+      {
+        kind: "docs",
+        label: "Read the docs",
+        to: docs.target,
+        destinationHost: "trigger.dev",
+      },
     ]);
   });
 
@@ -37,10 +42,35 @@ describe("planDiagnosisActions", () => {
     );
   });
 
+  it("derives the displayed host from the resolved destination", () => {
+    expect(
+      planDiagnosisActions(
+        [{ ...docs, target: "https://example.com/help", label: "trigger.dev documentation" }],
+        resolve
+      )
+    ).toEqual([
+      {
+        kind: "docs",
+        label: "trigger.dev documentation",
+        to: "https://example.com/help",
+        destinationHost: "example.com",
+      },
+    ]);
+  });
+
   it("drops a docs action with an unsafe target", () => {
     expect(planDiagnosisActions([{ ...docs, target: "javascript:alert(1)" }], resolve)).toEqual([]);
   });
 
+  it("drops a docs action when its resolved destination has no hostname", () => {
+    expect(
+      planDiagnosisActions([docs], {
+        ...resolve,
+        docsUrl: () => "blob:https://trigger.dev/id",
+      })
+    ).toEqual([]);
+  });
+
   it("drops an action kind it does not know", () => {
     expect(planDiagnosisActions([{ ...viewRun, kind: "replay_run" }], resolve)).toEqual([]);
   });

apps/webapp/app/components/dashboard-agent/diagnosis-actions.ts

@@ -2,11 +2,18 @@ import { isRunFriendlyId } from "./run-id";
 
 export type DiagnosisActionInput = { kind: string; target: string; label: string };
 
-export type PlannedDiagnosisAction = {
-  kind: "view_run" | "docs";
-  label: string;
-  to: string;
-};
+export type PlannedDiagnosisAction =
+  | {
+      kind: "view_run";
+      label: string;
+      to: string;
+    }
+  | {
+      kind: "docs";
+      label: string;
+      to: string;
+      destinationHost: string;
+    };
 
 /**
  * An action whose destination can't be resolved is dropped, never rendered as a
@@ -29,7 +36,14 @@ export function planDiagnosisActions(
     }
     if (action.kind === "docs") {
       const to = resolve.docsUrl(action.target);
-      if (to) planned.push({ kind: "docs", label: action.label, to });
+      if (!to) continue;
+
+      try {
+        const destinationHost = new URL(to).hostname;
+        if (destinationHost) {
+          planned.push({ kind: "docs", label: action.label, to, destinationHost });
+        }
+      } catch {}
     }
   }
 

apps/webapp/app/routes/resources.$projectId.deployments.$deploymentShortCode.promote.ts

@@ -5,6 +5,7 @@ import { $replica, prisma } from "~/db.server";
 import { redirectWithErrorMessage, redirectWithSuccessMessage } from "~/models/message.server";
 import { logger } from "~/services/logger.server";
 import { dashboardAction } from "~/services/routeBuilders/dashboardBuilder";
+import { sanitizeRedirectPath } from "~/utils";
 import { ChangeCurrentDeploymentService } from "~/v3/services/changeCurrentDeployment.server";
 
 export const promoteSchema = z.object({
@@ -43,6 +44,8 @@ export const action = dashboardAction(
       return json(submission.reply());
     }
 
+    const redirectUrl = sanitizeRedirectPath(submission.value.redirectUrl);
+
     try {
       const project = await prisma.project.findFirst({
         where: {
@@ -58,7 +61,7 @@ export const action = dashboardAction(
       });
 
       if (!project) {
-        return redirectWithErrorMessage(submission.value.redirectUrl, request, "Project not found");
+        return redirectWithErrorMessage(redirectUrl, request, "Project not found");
       }
 
       const deployment = await prisma.workerDeployment.findFirst({
@@ -69,18 +72,14 @@ export const action = dashboardAction(
       });
 
       if (!deployment) {
-        return redirectWithErrorMessage(
-          submission.value.redirectUrl,
-          request,
-          "Deployment not found"
-        );
+        return redirectWithErrorMessage(redirectUrl, request, "Deployment not found");
       }
 
       const promoteService = new ChangeCurrentDeploymentService();
       await promoteService.call(deployment, "promote");
 
       return redirectWithSuccessMessage(
-        submission.value.redirectUrl,
+        redirectUrl,
         request,
         `Promoted deployment version ${deployment.version} to current.`
       );

apps/webapp/app/routes/resources.$projectId.deployments.$deploymentShortCode.rollback.ts

@@ -5,6 +5,7 @@ import { $replica, prisma } from "~/db.server";
 import { redirectWithErrorMessage, redirectWithSuccessMessage } from "~/models/message.server";
 import { logger } from "~/services/logger.server";
 import { dashboardAction } from "~/services/routeBuilders/dashboardBuilder";
+import { sanitizeRedirectPath } from "~/utils";
 import { ChangeCurrentDeploymentService } from "~/v3/services/changeCurrentDeployment.server";
 
 export const rollbackSchema = z.object({
@@ -43,6 +44,8 @@ export const action = dashboardAction(
       return json(submission.reply());
     }
 
+    const redirectUrl = sanitizeRedirectPath(submission.value.redirectUrl);
+
     try {
       const project = await prisma.project.findFirst({
         where: {
@@ -58,7 +61,7 @@ export const action = dashboardAction(
       });
 
       if (!project) {
-        return redirectWithErrorMessage(submission.value.redirectUrl, request, "Project not found");
+        return redirectWithErrorMessage(redirectUrl, request, "Project not found");
       }
 
       const deployment = await prisma.workerDeployment.findFirst({
@@ -69,21 +72,13 @@ export const action = dashboardAction(
       });
 
       if (!deployment) {
-        return redirectWithErrorMessage(
-          submission.value.redirectUrl,
-          request,
-          "Deployment not found"
-        );
+        return redirectWithErrorMessage(redirectUrl, request, "Deployment not found");
       }
 
       const rollbackService = new ChangeCurrentDeploymentService();
       await rollbackService.call(deployment, "rollback");
 
-      return redirectWithSuccessMessage(
-        submission.value.redirectUrl,
-        request,
-        "Rolled back deployment"
-      );
+      return redirectWithSuccessMessage(redirectUrl, request, "Rolled back deployment");
     } catch (error) {
       if (error instanceof Error) {
         logger.error("Failed to roll back deployment", {

apps/webapp/app/routes/resources.feedback.ts

@@ -4,6 +4,7 @@ import { uiComponent } from "@team-plain/ui-components";
 import { z } from "zod";
 import { redirectWithSuccessMessage } from "~/models/message.server";
 import { requireUser } from "~/services/session.server";
+import { sanitizeRedirectPath } from "~/utils";
 import { sendToPlain } from "~/utils/plain.server";
 
 export const feedbackTypes = {
@@ -77,6 +78,7 @@ export async function action({ request }: ActionFunctionArgs) {
   }
 
   const inquiry = feedbackTypes[submission.value.feedbackType as FeedbackType];
+  const redirectPath = sanitizeRedirectPath(submission.value.path);
   try {
     await sendToPlain({
       userId: user.id,
@@ -110,7 +112,7 @@ export async function action({ request }: ActionFunctionArgs) {
     });
 
     return redirectWithSuccessMessage(
-      submission.value.path,
+      redirectPath,
       request,
       "Thanks for your feedback! We'll get back to you soon."
     );

apps/webapp/app/routes/resources.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs.ai-filter.tsx

@@ -154,7 +154,7 @@ export async function action({ request, params }: ActionFunctionArgs) {
 
   const [error, result] = await tryCatch(service.call(text, environment.id));
   if (error) {
-    return json({ success: false, error: error.message }, { status: 400 });
+    return json({ success: false, error: "Unable to create filters" }, { status: 400 });
   }
 
   return json(result);

apps/webapp/app/routes/resources.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs.bulkaction.tsx

@@ -58,6 +58,7 @@ import { RUNS_BULK_INSPECTOR_UI_SEARCH_PARAMS } from "~/routes/_app.orgs.$organi
 import { logger } from "~/services/logger.server";
 import { dashboardAction, dashboardLoader } from "~/services/routeBuilders/dashboardBuilder";
 import { checkPermissions } from "~/services/routeBuilders/permissions.server";
+import { sanitizeRedirectPath } from "~/utils";
 import { cn } from "~/utils/cn";
 import { EnvironmentParamSchema, v3BulkActionPath } from "~/utils/pathBuilder";
 import { BulkActionService } from "~/v3/services/bulk/BulkActionV2.server";
@@ -187,6 +188,8 @@ export const action = dashboardAction(
       return redirectWithErrorMessage("/", request, "Invalid bulk action");
     }
 
+    const failedRedirect = sanitizeRedirectPath(submission.value.failedRedirect);
+
     // "Don't override" keeps each run's original region — drop it so it isn't
     // stored as a real override.
     if (submission.value.region === REPLAY_REGION_NO_OVERRIDE_VALUE) {
@@ -222,7 +225,7 @@ export const action = dashboardAction(
       });
 
       return redirectWithErrorMessage(
-        submission.value.failedRedirect,
+        failedRedirect,
         request,
         `Failed to create bulk action: ${error.message}`
       );

apps/webapp/app/routes/resources.sessions.$sessionParam.close.ts

@@ -6,6 +6,7 @@ import { redirectWithErrorMessage, redirectWithSuccessMessage } from "~/models/m
 import { resolveSessionByIdOrExternalId } from "~/services/realtime/sessions.server";
 import { logger } from "~/services/logger.server";
 import { requireUserId } from "~/services/session.server";
+import { sanitizeRedirectPath } from "~/utils";
 
 export const closeSessionSchema = z.object({
   redirectUrl: z.string(),
@@ -28,7 +29,8 @@ export const action: ActionFunction = async ({ request, params }) => {
     return json(submission.reply());
   }
 
-  const { redirectUrl, environmentId, reason } = submission.value;
+  const { environmentId, reason } = submission.value;
+  const redirectUrl = sanitizeRedirectPath(submission.value.redirectUrl);
   const trimmedReason = reason?.trim();
   const closedReason =
     trimmedReason && trimmedReason.length > 0 ? trimmedReason : "closed-from-dashboard";