tuiboard 0.5.0

package/src/store/timeline.ts

@@ -0,0 +1,279 @@
+/**
+ * Timeline view — derives a per-day vertical schedule from kanban tasks.
+ *
+ * The store is "pure": given the current boards + a date string, it returns
+ * the list of `TimelineEntry` (one per scheduled+time-blocked task) and a
+ * pre-computed `RowMap` ready to be rendered as a 64-row vertical column.
+ *
+ * Read-only by design — edits (resize, move, drag-to-schedule) go through
+ * the kanban store's existing setTimeBlock / setScheduled actions.
+ */
+
+import { isTask } from "~/parser/markdown";
+import type { Board, Task } from "~/types";
+import type { TaskRef } from "~/store/index";
+
+/** First hour rendered in the timeline column (inclusive). */
+export const DAY_START_HOUR = 7;
+/** Last hour rendered in the timeline column (exclusive). */
+export const DAY_END_HOUR = 23;
+/** Vertical resolution: each row = N minutes. */
+export const MINS_PER_ROW = 15;
+/** Total renderable rows. (23-7)*60/15 = 64. */
+export const TOTAL_ROWS =
+  ((DAY_END_HOUR - DAY_START_HOUR) * 60) / MINS_PER_ROW;
+/** Minimum block height in rows — single-row blocks are unreadable. */
+export const MIN_BLOCK_ROWS = 2;
+
+export interface TimelineEntry {
+  ref: TaskRef;
+  task: Task;
+  boardName: string;
+  boardIndex: number;
+  columnName: string;
+  startMin: number;
+  endMin: number;
+  /** Vertical position in the row grid (clipped to [0, TOTAL_ROWS)). */
+  startRow: number;
+  /** Exclusive end row. */
+  endRow: number;
+}
+
+export type RowKind = "empty" | "hour" | "head" | "body" | "fill" | "now";
+
+export interface RowMapEntry {
+  kind: RowKind;
+  /** Hour 0-23 for "hour" kind. */
+  hour?: number;
+  /** Source entry for head/body/fill kinds. */
+  entry?: TimelineEntry;
+  /** Now-marker minute (only for "now"). */
+  nowMin?: number;
+}
+
+/**
+ * A row of the timeline grid, paired by lane. The left lane carries the
+ * primary content (hour labels, single-lane blocks, the now marker); the
+ * right lane is set only when two blocks overlap, in which case the
+ * renderer splits the row horizontally into two side-by-side cells.
+ */
+export interface RowMapPair {
+  left: RowMapEntry;
+  right: RowMapEntry;
+}
+
+export interface BuildRowMapResult {
+  rows: RowMapPair[];
+  /** Number of entries that couldn't be placed (3rd+ block in an overlap). */
+  overflow: number;
+}
+
+/**
+ * Build the flat list of time-blocked tasks for the given ISO date.
+ * Tasks must be:
+ *   - non-done
+ *   - have task.timeBlock
+ *   - have task.scheduled === date (we ignore `due` for now; calendar-style
+ *     time-blocking is always scheduled, not due)
+ *
+ * Sorted ascending by startMin so head/body/fill rendering can claim rows
+ * in chronological order.
+ */
+export function buildTimelineEntries(
+  boards: Board[],
+  date: string,
+): TimelineEntry[] {
+  const out: TimelineEntry[] = [];
+  for (let bi = 0; bi < boards.length; bi++) {
+    const board = boards[bi]!;
+    for (let ci = 0; ci < board.columns.length; ci++) {
+      const col = board.columns[ci]!;
+      let taskIndex = 0;
+      for (const child of col.children) {
+        if (!isTask(child)) continue;
+        const idx = taskIndex++;
+        const t = child;
+        if (t.done) continue;
+        if (!t.timeBlock) continue;
+        if (t.scheduled !== date) continue;
+
+        const { startMin, endMin } = t.timeBlock;
+        const windowStart = DAY_START_HOUR * 60;
+        const windowEnd = DAY_END_HOUR * 60;
+        // Skip blocks that fall entirely outside the rendered window.
+        if (endMin <= windowStart || startMin >= windowEnd) continue;
+
+        const startRow = Math.floor((startMin - windowStart) / MINS_PER_ROW);
+        const naturalHeight = Math.max(
+          MIN_BLOCK_ROWS,
+          Math.floor((endMin - startMin) / MINS_PER_ROW),
+        );
+        const endRow = startRow + naturalHeight;
+
+        out.push({
+          ref: {
+            boardPath: board.filepath,
+            columnIndex: ci,
+            taskIndex: idx,
+          },
+          task: t,
+          boardName: board.name,
+          boardIndex: bi,
+          columnName: col.name,
+          startMin,
+          endMin,
+          startRow: Math.max(0, startRow),
+          endRow: Math.min(TOTAL_ROWS, endRow),
+        });
+      }
+    }
+  }
+  out.sort((a, b) => a.startMin - b.startMin);
+  return out;
+}
+
+/**
+ * Place entries onto the TOTAL_ROWS grid, using up to 2 lanes to render
+ * overlapping blocks side-by-side. A third+ overlapping block on the same
+ * row is dropped and counted as `overflow` so the renderer can show a
+ * banner.
+ *
+ * Placement strategy (mirrors timeline.py):
+ *   - Entries are processed in start-time order (already pre-sorted).
+ *   - Each entry tries lane 0 first; if that lane is still occupied by an
+ *     earlier block, it tries lane 1; otherwise it counts as overflow.
+ *   - The `now` marker always lands on lane 0 and clears lane 1 for that
+ *     row — it's the single most important visual cue and shouldn't be
+ *     half-hidden behind a block band.
+ */
+export function buildRowMap(
+  entries: TimelineEntry[],
+  nowMin: number,
+): BuildRowMapResult {
+  const left: RowMapEntry[] = Array.from({ length: TOTAL_ROWS }, () => ({
+    kind: "empty",
+  }));
+  const right: RowMapEntry[] = Array.from({ length: TOTAL_ROWS }, () => ({
+    kind: "empty",
+  }));
+
+  // Hour labels live on the left lane only.
+  for (let r = 0; r < TOTAL_ROWS; r++) {
+    if ((r * MINS_PER_ROW) % 60 === 0) {
+      left[r] = {
+        kind: "hour",
+        hour: DAY_START_HOUR + Math.floor((r * MINS_PER_ROW) / 60),
+      };
+    }
+  }
+
+  // Per-lane "next free row" tracker. -1 means the lane has never held a
+  // block yet, so any startRow is admissible.
+  const laneEndRow: [number, number] = [-1, -1];
+  let overflow = 0;
+
+  for (const entry of entries) {
+    const start = Math.max(0, entry.startRow);
+    const end = Math.min(TOTAL_ROWS, entry.endRow);
+    if (end <= start) continue;
+
+    let lane: 0 | 1;
+    if (start >= laneEndRow[0]) lane = 0;
+    else if (start >= laneEndRow[1]) lane = 1;
+    else {
+      overflow++;
+      continue;
+    }
+
+    const target = lane === 0 ? left : right;
+    laneEndRow[lane] = end;
+    for (let r = start; r < end; r++) {
+      if (r === start) target[r] = { kind: "head", entry };
+      else if (r === start + 1) target[r] = { kind: "body", entry };
+      else target[r] = { kind: "fill", entry };
+    }
+  }
+
+  // Now marker (only when in the visible window). Force both lanes so the
+  // renderer can treat it as a full-width row regardless of overlap state.
+  const windowStart = DAY_START_HOUR * 60;
+  const windowEnd = DAY_END_HOUR * 60;
+  if (nowMin >= windowStart && nowMin < windowEnd) {
+    const nowRow = Math.floor((nowMin - windowStart) / MINS_PER_ROW);
+    if (nowRow >= 0 && nowRow < TOTAL_ROWS) {
+      left[nowRow] = { kind: "now", nowMin };
+      right[nowRow] = { kind: "empty" };
+    }
+  }
+
+  const rows: RowMapPair[] = left.map((l, i) => ({ left: l, right: right[i]! }));
+  return { rows, overflow };
+}
+
+/**
+ * Count time-block overlaps in the entry list. Used to surface a banner so
+ * the user knows their schedule has conflicts (the MVP last-writer-wins
+ * render would otherwise just silently hide some blocks).
+ */
+export function countOverlaps(entries: TimelineEntry[]): number {
+  let count = 0;
+  for (let i = 0; i < entries.length; i++) {
+    for (let j = i + 1; j < entries.length; j++) {
+      const a = entries[i]!;
+      const b = entries[j]!;
+      if (a.startMin < b.endMin && b.startMin < a.endMin) count++;
+    }
+  }
+  return count;
+}
+
+export interface UnscheduledItem {
+  ref: TaskRef;
+  task: Task;
+  boardName: string;
+  boardIndex: number;
+  columnName: string;
+}
+
+/**
+ * Tasks scheduled for the given date but without a time block — the ones
+ * shown in the sticky "◦ Unscheduled" section above the timeline grid.
+ * Sorted by board declaration order, then by encounter in the column
+ * (preserves the user's manual ordering inside each kanban column).
+ */
+export function buildUnscheduledToday(
+  boards: Board[],
+  date: string,
+): UnscheduledItem[] {
+  const out: UnscheduledItem[] = [];
+  for (let bi = 0; bi < boards.length; bi++) {
+    const board = boards[bi]!;
+    for (let ci = 0; ci < board.columns.length; ci++) {
+      const col = board.columns[ci]!;
+      let taskIndex = 0;
+      for (const child of col.children) {
+        if (!isTask(child)) continue;
+        const idx = taskIndex++;
+        const t = child;
+        if (t.done) continue;
+        if (t.timeBlock) continue;
+        if (t.scheduled !== date) continue;
+        out.push({
+          ref: { boardPath: board.filepath, columnIndex: ci, taskIndex: idx },
+          task: t,
+          boardName: board.name,
+          boardIndex: bi,
+          columnName: col.name,
+        });
+      }
+    }
+  }
+  return out;
+}
+
+/** Format minutes since midnight as "HH:MM". */
+export function formatHm(mins: number): string {
+  const h = Math.floor(mins / 60) % 24;
+  const m = mins % 60;
+  return `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}`;
+}

package/src/types.ts

@@ -0,0 +1,116 @@
+/**
+ * Core data model for tuiboard.
+ *
+ * Design principle: parsing is *lossy by selection, not by destruction*.
+ * We extract the structured fields we know about (dates, assignee, time block,
+ * priority, tags, wikilinks), but we always keep `rawBody` and `rawLine` so
+ * serialization can round-trip a board file without losing unknown emoji,
+ * Obsidian-specific syntax, or decorative content.
+ */
+
+export type ISODate = string; // YYYY-MM-DD
+
+export interface TimeBlock {
+  /** Minutes since midnight, inclusive. */
+  startMin: number;
+  /** Minutes since midnight, exclusive. */
+  endMin: number;
+}
+
+/** Where the time block was found in the source — drives writer behavior. */
+export type TimeBlockSource = "legacy-prefix" | "watch-emoji";
+
+export interface Task {
+  /** Stable identity within a board: `${columnIndex}:${indexInColumn}`. */
+  id: string;
+  done: boolean;
+  /** Raw markdown body after the `- [ ] ` / `- [x] ` prefix, verbatim. */
+  rawBody: string;
+  /** Whole raw source line, used for verbatim round-trip until edited. */
+  rawLine: string;
+  /** True when the task has been mutated since parsing — serializer rebuilds from structured fields. */
+  dirty: boolean;
+  /** Display-friendly title with metadata stripped — derived, do not store source-of-truth here. */
+  displayTitle: string;
+
+  // --- Parsed metadata ---
+  assignee?: string;
+  tags: string[];
+  /** Wikilinks: alias if present, otherwise target. */
+  wikilinks: string[];
+  scheduled?: ISODate;
+  due?: ISODate;
+  start?: ISODate;
+  doneDate?: ISODate;
+  priority: PriorityLevel;
+  timeBlock?: TimeBlock;
+  timeBlockSource?: TimeBlockSource;
+}
+
+/** Tasks-plugin priority emojis, in order. `none` = unset. */
+export type PriorityLevel =
+  | "highest" //  🔺
+  | "high"    //  ⏫
+  | "medium"  //  🔼
+  | "low"     //  🔽
+  | "lowest"  //  ⏬
+  | "none";
+
+/** A section separator inside a column (`***` under Kanban plugin convention). */
+export interface SectionBreak {
+  kind: "section-break";
+  rawLine: string;
+}
+
+/** A blank line preserved for round-trip fidelity. */
+export interface BlankLine {
+  kind: "blank";
+  rawLine: string;
+}
+
+/** Any other line we didn't recognize (e.g. indented continuation, comments). */
+export interface RawOther {
+  kind: "raw";
+  rawLine: string;
+}
+
+export type ColumnChild = Task | SectionBreak | BlankLine | RawOther;
+
+export interface Column {
+  name: string;
+  /** Header level (almost always 2, i.e. `##`). */
+  headerLevel: number;
+  /** Raw heading line, for verbatim round-trip. */
+  rawHeading: string;
+  children: ColumnChild[];
+}
+
+export interface Board {
+  /** Absolute filesystem path. */
+  filepath: string;
+  /** Display name from frontmatter `name:` or from filename. */
+  name: string;
+  /** Verbatim frontmatter block including `---` fences, or empty. */
+  frontmatter: string;
+  /** Content between frontmatter and first column heading (verbatim, may be blank lines). */
+  preamble: string;
+  columns: Column[];
+  /** Trailing content after the last column (e.g. `%% kanban:settings %%`). Verbatim. */
+  trailer: string;
+  /** Detected line ending — `\n` or `\r\n`. Used by serializer. */
+  lineEnding: "\n" | "\r\n";
+  /** Original full text — kept for diffing on conflict detection later. */
+  originalContent: string;
+}
+
+export interface ParseDiagnostic {
+  /** 1-based line number. */
+  line: number;
+  level: "info" | "warn" | "error";
+  message: string;
+}
+
+export interface ParseResult {
+  board: Board;
+  diagnostics: ParseDiagnostic[];
+}

package/src/ui/AgentRow.tsx

@@ -0,0 +1,79 @@
+/**
+ * Single-line render of an AgentSession. Used in both AgentsBar (compact
+ * dashboard strip) and AgentsOnly (fullscreen list).
+ *
+ * Layout: cursor · status-dot · name · git branch · cwd_short · age
+ */
+
+import { Show, createMemo } from "solid-js";
+
+import { T } from "~/ui/glyphs";
+import { formatAge, type AgentSession, type AgentStatus } from "~/store/agents";
+
+const STATUS_COLOR: Record<AgentStatus, string> = {
+  "live-busy": T.today,     // bright accent for actively-running
+  "live-idle": T.scheduled, // warm but quieter
+  "stale-pid": T.bannerWarn,
+  "dormant":   T.textDim,
+  "archived":  T.textDone,
+};
+
+const STATUS_GLYPH: Record<AgentStatus, string> = {
+  "live-busy": "●",
+  "live-idle": "○",
+  "stale-pid": "△",
+  "dormant":   "·",
+  "archived":  "·",
+};
+
+interface AgentRowProps {
+  session: AgentSession;
+  cursor?: boolean;
+  /** Maximum chars for displayName before truncation. Default 40. */
+  nameMaxChars?: number;
+  onClick?: () => void;
+}
+
+export function AgentRow(props: AgentRowProps) {
+  const ageStr = createMemo(() =>
+    formatAge(props.session.lastActivityMs, Date.now()),
+  );
+  const nameMax = () => props.nameMaxChars ?? 40;
+  const displayName = createMemo(() => {
+    const n = props.session.displayName;
+    return n.length > nameMax() ? n.slice(0, nameMax() - 1) + "…" : n;
+  });
+
+  return (
+    <box
+      style={{
+        flexDirection: "row",
+        paddingLeft: 1,
+        paddingRight: 1,
+        backgroundColor: props.cursor ? T.cardBgCursor : undefined,
+      }}
+      onMouseDown={props.onClick ? (() => props.onClick!()) : undefined}
+    >
+      {/* `truncate` is on as a safety net — our own displayName tail
+          truncation in AgentRow normally controls the visible string,
+          but OpenTUI's clip-at-cell-bound prevents bleed into adjacent
+          renderables in edge cases (terminal emoji width quirks etc.). */}
+      <text style={{ flexGrow: 1, flexShrink: 1 }} wrapMode="none" truncate>
+        <span style={{ fg: props.cursor ? T.accent : T.textDim }}>
+          {props.cursor ? "▶ " : "  "}
+        </span>
+        <span style={{ fg: STATUS_COLOR[props.session.status] }}>
+          {STATUS_GLYPH[props.session.status]}{" "}
+        </span>
+        <span style={{ fg: T.text }}>{displayName()}</span>
+        <Show when={props.session.gitBranch}>
+          <span style={{ fg: T.textDim }}>{"  "}{props.session.gitBranch}</span>
+        </Show>
+        <span style={{ fg: T.textDim }}>{"  "}{props.session.cwdShort}</span>
+      </text>
+      <text style={{ flexShrink: 0 }} wrapMode="none">
+        <span style={{ fg: T.textDim }}>{" "}{ageStr()}</span>
+      </text>
+    </box>
+  );
+}

package/src/ui/AgentsBar.tsx

@@ -0,0 +1,102 @@
+/**
+ * Compact agent status strip for the dashboard. Renders a windowed slice
+ * of the non-archived sessions list so the cursor stays inside the view
+ * even when the underlying list is far larger than the visible rows.
+ *
+ * The border color reflects activeZone === "agents" so the cursor
+ * ring is visible. Clicking a row sets activeZone + agent cursor.
+ */
+
+import { For, Show, createMemo } from "solid-js";
+
+import { AgentRow } from "~/ui/AgentRow";
+import { T } from "~/ui/glyphs";
+import type { TuiStore } from "~/store/index";
+
+interface AgentsBarProps {
+  store: TuiStore;
+  /** Fixed row height in the dashboard layout. */
+  height?: number;
+  /** Max sessions to show in the compact strip. Default 5 (fits in height=7). */
+  maxVisible?: number;
+}
+
+interface WindowedEntry {
+  index: number;
+  // We don't import AgentSession here; carrying through the For element is fine.
+  // Solid will infer the type.
+  session: ReturnType<TuiStore["agents"]["sessions"]>[number];
+}
+
+export function AgentsBar(props: AgentsBarProps) {
+  const isActive = () => props.store.state.ui.activeZone === "agents";
+  const agentRow = () => props.store.state.ui.row;
+  const maxVisible = () => props.maxVisible ?? 5;
+
+  /** All visible (non-archived) sessions — full list. */
+  const allShown = createMemo(() =>
+    props.store.agents.sessions().filter((s) => s.status !== "archived"),
+  );
+
+  /**
+   * Windowed slice that follows the cursor. When the cursor falls outside
+   * the current window, we slide so it sits in the middle (when possible).
+   */
+  const windowed = createMemo<WindowedEntry[]>(() => {
+    const all = allShown();
+    const max = maxVisible();
+    if (all.length <= max) {
+      return all.map((session, index) => ({ index, session }));
+    }
+    const cursor = isActive() ? agentRow() : 0;
+    const halfWin = Math.floor(max / 2);
+    let start = Math.max(0, cursor - halfWin);
+    let end = Math.min(all.length, start + max);
+    if (end - start < max) start = Math.max(0, end - max);
+    return all.slice(start, end).map((session, i) => ({
+      index: start + i,
+      session,
+    }));
+  });
+
+  return (
+    <box
+      style={{
+        flexDirection: "column",
+        height: props.height,
+        flexGrow: props.height ? 0 : 1,
+        marginTop: 1,
+        border: true,
+        borderStyle: "rounded",
+        borderColor: isActive() ? T.borderActive : T.border,
+        paddingLeft: 1,
+        paddingRight: 1,
+      }}
+      title={`┤ Agents (live) · ${allShown().length} ├`}
+      titleAlignment="left"
+    >
+      <Show
+        when={allShown().length > 0}
+        fallback={
+          <text>
+            <span style={{ fg: T.textDim }}>No active sessions.</span>
+          </text>
+        }
+      >
+        <For each={windowed()}>
+          {(entry) => (
+            <AgentRow
+              session={entry.session}
+              cursor={isActive() && entry.index === agentRow()}
+              nameMaxChars={48}
+              onClick={() => {
+                props.store.setActiveZone("agents");
+                props.store.setCursor(0, entry.index);
+              }}
+            />
+          )}
+        </For>
+      </Show>
+    </box>
+  );
+}