@sentry/junior-dashboard 0.253.0 → 0.255.0

package/src/client/conversations/ConversationComposer.tsx

@@ -16,8 +16,6 @@ import { Button } from "../components/Button";
 import { useDashboardOnline } from "../connection";
 import { cn, dashboardComposerSurfaceClass } from "../styles";
 
-const MOBILE_COMPOSER_MAX_HEIGHT_PX = 112;
-const DESKTOP_MEDIA_QUERY = "(min-width: 768px)";
 const DRAFT_STORAGE_PREFIX = "junior:dashboard:conversation-draft:";
 // Keep keystrokes off the storage path. Mobile Safari pays for every write.
 const DRAFT_STORAGE_DEBOUNCE_MS = 250;
@@ -137,35 +135,31 @@ export const ConversationComposer = memo(function ConversationComposer(
     };
   }, [storageKey]);
 
+  // Grow with wrapped and explicit lines. CSS `max-height` caps the box, and
+  // longer drafts scroll inside it. Width changes rewrap the text, so measure
+  // again when the textarea gets narrower or wider.
   useEffect(() => {
     const textarea = textareaRef.current;
     if (!textarea) return;
-
-    const syncHeight = () => {
-      if (window.matchMedia(DESKTOP_MEDIA_QUERY).matches) {
-        if (textarea.style.height) textarea.style.height = "";
-        return;
-      }
-      // Measure from auto height only when the value changed. Avoid layout work
-      // on parent re-renders that leave the draft text alone.
-      const previous = textarea.style.height;
-      textarea.style.height = "auto";
-      const nextHeight = Math.min(
-        textarea.scrollHeight,
-        MOBILE_COMPOSER_MAX_HEIGHT_PX,
-      );
-      const next = `${nextHeight}px`;
-      if (previous === next) {
-        textarea.style.height = previous;
-        return;
-      }
-      textarea.style.height = next;
+    syncComposerHeight(textarea);
+    let width = textarea.clientWidth;
+    let frame: number | undefined;
+    const observer = new ResizeObserver(() => {
+      if (textarea.clientWidth === width) return;
+      width = textarea.clientWidth;
+      // A height change inside this callback starts a ResizeObserver loop
+      // error. Measure in the next frame instead.
+      if (frame !== undefined) window.cancelAnimationFrame(frame);
+      frame = window.requestAnimationFrame(() => {
+        frame = undefined;
+        syncComposerHeight(textarea);
+      });
+    });
+    observer.observe(textarea);
+    return () => {
+      observer.disconnect();
+      if (frame !== undefined) window.cancelAnimationFrame(frame);
     };
-
-    syncHeight();
-    const media = window.matchMedia(DESKTOP_MEDIA_QUERY);
-    media.addEventListener("change", syncHeight);
-    return () => media.removeEventListener("change", syncHeight);
   }, []);
 
   const updateCanSend = (text: string) => {
@@ -210,12 +204,7 @@ export const ConversationComposer = memo(function ConversationComposer(
   };
 
   const syncTextareaHeight = () => {
-    const textarea = textareaRef.current;
-    if (!textarea || window.matchMedia(DESKTOP_MEDIA_QUERY).matches) return;
-    const previous = textarea.style.height;
-    textarea.style.height = "auto";
-    const next = `${Math.min(textarea.scrollHeight, MOBILE_COMPOSER_MAX_HEIGHT_PX)}px`;
-    textarea.style.height = previous === next ? previous : next;
+    if (textareaRef.current) syncComposerHeight(textareaRef.current);
   };
 
   const setMessage = (text: string) => {
@@ -431,7 +420,7 @@ export const ConversationComposer = memo(function ConversationComposer(
           autoCapitalize="off"
           autoComplete="off"
           autoCorrect="off"
-          className="min-h-12 max-h-28 w-full resize-none overflow-y-auto border-0 bg-transparent px-3 py-3 font-sans text-base leading-relaxed text-dashboard-text outline-none placeholder:text-dashboard-text-muted/65 md:min-h-14 md:max-h-none md:overflow-visible md:px-4 md:py-3"
+          className="min-h-12 max-h-28 w-full resize-none overflow-y-auto border-0 bg-transparent px-3 py-3 font-sans text-base leading-relaxed text-dashboard-text outline-none placeholder:text-dashboard-text-muted/65 md:min-h-14 md:max-h-[min(calc(12lh_+_1.5rem),40dvh)] md:px-4 md:py-3"
           disabled={Boolean(props.restoreDraftOnError && createPending)}
           enterKeyHint="send"
           id={id}
@@ -514,6 +503,15 @@ export const ConversationComposer = memo(function ConversationComposer(
   );
 });
 
+/** Fit the textarea to its text. CSS `max-height` sets the scroll limit. */
+function syncComposerHeight(textarea: HTMLTextAreaElement): void {
+  // Measure from auto height so the box can also shrink after deletes.
+  const previous = textarea.style.height;
+  textarea.style.height = "auto";
+  const next = `${textarea.scrollHeight}px`;
+  textarea.style.height = previous === next ? previous : next;
+}
+
 function emptyDraft(): ConversationDraft {
   return {
     idempotencyKey: crypto.randomUUID(),

package/src/client/pages/automations/AutomationDetailsDrawer.tsx

@@ -93,7 +93,7 @@ export function AutomationDetailsDrawer(props: {
         <AutomationLifecycle
           key={`${automation.kind}:${automation.id}`}
           automation={automation}
-          editPath={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/edit${location.search}`}
+          editPath={`/automations/${encodeURIComponent(automation.id)}/edit${location.search}`}
         />
         <DetailList>
           {details.map((detail) => (
@@ -121,14 +121,14 @@ export function AutomationDetailsDrawer(props: {
           automation.lastRunStatus !== "blocked" ? (
             <Link
               className="w-fit py-2 text-sm text-dashboard-text underline underline-offset-2"
-              to={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/executions`}
+              to={`/automations/${encodeURIComponent(automation.id)}/executions`}
             >
               View all runs
             </Link>
           ) : null}
           <Link
             className="w-fit py-2 text-sm text-dashboard-text underline underline-offset-2"
-            to={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/versions${location.search}`}
+            to={`/automations/${encodeURIComponent(automation.id)}/versions${location.search}`}
           >
             Version history
           </Link>
@@ -172,7 +172,7 @@ function AutomationExecutionSummary(props: {
   const { range, automation } = props;
   const runCount = automation.runs[range];
   const rangeLabel = timeRangeLabel(range);
-  const executionsPath = `/automations/${automation.kind}/${encodeURIComponent(automation.id)}/executions`;
+  const executionsPath = `/automations/${encodeURIComponent(automation.id)}/executions`;
   return (
     <div className="text-sm text-dashboard-text-muted">
       {automation.totalRuns > 0 ? (

package/src/client/pages/automations/AutomationEditPage.tsx

@@ -19,20 +19,20 @@ import { AutomationOutcomeList } from "./AutomationOutcomeFields";
 
 /** Load a linkable editor. Owners and public readers can edit until work completes. */
 export function AutomationEditPage(props: { enabled: boolean }) {
-  const { kind, automationId } = useParams();
+  const { automationId } = useParams();
   const location = useLocation();
   const summary = useAutomationData(props.enabled, automationId);
   const canEdit =
     summary.data &&
     !(summary.data.kind === "scheduled" && summary.data.status === "completed");
   const edit = useQuery({
-    queryKey: ["dashboard", "automations", "edit", kind, automationId],
-    enabled: props.enabled && Boolean(canEdit) && summary.data?.kind === kind,
+    queryKey: ["dashboard", "automations", "edit", automationId],
+    enabled: props.enabled && Boolean(canEdit),
     retry: false,
     queryFn: ({ signal }) =>
       fetchDashboardJson(
         automationEditSchema,
-        `/api/automations/${kind}/${encodeURIComponent(automationId!)}/edit`,
+        `/api/automations/${encodeURIComponent(automationId!)}/edit`,
         signal,
       ),
   });
@@ -84,7 +84,7 @@ export function AutomationEditPage(props: { enabled: boolean }) {
           {value ? (
             <div className="flex items-center gap-4">
               <Link
-                to={`/automations/${value.kind}/${encodeURIComponent(value.id)}/versions${location.search}`}
+                to={`/automations/${encodeURIComponent(value.id)}/versions${location.search}`}
                 className="text-sm text-dashboard-text-muted underline underline-offset-2 hover:text-dashboard-text"
               >
                 Version history
@@ -95,9 +95,7 @@ export function AutomationEditPage(props: { enabled: boolean }) {
             </div>
           ) : null}
         </div>
-        {(!value && summary.error) ||
-        (!edit.data && edit.error) ||
-        (value && value.kind !== kind) ? (
+        {(!value && summary.error) || (!edit.data && edit.error) ? (
           <FormNotice tone="error" title="Automation could not be loaded.">
             It may no longer be available, or you may not have access.{" "}
             <Button
@@ -113,7 +111,7 @@ export function AutomationEditPage(props: { enabled: boolean }) {
           <AutomationEditorLoading />
         ) : canEdit && edit.data ? (
           <AutomationEditor
-            key={`${kind}:${automationId}`}
+            key={automationId}
             automation={edit.data}
             summary={value}
             returnPath={returnPath}

package/src/client/pages/automations/AutomationEditor.tsx

@@ -55,7 +55,7 @@ export function AutomationEditor(props: {
   useEffect(() => {
     if (blocker.state === "blocked") discardNotice.current?.focus();
   }, [blocker.state]);
-  const url = `/api/automations/${original.kind}/${encodeURIComponent(original.id)}`;
+  const url = `/api/automations/${encodeURIComponent(original.id)}`;
   useEffect(() => {
     const prevent = (event: BeforeUnloadEvent) => {
       if (dirty && !allowLeave.current) {

package/src/client/pages/automations/AutomationExecutionsPage.tsx

@@ -42,20 +42,15 @@ const EXECUTION_GRID = "grid-cols-[minmax(0,1fr)_5.5rem_5.5rem_5.5rem_auto]";
 
 /** Render one automation's terminal executions as a conversation-style list. */
 export function AutomationExecutionsPage(props: { enabled: boolean }) {
-  const { automationId, kind } = useParams();
+  const { automationId } = useParams();
   const [searchParams] = useSearchParams();
-  const taskKind = kind === "scheduled" || kind === "event" ? kind : undefined;
-  const query = useAutomationExecutionsData(
-    props.enabled && Boolean(automationId && taskKind),
-    taskKind,
-    automationId,
-  );
+  const query = useAutomationExecutionsData(props.enabled, automationId);
   const backTo = pathWithSearch(
     automationId ? automationPath(automationId) : "/automations/list",
     searchParams,
   );
 
-  if (!automationId || !taskKind) {
+  if (!automationId) {
     return <Navigate replace to="/automations" />;
   }
   if (!query.data && !query.error) {

package/src/client/pages/automations/AutomationLifecycle.tsx

@@ -30,7 +30,7 @@ export function AutomationLifecycle({
   const action = paused || blocked ? "resume" : "pause";
   const mutation = useMutation({
     mutationFn: async () => {
-      const path = `/api/automations/${automation.kind}/${encodeURIComponent(automation.id)}`;
+      const path = `/api/automations/${encodeURIComponent(automation.id)}`;
       const current = await fetchDashboardJson(
         automationEditSchema,
         `${path}/edit`,
@@ -114,7 +114,7 @@ export function AutomationLifecycle({
             : ""}{" "}
           <Link
             className="text-dashboard-text underline underline-offset-2"
-            to={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/executions`}
+            to={`/automations/${encodeURIComponent(automation.id)}/executions`}
           >
             View run history
           </Link>

package/src/client/pages/automations/AutomationRow.tsx

@@ -108,7 +108,7 @@ export function AutomationRow(props: {
         {automation.ownedByViewer ? (
           <div className="-mr-2 -mt-1.5 shrink-0">
             <AutomationActions
-              editPath={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/edit${location.search}`}
+              editPath={`/automations/${encodeURIComponent(automation.id)}/edit${location.search}`}
               deleting={props.deleting}
               onDelete={props.onDelete}
               title={automation.title}
@@ -208,7 +208,7 @@ function AutomationTiming({ automation }: { automation: AutomationSummary }) {
         {lastRunFailed ? (
           <Link
             className="text-amber-300 underline"
-            to={`/automations/${automation.kind}/${encodeURIComponent(automation.id)}/executions`}
+            to={`/automations/${encodeURIComponent(automation.id)}/executions`}
           >
             Last run {automation.lastRunStatus}
             {automation.lastRunAt

package/src/client/pages/automations/AutomationScheduleFields.tsx

@@ -43,7 +43,7 @@ export function AutomationScheduleFields(props: {
     queryFn: () =>
       post(
         automationSchedulePreviewSchema,
-        `/api/automations/scheduled/${encodeURIComponent(props.automation.id)}/preview`,
+        `/api/automations/${encodeURIComponent(props.automation.id)}/preview`,
         previewValue,
       ),
   });

package/src/client/pages/automations/AutomationVersionsPage.tsx

@@ -28,20 +28,16 @@ const DESCRIPTION = "Saved settings for this automation, newest first.";
 
 /** Load one Automation's versions with its summary for labels and access. */
 export function AutomationVersionsPage(props: { enabled: boolean }) {
-  const { automationId, kind } = useParams();
+  const { automationId } = useParams();
   const [searchParams] = useSearchParams();
-  const taskKind = kind === "scheduled" || kind === "event" ? kind : undefined;
-  const enabled = props.enabled && Boolean(automationId && taskKind);
-  const summary = useAutomationData(enabled, automationId);
-  const versions = useAutomationVersionsData(enabled, taskKind, automationId);
-  if (!automationId || !taskKind) {
+  const summary = useAutomationData(props.enabled, automationId);
+  const versions = useAutomationVersionsData(props.enabled, automationId);
+  if (!automationId) {
     return <Navigate replace to="/automations" />;
   }
   const backTo = pathWithSearch(automationPath(automationId), searchParams);
   const error = summary.error ?? versions.error;
-  const notFound =
-    (error instanceof DashboardApiError && error.status === 404) ||
-    (summary.data && summary.data.kind !== taskKind);
+  const notFound = error instanceof DashboardApiError && error.status === 404;
   if (error || notFound) {
     return (
       <>
@@ -97,7 +93,7 @@ function AutomationVersionsView(props: {
   const canActivate = !(
     automation.kind === "scheduled" && automation.status === "completed"
   );
-  const path = `/api/automations/${automation.kind}/${encodeURIComponent(automation.id)}`;
+  const path = `/api/automations/${encodeURIComponent(automation.id)}`;
   const activate = useMutation({
     mutationFn: async (version: number) => {
       // The user chose an exact saved version, so the latest revision is safe here.

package/src/client/pages/automations/AutomationsPage.tsx

@@ -158,7 +158,7 @@ export function AutomationsPage(props: {
   const deletion = useMutation({
     mutationFn: async (automation: AutomationSummary) => {
       await deleteDashboardResource(
-        `/api/automations/${automation.kind}/${encodeURIComponent(automation.id)}`,
+        `/api/automations/${encodeURIComponent(automation.id)}`,
       );
     },
     onSuccess: async () => {

package/src/mock-reporting/fixtures.ts

@@ -3031,13 +3031,10 @@ function mockStatusDays(
 
 /** Build mock terminal executions for one viewer-visible task. */
 export function readMockAutomationExecutions(
-  kind: "scheduled" | "event",
   id: string,
   nowMs = NOW_MS,
 ): AutomationExecutionList | undefined {
-  const task = mockTasks().find(
-    (candidate) => candidate.kind === kind && candidate.id === id,
-  );
+  const task = mockTasks().find((candidate) => candidate.id === id);
   if (!task) return undefined;
   if (task.totalRuns === 0) {
     return {

package/src/mock-reporting/routes.ts

@@ -292,10 +292,7 @@ export function createMockReportingApi(): Hono<{
   app.get("/automations/runs", () => {
     const automations = readMockAutomationList().automations;
     const runs = automations.flatMap((automation) => {
-      const report = readMockAutomationExecutions(
-        automation.kind,
-        automation.id,
-      );
+      const report = readMockAutomationExecutions(automation.id);
       return (report?.executions ?? []).map((run) => ({
         ...run,
         kind: automation.kind,
@@ -318,15 +315,12 @@ export function createMockReportingApi(): Hono<{
       ? jsonResponse(automationSummarySchema, automation)
       : errorResponse("Automation not found.", 404);
   });
-  app.get("/automations/:kind/:id/executions", (c) => {
+  app.get("/automations/:id/executions", (c) => {
     const params = automationParamsSchema.safeParse(c.req.param());
     if (!params.success) {
       return errorResponse("Invalid route parameters.", 400);
     }
-    const report = readMockAutomationExecutions(
-      params.data.kind,
-      params.data.id,
-    );
+    const report = readMockAutomationExecutions(params.data.id);
     return report
       ? jsonResponse(automationExecutionListSchema, report)
       : errorResponse("Task not found.", 404);