Skip to content

Commit 94abe97

Browse files
authored
fix(webapp): prevent dashboard crash when span accessory text is not a string (#3400)
1 parent 02d2334 commit 94abe97

File tree

2 files changed

+30
-18
lines changed

2 files changed

+30
-18
lines changed
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
area: webapp
3+
type: fix
4+
---
5+
6+
Prevent dashboard crash (React error #31) when span accessory item text is not a string. Filters out malformed accessory items in SpanCodePathAccessory instead of passing objects to React as children.

apps/webapp/app/components/runs/v3/SpanTitle.tsx

Lines changed: 24 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -55,20 +55,24 @@ function SpanAccessory({
5555
case "pills": {
5656
return (
5757
<span className="flex items-center gap-1">
58-
{accessory.items.map((item, index) => (
59-
<SpanPill key={index} text={item.text} icon={item.icon} />
60-
))}
58+
{accessory.items
59+
.filter((item) => typeof item.text === "string")
60+
.map((item, index) => (
61+
<SpanPill key={index} text={item.text} icon={item.icon} />
62+
))}
6163
</span>
6264
);
6365
}
6466
default: {
6567
return (
6668
<span className={cn("flex gap-1")}>
67-
{accessory.items.map((item, index) => (
68-
<span key={index} className={cn("inline-flex items-center gap-1")}>
69-
{item.text}
70-
</span>
71-
))}
69+
{accessory.items
70+
.filter((item) => typeof item.text === "string")
71+
.map((item, index) => (
72+
<span key={index} className={cn("inline-flex items-center gap-1")}>
73+
{item.text}
74+
</span>
75+
))}
7276
</span>
7377
);
7478
}
@@ -104,16 +108,18 @@ export function SpanCodePathAccessory({
104108
className
105109
)}
106110
>
107-
{accessory.items.map((item, index) => (
108-
<Fragment key={index}>
109-
<span className={cn("truncate", "text-text-dimmed")}>{item.text}</span>
110-
{index < accessory.items.length - 1 && (
111-
<span className="text-text-dimmed">
112-
<ChevronRightIcon className="size-4" />
113-
</span>
114-
)}
115-
</Fragment>
116-
))}
111+
{accessory.items
112+
.filter((item) => typeof item.text === "string")
113+
.map((item, index, filtered) => (
114+
<Fragment key={index}>
115+
<span className={cn("truncate", "text-text-dimmed")}>{item.text}</span>
116+
{index < filtered.length - 1 && (
117+
<span className="text-text-dimmed">
118+
<ChevronRightIcon className="size-4" />
119+
</span>
120+
)}
121+
</Fragment>
122+
))}
117123
</code>
118124
);
119125
}

0 commit comments

Comments
 (0)