@tenyokjs/devdevian-cli 0.4.0-alpha.1 → 0.4.1-alpha.1

package/README.md

@@ -10,6 +10,8 @@ devdevian open     # a separate terminal window
 
 Login opens a browser. Compare the code shown in the terminal, sign in to Devdevian, then authorize the terminal. Google, GitHub and email login happen on the website; no provider credentials are collected by this package. Use `--no-open` to open the printed address yourself, including when connecting over SSH.
 
+Version-by-version changes and the customization roadmap: [CLI version history](VERSIONS.md).
+
 ## Live workspace
 
 The default `devdevian` command and `devdevian tui` open an alternate terminal screen. Navigation, conversations, inline forms, previews and search update in that screen; exiting restores your normal terminal. The blue and purple layout adapts to the terminal size, with compact navigation below 90 columns. Minimum size: 60 columns × 18 rows.
@@ -19,6 +21,7 @@ The default `devdevian` command and `devdevian tui` open an alternate terminal s
 - **←/→** switch conversation tabs; **Space** reads the selected reply/remark in full. **[ / ]** paginate; **Page Up/Down** scroll.
 - **N** creates a conversation (a community on the Communities screen); **A** asks a question; **R** replies inside a conversation; **Shift+R** refreshes.
 - **C** comments on snippet lines; **E/D** edit/delete your own ordinary replies or code feedback; **S** resolves/reopens a code remark or accepts/removes a reply as the solution (question/review author only); **!** reports selected code feedback.
+- **Ctrl+E** opens the current multiline field in `$VISUAL` / `$EDITOR` (use `code --wait` for VS Code). Closing the editor restores the form; publishing still requires preview and confirmation. **Ctrl+L** saves an active draft and returns to sign-in.
 - In forms, **Tab/Shift+Tab** change fields, arrows choose options or move the text cursor, **Enter** adds a line, **Ctrl+S** opens the preview. Publication requires a separate confirmation; Escape asks before discarding a draft. Drafts auto-save locally after a short pause and can be restored from **Local drafts** or `/drafts`.
 - **Ctrl+C** exits. With an unsent draft, confirm saving and leaving or press Ctrl+C again to force exit.
 

package/VERSIONS.md

@@ -0,0 +1,57 @@
+# Devdevian CLI version history
+
+The CLI is a separately versioned Devdevian client. Its npm version does not have to match the web app or API version. All versions below use the same hosted account and permission model.
+
+Every published npm artifact has a unique immutable version. We record each version here, even when several ship in one working session. A GitHub release can summarize a day's work and link to the individual entries; it does not need to be created for every npm publication. An unfinished change stays under **Unreleased** until its package version is assigned. Alpha packages use the `alpha` npm tag.
+
+## Roadmap
+
+- **0.5.0 — Themes and interface customization:** visual presets, appearance preferences and layout customization. Planned, not shipped; exact settings will be agreed before implementation.
+- Projects and Events parity is deferred; it is not the 0.5.0 milestone.
+
+## 0.4.1-alpha.1 — Everyday writing and navigation
+
+**Changes**
+
+- `Ctrl+E` edits a multiline form field using `VISUAL`, then `EDITOR`, then the platform default. Ink temporarily hands over the terminal and restores it afterward. Original and returned text are saved locally before publication; failed, oversized or invalid editor output preserves the original form.
+- Notifications link to the exact ordinary reply, including nested replies on later pages. Back navigation restores the selected item by ID and retains reading/review position where content still exists.
+- Conversation bodies and full-text replies render headings, lists, quotes, bold text, inline code, visible link destinations and fenced code with basic lexical highlighting. HTML is displayed as text; terminal control sequences are removed. This is a lightweight renderer, not full CommonMark.
+- HTTP status is preserved for non-JSON failures. Connection, timeout, permission, missing-content, rate-limit and server failures suggest a concrete next action. Session expiry during writing keeps the form; `Ctrl+L` saves the draft and returns to connection setup.
+
+**Compatibility and checks**
+
+No API/schema migration. Existing browser and CLI credentials remain compatible. Regression coverage includes real pseudo-terminal editor handoff/restoration, reply deep links, permission/error states and text rendering. Desktop editor behavior still depends on the configured editor; GUI editors such as VS Code need a wait flag (`code --wait`).
+
+## 0.4.0-alpha.1 — Review workspace and live Inbox
+
+- Side-by-side code and remarks on wide terminals; `W` focus switching on compact layouts. Select a line range and press `C` to comment; `F` filters all/open/resolved remarks. Markers describe the current page. Old remarks display their saved quote.
+- `X` context menu for available edits, deletion, reports, resolving remarks and accepted solutions. Destructive/solution actions require confirmation and server permission checks.
+- Unread counter and serial live polling: 45 seconds active, three minutes idle, failure backoff and pause controls. Active forms and selected items are preserved.
+- Shared blue/purple styling, rounded frames, clearer tabs, cards and project identity. No API/schema migration.
+
+## 0.3.1-alpha.1 — Reply deletion
+
+- `D/d` deletes the author's ordinary reply, including full-text and parent-reply views, with confirmation and revision checks.
+- API tombstones remove text and attachments from access, preserve descendant replies and clear the deleted reply's solution mark. Deleted replies cannot be edited or accepted again. Existing metadata storage is used; no schema migration.
+
+## 0.3.0-alpha.1 — Project files, Git diffs and drafts
+
+- Root-relative file explorer, filename filtering, code preview and line-range selection. Sensitive paths, ignored files, nested symlinks and outside-root traversal are excluded.
+- Read-only staged/unstaged Git diff selection, including individual hunks. No staging, commits or project helper execution. Changed source requires reselection before publication.
+- Scoped local autosaved drafts, restore/delete controls and bounded retention. Snippet source is reread at preview time; selected source files are not copied into draft storage.
+
+## 0.2.0-alpha.1 — Live terminal workspace
+
+- Replaced the numbered scrolling menu with an alternate-screen interface, responsive navigation, forms, previews and search.
+- Paginated conversations, replies, code-feedback threads, edit/delete/report actions and connected-terminal controls.
+- `devdevian tui` runs in the current terminal; `devdevian open` launches a supported desktop terminal. Unicode editing, cancellable reads, bounded caching and terminal restoration checks.
+
+## 0.1.0-alpha.1 — First terminal client
+
+- Browser-approved terminal authentication with scoped, expiring, revocable CLI credentials.
+- Command-based feed, Inbox, search, questions, replies, file-based reviews, line remarks and community discovery using the existing Devdevian API.
+- Explicit publication confirmation, JSON output for scripts, local private credential storage and terminal-output sanitization.
+
+## Preparing a combined GitHub release
+
+Choose a product release title and list the exact npm versions it includes. Summarize user-visible changes, installation, compatibility and known limitations; link to the relevant headings in this file. Do not rename or republish existing npm artifacts, and do not imply that a planned milestone has shipped. GitHub releases are created when the maintainer decides to close the session or milestone.

package/bin/devdevian.mjs

@@ -2,10 +2,9 @@
 import { fileURLToPath } from "node:url";
 import packageInfo from "../package.json" with { type: "json" };
 import { parseArgs } from "node:util";
-import { readFile, writeFile, mkdtemp, rm } from "node:fs/promises";
-import { hostname, tmpdir } from "node:os";
-import { join } from "node:path";
-import { spawn, spawnSync } from "node:child_process";
+import { readFile } from "node:fs/promises";
+import { hostname } from "node:os";
+import { spawn } from "node:child_process";
 import { createInterface } from "node:readline/promises";
 import { setTimeout as delay } from "node:timers/promises";
 import {
@@ -16,6 +15,7 @@ import {
   removeConfig,
   clean,
 } from "../lib/client.mjs";
+import { editExternal } from "../lib/external-editor.mjs";
 const version = packageInfo.version;
 const options = {
   host: { type: "string" },
@@ -111,30 +111,10 @@ async function editor(initial = "") {
   if (!process.stdin.isTTY || !process.stdout.isTTY)
     throw Error("--editor needs an interactive terminal.");
   terminal?.pause();
-  const directory = await mkdtemp(join(tmpdir(), "devdevian-editor-")),
-    file = join(directory, "message.md");
   try {
-    await writeFile(file, initial, { mode: 0o600 });
-    const command =
-      process.env.VISUAL ||
-      process.env.EDITOR ||
-      (process.platform === "win32" ? "notepad" : "vi");
-    // No shell: metacharacters in content or filenames cannot become commands.
-    const parts =
-      command
-        .match(/(?:[^\s"']+|"[^"]*"|'[^']*')+/g)
-        ?.map((p) => p.replace(/^(['"])(.*)\1$/, "$2")) || [];
-    if (!parts.length) throw Error("Set EDITOR to your text editor.");
-    const result = spawnSync(parts[0], [...parts.slice(1), file], {
-      stdio: "inherit",
-      shell: false,
-    });
-    if (result.error || result.status !== 0)
-      throw Error("The editor did not finish successfully.");
-    return await readFile(file, "utf8");
+    return await editExternal(initial);
   } finally {
     terminal?.resume();
-    await rm(directory, { recursive: true, force: true });
   }
 }
 async function boundedFile(file, max) {

package/lib/client.mjs

@@ -110,8 +110,13 @@ export function client(origin, token = null) {
       });
     } catch (error) {
       if (signal?.aborted) throw error;
-      throw Error(
-        "Could not reach Devdevian. Check your connection and server address.",
+      throw Object.assign(
+        Error(
+          error.name === "TimeoutError"
+            ? "Connection timed out. Check your connection and server address."
+            : "Could not reach Devdevian. Check your connection and server address.",
+        ),
+        { code: error.name === "TimeoutError" ? "TIMEOUT" : "NETWORK" },
       );
     }
     const chunks = [];
@@ -127,8 +132,11 @@ export function client(origin, token = null) {
     try {
       data = JSON.parse(text);
     } catch {
-      throw Error(
-        `Devdevian returned an unexpected response (HTTP ${response.status}). Try again later.`,
+      throw Object.assign(
+        Error(
+          `Devdevian returned an unexpected response (HTTP ${response.status}). Try again later.`,
+        ),
+        { status: response.status },
       );
     }
     if (!response.ok) {

package/lib/external-editor.mjs

@@ -0,0 +1,111 @@
+import { spawn } from "node:child_process";
+import { mkdtemp, writeFile, open, rm, lstat } from "node:fs/promises";
+import { constants } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+
+// Parse argv, never shell code. Quoting supports editor paths and --wait flags.
+export function editorArgs(command) {
+  const args = [];
+  let value = "",
+    quote = null,
+    started = false;
+  for (const char of command.trim()) {
+    if (quote) {
+      if (char === quote) quote = null;
+      else value += char;
+    } else if (char === '"' || char === "'") {
+      quote = char;
+      started = true;
+    } else if (/\s/.test(char)) {
+      if (started) {
+        args.push(value);
+        value = "";
+        started = false;
+      }
+    } else {
+      value += char;
+      started = true;
+    }
+  }
+  if (quote) throw Error("Close the quote in VISUAL / EDITOR.");
+  if (started) args.push(value);
+  if (!args[0])
+    throw Error(
+      "Set VISUAL or EDITOR to an editor command (for example: code --wait).",
+    );
+  return args;
+}
+export async function editExternal(
+  initial,
+  {
+    max = 15000,
+    command = process.env.VISUAL ||
+      process.env.EDITOR ||
+      (process.platform === "win32" ? "notepad" : "vi"),
+  } = {},
+) {
+  const [executable, ...args] = editorArgs(command);
+  const directory = await mkdtemp(join(tmpdir(), "devdevian-editor-")),
+    file = join(directory, "message.md");
+  try {
+    await writeFile(file, initial, { mode: 0o600, flag: "wx" });
+    await new Promise((resolve, reject) => {
+      const child = spawn(executable, [...args, file], {
+        stdio: "inherit",
+        shell: false,
+      });
+      child.once("error", () =>
+        reject(
+          Error(
+            "Could not start the editor. Check VISUAL / EDITOR; your original text is unchanged.",
+          ),
+        ),
+      );
+      child.once("exit", (code) =>
+        code === 0
+          ? resolve()
+          : reject(
+              Error(
+                "Editor cancelled or failed; your original text is unchanged.",
+              ),
+            ),
+      );
+    });
+    const infoBeforeOpen = await lstat(file);
+    if (infoBeforeOpen.isSymbolicLink() || !infoBeforeOpen.isFile())
+      throw Error("Editor output must be a regular file. Original text kept.");
+    const handle = await open(
+      file,
+      constants.O_RDONLY |
+        (constants.O_NOFOLLOW || 0) |
+        (constants.O_NONBLOCK || 0),
+    );
+    try {
+      const info = await handle.stat();
+      if (!info.isFile() || info.size > max * 4)
+        throw Error(
+          `Editor output must be a UTF-8 text file with at most ${max} characters. Original text kept.`,
+        );
+      const buffer = Buffer.alloc(max * 4 + 1),
+        { bytesRead } = await handle.read(buffer, 0, buffer.length, 0);
+      let text;
+      try {
+        text = new TextDecoder("utf-8", { fatal: true }).decode(
+          buffer.subarray(0, bytesRead),
+        );
+      } catch {
+        throw Error("Editor output must be UTF-8. Original text kept.");
+      }
+      if (bytesRead > max * 4 || text.length > max || text.includes("\0"))
+        throw Error(
+          `Editor output exceeds ${max} characters or contains binary data. Original text kept.`,
+        );
+      return text.replace(/\r\n/g, "\n");
+    } finally {
+      await handle.close();
+    }
+  } finally {
+    await rm(directory, { recursive: true, force: true });
+  }
+}

package/lib/problems.mjs

@@ -0,0 +1,29 @@
+import { clean } from "./client.mjs";
+export function problemMessage(error) {
+  const detail = clean(error.message || "Unexpected error.");
+  if (error.status === 401)
+    return "Session expired or revoked. Ctrl+L reconnects; your draft is kept locally.";
+  if (error.status === 403)
+    return (
+      "Access denied. Check your community membership or account permissions. " +
+      detail
+    );
+  if (error.status === 404)
+    return (
+      "Content unavailable: it may have been removed or is private. Esc goes back. " +
+      detail
+    );
+  if (error.status === 429)
+    return (
+      "Rate limit reached. Wait before trying again; writes are not retried automatically. " +
+      detail
+    );
+  if (error.status >= 500)
+    return (
+      "Server temporarily unavailable. Shift+R retries a view; check before retrying a write. " +
+      detail
+    );
+  if (error.code === "NETWORK" || error.code === "TIMEOUT")
+    return detail + " Shift+R retries a view. Your draft remains editable.";
+  return detail;
+}

package/lib/review-workspace.mjs

@@ -1,6 +1,7 @@
 import React from "react";
 import { Box, Text } from "ink";
 import { clip, graphemes } from "./tui-model.mjs";
+import { syntaxSpans } from "./rich-text.mjs";
 import { colors as c } from "./theme.mjs";
 const h = React.createElement;
 export function codeRange(line, anchor = null) {
@@ -96,6 +97,10 @@ export function ReviewWorkspace({
             number >= selectedNote.start_line &&
             number <= selectedNote.end_line);
       const text = lines[n];
+      const rendered = clip(
+        `${marked ? "●" : " "}${String(number).padStart(4)}  ${graphemes(text.replaceAll("\t", "  ")).slice(horizontal).join("")}`,
+        codeWidth,
+      );
       return h(
         Text,
         {
@@ -107,10 +112,11 @@ export function ReviewWorkspace({
               ? c.red
               : c.text,
         },
-        clip(
-          `${marked ? "●" : " "}${String(number).padStart(4)}  ${graphemes(text.replaceAll("\t", "  ")).slice(horizontal).join("")}`,
-          codeWidth,
-        ),
+        ...(text.startsWith("+") || text.startsWith("-")
+          ? [rendered]
+          : syntaxSpans(rendered).map((span, j) =>
+              h(Text, { key: j, color: span.color }, span.text),
+            )),
       );
     }),
   );

package/lib/rich-text.mjs

@@ -0,0 +1,96 @@
+import { clean } from "./client.mjs";
+import { wrap } from "./tui-model.mjs";
+import { colors as c } from "./theme.mjs";
+
+// Small, predictable terminal renderer. HTML and terminal hyperlinks are never executed.
+export function syntaxSpans(text) {
+  const pattern =
+    /("(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'|`[^`]*`|\/\/.*$|#.*$|\b(?:async|await|function|return|const|let|var|if|else|throw|new|class|import|from|export|def|None|True|False|true|false|null|try|catch|for|while)\b|\b\d+(?:\.\d+)?\b)/g;
+  const parts = [];
+  let start = 0;
+  for (const match of text.matchAll(pattern)) {
+    if (match.index > start)
+      parts.push({ text: text.slice(start, match.index) });
+    const word = match[0];
+    parts.push({
+      text: word,
+      color: /^(\/\/|#)/.test(word)
+        ? c.muted
+        : /^["'`]/.test(word)
+          ? c.green
+          : /^\d/.test(word)
+            ? c.blue
+            : c.purple,
+    });
+    start = match.index + word.length;
+  }
+  if (start < text.length) parts.push({ text: text.slice(start) });
+  return parts;
+}
+export function markdownRows(value, width) {
+  let fence = null,
+    number = 0;
+  const rows = [];
+  for (const raw of clean(value).replace(/\t/g, "  ").split("\n")) {
+    const marker = raw.match(/^\s*(`{3,}|~{3,})(.*)$/);
+    if (
+      marker &&
+      (!fence ||
+        (marker[1][0] === fence[0] &&
+          marker[1].length >= fence.length &&
+          !marker[2].trim()))
+    ) {
+      if (fence) {
+        fence = null;
+        rows.push({ text: "", color: c.muted });
+      } else {
+        fence = marker[1];
+        number = 0;
+        rows.push({
+          text:
+            "CODE SNIPPET" + (marker[2].trim() ? " · " + marker[2].trim() : ""),
+          color: c.blue,
+          bold: true,
+        });
+      }
+      continue;
+    }
+    if (fence) {
+      const prefix = String(++number).padStart(4) + "  ";
+      for (const [i, line] of wrap(raw, Math.max(1, width - 6)).entries()) {
+        const text = (i ? "      " : prefix) + line;
+        rows.push({ text, spans: syntaxSpans(text) });
+      }
+      continue;
+    }
+    const heading = /^#{1,6}\s+/.test(raw),
+      quote = /^>\s?/.test(raw);
+    const text = raw
+      .replace(/^#{1,6}\s+/, "")
+      .replace(/^>\s?/, "│ ")
+      .replace(/^\s*[-*+]\s+/, "• ")
+      .replace(/\[([^\]\n]+)\]\(([^)\n]+)\)/g, "$1 <$2>");
+    for (const line of wrap(text, width)) {
+      const parts = [];
+      let start = 0;
+      for (const match of line.matchAll(/\*\*([^*]+)\*\*|`([^`]+)`/g)) {
+        if (match.index > start)
+          parts.push({ text: line.slice(start, match.index) });
+        parts.push({
+          text: match[1] || match[2],
+          bold: !!match[1],
+          color: match[2] ? c.blue : undefined,
+        });
+        start = match.index + match[0].length;
+      }
+      parts.push({ text: line.slice(start) });
+      rows.push({
+        text: parts.map((p) => p.text).join(""),
+        spans: parts,
+        bold: heading,
+        color: heading ? c.purple : quote ? c.muted : c.text,
+      });
+    }
+  }
+  return rows;
+}

package/lib/tui-data.mjs

@@ -21,6 +21,39 @@ export const navigation = [
   ["devices", "Connected terminals", "Manage CLI access"],
   ["help", "Help", "Keys & commands"],
 ];
+export async function notificationRoute(api, item) {
+  if (item.code_review_id)
+    return {
+      view: "feedback",
+      postId: item.post_id,
+      id: item.code_review_id,
+      page: 1,
+      targetReply: item.feedback_reply_id || null,
+    };
+  if (!item.reply_id)
+    return { view: "post", id: item.post_id, tab: "overview", page: 1 };
+  const post = await api(`/posts/${item.post_id}?reply_id=${item.reply_id}`);
+  const target = post.reply_path?.at(-1);
+  if (!target || post.reply_target_missing)
+    throw Object.assign(Error("The linked reply is no longer available."), {
+      status: 404,
+    });
+  return target.parent_id
+    ? {
+        view: "thread",
+        postId: item.post_id,
+        parent: { id: target.parent_id },
+        page: target.page,
+        targetReply: item.reply_id,
+      }
+    : {
+        view: "post",
+        id: item.post_id,
+        tab: "replies",
+        page: target.page,
+        targetReply: item.reply_id,
+      };
+}
 export async function loadPage(api, route, signal) {
   const get = (path) => api(path, { signal }),
     page = route.page || 1;
@@ -85,7 +118,13 @@ export async function loadPage(api, route, signal) {
     };
   }
   if (route.view === "post") {
-    const post = await get("/posts/" + route.id + "?reply_page=" + page);
+    const post = await get(
+      "/posts/" +
+        route.id +
+        (route.targetReply
+          ? "?reply_id=" + route.targetReply
+          : "?reply_page=" + page),
+    );
     let items = post.replies,
       pagination = post.reply_pagination;
     let snippet_hash;
@@ -194,6 +233,8 @@ export function contentLines(route, data) {
       "E / D            Edit / delete your own feedback or reply",
       "O                Open this conversation in your browser",
       "/                Focus the command / search bar",
+      "Ctrl+E           Edit a multiline field in VISUAL / EDITOR",
+      "Ctrl+L           Save a draft and reconnect an expired session",
       "Ctrl+S           Preview the current form",
       "Ctrl+O / Ctrl+G  Select a code file / Git diff in a review form",
       "/drafts          Restore locally saved drafts for this account/project",

package/lib/tui.mjs

@@ -29,11 +29,15 @@ import {
   loadPage,
   contentLines,
   assertSnippet,
+  notificationRoute,
 } from "./tui-data.mjs";
 import { basename } from "node:path";
 import { colors } from "./theme.mjs";
 import { liveLoop, anchoredIndex } from "./live.mjs";
 import { contextActions } from "./context-actions.mjs";
+import { editExternal } from "./external-editor.mjs";
+import { markdownRows } from "./rich-text.mjs";
+import { problemMessage } from "./problems.mjs";
 import { ReviewWorkspace, codeRange } from "./review-workspace.mjs";
 const h = React.createElement;
 const itemsOf = (value) => (Array.isArray(value) ? value : value?.items || []);
@@ -194,13 +198,30 @@ function FrameRows({ rows, width, height, offset = 0 }) {
     Box,
     { flexDirection: "column", height, overflow: "hidden" },
     ...rows.slice(offset, offset + height).map((row, i) =>
-      h(TextLine, {
-        key: i,
-        text: typeof row === "string" ? row : row.text,
-        width,
-        color: row.color || colors.text,
-        bold: row.bold || false,
-      }),
+      row.spans
+        ? h(
+            Text,
+            {
+              key: i,
+              color: row.color || colors.text,
+              bold: row.bold,
+              wrap: "truncate",
+            },
+            ...row.spans.map((span, n) =>
+              h(
+                Text,
+                { key: n, color: span.color, bold: span.bold || row.bold },
+                span.text,
+              ),
+            ),
+          )
+        : h(TextLine, {
+            key: i,
+            text: typeof row === "string" ? row : row.text,
+            width,
+            color: row.color || colors.text,
+            bold: row.bold || false,
+          }),
     ),
   );
 }
@@ -371,8 +392,47 @@ function listRows(route, data, index, width) {
     ];
   });
 }
+function documentRows(route, data, width) {
+  if (route.view !== "post" || (route.tab && route.tab !== "overview"))
+    return contentLines(route, data).flatMap((line) => wrap(line, width));
+  const post = data?.post;
+  if (!post) return [];
+  const rows = markdownRows(post.body || "", width);
+  if (post.review_focus)
+    rows.push(
+      { text: "" },
+      { text: "REVIEW FOCUS", color: colors.purple, bold: true },
+      ...markdownRows(post.review_focus, width),
+    );
+  if (post.code) {
+    // Pick a fence longer than any backtick run in the snippet.
+    const fence = "`".repeat(
+      Math.max(
+        3,
+        ...(post.code.match(/`+/g) || []).map((run) => run.length + 1),
+      ),
+    );
+    rows.push(
+      { text: "" },
+      ...markdownRows(fence + "\n" + post.code + "\n" + fence, width),
+    );
+  }
+  if (post.links?.length)
+    rows.push(
+      { text: "LINKS", bold: true },
+      ...post.links.flatMap((link) =>
+        wrap(link.label + " · " + link.url, width),
+      ),
+    );
+  if (post.archived_at || post.locked_at)
+    rows.push({
+      text: "Replies are paused for this conversation.",
+      color: colors.muted,
+    });
+  return rows;
+}
 function App({ initialConfig, flags, root }) {
-  const { exit } = useApp(),
+  const { exit, suspendTerminal } = useApp(),
     { columns, rows } = useWindowSize();
   const [config, setConfig] = useState(initialConfig),
     [phase, setPhase] = useState(
@@ -417,6 +477,8 @@ function App({ initialConfig, flags, root }) {
     notificationGeneration = useRef(0);
   const cache = useRef(new PageCache()),
     history = useRef([]),
+    restoreSelection = useRef(null),
+    seenSnippet = useRef(null),
     busy = useRef(false),
     alive = useRef(true),
     authController = useRef(null),
@@ -522,9 +584,18 @@ function App({ initialConfig, flags, root }) {
     if (current?.unread_count !== undefined) setUnread(current.unread_count);
   }, [current]);
   useEffect(() => {
-    setReviewLine(0);
-    setReviewAnchor(null);
-    setReviewHorizontal(0);
+    const post = current?.post;
+    if (!post?.code) return;
+    if (
+      seenSnippet.current?.id === post.id &&
+      seenSnippet.current.code !== post.code
+    ) {
+      setReviewLine(0);
+      setReviewAnchor(null);
+      setReviewHorizontal(0);
+    } else
+      setReviewLine((line) => Math.min(line, post.code.split("\n").length - 1));
+    seenSnippet.current = { id: post.id, code: post.code };
   }, [current?.post?.id, current?.post?.code]);
   const resetAccount = () => {
     cache.current.clear();
@@ -535,24 +606,55 @@ function App({ initialConfig, flags, root }) {
     setPreview(null);
     setDevice(null);
     setUser(null);
+    setReading(null);
+    setActionIndex(null);
+    setUnread(0);
+    setLiveStatus("");
+    notificationGeneration.current++;
     setRoute({ view: "feed", page: 1 });
     setError("");
   };
   function fail(e) {
     if (!alive.current) return;
-    if (e.status === 401) {
+    if (e.status === 401 && form) {
+      setLive(false);
+      setError(problemMessage(e));
+    } else if (e.status === 401) {
       resetAccount();
       setPhase("auth");
       setConfig(null);
       setError(
         "Your session expired or was revoked. Press Enter to reconnect.",
       );
-    } else setError(clean(e.message));
+    } else setError(problemMessage(e));
   }
   function navigate(next, { replace = false } = {}) {
-    if (!replace) history.current.push({ route, index, scroll });
+    if (!replace)
+      history.current.push({
+        route,
+        index,
+        scroll,
+        selectedId: selected?.id,
+        entryType: selected?.entryType,
+        reviewFocus,
+        reviewLine,
+        reviewAnchor,
+        reviewHorizontal,
+      });
+    restoreSelection.current = {
+      key: JSON.stringify(next),
+      selectedId: next.targetReply,
+      entryType:
+        next.view === "feedback" && next.targetReply
+          ? "feedbackReply"
+          : undefined,
+      index: 0,
+    };
     if (history.current.length > 30) history.current.shift();
     setReading(null);
+    setReviewLine(0);
+    setReviewAnchor(null);
+    setReviewHorizontal(0);
     if (next.view === "feedback") setReviewFocus("notes");
     setRoute(next);
     setIndex(0);
@@ -564,6 +666,15 @@ function App({ initialConfig, flags, root }) {
   function back() {
     const previous = history.current.pop();
     if (previous) {
+      restoreSelection.current = {
+        ...previous,
+        key: JSON.stringify(previous.route),
+      };
+      setReading(null);
+      setReviewFocus(previous.reviewFocus);
+      setReviewLine(previous.reviewLine);
+      setReviewAnchor(previous.reviewAnchor);
+      setReviewHorizontal(previous.reviewHorizontal);
       setRoute(previous.route);
       setIndex(previous.index);
       setScroll(previous.scroll);
@@ -704,6 +815,23 @@ function App({ initialConfig, flags, root }) {
       cached = cache.current.get(key);
     setData(cached ? { ...cached, key } : null);
     setLoading(!cached);
+    if (cached && restoreSelection.current?.key === key) {
+      const saved = restoreSelection.current;
+      const found = cached.items?.findIndex(
+        (item) =>
+          item.id === saved.selectedId &&
+          (saved.entryType === undefined || item.entryType === saved.entryType),
+      );
+      setIndex(
+        found >= 0
+          ? found
+          : Math.min(
+              saved.index || 0,
+              Math.max(0, (cached.items?.length || 0) - 1),
+            ),
+      );
+      restoreSelection.current = null;
+    }
     setError("");
     if (!cached)
       (route.view === "drafts"
@@ -719,9 +847,27 @@ function App({ initialConfig, flags, root }) {
           if (!active) return;
           cache.current.set(key, result);
           setData({ ...result, key });
-          setIndex((i) =>
-            Math.min(i, Math.max(0, (result.items?.length || 0) - 1)),
-          );
+          const saved = restoreSelection.current;
+          if (saved?.key === key) {
+            const found = result.items?.findIndex(
+              (item) =>
+                item.id === saved.selectedId &&
+                (saved.entryType === undefined ||
+                  item.entryType === saved.entryType),
+            );
+            setIndex(
+              found >= 0
+                ? found
+                : Math.min(
+                    saved.index || 0,
+                    Math.max(0, (result.items?.length || 0) - 1),
+                  ),
+            );
+            restoreSelection.current = null;
+          } else
+            setIndex((i) =>
+              Math.min(i, Math.max(0, (result.items?.length || 0) - 1)),
+            );
         })
         .catch((e) => {
           if (active) fail(e);
@@ -890,6 +1036,46 @@ function App({ initialConfig, flags, root }) {
       values: { body: "" },
     });
   }
+  async function externalEdit() {
+    const descriptor = fieldsFor(form)[field];
+    if (!descriptor?.multiline) {
+      setNotice("Ctrl+E opens the editor for a multiline text field.");
+      return;
+    }
+    const original = form;
+    await task(async () => {
+      clearTimeout(draftTimer.current);
+      await queueDraft(() => drafts.save(original));
+      let value;
+      await suspendTerminal(async () => {
+        value = await editExternal(original.values[descriptor.key] || "", {
+          max: descriptor.max,
+        });
+      });
+      const updated = {
+        ...original,
+        values: { ...original.values, [descriptor.key]: value },
+      };
+      setForm(updated);
+      setCursor(graphemes(value).length);
+      await queueDraft(() => drafts.save(updated));
+      setDraftSaved(true);
+      setNotice("Text returned from editor. Preview before publishing.");
+    });
+  }
+  async function reconnect() {
+    await task(async () => {
+      clearTimeout(draftTimer.current);
+      draftGeneration.current++;
+      if (form && drafts) await queueDraft(() => drafts.save(form));
+      resetAccount();
+      setConfig(null);
+      setPhase("auth");
+      setNotice(
+        "Draft saved locally. Enter reconnects; restore it from Local drafts after signing in.",
+      );
+    });
+  }
   async function lineFeedback() {
     const p = current?.post;
     if (!p?.code) {
@@ -1138,21 +1324,7 @@ function App({ initialConfig, flags, root }) {
           setNotice("Event opened in your browser.");
           return;
         }
-        if (item.code_review_id)
-          navigate({
-            view: "feedback",
-            postId: item.post_id,
-            id: item.code_review_id,
-            page: 1,
-            targetReply: item.feedback_reply_id || null,
-          });
-        else
-          navigate({
-            view: "post",
-            id: item.post_id,
-            tab: item.reply_id ? "replies" : "overview",
-            page: 1,
-          });
+        navigate(await notificationRoute(api, item));
       });
       return;
     }
@@ -1486,6 +1658,10 @@ function App({ initialConfig, flags, root }) {
       return;
     }
     if (busy.current) return;
+    if (keyEvent.ctrl && input === "l") {
+      reconnect();
+      return;
+    }
     if (actionIndex !== null) {
       if (keyEvent.escape || input === "x" || input === "X")
         setActionIndex(null);
@@ -1496,7 +1672,7 @@ function App({ initialConfig, flags, root }) {
       return;
     }
     if (reading) {
-      const lines = wrap(
+      const lines = markdownRows(
           reading.deleted_at
             ? "[deleted — discussion preserved]"
             : reading.body || "",
@@ -1549,6 +1725,10 @@ function App({ initialConfig, flags, root }) {
       return;
     }
     if (form) {
+      if (keyEvent.ctrl && input === "e") {
+        externalEdit();
+        return;
+      }
       if (
         keyEvent.ctrl &&
         ["o", "g"].includes(input) &&
@@ -1774,9 +1954,8 @@ function App({ initialConfig, flags, root }) {
       if (prose) {
         const maximum = Math.max(
           0,
-          contentLines(route, current || {}).flatMap((line) =>
-            wrap(line, contentWidth),
-          ).length - contentHeight,
+          documentRows(route, current || {}, contentWidth).length -
+            contentHeight,
         );
         const amount =
           keyEvent.pageUp || keyEvent.pageDown
@@ -2018,7 +2197,7 @@ function App({ initialConfig, flags, root }) {
   } else {
     let body;
     if (reading) {
-      const lines = wrap(
+      const lines = markdownRows(
         reading.deleted_at
           ? "[deleted — discussion preserved]"
           : reading.body || "",
@@ -2147,10 +2326,23 @@ function App({ initialConfig, flags, root }) {
         horizontal: reviewHorizontal,
         rows: (w) => listRows(route, current, index, w),
       });
+    else if (error && !current)
+      body = h(FrameRows, {
+        rows: [
+          { text: "Could not open this view", bold: true, color: colors.red },
+          "",
+          ...wrap(error, contentWidth),
+          "",
+          ...wrap(
+            "Shift+R retries this view · Esc goes back · Ctrl+L reconnects",
+            contentWidth,
+          ),
+        ],
+        width: contentWidth,
+        height: contentHeight,
+      });
     else {
-      const lines = contentLines(route, current || {}).flatMap((line) =>
-        wrap(line, contentWidth),
-      );
+      const lines = documentRows(route, current || {}, contentWidth);
       if (lines.length)
         body = h(FrameRows, {
           rows: lines,
@@ -2278,7 +2470,7 @@ function App({ initialConfig, flags, root }) {
           )
         : h(TextLine, {
             text: form
-              ? "Tab next field · Ctrl+S preview" +
+              ? "Tab next field · Ctrl+E editor · Ctrl+S preview" +
                 (draftSaved ? " · Draft saved locally" : "")
               : preview
                 ? "Scroll to review · ← → choose · Enter confirms"
@@ -2365,7 +2557,7 @@ function App({ initialConfig, flags, root }) {
             : preview
               ? "← → choose · Enter confirm · Esc edit"
               : form
-                ? "Tab field · Ctrl+O files · Ctrl+G diff · Ctrl+S preview · Esc discard"
+                ? "Tab field · Ctrl+E editor · Ctrl+O files · Ctrl+G diff · Ctrl+S preview"
                 : phase !== "ready"
                   ? "Enter connect / open browser · Ctrl+C exit"
                   : route.view === "feedback"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tenyokjs/devdevian-cli",
-  "version": "0.4.0-alpha.1",
+  "version": "0.4.1-alpha.1",
   "description": "Devdevian in your terminal: discussions, questions and human code reviews.",
   "type": "module",
   "bin": {
@@ -10,6 +10,7 @@
     "bin/",
     "lib/",
     "README.md",
+    "VERSIONS.md",
     "LICENSE"
   ],
   "engines": {