@starlove/orbit 1.0.6 → 1.1.0

package/public/js/state.js

@@ -10,6 +10,8 @@ export const state = {
   /** Currently selected board id. Single-board UI; this points at the active
    *  board in `state.data.boards`. */
   boardId: "",
+  /** URL-facing board identifier. Routes use slugs; API calls keep using ids. */
+  boardSlug: "",
   selectedTicketId: "",
   expandedCardIds: new Set(),
   /** "empty" | "ticket" | "settings" — drives the main right overlay drawer (not the New flyout). */
@@ -30,9 +32,16 @@ export function getSettingsTab() {
 export function syncBoardSelection() {
   if (!state.data) return;
   const boards = state.data.boards || [];
-  if (!state.boardId || !boards.some((b) => b.id === state.boardId)) {
-    state.boardId = boards[0]?.id || "";
+  let board = state.boardId ? boards.find((b) => b.id === state.boardId) : null;
+  if (!board && state.boardSlug) {
+    board = boards.find((b) => b.slug === state.boardSlug) || boards.find((b) => b.id === state.boardSlug);
   }
+  if (!board) {
+    const activeBoardId = state.data.active_board_id;
+    board = boards.find((b) => b.id === activeBoardId) || boards[0] || null;
+  }
+  state.boardId = board?.id || "";
+  state.boardSlug = board?.slug || "";
 }
 
 export function currentBoard() {
@@ -68,3 +77,53 @@ export function selectableStatesForProject(currentStateId = "") {
 export function ticketsForProject() {
   return state.data.tickets.filter((item) => item.board_id === state.boardId);
 }
+
+function compactTicketForBoard(ticket) {
+  if (!ticket) return null;
+  return {
+    id: ticket.id,
+    board_id: ticket.board_id,
+    board_slug: ticket.board_slug,
+    number: ticket.number,
+    title: ticket.title,
+    type: ticket.type,
+    state_name: ticket.state_name,
+    state_role: ticket.state_role,
+    priority: ticket.priority
+  };
+}
+
+function refreshBoardTicketDerivatives(boardId) {
+  if (!state.data?.tickets) return;
+  const boardTickets = state.data.tickets.filter((ticket) => ticket.board_id === boardId && !ticket.archived_at);
+  const ticketById = new Map(boardTickets.map((ticket) => [ticket.id, ticket]));
+  const childCountByParent = new Map();
+  for (const ticket of boardTickets) {
+    if (!ticket.parent_ticket_id) continue;
+    childCountByParent.set(ticket.parent_ticket_id, (childCountByParent.get(ticket.parent_ticket_id) || 0) + 1);
+  }
+  for (const ticket of boardTickets) {
+    ticket.parent_ticket = ticket.parent_ticket_id ? compactTicketForBoard(ticketById.get(ticket.parent_ticket_id)) : null;
+    ticket.child_count = childCountByParent.get(ticket.id) || 0;
+  }
+}
+
+/** Merge a ticket returned by a mutation/context endpoint into the bootstrap cache.
+ * Keeps drawer edits responsive without paying for a full /api/bootstrap reload. */
+export function upsertTicket(updatedTicket) {
+  if (!state.data?.tickets || !updatedTicket?.id) return;
+  const index = state.data.tickets.findIndex((ticket) => ticket.id === updatedTicket.id);
+  const previous = index >= 0 ? state.data.tickets[index] : {};
+  const merged = {
+    ...previous,
+    ...updatedTicket,
+    labels: updatedTicket.labels || previous.labels || [],
+    comment_count: updatedTicket.comment_count ?? previous.comment_count ?? 0,
+    child_count: updatedTicket.child_count ?? previous.child_count ?? 0,
+    parent_ticket: updatedTicket.parent_ticket || previous.parent_ticket || null
+  };
+  if (index >= 0) state.data.tickets.splice(index, 1, merged);
+  else state.data.tickets.push(merged);
+  state.data.tickets.sort((a, b) => String(b.updated_at || "").localeCompare(String(a.updated_at || "")) || String(a.id).localeCompare(String(b.id)));
+  refreshBoardTicketDerivatives(merged.board_id || state.boardId);
+}

package/public/js/theme-preference.js

@@ -0,0 +1,88 @@
+export const THEME_STORAGE_KEY = "mab_theme";
+export const THEME_CHANGE_EVENT = "orbit:theme-change";
+
+const THEMES = new Set(["light", "dark"]);
+
+function safeStorage(storage) {
+  try {
+    return storage ?? globalThis.localStorage ?? null;
+  } catch {
+    return null;
+  }
+}
+
+function safeDocument(doc) {
+  try {
+    return doc ?? globalThis.document ?? null;
+  } catch {
+    return null;
+  }
+}
+
+function safeEventTarget(eventTarget) {
+  try {
+    return eventTarget ?? globalThis.window ?? null;
+  } catch {
+    return null;
+  }
+}
+
+export function normalizeTheme(theme) {
+  return THEMES.has(theme) ? theme : "light";
+}
+
+export function storedThemePreference(storage = safeStorage()) {
+  const store = safeStorage(storage);
+  const value = store?.getItem?.(THEME_STORAGE_KEY);
+  return THEMES.has(value) ? value : null;
+}
+
+export function currentTheme({ doc = safeDocument(), storage = safeStorage() } = {}) {
+  const rootTheme = safeDocument(doc)?.documentElement?.getAttribute?.("data-theme");
+  return THEMES.has(rootTheme) ? rootTheme : storedThemePreference(storage) ?? "light";
+}
+
+export function applyStoredThemePreference({
+  doc = safeDocument(),
+  storage = safeStorage()
+} = {}) {
+  const storedTheme = storedThemePreference(storage);
+  if (storedTheme) {
+    safeDocument(doc)?.documentElement?.setAttribute?.("data-theme", storedTheme);
+  }
+  return currentTheme({ doc, storage });
+}
+
+export function setThemePreference(theme, {
+  doc = safeDocument(),
+  storage = safeStorage(),
+  eventTarget = safeEventTarget(),
+  notify = true
+} = {}) {
+  const next = normalizeTheme(theme);
+  safeDocument(doc)?.documentElement?.setAttribute?.("data-theme", next);
+  safeStorage(storage)?.setItem?.(THEME_STORAGE_KEY, next);
+
+  if (notify) {
+    dispatchThemeChange(next, eventTarget);
+  }
+
+  return next;
+}
+
+export function toggleThemePreference(options = {}) {
+  const next = currentTheme(options) === "dark" ? "light" : "dark";
+  return setThemePreference(next, options);
+}
+
+function dispatchThemeChange(theme, eventTarget = safeEventTarget()) {
+  const target = safeEventTarget(eventTarget);
+  if (typeof target?.dispatchEvent !== "function") return;
+
+  if (typeof CustomEvent === "function") {
+    target.dispatchEvent(new CustomEvent(THEME_CHANGE_EVENT, { detail: { theme } }));
+    return;
+  }
+
+  target.dispatchEvent({ type: THEME_CHANGE_EVENT, detail: { theme } });
+}