@runwisp/ui 1.5.0 → 1.7.0

package/src/lib/components/dashboard/bulk-selection.svelte.test.ts

@@ -0,0 +1,42 @@
+// SPDX-FileCopyrightText: PoppyCake, s.r.o.
+// SPDX-License-Identifier: Apache-2.0
+
+import { describe, expect, it } from "vitest";
+import { BulkSelection } from "./bulk-selection.svelte.js";
+
+describe("BulkSelection", () => {
+    it("tracks explicitly picked rows", () => {
+        const sel = new BulkSelection();
+        sel.toggle("a");
+        sel.toggle("b");
+        sel.toggle("a");
+        expect(sel.isSelected("a")).toBe(false);
+        expect(sel.isSelected("b")).toBe(true);
+        expect(sel.allSelected).toBe(false);
+        expect(sel.selector({}, ["b"])).toEqual({ matchAll: false, ids: ["b"] });
+    });
+
+    it("selects everything except opt-outs in all mode", () => {
+        const sel = new BulkSelection();
+        sel.toggle("x");
+        sel.selectAll();
+        expect(sel.isSelected("x")).toBe(true);
+        expect(sel.allSelected).toBe(true);
+        sel.toggle("x");
+        expect(sel.isSelected("x")).toBe(false);
+        expect(sel.allSelected).toBe(false);
+        expect(sel.selector({ taskName: "t" }, ["ignored"])).toEqual({
+            matchAll: true,
+            filter: { taskName: "t" },
+            exceptIds: ["x"],
+        });
+    });
+
+    it("clears back to nothing selected", () => {
+        const sel = new BulkSelection();
+        sel.selectAll();
+        sel.clear();
+        expect(sel.isSelected("a")).toBe(false);
+        expect(sel.allSelected).toBe(false);
+    });
+});

package/src/lib/components/dashboard/bulk-selection.svelte.ts

@@ -0,0 +1,50 @@
+// SPDX-FileCopyrightText: PoppyCake, s.r.o.
+// SPDX-License-Identifier: Apache-2.0
+
+import { SvelteSet } from "svelte/reactivity";
+import type { RunSelector } from "@runwisp/common";
+
+/**
+ * Which runs are ticked in the list. Two modes:
+ *   1. explicit: the operator picked specific rows; `#explicit` holds them.
+ *   2. all: "everything matching the current filter"; `#except` holds opt-outs.
+ */
+export class BulkSelection {
+    #all = $state(false);
+    readonly #explicit = new SvelteSet<string>();
+    readonly #except = new SvelteSet<string>();
+
+    isSelected(id: string): boolean {
+        return this.#all ? !this.#except.has(id) : this.#explicit.has(id);
+    }
+
+    toggle(id: string): void {
+        const ids = this.#all ? this.#except : this.#explicit;
+        if (!ids.delete(id)) ids.add(id);
+    }
+
+    clear(): void {
+        this.#all = false;
+        this.#explicit.clear();
+        this.#except.clear();
+    }
+
+    selectAll(): void {
+        this.clear();
+        this.#all = true;
+    }
+
+    /** Every matching run is selected, with no opt-outs. */
+    get allSelected(): boolean {
+        return this.#all && this.#except.size === 0;
+    }
+
+    /**
+     * The server-side selector for a bulk operation. In "all" mode it targets
+     * everything matching `filter`; in explicit mode just `affectedIds`.
+     */
+    selector(filter: NonNullable<RunSelector["filter"]>, affectedIds: string[]): RunSelector {
+        if (!this.#all) return { matchAll: false, ids: affectedIds };
+        return { matchAll: true, filter, exceptIds: [...this.#except] };
+    }
+}

package/src/lib/components/dashboard/cron-format.test.ts

@@ -17,6 +17,15 @@ describe("humanizeCron", () => {
         expect(result.isHumanized).toBe(true);
     });
 
+    it("describes the nth and last weekday of the month", () => {
+        expect(humanizeCron("0 3 * * FRI#3").humanized).toBe(
+            "At 03:00 AM, on the third Friday of the month",
+        );
+        const last = humanizeCron("0 3 * * FRI#L");
+        expect(last.humanized).toBe("At 03:00 AM, on the last Friday of the month");
+        expect(last.raw).toBe("0 3 * * FRI#L");
+    });
+
     it("humanizes @hourly via cronstrue", () => {
         const result = humanizeCron("@hourly");
         expect(result.humanized).toBe("Every hour");
@@ -52,7 +61,7 @@ describe("humanizeCron", () => {
         expect(result.isHumanized).toBe(false);
     });
 
-    it("falls back to raw for unparseable expressions — never 'Invalid'", () => {
+    it("falls back to raw for unparseable expressions, never 'Invalid'", () => {
         const result = humanizeCron("not a cron");
         expect(result.humanized).toBe("not a cron");
         expect(result.isHumanized).toBe(false);

package/src/lib/components/dashboard/cron-format.ts

@@ -3,7 +3,7 @@
 import cronstrue from "cronstrue";
 
 interface HumanizedCron {
-    /** Display text — humanized when possible, otherwise the raw expression. */
+    /** Display text, humanized when possible, otherwise the raw expression. */
     humanized: string;
     /** The original cron expression, for tooltips. */
     raw: string;
@@ -51,7 +51,7 @@ function humanizeEvery(duration: string): string | null {
 /**
  * humanizeCron renders a cron expression as plain English ("Every 5 minutes").
  * Handles robfig's `@every <duration>` extension (cronstrue throws on it) and
- * falls back to the raw expression on anything unparseable — never "Invalid".
+ * falls back to the raw expression on anything unparseable, never "Invalid".
  */
 export function humanizeCron(cron: string): HumanizedCron {
     const raw = cron.trim();
@@ -66,7 +66,11 @@ export function humanizeCron(cron: string): HumanizedCron {
     }
 
     try {
-        const humanized = cronstrue.toString(raw, { throwExceptionOnParseError: true });
+        // cronstrue reads a last weekday as Quartz's "5L"; "5#L" would come out as
+        // "on the null Friday of the month".
+        const humanized = cronstrue.toString(raw.replace(/#L/gi, "L"), {
+            throwExceptionOnParseError: true,
+        });
         return { humanized, raw, isHumanized: true };
     } catch {
         return { humanized: raw, raw, isHumanized: false };

package/src/lib/components/dashboard/run-filters.test.ts

@@ -26,6 +26,8 @@ import {
     exitCodeRangeActive,
     isExitCodeExprValid,
     exitCodeChipLabel,
+    runFilterParams,
+    filterChipLabel,
     type StatusBucket,
     type RunsListFilters,
 } from "./run-filters.js";
@@ -42,7 +44,7 @@ const base = (overrides: Partial<RunsListFilters> = {}): RunsListFilters => ({
 });
 
 describe("emptyRunFilters", () => {
-    it("is a fully-open filter — no dimension active, newest-first", () => {
+    it("is a fully-open filter, no dimension active, newest-first", () => {
         const f = emptyRunFilters();
         expect(f.statuses).toEqual([]);
         expect(f.sortDirection).toBe("desc");
@@ -132,7 +134,7 @@ describe("statusChipLabel", () => {
 describe("STATUS_BUCKETS", () => {
     // The Failed bucket is the failure sentinel (resolved server-side to the
     // per-task is_failure classification), so the execution-failure reasons are
-    // not bucketed — they stay reachable via the popover's Advanced expander.
+    // not bucketed, they stay reachable via the popover's Advanced expander.
     const FAILURE_REASONS = [
         "failed",
         "crashed",
@@ -292,3 +294,61 @@ describe("exit-code expression", () => {
         expect(exitCodeChipLabel(" 137 ")).toBe("Exit 137");
     });
 });
+
+describe("runFilterParams", () => {
+    it("omits every inactive dimension", () => {
+        expect(runFilterParams(emptyRunFilters())).toEqual({});
+    });
+
+    it("maps each active dimension to its server field", () => {
+        expect(
+            runFilterParams({
+                search: " nightly ",
+                statuses: ["failed", "timeout"],
+                sortDirection: "asc",
+                taskName: "backup",
+                createdAfter: "2026-01-01T00:00:00Z",
+                createdBefore: "2026-01-02T00:00:00Z",
+                triggeredBy: "cron",
+                exitCode: ">100 <150",
+                retriesOnly: true,
+            }),
+        ).toEqual({
+            taskName: "backup",
+            search: "nightly",
+            status: "failed,timeout",
+            createdAfter: "2026-01-01T00:00:00Z",
+            createdBefore: "2026-01-02T00:00:00Z",
+            triggeredBy: "cron",
+            exitCodeMin: 101,
+            exitCodeMax: 149,
+            retriesOnly: true,
+        });
+    });
+
+    it("ignores an unparseable exit-code expression", () => {
+        expect(runFilterParams({ ...emptyRunFilters(), exitCode: "12a" })).toEqual({});
+    });
+});
+
+describe("filterChipLabel", () => {
+    it("labels each dimension", () => {
+        const f = base({
+            statuses: ["failed"],
+            taskName: "backup",
+            triggeredBy: "cron",
+            exitCode: ">100",
+            createdAfter: "2026-01-01T00:00:00Z",
+        });
+        expect(filterChipLabel(f, "status")).toBe(statusChipLabel(["failed"]));
+        expect(filterChipLabel(f, "task")).toBe("backup");
+        expect(filterChipLabel(f, "triggeredBy")).toBe("Trigger: " + triggerDescription("cron"));
+        expect(filterChipLabel(f, "exitCode")).toBe("Exit >100");
+        expect(filterChipLabel(f, "retries")).toBe("Retries only");
+        expect(filterChipLabel(f, "time")).toMatch(/^Since /);
+    });
+
+    it("has no time label without bounds", () => {
+        expect(filterChipLabel(base(), "time")).toBe("");
+    });
+});

package/src/lib/components/dashboard/run-filters.ts

@@ -2,17 +2,14 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { TRIGGERS, type Trigger } from "@runwisp/common";
+import { formatCalendarDate, formatDateTime } from "../../utils/format.js";
+import { TRIGGER_LABELS } from "./run-helpers.js";
+import { RUN_STATUS_CONFIG } from "./status-config.js";
 
 /**
- * The single filter shape shared by the runs list, the filter popover, the
- * SSE-merge source, and the bulk selector. Every field beyond `search` and
- * `sortDirection` is an optional dimension applied server-side; the zero
- * value (`emptyRunFilters`) matches every run.
- *
- * `statuses` is a multi-select set joined to a comma-separated string only at
- * the two wire boundaries (the list query and the bulk selector). Time bounds
- * are absolute RFC3339 instants — presets resolve to `now − delta` at apply
- * time so a live SSE row created after the boundary keeps matching.
+ * The filter shared by the runs list, the filter popover, the SSE-merge source
+ * and the bulk selector. Time bounds are absolute RFC3339 instants, so a live
+ * SSE row created after a preset was applied keeps matching.
  */
 export interface RunsListFilters {
     search: string;
@@ -20,82 +17,77 @@ export interface RunsListFilters {
     sortDirection: "asc" | "desc" | "";
     // Optional dimensions explicitly admit `undefined` so a dimension can be
     // cleared by reassignment (`{ ...f, x: undefined }`) under the project's
-    // exactOptionalPropertyTypes — a fresh object reference is what re-triggers
+    // exactOptionalPropertyTypes, a fresh object reference is what re-triggers
     // the parent's fetch effect through several levels of `bind:`.
     taskName?: string | undefined;
     createdAfter?: string | undefined;
     createdBefore?: string | undefined;
     triggeredBy?: string | undefined;
-    // A human exit-code expression — a bare code (`137`), a comparison (`>100`,
-    // `<=150`), or a space-separated combination (`>100 <150`). Normalized to an
-    // inclusive [min, max] range (`exitCodeRange`) at the wire boundary; the
-    // server only ever sees `exitCodeMin` / `exitCodeMax`.
+    // An exit-code expression such as `137`, `>100` or `>100 <150`; see
+    // parseExitCodeRange.
     exitCode?: string | undefined;
     retriesOnly?: boolean | undefined;
 }
 
-/** A fresh default filter — no dimensions active, newest-first. */
+/** A fresh default filter, no dimensions active, newest-first. */
 export function emptyRunFilters(): RunsListFilters {
     return { search: "", statuses: [], sortDirection: "desc" };
 }
 
 /**
- * Reserved `status` token the "Failed" browse filter sends instead of a fixed
- * end-reason list. The server (splitFailureToken in api_types.go) strips it and
- * matches on each run's persisted `isFailure` bit, so the browse filter agrees
- * with the attention badges, the failed stat, and notifications — all of which
- * follow the per-task `failures` policy. It is not a real status/end-reason, so
- * it OR-combines with the other buckets. Must match `failureStatusToken` in the
- * daemon.
+ * Reserved `status` token for the "Failed" filter. The daemon matches it on each
+ * run's `isFailure` bit (per-task `failures` policy) instead of a fixed
+ * end-reason list. Must match `failureStatusToken` in the daemon.
  */
 export const FAILURE_STATUS_TOKEN = "failure";
 
 /**
- * Outcome buckets: the 14 individual run statuses collapsed into five
- * plain-language groups, so the common case is a five-item pick instead of a
- * flat checklist. Each bucket is purely a UI grouping over `statuses` — toggling
- * one adds/removes its members, and the popover's "Advanced" section still
- * exposes the individual statuses for surgical filters (e.g. only `timeout`).
- *
- * Every status appears in exactly one bucket; `Failed` is the failure sentinel,
- * which the server resolves to each run's `isFailure` bit. `dot` mirrors that
- * group's color in
- * RUN_STATUS_CONFIG so the bucket reads at a glance.
+ * Outcome buckets: a UI grouping of the individual run statuses into five
+ * plain-language picks. The popover's "Advanced" section still exposes the
+ * individual statuses.
  */
 export interface StatusBucket {
     key: string;
     label: string;
-    /** Tailwind background class for the bucket's status dot. */
     dot: string;
     statuses: readonly string[];
 }
 
 export const STATUS_BUCKETS: readonly StatusBucket[] = [
-    { key: "running", label: "Running", dot: "bg-info-surface", statuses: ["pending", "running"] },
-    { key: "succeeded", label: "Succeeded", dot: "bg-success-surface", statuses: ["succeeded"] },
+    {
+        key: "running",
+        label: "Running",
+        dot: RUN_STATUS_CONFIG.running.solidDot,
+        statuses: ["pending", "running"],
+    },
+    {
+        key: "succeeded",
+        label: "Succeeded",
+        dot: RUN_STATUS_CONFIG.succeeded.solidDot,
+        statuses: ["succeeded"],
+    },
     {
         key: "failed",
         label: "Failed",
-        dot: "bg-danger-surface",
+        dot: RUN_STATUS_CONFIG.failed.solidDot,
         statuses: [FAILURE_STATUS_TOKEN],
     },
     {
         key: "skipped",
         label: "Skipped",
-        dot: "bg-on-surface-faint",
+        dot: RUN_STATUS_CONFIG.skipped.solidDot,
         statuses: ["skipped", "dst_skipped", "queue_full"],
     },
     {
         key: "stopped",
         label: "Stopped",
-        dot: "bg-warning-surface",
+        dot: RUN_STATUS_CONFIG.stopped.solidDot,
         statuses: ["stopped", "daemon_stopped"],
     },
 ];
 
 export type BucketState = "on" | "partial" | "off";
 
-/** Whether none, some, or all of a bucket's statuses are currently selected. */
 export function bucketState(statuses: string[], bucket: StatusBucket): BucketState {
     const set = new Set(statuses);
     const present = bucket.statuses.filter((s) => set.has(s)).length;
@@ -122,7 +114,7 @@ function exactBucket(statuses: string[]): StatusBucket | undefined {
 
 /**
  * The popover-managed dimensions, in display (most→least useful) order.
- * `task` only ever applies on the cross-task /runs view — on a single task's
+ * `task` only ever applies on the cross-task /runs view, on a single task's
  * page the task name is the page scope (injected at fetch time), never a
  * popover-set filter, so it stays absent from those filters and is not counted.
  */
@@ -137,7 +129,6 @@ const DIMENSION_ORDER: FilterDimension[] = [
     "retries",
 ];
 
-/** Whether a single dimension is currently constraining the result set. */
 export function dimensionActive(f: RunsListFilters, dim: FilterDimension): boolean {
     switch (dim) {
         case "status":
@@ -155,17 +146,16 @@ export function dimensionActive(f: RunsListFilters, dim: FilterDimension): boole
     }
 }
 
-/** The active dimensions, in display order — drives the chip row. */
+/** The active dimensions, in display order, drives the chip row. */
 export function activeDimensions(f: RunsListFilters): FilterDimension[] {
     return DIMENSION_ORDER.filter((dim) => dimensionActive(f, dim));
 }
 
-/** How many dimensions are active — the count badge on the Filter button. */
+/** How many dimensions are active, the count badge on the Filter button. */
 export function activeFilterCount(f: RunsListFilters): number {
     return activeDimensions(f).length;
 }
 
-/** Reset one dimension, leaving the others (and search/sort) untouched. */
 export function clearDimension(f: RunsListFilters, dim: FilterDimension): RunsListFilters {
     switch (dim) {
         case "status":
@@ -190,47 +180,20 @@ export function humanizeStatus(status: string): string {
     return spaced.charAt(0).toUpperCase() + spaced.slice(1);
 }
 
-/**
- * Descriptive label for a run's trigger source — fuller than the one-word row
- * badge (`formatTriggeredByLabel`) for the "cron"/"station"/"service"/"startup"
- * sources, where the extra words disambiguate (e.g. "REST API" vs a bare
- * "API"). "ui", "cli" and "hook" already read fine as their bare badge word,
- * so those three match `formatTriggeredByLabel` exactly.
- *
- * Note `cron` covers both on-time schedule firings and catch-up for missed
- * runs, and `startup` is specifically `run_on_start` (not catch-up).
- */
+/** Descriptive label for a run's trigger source (see {@link TRIGGER_LABELS}). */
 export function triggerDescription(trigger: string): string {
-    switch (trigger) {
-        case "cron":
-            return "Scheduled (cron)";
-        case "api":
-            return "REST API";
-        case "ui":
-            return "UI";
-        case "cli":
-            return "CLI";
-        case "station":
-            return "Control plane";
-        case "service":
-            return "Service auto-start";
-        case "startup":
-            return "On daemon start";
-        case "hook":
-            return "Hook";
-        default:
-            return humanizeStatus(trigger);
-    }
+    const known = TRIGGERS.find((t) => t === trigger);
+    return known ? TRIGGER_LABELS[known].long : humanizeStatus(trigger);
 }
 
 /**
  * The triggers offered in the filter dropdown. `station` is intentionally
- * excluded for now — control-plane runs still carry the `station` trigger, but
+ * excluded for now, control-plane runs still carry the `station` trigger, but
  * it isn't a selectable filter dimension.
  */
 export const FILTERABLE_TRIGGERS: readonly Trigger[] = TRIGGERS.filter((t) => t !== "station");
 
-/** Chip label for the status dimension — names a whole bucket when it matches. */
+/** Chip label for the status dimension, names a whole bucket when it matches. */
 export function statusChipLabel(statuses: string[]): string {
     const bucket = exactBucket(statuses);
     if (bucket) return bucket.label;
@@ -239,15 +202,6 @@ export function statusChipLabel(statuses: string[]): string {
     return `${String(statuses.length)} statuses`;
 }
 
-// --- Time helpers --------------------------------------------------------
-//
-// A bare calendar day (`YYYY-MM-DD` from a native date input) maps to a local
-// instant: the "from" edge is that day's 00:00, the "to" edge is its end
-// (23:59:59.999) so picking the same day for both bounds — or the one-click
-// "on day" shortcut — captures the whole day and round-trips back to the same
-// date in the inputs. Bounds are stored as absolute RFC3339 (UTC) instants, the
-// shape the list query and SSE-merge filter already expect.
-
 /** Parse `YYYY-MM-DD` into the local Date for that day, or null if malformed. */
 function localDay(dateStr: string): Date | null {
     const parts = dateStr.split("-");
@@ -295,14 +249,6 @@ export function isWholeDay(after?: string, before?: string): boolean {
     );
 }
 
-// --- Exit-code expression ------------------------------------------------
-//
-// The popover takes a free-form exit-code expression and normalizes it to an
-// inclusive integer [min, max] range — the shape the server gates on. Because
-// exit codes are integers, a strict comparison collapses to an inclusive
-// bound: `>100` is min 101, `<150` is max 149. Tokens combine (`>100 <150`),
-// and a bare number is an exact match (min = max = n).
-
 export interface ExitCodeRange {
     min?: number;
     max?: number;
@@ -311,10 +257,10 @@ export interface ExitCodeRange {
 const EXIT_CODE_TOKEN = /^(>=|<=|>|<)?(-?\d+)$/;
 
 /**
- * Parse an exit-code expression into an inclusive [min, max] range. Returns
- * `valid: false` if any token is unparseable, so the UI can flag a typo
- * instead of silently applying half of it. An empty expression is valid with
- * no bounds (no constraint).
+ * Parse an exit-code expression into the inclusive integer range the server
+ * filters on: `>100` is min 101, `<150` is max 149, a bare number is an exact
+ * match, and tokens combine. Any unparseable token makes the whole expression
+ * invalid so the UI can flag the typo. An empty expression is valid and unbounded.
  */
 export function parseExitCodeRange(expr: string): { range: ExitCodeRange; valid: boolean } {
     const range: ExitCodeRange = {};
@@ -353,18 +299,77 @@ export function exitCodeRange(expr: string | undefined): ExitCodeRange {
     return valid ? range : {};
 }
 
-/** True when the expression resolves to at least one bound (a real filter). */
 export function exitCodeRangeActive(expr: string | undefined): boolean {
     const { min, max } = exitCodeRange(expr);
     return min !== undefined || max !== undefined;
 }
 
-/** True when the expression is empty or fully parseable — drives input validation. */
+/** True when the expression is empty or fully parseable, drives input validation. */
 export function isExitCodeExprValid(expr: string): boolean {
     return parseExitCodeRange(expr).valid;
 }
 
+/**
+ * The server-side filter fields for a filter state. The list query and the
+ * bulk selector both build on it, so "select all matching" targets exactly the
+ * rows on screen. Dimensions that are off are omitted.
+ */
+export interface RunFilterParams {
+    taskName?: string;
+    search?: string;
+    status?: string;
+    createdAfter?: string;
+    createdBefore?: string;
+    triggeredBy?: string;
+    exitCodeMin?: number;
+    exitCodeMax?: number;
+    retriesOnly?: true;
+}
+
+export function runFilterParams(f: RunsListFilters): RunFilterParams {
+    const params: RunFilterParams = {};
+    if (f.taskName) params.taskName = f.taskName;
+    const search = f.search.trim();
+    if (search) params.search = search;
+    if (f.statuses.length > 0) params.status = f.statuses.join(",");
+    if (f.createdAfter) params.createdAfter = f.createdAfter;
+    if (f.createdBefore) params.createdBefore = f.createdBefore;
+    if (f.triggeredBy) params.triggeredBy = f.triggeredBy;
+    const exit = exitCodeRange(f.exitCode);
+    if (exit.min !== undefined) params.exitCodeMin = exit.min;
+    if (exit.max !== undefined) params.exitCodeMax = exit.max;
+    if (f.retriesOnly === true) params.retriesOnly = true;
+    return params;
+}
+
 /** Chip label for an active exit-code filter, e.g. `Exit >100 <150`. */
 export function exitCodeChipLabel(expr: string | undefined): string {
     return `Exit ${(expr ?? "").trim()}`;
 }
+
+function timeChipLabel(f: RunsListFilters): string {
+    const { createdAfter: after, createdBefore: before } = f;
+    if (isWholeDay(after, before) && after) return `On ${formatCalendarDate(after)}`;
+    if (after && before) return `${formatDateTime(after)} – ${formatDateTime(before)}`;
+    if (after) return `Since ${formatDateTime(after)}`;
+    if (before) return `Before ${formatDateTime(before)}`;
+    return "";
+}
+
+/** Label of the chip shown for an active filter dimension. */
+export function filterChipLabel(f: RunsListFilters, dim: FilterDimension): string {
+    switch (dim) {
+        case "status":
+            return statusChipLabel(f.statuses);
+        case "time":
+            return timeChipLabel(f);
+        case "task":
+            return f.taskName ?? "";
+        case "triggeredBy":
+            return "Trigger: " + triggerDescription(f.triggeredBy ?? "");
+        case "exitCode":
+            return exitCodeChipLabel(f.exitCode);
+        case "retries":
+            return "Retries only";
+    }
+}