synabun 2.0.0 → 2.0.7

package/neural-interface/public/shared/settings/settings-code-editor.js

@@ -0,0 +1,328 @@
+// ═══════════════════════════════════════════
+// SETTINGS — the code editor's page, in words
+// ═══════════════════════════════════════════
+//
+// What `GET /api/editor/config`, `GET /api/editor/capabilities` and the routes under `/api/editor/complete`
+// (lib/editor-config.js, lib/editor-completion.js) say about Settings → Code editor: for "Editing", which
+// preferences there are and what each is set to; for "AI autocomplete", whether the section can be used at all,
+// what is stored, which models there are, and what a test found. Pure: no DOM and no import, so node runs it
+// (tests/settings-code-editor-view.test.mjs).
+//
+//   EDITING_FIELDS                                                the editing preferences, each with its control
+//   readEditorEditingResponse({ status, body, error })            what the server answered → a reading
+//   describeEditorEditing(reading, { tx })                        the "Editing" section as the pane draws it
+//   editingOptionLabel(key, value, { tx }) / editingChange(key, raw)
+//   readEditorAiResponse({ status, body, error, capabilities })   what the server answered → a reading
+//   describeEditorAi(reading, { tx })                             the section as settings-code-editor-pane.js draws it
+//   describeEditorModels(answer, selected, { tx })                the model list
+//   describeEditorTest(result, { tx }) / describeEditorFastest(body, { tx })
+//   describeEditorUsage(today, { tx })
+//   describeEditorSaveFailure(input, { tx })                      the sentence for a change that could not be saved
+//   parseExcludeList(text) / excludeListText(list) / isEndpointUrl(text)
+//
+// `tx(key, params)` is the caller's translate function over the settings.redesign.* strings (the kit's `tx`).
+//
+// The section never shows a healthy-looking control for something that is not happening: a server without the
+// feature gets disabled controls and says why, and the key is only ever "set" or "not set".
+
+const K = 'settings.redesign.code_editor';
+
+const clean = (value, max = 200) => {
+  const text = String(value ?? '').replace(/\s+/g, ' ').trim();
+  return text.length > max ? `${text.slice(0, max - 1)}…` : text;
+};
+
+// ── Editing ──
+
+/**
+ * The `editing` preferences (public/shared/editor/editor-prefs.js keeps their defaults and their limits), in the
+ * order the section shows them: the text, what is drawn around it, indentation, and what a save does.
+ * `id`: the control's inventory id; `kind`: a switch, or one choice among `values`.
+ */
+export const EDITING_FIELDS = Object.freeze([
+  { key: 'fontSize', id: 'EDT014', kind: 'choice', values: Object.freeze([10, 11, 12, 13, 14, 15, 16, 17, 18]) },
+  { key: 'ligatures', id: 'EDT015', kind: 'toggle' },
+  { key: 'wordWrap', id: 'EDT016', kind: 'toggle' },
+  { key: 'minimap', id: 'EDT017', kind: 'toggle' },
+  { key: 'indentGuides', id: 'EDT018', kind: 'toggle' },
+  { key: 'renderWhitespace', id: 'EDT019', kind: 'choice', values: Object.freeze(['none', 'selection', 'all']) },
+  { key: 'indentWith', id: 'EDT020', kind: 'choice', values: Object.freeze(['auto', 'spaces', 'tabs']) },
+  { key: 'tabSize', id: 'EDT021', kind: 'choice', values: Object.freeze(['auto', 2, 4, 8]) },
+  { key: 'trimTrailingWhitespace', id: 'EDT022', kind: 'toggle' },
+  { key: 'insertFinalNewline', id: 'EDT023', kind: 'toggle' },
+]);
+
+/**
+ * What GET /api/editor/config answered about the editing preferences.
+ *
+ *   ready        the preferences are there
+ *   old-server   404: the running server was started before the editor kept its preferences
+ *   unreadable   anything else; `reason` says what
+ *
+ * @param {{ status?: number, body?: object|null, error?: string|null }} response
+ * @returns {{ state: 'ready'|'old-server'|'unreadable', editing: object|null, reason: string|null }}
+ */
+export function readEditorEditingResponse({ status = 0, body = null, error = null } = {}) {
+  if (status === 404) return { state: 'old-server', editing: null, reason: null };
+  if (status === 200 && body?.ok === true && body.config?.editing && typeof body.config.editing === 'object' && !Array.isArray(body.config.editing)) {
+    return { state: 'ready', editing: body.config.editing, reason: null };
+  }
+  return { state: 'unreadable', editing: null, reason: clean(body?.error || error) || (status ? `HTTP ${status}` : null) };
+}
+
+/** What a choice is called in its list: "12 px", "Detect", "Spaces", "In the selection"… */
+export function editingOptionLabel(key, value, { tx }) {
+  if (key === 'fontSize') return tx(`${K}.editing.fontSize`, { size: value });
+  if (key === 'renderWhitespace') return tx(`${K}.editing.whitespace.${value}`);
+  if (value === 'auto') return tx(`${K}.editing.detect`);
+  if (key === 'indentWith') return tx(`${K}.editing.${value}`);
+  return String(value);
+}
+
+/**
+ * The "Editing" section as it is drawn.
+ * → { state, ready, note, values: { [key]: value } }
+ *   `reading`: what readEditorEditingResponse() returned, or null while the server has not answered yet.
+ *   `values`: for each field what its control shows: a boolean for a switch, one of the field's values (as text)
+ *   for a choice. Before the preferences are known, a switch is off and a choice shows its first value.
+ *   `note`: one line above the controls when they cannot be used (and why), else null.
+ */
+export function describeEditorEditing(reading, { tx }) {
+  const state = reading ? reading.state || 'unreadable' : 'loading';
+  const ready = state === 'ready';
+  const stored = ready && reading.editing ? reading.editing : {};
+  const values = {};
+  for (const field of EDITING_FIELDS) {
+    if (field.kind === 'toggle') values[field.key] = stored[field.key] === true;
+    else {
+      const found = field.values.find((value) => String(value) === String(stored[field.key]));
+      values[field.key] = String(found !== undefined ? found : field.values[0]);
+    }
+  }
+  let note = null;
+  // Until the preferences arrive the controls show first choices and switches that are off: say that they are
+  // being read, so those are not taken for what is stored.
+  if (state === 'loading') note = { text: tx('settings.redesign.common.checking'), tone: 'neutral' };
+  else if (state === 'old-server') note = { text: tx(`${K}.editing.oldServer`), tone: 'warn' };
+  else if (state === 'unreadable') {
+    const reason = clean(reading?.reason);
+    note = { text: reason ? tx(`${K}.state.unreadable`, { reason }) : tx(`${K}.state.unreadableNoReason`), tone: 'warn' };
+  }
+  return { state, ready, note, values };
+}
+
+/**
+ * What a control's new value changes in the stored preferences.
+ * @param {string} key a field's key
+ * @param {boolean | string} raw a switch's `checked`, or a list's `value`
+ * @returns {{ editing: object } | null} what is sent to PUT /api/editor/config; null for a value the field does not have
+ */
+export function editingChange(key, raw) {
+  const field = EDITING_FIELDS.find((entry) => entry.key === key);
+  if (!field) return null;
+  if (field.kind === 'toggle') return typeof raw === 'boolean' ? { editing: { [key]: raw } } : null;
+  const value = field.values.find((entry) => String(entry) === String(raw));
+  return value === undefined ? null : { editing: { [key]: value } };
+}
+
+// ── AI autocomplete ──
+
+/**
+ * What the server answered.
+ *
+ *   ready        the preferences are there and the server has the `complete` capability
+ *   old-server   404, or preferences without the capability: the running server was started before AI
+ *                autocomplete existed (public/ reloads at any time, lib/ only on a restart)
+ *   unreadable   anything else (no answer, a refusal, a body that is not the preferences); `reason` says what
+ *
+ * @param {{ status?: number, body?: object|null, error?: string|null, capabilities?: string[]|null }} response
+ *   `status` and `body` of GET /api/editor/config; `capabilities` of GET /api/editor/capabilities (null: not answered)
+ * @returns {{ state: 'ready'|'old-server'|'unreadable', config: object|null, hasEndpointKey: boolean, reason: string|null }}
+ */
+export function readEditorAiResponse({ status = 0, body = null, error = null, capabilities = null } = {}) {
+  const out = (state, reason = null) => ({ state, config: null, hasEndpointKey: false, reason });
+  if (status === 404) return out('old-server');
+  if (status === 200 && body?.ok === true && body.config?.ai && typeof body.config.ai === 'object') {
+    if (!Array.isArray(capabilities) || !capabilities.includes('complete')) return out('old-server');
+    return { state: 'ready', config: body.config, hasEndpointKey: body.hasEndpointKey === true, reason: null };
+  }
+  return out('unreadable', clean(body?.error || error) || (status ? `HTTP ${status}` : null));
+}
+
+/**
+ * The section as it is drawn.
+ * → { state, ready, note, pill: { text, state }, enabled, engine, model, endpoint: { kind, url, model, shape },
+ *     hasKey, keyState, keyPlaceholder, urlPlaceholder, exclude (text), excludeCount }
+ *   `reading`: what readEditorAiResponse() returned, or null while the server has not answered yet (the controls
+ *   are then switched off without a word about why: nothing is known to be wrong).
+ *   `note`: one line above the controls when they cannot be used (and why), else null.
+ *   `pill.state`: 'ok' on and able to ask · 'warn' on but with nothing to ask yet · 'off'. An empty `pill.text`
+ *   is not shown.
+ */
+export function describeEditorAi(reading, { tx }) {
+  const state = reading ? reading.state || 'unreadable' : 'loading';
+  const ready = state === 'ready';
+  const view = {
+    state, ready, note: null, pill: { text: state === 'loading' ? '' : tx(`${K}.pill.unavailable`), state: 'off' },
+    enabled: false, engine: 'opencode', model: null, endpoint: { kind: 'ollama', url: '', model: '', shape: 'fim' },
+    hasKey: false, keyState: '', keyPlaceholder: tx(`${K}.key.placeholder`), urlPlaceholder: tx(`${K}.url.placeholderOllama`),
+    exclude: '', excludeCount: '',
+  };
+  if (state === 'loading') {
+    view.note = { text: tx('settings.redesign.common.checking'), tone: 'neutral' };
+    return view;
+  }
+  if (!ready) {
+    const reason = clean(reading?.reason);
+    if (state === 'old-server') view.note = { text: tx(`${K}.state.oldServer`), tone: 'warn' };
+    else view.note = { text: reason ? tx(`${K}.state.unreadable`, { reason }) : tx(`${K}.state.unreadableNoReason`), tone: 'warn' };
+    return view;
+  }
+  const ai = reading.config.ai;
+  const endpoint = ai.endpoint && typeof ai.endpoint === 'object' ? ai.endpoint : {};
+  view.enabled = ai.enabled === true;
+  view.engine = ai.engine === 'endpoint' ? 'endpoint' : 'opencode';
+  view.model = typeof ai.model === 'string' && ai.model ? ai.model : null;
+  view.endpoint = {
+    kind: endpoint.kind === 'openai' ? 'openai' : 'ollama', url: String(endpoint.url || ''), model: String(endpoint.model || ''),
+    shape: endpoint.shape === 'chat' ? 'chat' : 'fim',
+  };
+  view.hasKey = reading.hasEndpointKey === true;
+  view.keyState = tx(view.hasKey ? `${K}.key.set` : `${K}.key.notSet`);
+  view.keyPlaceholder = tx(view.hasKey ? `${K}.key.placeholderReplace` : `${K}.key.placeholder`);
+  view.urlPlaceholder = tx(view.endpoint.kind === 'openai' ? `${K}.url.placeholderOpenai` : `${K}.url.placeholderOllama`);
+  const list = Array.isArray(ai.exclude) ? ai.exclude.filter((glob) => typeof glob === 'string') : [];
+  view.exclude = excludeListText(list);
+  view.excludeCount = list.length ? tx(`${K}.exclude.count`, { n: list.length }) : tx(`${K}.exclude.empty`);
+  const able = view.engine === 'endpoint' ? !!(view.endpoint.url && view.endpoint.model) : !!view.model;
+  if (!view.enabled) view.pill = { text: tx(`${K}.pill.off`), state: 'off' };
+  else if (!able) view.pill = { text: tx(`${K}.pill.setup`), state: 'warn' };
+  else view.pill = { text: tx(`${K}.pill.on`), state: 'ok' };
+  return view;
+}
+
+/** A price per million tokens the way a model row writes it: 0.15, 0.60, 2.00, 0.003. */
+export function formatPrice(value) {
+  const n = Number(value);
+  if (!Number.isFinite(n) || n < 0) return '';
+  return n > 0 && n < 0.01 ? n.toFixed(3) : n.toFixed(2);
+}
+
+/** A duration: 640 ms, 1.2 s. */
+export function formatDuration(value) {
+  const ms = Math.max(0, Math.round(Number(value) || 0));
+  return ms < 1000 ? `${ms} ms` : `${(ms / 1000).toFixed(1)} s`;
+}
+
+/** A count: 950, 1.2k, 3.4M. */
+export function formatAmount(value) {
+  const n = Math.max(0, Math.round(Number(value) || 0));
+  if (n < 1000) return String(n);
+  if (n < 1_000_000) return `${(n / 1000).toFixed(n < 10_000 ? 1 : 0).replace(/\.0$/, '')}k`;
+  return `${(n / 1_000_000).toFixed(1).replace(/\.0$/, '')}M`;
+}
+
+/**
+ * The model list.
+ * @param {{ status?: number, body?: object|null } | null} answer what GET /api/editor/complete/models answered;
+ *   null while it is being asked
+ * @param {string|null} selected `ai.model`
+ * @param {{ tx: Function, providersPage?: string }} deps `providersPage`: the name of the Settings page where a
+ *   provider is signed in to
+ * @returns {{ state: 'loading'|'list'|'empty'|'unavailable', message: string, canStart: boolean,
+ *   rows: { id: string, label: string, provider: string, meta: string, fast: boolean, selected: boolean, listed: boolean }[] }}
+ *   `canStart`: the list could not be read because OpenCode is not running, and starting it would give one.
+ */
+export function describeEditorModels(answer, selected, { tx, providersPage = '' }) {
+  const view = { state: 'loading', message: tx(`${K}.models.loading`), canStart: false, rows: [] };
+  const missing = () => (selected ? [{ id: selected, label: selected, provider: selected.split('/')[0], meta: tx(`${K}.models.notListed`), fast: false, selected: true, listed: false }] : []);
+  if (!answer) return view;
+  const body = answer.body;
+  if (answer.status !== 200 || body?.ok !== true || !Array.isArray(body.models)) {
+    return { state: 'unavailable', message: clean(body?.message || body?.error) || tx(`${K}.models.unavailable`), canStart: false, rows: missing() };
+  }
+  if (body.available === false) {
+    return { state: 'unavailable', message: clean(body.message) || tx(`${K}.models.unavailable`), canStart: true, rows: missing() };
+  }
+  const rows = body.models.filter((model) => model && typeof model.id === 'string').map((model) => {
+    const parts = [];
+    if (model.fast) parts.push(tx(`${K}.models.fast`));
+    if (model.free) parts.push(tx(`${K}.models.free`));
+    else if (model.price) parts.push(tx(`${K}.models.price`, { input: formatPrice(model.price.input), output: formatPrice(model.price.output) }));
+    else parts.push(tx(`${K}.models.noPrice`));
+    return { id: model.id, label: String(model.label || model.id), provider: String(model.provider || model.id.split('/')[0]), meta: parts.join(' · '), fast: model.fast === true, selected: model.id === selected, listed: true };
+  });
+  if (selected && !rows.some((row) => row.selected)) rows.unshift(...missing());
+  if (!rows.length) return { state: 'empty', message: tx(`${K}.models.none`, { page: providersPage }), canStart: false, rows };
+  return { state: 'list', message: '', canStart: false, rows };
+}
+
+/**
+ * One test's result as a sentence.
+ * @param {{ ok?: boolean, ms?: number, tokens?: { input: number, output: number }|null, sample?: string, error?: string }|null} result
+ *   a row of POST /api/editor/complete/test; null when the request itself got no answer
+ * @returns {{ tone: 'ok'|'warn'|'err', text: string }}
+ */
+export function describeEditorTest(result, { tx }) {
+  if (!result) return { tone: 'err', text: tx(`${K}.test.failed`, { reason: tx(`${K}.test.noAnswer`) }) };
+  if (!result.ok) return { tone: 'err', text: tx(`${K}.test.failed`, { reason: clean(result.error, 160) || '?' }) };
+  const time = formatDuration(result.ms);
+  const sample = clean(result.sample, 80);
+  if (!sample) return { tone: 'warn', text: tx(`${K}.test.empty`, { time }) };
+  if (result.tokens) return { tone: 'ok', text: tx(`${K}.test.ok`, { time, input: formatAmount(result.tokens.input), output: formatAmount(result.tokens.output), sample }) };
+  return { tone: 'ok', text: tx(`${K}.test.okNoTokens`, { time, sample }) };
+}
+
+/**
+ * What "Find fastest" found.
+ * @param {object|null} body the answer of POST /api/editor/complete/test { fastest: true }; null: no answer
+ * @returns {{ tone: 'ok'|'warn'|'err', text: string, model: string|null }} `model`: the one to select, or null
+ */
+export function describeEditorFastest(body, { tx }) {
+  if (!body || body.ok !== true || !Array.isArray(body.results)) {
+    return { tone: 'err', text: tx(`${K}.test.failed`, { reason: clean(body?.error || body?.message, 160) || tx(`${K}.test.noAnswer`) }), model: null };
+  }
+  const best = body.fastest ? body.results.find((row) => row.model === body.fastest && row.ok) : null;
+  if (best) return { tone: 'ok', text: tx(`${K}.fastest.found`, { model: best.model, time: formatDuration(best.ms) }), model: best.model };
+  if (!body.results.length) return { tone: 'warn', text: clean(body.message, 160) || tx(`${K}.fastest.noCandidates`), model: null };
+  return { tone: 'warn', text: tx(`${K}.fastest.none`), model: null };
+}
+
+/** Today's use as one line. `today`: the `today` of GET /api/editor/complete/usage, or null. */
+export function describeEditorUsage(today, { tx }) {
+  const n = (value) => Math.max(0, Math.round(Number(value) || 0));
+  if (!today || n(today.requests) === 0) return tx(`${K}.usage.none`);
+  return tx(`${K}.usage.today`, { requests: formatAmount(today.requests), input: formatAmount(today.tokensIn), output: formatAmount(today.tokensOut), accepted: n(today.accepted), shown: n(today.shown) });
+}
+
+/**
+ * The patterns a text holds: one per line (or between commas), no empty ones, none twice, no folders.
+ * The server normalises the same way (editor-prefs.js); this is what the page sends.
+ */
+export function parseExcludeList(text) {
+  const out = [];
+  for (const piece of String(text ?? '').split(/[\n,]/)) {
+    const glob = piece.trim().slice(0, 200);
+    if (glob && !glob.includes('/') && !glob.includes('\\') && !out.includes(glob)) out.push(glob);
+    if (out.length >= 200) break;
+  }
+  return out;
+}
+
+/** A list of patterns as the text field shows it. */
+export const excludeListText = (list) => (Array.isArray(list) ? list.join('\n') : '');
+
+/** Whether a text is an address a request can be sent to. Empty is not an address, and not an error either. */
+export const isEndpointUrl = (text) => /^https?:\/\/\S+$/i.test(String(text ?? '').trim());
+
+/**
+ * A change that could not be saved: the control goes back to where it was, and this is the sentence that says so.
+ * @param {{ status?: number, body?: object|null, error?: string|null }} input
+ */
+export function describeEditorSaveFailure({ status = 0, body = null, error = null } = {}, { tx }) {
+  let reason = clean(body?.error || body?.message, 160);
+  if (!reason && status === 404) reason = tx(`${K}.save.oldServer`);
+  if (!reason && status) reason = `HTTP ${status}`;
+  if (!reason) reason = clean(error, 160) || tx(`${K}.save.noAnswer`);
+  return tx(`${K}.save.failed`, { reason });
+}

package/neural-interface/public/shared/settings/settings-greeting.js

@@ -0,0 +1,133 @@
+// ═══════════════════════════════════════════
+// SETTINGS — the greeting, in words
+// ═══════════════════════════════════════════
+//
+// What `GET /api/greeting` and `POST /api/greeting/preview` (lib/greeting/api.js, the engine in
+// lib/greeting/engine.js) say about Settings → Automations → Greeting: whether the one switch can be
+// used at all, what it is set to, what stands in the way, and what a new session would be greeted
+// with right now. Pure: no DOM (it imports only the greeting's own DOM-free view), so node runs it
+// (tests/settings-greeting-view.test.mjs).
+//
+//   readGreetingStatus({ status, body, error })     what the server answered → a reading
+//   describeGreeting(reading, preview, { tx, t })   the section as ui-settings.js draws it
+//   describeGreetingSaveFailure(input, { tx })      the sentence for a switch that could not be saved
+//
+// `tx(key, params)` is the caller's translate function over the settings.redesign.* strings (the
+// kit's `tx`); `t` is the app's translator, for the elapsed time the greeting card also formats.
+//
+// The section never shows a healthy-looking control for something that is not happening: a server
+// without the engine gets a disabled switch and says why, and the preview says in so many words
+// whether a session opened now would actually be greeted.
+
+import { formatAway } from '../greeting/greeting-view.js';
+
+const K = 'settings.redesign.hooks.greet';
+
+const clean = (value, max = 200) => {
+  const text = String(value ?? '').replace(/\s+/g, ' ').trim();
+  return text.length > max ? `${text.slice(0, max - 1)}…` : text;
+};
+
+/**
+ * What the server answered.
+ *
+ *   ready        the engine is there: `payload` is { settings, enabled, killed, writer, spend, gapMs, last }
+ *   old-server   404: the running server was started before the engine existed (public/ reloads at any
+ *                time, lib/ only on a restart)
+ *   failed       503 GREETING_UNAVAILABLE: the engine did not start; `reason` is the error
+ *   unreadable   anything else (no answer, a refusal, a body that is not the payload); `reason` says what
+ *
+ * @param {{ status?: number, body?: object|null, error?: string|null }} response
+ * @returns {{ state: 'ready'|'old-server'|'failed'|'unreadable', payload: object|null, reason: string|null }}
+ */
+export function readGreetingStatus({ status = 0, body = null, error = null } = {}) {
+  if (status === 200 && body?.ok === true && body.settings && typeof body.settings === 'object') return { state: 'ready', payload: body, reason: null };
+  if (status === 404) return { state: 'old-server', payload: null, reason: null };
+  if (status === 503 && body?.code === 'GREETING_UNAVAILABLE') return { state: 'failed', payload: null, reason: clean(body.reason) || null };
+  return { state: 'unreadable', payload: null, reason: clean(body?.error || error) || (status ? `HTTP ${status}` : null) };
+}
+
+/** "$0.0006" · "<$0.0001" · '' */
+function usd(value) {
+  const amount = Number(value);
+  if (!Number.isFinite(amount) || amount <= 0) return '';
+  if (amount < 0.0001) return '<$0.0001';
+  return `$${amount < 0.01 ? amount.toFixed(4) : amount.toFixed(2)}`;
+}
+
+/**
+ * The section as it is drawn.
+ * `preview`: null (not asked yet) | { loading: true } | { failed } (the request itself failed) | the engine's
+ * preview payload (whose own `error` only says why no model wrote the sentence: 'not-prepared', 'no-writer' …).
+ * → { state, ready, on, disabled, note, notes[], preview: { shown, state, project, lead, greeting, empty, spend, canWrite } }
+ *   preview.state: 'hidden' | 'loading' | 'greeting' | 'empty' | 'error'
+ *   preview.greeting: what the shared card draws (public/shared/greeting/greeting-card.js), or null
+ */
+export function describeGreeting(reading, preview, { tx, t = null, now = Date.now() } = {}) {
+  const state = reading?.state || 'unreadable';
+  const ready = state === 'ready';
+  const payload = ready ? reading.payload : null;
+  const on = ready && payload.settings.enabled !== false;
+  const killed = ready && payload.killed === true;
+  let note = null;
+  if (state === 'old-server') note = { tone: 'info', text: tx(`${K}.state.oldServer`) };
+  else if (state === 'failed') note = { tone: 'warn', text: reading.reason ? tx(`${K}.state.failed`, { reason: reading.reason }) : tx(`${K}.state.failedUnknown`) };
+  else if (state === 'unreadable') note = { tone: 'warn', text: reading?.reason ? tx(`${K}.state.unreadable`, { reason: reading.reason }) : tx(`${K}.state.unreadableUnknown`) };
+  else if (killed) note = { tone: 'warn', text: tx(`${K}.state.killed`) };
+
+  const notes = [];
+  if (ready && on && !killed && payload.writer === false) notes.push({ tone: 'info', text: tx(`${K}.note.noWriter`) });
+
+  const view = { shown: ready, state: 'hidden', project: '', lead: '', greeting: null, empty: '', spend: '', canWrite: false };
+  if (ready) {
+    if (!preview || preview.loading) { view.state = 'loading'; view.lead = tx(`${K}.preview.loading`); }
+    else if (preview.failed || preview.reason === 'error' || preview.reason === 'unavailable') {
+      view.state = 'error';
+      view.project = clean(preview.label || preview.project || '', 60);
+      view.empty = tx(`${K}.preview.error`, { reason: clean(preview.failed || preview.reason || '', 120) || '?' });
+    } else {
+      const project = clean(preview.label || preview.project || '', 60);
+      view.project = project;
+      const text = typeof preview.text === 'string' ? preview.text.trim() : '';
+      const since = Date.parse(preview.lastHereAt ?? '');
+      const away = Number.isFinite(since) ? formatAway(Math.max(0, now - since), t) : '';
+      if (!text) {
+        view.state = 'empty';
+        view.empty = tx(preview.reason === 'first-session' || !Number.isFinite(since) ? `${K}.preview.firstSession` : `${K}.preview.nothingToSay`, { project });
+      } else {
+        view.state = 'greeting';
+        const reason = !on || killed ? 'off' : preview.reason;
+        if (reason === 'off') view.lead = tx(`${K}.preview.off`, { project });
+        else if (reason === 'recent') view.lead = tx(`${K}.preview.recent`, { project, time: away || tx(`${K}.preview.moment`), gap: formatAway(Number(preview.gapMs) || 3_600_000, t) });
+        else if (reason === 'nothing-new') view.lead = tx(`${K}.preview.nothingNew`, { project });
+        else view.lead = tx(`${K}.preview.now`, { project });
+        view.greeting = {
+          id: null, text, source: preview.source === 'writer' ? 'writer' : 'fallback', error: preview.error || null, model: preview.model || null,
+          tokens: preview.tokens || null, costUsd: preview.costUsd ?? null, preparedAt: preview.preparedAt || null,
+          basis: Array.isArray(preview.basis) ? preview.basis : [], awaySince: null,
+        };
+      }
+      const spend = preview.spend || payload.spend || null;
+      if (spend) {
+        const calls = Math.max(0, Math.round(Number(spend.calls) || 0));
+        view.spend = calls > 0
+          ? tx(`${K}.preview.spend`, { calls, cap: Math.round(Number(spend.cap) || 0), cost: usd(spend.costUsd) || '$0' })
+          : tx(`${K}.preview.spendNone`);
+      }
+      view.canWrite = payload.writer !== false && view.state !== 'empty';
+    }
+  }
+  return { state, ready, on, disabled: !ready || killed, note, notes, preview: view };
+}
+
+/**
+ * Why a switch could not be saved, as one sentence. `status` / `body`: what the server answered;
+ * `error`: the fetch failure when there was no answer.
+ */
+export function describeGreetingSaveFailure({ status = 0, body = null, error = null } = {}, { tx }) {
+  if (status === 404) return tx(`${K}.save.oldServer`);
+  if (status === 503) return tx(`${K}.save.failed`, { reason: clean(body?.reason || body?.error) || 'HTTP 503' });
+  if (status === 403) return tx(`${K}.save.forbidden`);
+  const reason = clean(body?.error || error) || (status ? `HTTP ${status}` : '');
+  return reason ? tx(`${K}.save.failed`, { reason }) : tx(`${K}.save.noAnswer`);
+}

package/neural-interface/public/shared/settings/settings-ia.js

@@ -29,6 +29,7 @@ export const SETTINGS_GROUPS = [
   { id: 'tools',       labelKey: k('group.tools') },
   { id: 'automations', labelKey: k('group.automations') },
   { id: 'personalize', labelKey: k('group.personalize') },
+  { id: 'app',         labelKey: k('group.app') },
 ];
 
 /** `key` is the i18n slug under settings.redesign.{nav,page,section}; `icon` names a TAB_ICONS entry. */
@@ -118,6 +119,14 @@ export const SETTINGS_PAGES = [
       { id: 'stg-sec-tool-permissions', key: 'tool_permissions', state: 'open' },
     ],
   },
+  {
+    id: 'code-editor', key: 'code_editor', group: 'tools', icon: 'editor',
+    panes: [{ id: 'editor' }],
+    sections: [
+      { id: 'stg-sec-editor-editing', key: 'editing', state: 'open' },
+      { id: 'stg-sec-editor-ai', key: 'ai_autocomplete', state: 'open' },
+    ],
+  },
   {
     id: 'automations', key: 'automations', group: 'automations', icon: 'hooks',
     panes: [{ id: 'hooks' }, { id: 'social' }, { id: 'youtube', titleKey: k('pane.youtube') }],
@@ -175,6 +184,17 @@ export const SETTINGS_PAGES = [
       { id: 'stg-sec-2d-graph',      key: 'd2_graph',               state: 'advanced', variant: 'graphics' },
     ],
   },
+  {
+    // The last page: version, links, system and dependencies (settings-about-pane.js, GET /api/system/about).
+    // Its header (icon, version, Check for updates, Copy info) is not a section: it is always shown.
+    id: 'about', key: 'about', group: 'app', icon: 'about',
+    panes: [{ id: 'about' }],
+    sections: [
+      { id: 'stg-sec-about-links',        key: 'links',        state: 'open' },
+      { id: 'stg-sec-about-system',       key: 'system',       state: 'open' },
+      { id: 'stg-sec-about-dependencies', key: 'dependencies', state: 'open' },
+    ],
+  },
 ];
 
 export const DEFAULT_SETTINGS_PAGE = 'ai-connections';
@@ -243,8 +263,10 @@ export const SETTINGS_CONTROLS = {
   'stg-sec-ml-server': 'ML012 ML013 ML014',
   'stg-sec-skills': 'SKL004 SKL001',
   'stg-sec-tool-permissions': 'PER012 PER001 PER002 PER003 PER004 PER005 PER006 PER007 PER008 PER009 PER010 PER011',
-  'stg-sec-greetings': 'AUT001 AUT002 AUT003 AUT047 AUT004 AUT005 AUT009 AUT010 AUT011 AUT012 AUT013 AUT014 AUT015 AUT016 AUT017 AUT018 AUT019 AUT020 AUT021 AUT022 AUT026 AUT027',
-  'stg-sec-automation-behavior': 'AUT046 AUT036 AUT037 AUT038 AUT039 AUT040 AUT041 AUT028 AUT029 AUT030 AUT031 AUT032 AUT033 AUT034 AUT035',
+  'stg-sec-editor-editing': 'EDT014 EDT015 EDT016 EDT017 EDT018 EDT019 EDT020 EDT021 EDT022 EDT023',
+  'stg-sec-editor-ai': 'EDT001 EDT002 EDT003 EDT004 EDT005 EDT006 EDT007 EDT008 EDT009 EDT010 EDT011 EDT012 EDT013',
+  'stg-sec-greetings': 'AUT058 AUT059 AUT060',
+  'stg-sec-automation-behavior': 'AUT053 AUT054 AUT055 AUT056 AUT057 AUT046 AUT036 AUT037 AUT038 AUT039 AUT040 AUT041 AUT028 AUT029 AUT030 AUT031 AUT032 AUT033 AUT034 AUT035',
   'stg-sec-online-access': 'AUT048 AUT042 AUT043 AUT044 AUT045 AUT049 AUT050 AUT051 AUT052',
   'stg-sec-social': 'SOC003 SOC001 SOC002',
   'stg-sec-youtube': 'YT017 YT001 YT002 YT003 YT004 YT005 YT006 YT007 YT008 YT009 YT010 YT011 YT012 YT013 YT014 YT015 YT016 YT018',
@@ -268,11 +290,13 @@ export const SETTINGS_CONTROLS = {
   'stg-sec-visual-tuning': 'UI003 UI004 UI005 UI006 UI007 UI008 UI009 UI010',
   'stg-sec-file-icons': 'ICO001 ICO003 ICO002 ICO004 ICO005',
   'stg-sec-2d-graph': 'GFX001 GFX002 GFX003 GFX004 GFX005 GFX006 GFX007 GFX008',
+  'stg-sec-about-dependencies': 'ABT003',
 };
 /** Controls of a page that sit outside its sections (a pane's save bar, the tabs of a pane). */
 export const SETTINGS_PAGE_CONTROLS = {
   browser: 'BRW081 BRW082 BRW085',
   'connected-tools': 'MCP001',
+  about: 'ABT001 ABT002',
 };
 /** The window's own controls (dim the background, close, the page list): not settings, so never search results. */
 export const SETTINGS_SHELL_CONTROLS = 'SH002 SH003 SH005';
@@ -296,6 +320,7 @@ export const homeOfControl = (controlId) => CONTROL_HOME.get(controlId) || null;
 // ── Deep-link aliases ──────────────────────────────────────────────────────
 // Old tab id → the page that took it over, and the section a link to that tab
 // should land on. Old callers keep working; new code uses the page ids.
+// A page that never had an old tab needs no entry: `{ tab: 'about' }` names the About page itself.
 
 export const SETTINGS_TAB_ALIASES = {
   server:        { page: 'memory-backups',  section: 'stg-sec-database' },
@@ -326,9 +351,13 @@ export const SETTINGS_TAB_ALIASES = {
 
 // Old `expand` / `highlight` / `scrollTo` ids whose element was merged into another
 // section. Ids that still exist in the markup (setup-claude, jv-sec-log, wa-sec-setup,
-// recall-controls, cc-greeting-config, bridge-openclaw, project-storage-manager,
-// cc-cli-paths …) need no entry: they resolve to themselves.
+// recall-controls, bridge-openclaw, project-storage-manager, cc-cli-paths …) need
+// no entry: they resolve to themselves.
 export const SETTINGS_SECTION_ALIASES = {
+  // The three greeting editors became the one Greeting section (lib/greeting/).
+  'cc-greeting-config':       'stg-sec-greetings',
+  'codex-greeting-config':    'stg-sec-greetings',
+  'opencode-greeting-config': 'stg-sec-greetings',
   'notif-sources-section':  'stg-sec-when',
   'notif-triggers-section': 'stg-sec-when',
   'notif-sound-section':    'stg-sec-sounds',