stroblmeandClaude Opus 5
d4a9406c51
Docs / docs (push) Successful in 49s
Playwright Tests / test-playwright (1, 2) (push) Failing after 1m11s
Playwright Tests / test-playwright (2, 2) (push) Failing after 23s
pre-commit / pre-commit (push) Successful in 3m2s
Test Backend / test-backend (push) Successful in 2m22s
Compose Smoke Test / test-compose (push) Failing after 22s
Playwright Tests / merge-reports (push) Canceled after 1s
The gates have never gone green on the new runners. Three separate reasons: - backend/Dockerfile shipped Python 3.10 while the code imports typing.Self and datetime.UTC, so the container exited on import and the suite could not even load its conftest. The image moves to 3.13 and the packages declare >=3.12, which is the floor the tests actually pass on; ruff's target follows and rewrites timezone.utc and asyncio.TimeoutError accordingly. Relocking drops the 3.10 branch, which bumps FastAPI and so regenerates the SDK. - frontend/README.md had no trailing newline and two dashboard widgets used arbitrary text-[…] sizes. Both are em-relative on purpose, so they move to the inline style the neighbouring ramp already uses. - Every commit left its own run queued: without a concurrency group a runner that was offline for a while works through a backlog nobody reads. A stack that fails to come up now prints its logs before the teardown removes it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
84 lines
3.1 KiB
TypeScript
84 lines
3.1 KiB
TypeScript
import { useLiveValue } from "@/components/Flow/liveStore"
|
|
import { cn } from "@/lib/utils"
|
|
import { ICON_COLORS, ICONS } from "./icons"
|
|
import { config } from "./ui/core/config"
|
|
import type { WidgetProps } from "./widgets"
|
|
|
|
/** One column of a forecast, as the `list` message declares it. */
|
|
type ForecastItem = {
|
|
label?: string
|
|
icon?: string
|
|
value?: string | number
|
|
color?: string
|
|
}
|
|
|
|
/**
|
|
* What comes next, as a strip of columns over a `list` message.
|
|
*
|
|
* The shape is the widget's contract rather than a path per column: every item
|
|
* is `{label, icon, value}` with an optional `color`, naming its icon from the
|
|
* same vocabulary the icon widget offers, so a flow answering with a forecast
|
|
* decides what a step is called and this only has to draw it. Later columns are
|
|
* dimmed progressively — a forecast is less certain the further out it reads.
|
|
*/
|
|
export function ForecastWidget({ widget }: WidgetProps) {
|
|
const cfg = config(widget)
|
|
const message = cfg.message ? String(cfg.message) : ""
|
|
const live = useLiveValue(message || undefined)
|
|
if (!message) {
|
|
return <p className="text-muted-foreground">Pick a message.</p>
|
|
}
|
|
|
|
const count = Number(cfg.count)
|
|
const items: ForecastItem[] = (Array.isArray(live?.value) ? live.value : [])
|
|
.filter((item): item is ForecastItem => !!item && typeof item === "object")
|
|
.slice(0, Number.isFinite(count) ? count : 5)
|
|
|
|
if (items.length === 0) {
|
|
return <p className="text-muted-foreground">Nothing forecast.</p>
|
|
}
|
|
|
|
return (
|
|
<div className="flex min-h-0 items-stretch justify-between gap-2">
|
|
{items.map((item, index) => {
|
|
const Glyph = ICONS[item.icon ?? ""] ?? null
|
|
return (
|
|
<div
|
|
// Two steps can carry the same label and reading; position is the
|
|
// identity, and it is what the dimming is computed from.
|
|
key={`column-${index}`}
|
|
data-testid="forecast-column"
|
|
className="flex min-w-0 flex-col items-center gap-1"
|
|
// Content rather than a panel, so this fades the column as a whole
|
|
// instead of text over a surface; an inline value also keeps the
|
|
// ramp out of an arbitrary Tailwind class.
|
|
style={{ opacity: Math.max(0.45, 1 - index * 0.14) }}
|
|
>
|
|
<span
|
|
className="w-full truncate text-center text-muted-foreground"
|
|
// Relative to the widget's own size, like the ramp above, so an
|
|
// inline value rather than an arbitrary Tailwind class.
|
|
style={{ fontSize: "0.85em" }}
|
|
>
|
|
{item.label ?? ""}
|
|
</span>
|
|
{Glyph ? (
|
|
<Glyph
|
|
className={cn(
|
|
"dui-glyph-sm shrink-0",
|
|
ICON_COLORS[item.color ?? ""] ?? ICON_COLORS.default,
|
|
)}
|
|
/>
|
|
) : null}
|
|
<span className="w-full truncate text-center tabular-nums">
|
|
{item.value === null || item.value === undefined
|
|
? ""
|
|
: String(item.value)}
|
|
</span>
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
)
|
|
}
|