nlm-memory 0.4.0

package/src/ui/pages/settings/Sources.tsx

@@ -0,0 +1,326 @@
+import { useCallback, useEffect, useState } from "react";
+import { SettingsSubnav } from "./SettingsSubnav.js";
+import {
+  fetchSources,
+  SOURCE_KINDS,
+  SOURCE_KIND_LABEL,
+  SOURCE_PRESETS,
+  type SourceKind,
+  type SourceRow,
+} from "../../lib/registries.js";
+
+export function SettingsSourcesPage() {
+  const [sources, setSources] = useState<SourceRow[]>([]);
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [showWizard, setShowWizard] = useState(false);
+  const [revealedToken, setRevealedToken] = useState<{ name: string; token: string } | null>(null);
+
+  const load = useCallback(async () => {
+    setLoading(true);
+    try {
+      setSources(await fetchSources());
+      setError(null);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : String(e));
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => { void load(); }, [load]);
+
+  const toggleEnabled = async (row: SourceRow) => {
+    await fetch(`/api/sources/${row.id}`, {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ enabled: !row.enabled }),
+    });
+    await load();
+  };
+
+  const remove = async (row: SourceRow) => {
+    if (!confirm(`Delete source "${row.name}"? This stops scanning but leaves ingested sessions in place.`)) return;
+    await fetch(`/api/sources/${row.id}`, { method: "DELETE" });
+    await load();
+  };
+
+  const regenerateToken = async (row: SourceRow) => {
+    if (!confirm(`Regenerate token for "${row.name}"? Any client using the current token will stop working.`)) return;
+    const r = await fetch(`/api/sources/${row.id}/regenerate-token`, { method: "POST" });
+    const data = (await r.json()) as { token?: string; error?: string };
+    if (data.token) {
+      setRevealedToken({ name: row.name, token: data.token });
+      await load();
+    } else {
+      alert(`Failed: ${data.error ?? r.statusText}`);
+    }
+  };
+
+  return (
+    <div className="page-pad">
+      <SettingsSubnav />
+      <div className="form-row" style={{ justifyContent: "space-between" }}>
+        <h2 className="page-title" style={{ margin: 0 }}>Sources</h2>
+        <button type="button" className="btn btn-accent" onClick={() => setShowWizard(true)}>
+          Add source
+        </button>
+      </div>
+
+      {revealedToken && (
+        <TokenBanner
+          name={revealedToken.name}
+          token={revealedToken.token}
+          onDismiss={() => setRevealedToken(null)}
+        />
+      )}
+
+      {loading && sources.length === 0 && <div className="muted">Loading…</div>}
+      {error && <div className="muted error">{error}</div>}
+
+      {sources.length > 0 && (
+        <table className="data-table">
+          <thead>
+            <tr>
+              <th>Name</th>
+              <th>Kind</th>
+              <th>Runtime</th>
+              <th>Path / URL</th>
+              <th>Status</th>
+              <th></th>
+            </tr>
+          </thead>
+          <tbody>
+            {sources.map((s) => (
+              <tr key={s.id}>
+                <td className="mono">{s.name}</td>
+                <td>{SOURCE_KIND_LABEL[s.kind]}</td>
+                <td className="mono small">{s.runtimeLabel}</td>
+                <td className="mono small">{s.pathOrUrl ?? (s.kind === "webhook" ? "—" : "")}</td>
+                <td>
+                  <span className={`chip-inline ${s.enabled ? "status-active" : "status-stale"}`}>
+                    {s.enabled ? "enabled" : "disabled"}
+                  </span>
+                </td>
+                <td>
+                  <div className="form-row" style={{ gap: "0.5rem" }}>
+                    <button type="button" className="btn small" onClick={() => void toggleEnabled(s)}>
+                      {s.enabled ? "Disable" : "Enable"}
+                    </button>
+                    {s.kind === "webhook" && (
+                      <button type="button" className="btn small" onClick={() => void regenerateToken(s)}>
+                        Regenerate token
+                      </button>
+                    )}
+                    <button type="button" className="btn small" onClick={() => void remove(s)}>
+                      Delete
+                    </button>
+                  </div>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      )}
+
+      {!loading && sources.length === 0 && (
+        <p className="muted small">No sources yet. Click "Add source" to scan your first transcript directory.</p>
+      )}
+
+      {showWizard && (
+        <AddSourceWizard
+          onClose={() => setShowWizard(false)}
+          onCreated={(created) => {
+            setShowWizard(false);
+            if (created.kind === "webhook" && created.token) {
+              setRevealedToken({ name: created.name, token: created.token });
+            }
+            void load();
+          }}
+        />
+      )}
+    </div>
+  );
+}
+
+function TokenBanner({ name, token, onDismiss }: { name: string; token: string; onDismiss: () => void }) {
+  return (
+    <div className="card" style={{ borderColor: "var(--accent)", padding: "1rem", marginTop: "1rem" }}>
+      <h3 className="section-title" style={{ marginTop: 0 }}>One-time token for "{name}"</h3>
+      <p className="muted small">
+        Copy this now. It's stored hashed on the daemon and won't be shown again. Send sessions with{" "}
+        <code>Authorization: Bearer &lt;token&gt;</code> to <code>POST /api/ingest</code>.
+      </p>
+      <pre className="mono" style={{ padding: "0.5rem", overflow: "auto" }}>{token}</pre>
+      <div className="form-row">
+        <button type="button" className="btn" onClick={() => void navigator.clipboard.writeText(token)}>
+          Copy
+        </button>
+        <button type="button" className="btn btn-accent" onClick={onDismiss}>
+          I've stored it
+        </button>
+      </div>
+    </div>
+  );
+}
+
+interface CreatedSource extends SourceRow {}
+
+function AddSourceWizard({
+  onClose,
+  onCreated,
+}: {
+  onClose: () => void;
+  onCreated: (s: CreatedSource) => void;
+}) {
+  const [kind, setKind] = useState<SourceKind>("claude-code");
+  const preset = SOURCE_PRESETS[kind];
+  const [name, setName] = useState(preset.name);
+  const [runtimeLabel, setRuntimeLabel] = useState(preset.runtimeLabel);
+  const [pathOrUrl, setPathOrUrl] = useState<string>(preset.pathOrUrl ?? "");
+  const [jsonlConfig, setJsonlConfig] = useState({
+    idField: "session_id",
+    textField: "text",
+    startedAtField: "started_at",
+    endedAtField: "ended_at",
+  });
+  const [busy, setBusy] = useState(false);
+  const [err, setErr] = useState<string | null>(null);
+
+  useEffect(() => {
+    const p = SOURCE_PRESETS[kind];
+    setName(p.name);
+    setRuntimeLabel(p.runtimeLabel);
+    setPathOrUrl(p.pathOrUrl ?? "");
+    setErr(null);
+  }, [kind]);
+
+  const needsPath = kind !== "webhook";
+  const isCustomJsonl = kind === "jsonl-generic";
+
+  const submit = async () => {
+    setBusy(true);
+    setErr(null);
+    try {
+      const body: Record<string, unknown> = {
+        kind,
+        name,
+        runtimeLabel,
+      };
+      if (needsPath) body["pathOrUrl"] = pathOrUrl;
+      if (isCustomJsonl) body["parseConfig"] = jsonlConfig;
+      const r = await fetch("/api/sources", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(body),
+      });
+      const data = (await r.json()) as CreatedSource & { error?: string };
+      if (!r.ok || data.error) {
+        setErr(data.error ?? r.statusText);
+        return;
+      }
+      onCreated(data);
+    } catch (e) {
+      setErr(e instanceof Error ? e.message : String(e));
+    } finally {
+      setBusy(false);
+    }
+  };
+
+  const canSubmit =
+    !busy &&
+    name.length > 0 &&
+    runtimeLabel.length > 0 &&
+    (!needsPath || pathOrUrl.length > 0);
+
+  return (
+    <div className="card" style={{ padding: "1rem", marginTop: "1rem" }}>
+      <h3 className="section-title" style={{ marginTop: 0 }}>Add source</h3>
+
+      <div className="form-row">
+        <label className="form-label">Kind</label>
+        <select
+          className="form-input form-input-inline"
+          value={kind}
+          onChange={(e) => setKind(e.target.value as SourceKind)}
+          disabled={busy}
+        >
+          {SOURCE_KINDS.map((k) => (
+            <option key={k} value={k}>{SOURCE_KIND_LABEL[k]}</option>
+          ))}
+        </select>
+      </div>
+
+      <div className="form-row">
+        <label className="form-label">Name</label>
+        <input
+          className="form-input form-input-inline"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
+          placeholder={isCustomJsonl || kind === "webhook" ? "e.g. my-agent" : ""}
+          disabled={busy}
+        />
+        <label className="form-label">Runtime label</label>
+        <input
+          className="form-input form-input-inline"
+          value={runtimeLabel}
+          onChange={(e) => setRuntimeLabel(e.target.value)}
+          placeholder="appears on Pulse Runtimes card"
+          disabled={busy}
+        />
+      </div>
+
+      {needsPath && (
+        <div className="form-row">
+          <label className="form-label">{kind === "jsonl-generic" ? "Directory" : "Path"}</label>
+          <input
+            className="form-input form-input-inline"
+            style={{ minWidth: "32rem" }}
+            value={pathOrUrl}
+            onChange={(e) => setPathOrUrl(e.target.value)}
+            placeholder="absolute or ~/ path to JSONL directory"
+            disabled={busy}
+          />
+        </div>
+      )}
+
+      {isCustomJsonl && (
+        <>
+          <h4 className="section-title" style={{ fontSize: "0.875rem" }}>JSONL field mapping</h4>
+          <p className="muted small">
+            How to read your JSONL files. Each row should be one session. Use dot.notation for nested fields.
+          </p>
+          {(["idField", "textField", "startedAtField", "endedAtField"] as const).map((f) => (
+            <div className="form-row" key={f}>
+              <label className="form-label">{f}</label>
+              <input
+                className="form-input form-input-inline"
+                value={jsonlConfig[f]}
+                onChange={(e) => setJsonlConfig({ ...jsonlConfig, [f]: e.target.value })}
+                disabled={busy}
+              />
+            </div>
+          ))}
+        </>
+      )}
+
+      {kind === "webhook" && (
+        <p className="muted small">
+          A bearer token will be generated and shown <strong>once</strong> when you create this source.
+          Use it to <code>POST /api/ingest</code> from any agent or script.
+        </p>
+      )}
+
+      {err && <p className="muted error small">{err}</p>}
+
+      <div className="form-row">
+        <button type="button" className="btn btn-accent" onClick={() => void submit()} disabled={!canSubmit}>
+          {busy ? "Creating…" : "Create"}
+        </button>
+        <button type="button" className="btn" onClick={onClose} disabled={busy}>
+          Cancel
+        </button>
+      </div>
+    </div>
+  );
+}

package/src/ui/pages/settings/Views.tsx

@@ -0,0 +1,96 @@
+import { useEffect, useRef, useState } from "react";
+import { SettingsSubnav } from "./SettingsSubnav.js";
+import {
+  readViewSettings,
+  writeViewSettings,
+  VIEW_SETTINGS_DEFAULT,
+  type ViewSettings,
+} from "../../lib/view-settings.js";
+
+export function SettingsViewsPage() {
+  const [values, setValues] = useState<ViewSettings>(() => readViewSettings());
+  const [saved, setSaved] = useState(false);
+  const firstRun = useRef(true);
+
+  useEffect(() => {
+    if (firstRun.current) {
+      firstRun.current = false;
+      return;
+    }
+    writeViewSettings(values);
+    setSaved(true);
+    const t = setTimeout(() => setSaved(false), 1800);
+    return () => clearTimeout(t);
+  }, [values]);
+
+  const isDefault =
+    values.landing === VIEW_SETTINGS_DEFAULT.landing &&
+    values.riverDensity === VIEW_SETTINGS_DEFAULT.riverDensity &&
+    values.threadSort === VIEW_SETTINGS_DEFAULT.threadSort;
+
+  return (
+    <div className="page-pad">
+      <SettingsSubnav />
+      <div className="form-row" style={{ justifyContent: "space-between" }}>
+        <h2 className="page-title" style={{ margin: 0 }}>Views</h2>
+        {saved && <span className="muted small">Saved</span>}
+      </div>
+      <div className="form-grid">
+        <Field label="Default landing">
+          <select
+            className="form-input"
+            value={values.landing}
+            onChange={(e) => setValues({ ...values, landing: e.target.value as ViewSettings["landing"] })}
+          >
+            <option value="live">Live</option>
+            <option value="pulse">Pulse</option>
+            <option value="river">River</option>
+            <option value="thread">Thread</option>
+            <option value="search">Search</option>
+          </select>
+        </Field>
+        <Field label="River density">
+          <select
+            className="form-input"
+            value={values.riverDensity}
+            onChange={(e) => setValues({ ...values, riverDensity: e.target.value as ViewSettings["riverDensity"] })}
+          >
+            <option value="compact">Compact</option>
+            <option value="comfortable">Comfortable</option>
+            <option value="spacious">Spacious</option>
+          </select>
+        </Field>
+        <Field label="Thread sort">
+          <select
+            className="form-input"
+            value={values.threadSort}
+            onChange={(e) => setValues({ ...values, threadSort: e.target.value as ViewSettings["threadSort"] })}
+          >
+            <option value="recent">Most recent first</option>
+            <option value="oldest">Oldest first</option>
+          </select>
+        </Field>
+      </div>
+      <div className="form-row">
+        <button
+          type="button"
+          className="btn"
+          onClick={() => setValues(VIEW_SETTINGS_DEFAULT)}
+          disabled={isDefault}
+        >Reset to defaults</button>
+      </div>
+      <p className="muted small">
+        Preferences are stored per-device in localStorage. Landing applies on next load; River density and Thread sort apply when you open those pages.
+      </p>
+    </div>
+  );
+}
+
+function Field({ label, children }: { label: string; children: React.ReactNode }) {
+  return (
+    <label className="form-field">
+      <span className="form-label">{label}</span>
+      {children}
+    </label>
+  );
+}