harness-mix 0.1.0

package/src/native-ui/renderer-extension/src/settings/release-notes.ts

@@ -0,0 +1,222 @@
+const HEADING_PATTERN = /^(#{1,6})[ \t]+(.+?)\s*$/u;
+const BLOCKQUOTE_PATTERN = /^>[ \t]?(.*?)\s*$/u;
+const UNORDERED_ITEM_PATTERN = /^[-*][ \t]+(.+?)\s*$/u;
+const CONTINUATION_PATTERN = /^[ \t]+(.+?)\s*$/u;
+const ORDERED_ITEM_PATTERN = /^\d+[.)][ \t]+(.+?)\s*$/u;
+const FENCE_PATTERN = /^```([\w+-]*)\s*$/u;
+const THEMATIC_BREAK_PATTERN = /^(?:---|___|\*\*\*)[ \t]*$/u;
+const INLINE_PATTERN = /(`+)((?:(?!\1).)+)\1|\*\*(.+?)\*\*|\[([^\]]+)\]\(([^)\s]+)\)/gu;
+
+type ReleaseNotesDocument = Pick<Document, "createElement">;
+
+export function createReleaseNotesElement(
+  document: ReleaseNotesDocument,
+  markdown: string,
+): HTMLElement {
+  const root = document.createElement("div");
+  root.className = "settings-update-notes";
+  appendReleaseNotesBlocks(document, root, markdown);
+  return root;
+}
+
+function appendReleaseNotesBlocks(
+  document: ReleaseNotesDocument,
+  root: HTMLElement,
+  markdown: string,
+): void {
+  const lines = markdown.replaceAll("\r\n", "\n").split("\n");
+  let index = 0;
+  while (index < lines.length) {
+    const line = lines[index] ?? "";
+    if (line.trim().length === 0) {
+      index += 1;
+      continue;
+    }
+    const fence = FENCE_PATTERN.exec(line);
+    if (fence) {
+      index = appendFencedCode(document, root, lines, index, fence[1] ?? "");
+      continue;
+    }
+    const heading = HEADING_PATTERN.exec(line);
+    if (heading?.[1] && heading[2]) {
+      const tag = `h${heading[1].length}` as "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+      const element = document.createElement(tag);
+      appendInline(document, element, heading[2]);
+      root.append(element);
+      index += 1;
+      continue;
+    }
+    if (BLOCKQUOTE_PATTERN.test(line)) {
+      index = appendBlockquote(document, root, lines, index);
+      continue;
+    }
+    if (THEMATIC_BREAK_PATTERN.test(line)) {
+      root.append(document.createElement("hr"));
+      index += 1;
+      continue;
+    }
+    if (UNORDERED_ITEM_PATTERN.test(line)) {
+      index = appendList(document, root, lines, index, "ul", UNORDERED_ITEM_PATTERN);
+      continue;
+    }
+    if (ORDERED_ITEM_PATTERN.test(line)) {
+      index = appendList(document, root, lines, index, "ol", ORDERED_ITEM_PATTERN);
+      continue;
+    }
+    index = appendParagraph(document, root, lines, index);
+  }
+}
+
+function appendFencedCode(
+  document: ReleaseNotesDocument,
+  root: HTMLElement,
+  lines: readonly string[],
+  start: number,
+  language: string,
+): number {
+  const body: string[] = [];
+  let index = start + 1;
+  while (index < lines.length && !FENCE_PATTERN.test(lines[index] ?? "")) {
+    body.push(lines[index] ?? "");
+    index += 1;
+  }
+  if (index < lines.length) index += 1;
+  const pre = document.createElement("pre");
+  const code = document.createElement("code");
+  if (language.length > 0) code.className = `language-${language}`;
+  code.textContent = body.join("\n");
+  pre.append(code);
+  root.append(pre);
+  return index;
+}
+
+function appendBlockquote(
+  document: ReleaseNotesDocument,
+  root: HTMLElement,
+  lines: readonly string[],
+  start: number,
+): number {
+  const blockquote = document.createElement("blockquote");
+  const content: string[] = [];
+  let index = start;
+  while (index < lines.length) {
+    const match = BLOCKQUOTE_PATTERN.exec(lines[index] ?? "");
+    if (!match) break;
+    content.push(match[1] ?? "");
+    index += 1;
+  }
+  const paragraph = document.createElement("p");
+  appendInline(document, paragraph, content.join(" ").trim());
+  blockquote.append(paragraph);
+  root.append(blockquote);
+  return index;
+}
+
+function appendList(
+  document: ReleaseNotesDocument,
+  root: HTMLElement,
+  lines: readonly string[],
+  start: number,
+  tag: "ul" | "ol",
+  pattern: RegExp,
+): number {
+  const list = document.createElement(tag);
+  let index = start;
+  while (index < lines.length) {
+    const item = pattern.exec(lines[index] ?? "");
+    if (!item?.[1]) break;
+    const entry = document.createElement("li");
+    appendInline(document, entry, item[1]);
+    index += 1;
+
+    const continuationLines: string[] = [];
+    while (index < lines.length) {
+      const continuation = CONTINUATION_PATTERN.exec(lines[index] ?? "");
+      if (!continuation?.[1]) break;
+      continuationLines.push(continuation[1]);
+      index += 1;
+    }
+    if (continuationLines.length > 0) {
+      const continuation = document.createElement("span");
+      continuation.className = "release-note-translation";
+      appendInline(document, continuation, continuationLines.join(" "));
+      entry.append(continuation);
+    }
+    list.append(entry);
+  }
+  root.append(list);
+  return index;
+}
+
+function appendParagraph(
+  document: ReleaseNotesDocument,
+  root: HTMLElement,
+  lines: readonly string[],
+  start: number,
+): number {
+  const paragraphLines: string[] = [];
+  let index = start;
+  while (index < lines.length) {
+    const current = lines[index] ?? "";
+    if (
+      current.trim().length === 0 ||
+      FENCE_PATTERN.test(current) ||
+      HEADING_PATTERN.test(current) ||
+      BLOCKQUOTE_PATTERN.test(current) ||
+      THEMATIC_BREAK_PATTERN.test(current) ||
+      UNORDERED_ITEM_PATTERN.test(current) ||
+      ORDERED_ITEM_PATTERN.test(current)
+    ) {
+      break;
+    }
+    paragraphLines.push(current.trim());
+    index += 1;
+  }
+  const paragraph = document.createElement("p");
+  paragraphLines.forEach((line, lineIndex) => {
+    appendInline(document, paragraph, line);
+    if (lineIndex < paragraphLines.length - 1) paragraph.append(document.createElement("br"));
+  });
+  root.append(paragraph);
+  return index;
+}
+
+function appendInline(document: ReleaseNotesDocument, parent: HTMLElement, text: string): void {
+  let lastIndex = 0;
+  for (const match of text.matchAll(INLINE_PATTERN)) {
+    const index = match.index ?? 0;
+    if (index > lastIndex) parent.append(text.slice(lastIndex, index));
+    if (match[2] !== undefined) {
+      const code = document.createElement("code");
+      code.textContent = match[2];
+      parent.append(code);
+    } else if (match[3] !== undefined) {
+      const strong = document.createElement("strong");
+      strong.textContent = match[3];
+      parent.append(strong);
+    } else {
+      const href = match[5] ?? "";
+      if (!isSafeLink(href)) {
+        parent.append(match[4] ?? "");
+      } else {
+        const link = document.createElement("a");
+        link.textContent = match[4] ?? "";
+        link.setAttribute("href", href);
+        link.setAttribute("target", "_blank");
+        link.setAttribute("rel", "noopener noreferrer");
+        parent.append(link);
+      }
+    }
+    lastIndex = index + match[0].length;
+  }
+  if (lastIndex < text.length) parent.append(text.slice(lastIndex));
+}
+
+function isSafeLink(href: string): boolean {
+  try {
+    const url = new URL(href, "https://codexhost.invalid");
+    return url.protocol === "http:" || url.protocol === "https:";
+  } catch {
+    return false;
+  }
+}

package/src/native-ui/renderer-extension/src/settings/session-import-list-controls.ts

@@ -0,0 +1,128 @@
+import {
+  HARNESS_SESSION_IMPORT_DEFAULT_PAGE_SIZE,
+  type HarnessSessionListParams,
+} from "@codexhost/shared-contracts";
+import type { RendererSettingsMessages } from "./localization.js";
+
+/** Search submission and pagination state; native discovery and import are owned elsewhere. */
+export function createSessionImportListControls(
+  document: Document,
+  messages: RendererSettingsMessages,
+  onChange: () => void,
+) {
+  let query = "";
+  let offset = 0;
+  let limit = HARNESS_SESSION_IMPORT_DEFAULT_PAGE_SIZE;
+  let total = 0;
+  let loading = false;
+  let locked = false;
+  const searchForm = document.createElement("form");
+  searchForm.className = "settings-session-import-search";
+  searchForm.setAttribute("role", "search");
+  const search = document.createElement("input");
+  search.type = "search";
+  search.value = "";
+  search.maxLength = 4_096;
+  search.placeholder = messages.sessionImportSearchPlaceholder;
+  search.setAttribute("aria-label", messages.sessionImportSearchPlaceholder);
+  search.dataset.sessionImportAction = "search-input";
+  const submit = document.createElement("button");
+  submit.type = "submit";
+  submit.className = "settings-command-button settings-command-button--secondary";
+  submit.textContent = messages.sessionImportSearch;
+  submit.dataset.sessionImportAction = "search";
+  searchForm.append(search, submit);
+  searchForm.addEventListener("submit", (event) => {
+    event.preventDefault();
+    if (locked) return;
+    query = search.value.trim();
+    offset = 0;
+    onChange();
+  });
+
+  const pagination = document.createElement("div");
+  pagination.className = "settings-session-import-pagination";
+  const pageSizeLabel = document.createElement("label");
+  pageSizeLabel.textContent = messages.sessionImportPageSize;
+  const pageSize = document.createElement("select");
+  pageSize.dataset.sessionImportAction = "page-size";
+  pageSize.setAttribute("aria-label", messages.sessionImportPageSize);
+  for (const size of [20, 50, 100]) {
+    const option = document.createElement("option");
+    option.value = String(size);
+    option.textContent = String(size);
+    pageSize.append(option);
+  }
+  pageSize.value = String(limit);
+  pageSizeLabel.append(pageSize);
+  pageSize.addEventListener("change", () => {
+    if (locked) return;
+    const value = Number(pageSize.value);
+    if (![20, 50, 100].includes(value)) return;
+    limit = value;
+    offset = 0;
+    onChange();
+  });
+  const summary = document.createElement("span");
+  summary.setAttribute("role", "status");
+  summary.dataset.sessionImportAction = "page-summary";
+  const previous = document.createElement("button");
+  const next = document.createElement("button");
+  for (const [button, label, action, direction] of [
+    [previous, messages.sessionImportPrevious, "previous", -1],
+    [next, messages.sessionImportNext, "next", 1],
+  ] as const) {
+    button.type = "button";
+    button.className = "settings-command-button settings-command-button--secondary";
+    button.textContent = label;
+    button.dataset.sessionImportAction = action;
+    button.addEventListener("click", () => {
+      if (button.disabled || locked || loading) return;
+      offset += direction * limit;
+      onChange();
+    });
+  }
+  const navigation = document.createElement("div");
+  navigation.className = "settings-session-import-pagination__navigation";
+  navigation.append(previous, next);
+  pagination.append(pageSizeLabel, summary, navigation);
+  const update = (): void => {
+    search.disabled = locked;
+    submit.disabled = locked;
+    pageSize.disabled = locked;
+    previous.disabled = locked || loading || offset === 0;
+    next.disabled = locked || loading || offset + limit >= total;
+    summary.textContent = loading
+      ? ""
+      : messages.sessionImportPageSummary
+          .replace("{page}", String(total ? Math.floor(offset / limit) + 1 : 0))
+          .replace("{pages}", String(Math.ceil(total / limit)))
+          .replace("{total}", String(total));
+  };
+  update();
+  return {
+    searchForm,
+    pagination,
+    params(): Pick<HarnessSessionListParams, "query" | "offset" | "limit"> {
+      return { query, offset, limit };
+    },
+    reset(): void {
+      offset = 0;
+      total = 0;
+      update();
+    },
+    setBusy(value: boolean, lock = false): void {
+      loading = value;
+      locked = lock;
+      update();
+    },
+    setTotal(value: number): boolean {
+      total = value;
+      const lastOffset = Math.max(0, Math.ceil(total / limit) - 1) * limit;
+      const changed = offset > lastOffset;
+      if (changed) offset = lastOffset;
+      update();
+      return changed;
+    },
+  };
+}