@sentry/junior-dashboard 0.141.0 → 0.142.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentry/junior-dashboard",
-  "version": "0.141.0",
+  "version": "0.142.0",
   "private": false,
   "publishConfig": {
     "access": "public"
@@ -34,8 +34,8 @@
     "react-router": "^7.16.0",
     "shiki": "4.1.0",
     "zod": "^4.4.3",
-    "@sentry/junior": "0.141.0",
-    "@sentry/junior-plugin-api": "0.141.0"
+    "@sentry/junior": "0.142.0",
+    "@sentry/junior-plugin-api": "0.142.0"
   },
   "devDependencies": {
     "@tailwindcss/cli": "^4.3.0",

package/src/client/components/Tooltip.tsx

@@ -18,6 +18,7 @@ type TooltipProps = {
   content: ReactNode;
   label?: ReactNode;
   placement?: "above" | "below";
+  triggerClassName?: string;
 };
 
 const VIEWPORT_GAP = 8;
@@ -52,6 +53,7 @@ export function Tooltip({
   content,
   label,
   placement = "above",
+  triggerClassName,
 }: TooltipProps) {
   const tooltipId = useId();
   const rootRef = useRef<Element | null>(null);
@@ -160,7 +162,7 @@ export function Tooltip({
 
   return (
     <span
-      className="inline-flex"
+      className={cn("inline-flex", triggerClassName)}
       ref={rootRef as RefObject<HTMLSpanElement | null>}
     >
       {card}

package/src/client/pages/system/GuardianActivity.tsx

@@ -122,10 +122,11 @@ export function GuardianActivity(props: { days: GuardianMetricDay[] }) {
                 }
                 key={day.date}
                 label={shortDate(day.date)}
+                triggerClassName="h-full min-w-0 flex-1 items-end"
               >
                 <button
                   aria-label={`${shortDate(day.date)}: ${day.allow} allowed, ${day.ask} asked, ${day.deny} denied, ${formatCostSummary({ total: day.costUsd ?? 0 })}`}
-                  className="flex min-w-0 flex-1 flex-col justify-end overflow-hidden rounded-t-sm bg-white/[0.035] focus-visible:outline-1 focus-visible:outline-cyan-300"
+                  className="flex w-full min-w-0 flex-col justify-end overflow-hidden rounded-t-sm bg-white/[0.035] focus-visible:outline-1 focus-visible:outline-cyan-300"
                   style={{ height: `${height}%` }}
                   type="button"
                 >

package/src/client/pages/tasks/TaskDetailsDrawer.tsx

@@ -138,13 +138,13 @@ export function TaskDetailsDrawer(props: {
         <header className="relative border-b border-white/10 bg-dashboard-surface-raised px-4 py-3 md:px-5">
           <div className="min-w-0 pr-12">
             <h2
-              className="m-0 font-display text-lg font-medium tracking-normal text-dashboard-text capitalize"
+              className="m-0 font-display text-lg font-medium tracking-normal text-dashboard-text"
               id={titleId}
             >
-              {task.kind} task
+              {task.title}
             </h2>
-            <div className="mt-1 break-words font-mono text-xs leading-snug text-dashboard-text-muted">
-              {statusLabel} · {formatDate(task.createdAt)}
+            <div className="mt-1 break-words font-mono text-xs leading-snug text-dashboard-text-muted capitalize">
+              {task.kind} task · {statusLabel} · {formatDate(task.createdAt)}
             </div>
           </div>
           <div className="absolute top-3 right-4 md:right-5">

package/src/client/pages/tasks/TaskExecutionsPage.tsx

@@ -103,7 +103,7 @@ function TaskExecutionsView(props: {
           </Link>
           <PageHeader
             description={`${data.task.kind} task · ${data.task.destination.label} · ${statusSummary}`}
-            title={data.task.instruction}
+            title={data.task.title}
           />
         </div>
 
@@ -140,7 +140,7 @@ function TaskExecutionsView(props: {
               {data.executions.map((execution) => (
                 <ExecutionRow
                   execution={execution}
-                  fallbackTitle={data.task.instruction}
+                  fallbackTitle={data.task.title}
                   key={execution.executionId}
                 />
               ))}

package/src/client/pages/tasks/TasksPage.tsx

@@ -63,6 +63,7 @@ function taskMatches(task: TaskSummary, search: string): boolean {
     task.destination.teamId,
     task.instruction,
     task.kind,
+    task.title,
     task.kind === "scheduled" ? task.schedule : task.resource,
     ...(task.kind === "event" ? [task.source] : []),
     ...(task.kind === "event" ? task.events : []),
@@ -176,7 +177,7 @@ export function TasksPage(props: { enabled: boolean }) {
               className="w-full lg:max-w-sm"
               label="Search tasks"
               onChange={setSearchText}
-              placeholder="Instruction, location, or creator"
+              placeholder="Title, instruction, location, or creator"
               value={searchText}
             />
           </TaskFilterGroup>
@@ -331,7 +332,7 @@ function TaskRow(props: {
           <TaskSourceMark task={task} />
           <span className="min-w-0">
             <span className="block truncate font-display text-base font-medium text-dashboard-text">
-              {task.instruction}
+              {task.title}
             </span>
             <span className="mt-1 block truncate font-mono text-xs uppercase tracking-[0.08em] text-dashboard-text-muted">
               <span className="md:hidden">{task.destination.label}</span>
@@ -363,7 +364,7 @@ function TaskRow(props: {
         </div>
         <button
           aria-expanded={props.selected}
-          aria-label={`View task details: ${task.instruction}`}
+          aria-label={`View task details: ${task.title}`}
           className="grid size-8 cursor-pointer place-items-center rounded border border-transparent bg-transparent text-dashboard-text-muted transition-colors hover:border-white/10 hover:bg-white/[0.04] hover:text-dashboard-text"
           onClick={props.onSelect}
           type="button"
@@ -379,7 +380,7 @@ function TaskRow(props: {
         </button>
         {task.ownedByViewer ? (
           <Button
-            aria-label={`Delete: ${task.instruction}`}
+            aria-label={`Delete: ${task.title}`}
             disabled={props.deleting}
             onClick={props.onDelete}
             size="icon"

package/src/mock-reporting/fixtures.ts

@@ -1550,6 +1550,7 @@ function mockTasks(): TaskSummary[] {
       runsLast7Days: 3,
       schedule: "Every Monday at 9:00 AM",
       status: "active",
+      title: "Weekly project summary",
       totalRuns: 48,
     },
     {
@@ -1570,6 +1571,7 @@ function mockTasks(): TaskSummary[] {
       resource: "Issue · ACME-42",
       runsLast7Days: 1,
       source: "github",
+      title: "Closed issue summary",
       totalRuns: 7,
       triggerAvailable: true,
     },
@@ -1591,6 +1593,7 @@ function mockTasks(): TaskSummary[] {
       resource: "Incident · INC-17",
       runsLast7Days: 0,
       source: "pagerduty",
+      title: "Incident change alerts",
       totalRuns: 0,
       triggerAvailable: false,
     },