Merge pull request #185 from PetalNet/feat/console-work

feat(console): build Work surface

Author: returnsvoidjanet

apps/console/src/lib/api/client.ts

@@ -12,6 +12,7 @@
 import { env } from "$env/dynamic/public";
 
 import type {
+	AttentionItem,
 	ApiError,
 	BoxUpdateItem,
 	BoxUpdateRaw,
@@ -22,6 +23,7 @@ import type {
 	DeliveryItem,
 	ExecutorItem,
 	HeartbeatItem,
+	LeaseItem,
 	EdgeRegistryItem,
 	EdgeSessionItem,
 	Me,
@@ -30,6 +32,7 @@ import type {
 	QueryResult,
 	StructuredQuery,
 	SubscriptionItem,
+	TaskItem,
 } from "./types";
 
 export type DataMode = "mock" | "live";
@@ -131,6 +134,40 @@ export async function readHeartbeats(
 	});
 	return json<ReadEnvelope<HeartbeatItem>>(res);
 }
+export async function readTasks(fetchFn: typeof fetch = fetch): Promise<ReadEnvelope<TaskItem>> {
+	let cursor: string | null = null;
+	let first: ReadEnvelope<TaskItem> | null = null;
+	const items: TaskItem[] = [];
+	do {
+		// Cursor pagination is sequential: each request depends on the previous cursor.
+		// oxlint-disable-next-line no-await-in-loop
+		const res: Response = await fetchFn(
+			`${base()}/tasks?limit=250${cursor ? `&cursor=${encodeURIComponent(cursor)}` : ""}`,
+			{
+				headers: { accept: "application/json" },
+				credentials: "include",
+			},
+		);
+		// oxlint-disable-next-line no-await-in-loop
+		const page: ReadEnvelope<TaskItem> = await json<ReadEnvelope<TaskItem>>(res);
+		first ??= page;
+		items.push(...page.items);
+		cursor = page.next_cursor;
+	} while (cursor);
+	return {
+		...(first as ReadEnvelope<TaskItem>),
+		items,
+		next_cursor: null,
+		total: first?.total ?? items.length,
+	};
+}
+export async function readLeases(fetchFn: typeof fetch = fetch): Promise<ReadEnvelope<LeaseItem>> {
+	const res = await fetchFn(`${base()}/leases?limit=1000`, {
+		headers: { accept: "application/json" },
+		credentials: "include",
+	});
+	return json<ReadEnvelope<LeaseItem>>(res);
+}
 
 /** POST /api/v1/query — scope-filtered structured statistics query, run as the caller. */
 export async function runQuery(
@@ -212,6 +249,15 @@ export async function readCards(fetchFn: typeof fetch = fetch): Promise<ReadEnve
 	});
 	return json<ReadEnvelope<CardItem>>(res);
 }
+export async function readAttention(
+	fetchFn: typeof fetch = fetch,
+): Promise<ReadEnvelope<AttentionItem>> {
+	const res = await fetchFn(`${base()}/attention?limit=1000`, {
+		headers: { accept: "application/json" },
+		credentials: "include",
+	});
+	return json<ReadEnvelope<AttentionItem>>(res);
+}
 export async function readHealth(fetchFn: typeof fetch = fetch): Promise<ConsoleHealth> {
 	const res = await fetchFn(`${base()}/health`, { headers: { accept: "application/json" } });
 	return json<ConsoleHealth>(res);

apps/console/src/lib/api/ops.ts

@@ -88,6 +88,33 @@ const OPS = {
 		undo: false,
 		humanOnly: false,
 	},
+	"task.claim": {
+		op: "task.claim",
+		verb: "Claim",
+		lane: "operator",
+		executor: "tracker",
+		confirm: "none",
+		undo: false,
+		humanOnly: false,
+	},
+	"task.update": {
+		op: "task.update",
+		verb: "Update",
+		lane: "operator",
+		executor: "tracker",
+		confirm: "none",
+		undo: false,
+		humanOnly: false,
+	},
+	"task.close": {
+		op: "task.close",
+		verb: "Close",
+		lane: "operator",
+		executor: "tracker",
+		confirm: "none",
+		undo: false,
+		humanOnly: false,
+	},
 	"governance.action": {
 		op: "governance.action",
 		verb: "Pause",

apps/console/src/lib/api/types.ts

@@ -144,6 +144,46 @@ export interface HeartbeatItem extends Extra {
 	host: string;
 	observed_at: string;
 }
+export type TaskStatus = "inbox" | "todo" | "doing" | "blocked" | "review" | "done" | "dropped";
+export interface TaskItem extends Extra {
+	id: number;
+	kind: string;
+	title: string;
+	body?: string;
+	status: TaskStatus;
+	priority: 0 | 1 | 2 | 3;
+	project_id?: number | null;
+	project_title?: string | null;
+	parent_id?: number | null;
+	assignee?: string;
+	claimed_by?: string;
+	lease_expires_at?: string | null;
+	blocked_on?: string;
+	verification_status?: "unverified" | "verified" | "rejected";
+	suggested_agent?: string;
+	effort?: string;
+	parallel_group?: string;
+	rank?: number;
+	up_next?: boolean;
+	owner?: string;
+	visibility?: "shared" | "private";
+	handoff_context?: string;
+	acceptance_criteria?: string;
+	result_summary?: string;
+	close_reason?: string;
+	created_at: string;
+	updated_at: string;
+	capability?: string;
+}
+export interface LeaseItem extends Extra {
+	schema_version: 1;
+	task_id: number;
+	worker: string;
+	fence?: number;
+	granted_at?: string;
+	lease_expires_at: string;
+	lease_seconds?: number;
+}
 
 // ---- accounting (POST /query, GET /catalog, GET /dashboards) ----
 export type QueryColumnType = "string" | "number" | "boolean" | "timestamp" | "json";

apps/console/src/lib/components/Countdown.svelte

@@ -32,7 +32,7 @@
 {#if reaped}
 	<span class="cd danger">reaped</span>
 {:else if remainingMs != null}
-	<span class="cd {tone}">{fmt(remainingMs)}</span>
+	<span class="cd {tone}">{remainingMs <= 0 ? "expired · awaiting reap" : fmt(remainingMs)}</span>
 {/if}
 
 <style>

apps/console/src/lib/components/PriorityPips.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+	let { priority }: { priority: 0 | 1 | 2 | 3 } = $props();
+	const filled = $derived(3 - priority);
+</script>
+<span class="priority p{priority}" aria-label={`Priority P${priority}`}><span class="pips" aria-hidden="true">{#each [0, 1, 2] as pip}<i class:filled={pip < filled}></i>{/each}</span><b>P{priority}</b></span>
+<style>
+	.priority{display:inline-flex;align-items:center;gap:var(--s-1);font:500 .6875rem var(--mono);color:var(--text-3)}.pips{display:inline-flex;align-items:flex-end;gap:2px}.pips i{width:2px;height:8px;border-radius:1px;background:var(--rule-strong)}.pips i.filled{background:var(--text-3)}.p0,.p0 .pips i.filled{color:var(--danger-text);background-color:transparent}.p0 .pips i.filled{background:var(--danger-dot)}.p1,.p1 .pips i.filled{color:var(--warn-text)}.p1 .pips i.filled{background:var(--warn-dot)}
+</style>

apps/console/src/lib/components/SurfaceStub.svelte

@@ -0,0 +1,9 @@
+<script lang="ts">
+	import Icon from "./Icon.svelte";
+	let { status = "unverified", word = true }: { status?: "unverified" | "verified" | "rejected"; word?: boolean } = $props();
+	const icon = $derived(status === "verified" ? "circle-check" : status === "rejected" ? "circle-x" : "circle-dashed");
+</script>
+<span class="verification {status}" title={status} aria-label={`Verification: ${status}`}><Icon name={icon} size={12}/>{#if word}<span>{status}</span>{/if}</span>
+<style>
+	.verification{display:inline-flex;align-items:center;gap:var(--s-1);font:500 .6875rem var(--mono);color:var(--text-3)}.verified{color:var(--good-text)}.rejected{color:var(--danger-text)}
+</style>