can1357
2c773a12a4
git-subtree-dir: python/robomp git-subtree-mainline:4f6e70f779git-subtree-split:553fd1cfcf
46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import { For, type JSX } from "solid-js";
|
|
|
|
import { statusResource } from "../state";
|
|
import { EVENT_STATE_ORDER, type EventState } from "../types";
|
|
|
|
const ACCENT: Record<EventState, string> = {
|
|
queued: "text-[#9ec9ff]",
|
|
running: "text-[#ffe26b]",
|
|
done: "text-[#7fe5a3]",
|
|
failed: "text-[#ff8e85]",
|
|
skipped: "text-ink-300",
|
|
};
|
|
|
|
export function Stats(): JSX.Element {
|
|
const counts = (): Record<EventState, number> => {
|
|
const status = statusResource();
|
|
if (!status) return { queued: 0, running: 0, done: 0, failed: 0, skipped: 0 };
|
|
return status.issue_event_counts ?? status.event_counts;
|
|
};
|
|
|
|
return (
|
|
<section
|
|
class="glass glass-rise rounded-[22px] grid gap-px overflow-hidden"
|
|
style={{
|
|
"grid-template-columns": "repeat(5, minmax(0, 1fr))",
|
|
"background-color": "rgba(255, 255, 255, 0.05)",
|
|
}}
|
|
title="newest non-skipped event per issue"
|
|
>
|
|
<For each={EVENT_STATE_ORDER}>
|
|
{(state) => (
|
|
<div
|
|
class="px-5 py-5 flex flex-col gap-1.5"
|
|
style={{ "background-color": "rgba(8, 11, 16, 0.55)" }}
|
|
>
|
|
<span class="eyebrow">{state}</span>
|
|
<span class={`text-[34px] leading-none font-semibold tabular ${ACCENT[state]}`}>
|
|
{counts()[state] ?? 0}
|
|
</span>
|
|
</div>
|
|
)}
|
|
</For>
|
|
</section>
|
|
);
|
|
}
|