symbiot 0.40.2 → 0.40.4

package/README.md

@@ -136,6 +136,9 @@ symbiot app                                 # opens in your phone's browser
   `proot-distro`. To reach
   the phone's shared storage, run `termux-setup-storage` and add `~/storage/shared`
   (or a folder in it) under Settings → Folders to scan.
+- Claude Code's history is read from Termux's home and from those Linuxes'
+  homes, so projects your agent worked on inside `proot-distro login debian` get
+  their "agent" badge on the Map, as they do on a computer.
 - **Write my week and notify me** sends an Android notification when the
   `termux-api` package and the Termux:API app are installed.
 - **Start Symbiot in the background when the phone starts** writes a
@@ -555,6 +558,29 @@ While the app is running, these commands use its hidden browser, so it stays
 open between them as it does in the app. Without the app, each command opens the
 browser and closes it when done.
 
+**Watch a page for what's new.** On a mapped page (your Gmail inbox, GitHub's
+notifications), **Watch** has Symbiot read it again every 15 minutes (or 5, 30,
+60) while the app runs, in the same hidden browser, and compare what's listed
+there with what it has seen. It only reads: no screenshot is saved and nothing
+on the page is pressed or typed. The first read just learns what's there, so it
+never announces your whole inbox. After that, anything new (a new email, a new
+reply in a thread) gets a desktop notification and goes under **Watching** in
+Screens, newest first. A row is the same row whether its time reads `9:05 AM`,
+`Oct 5` or `2 hours ago`, or you've read it since. On a page with no rows it
+watches the links instead. If the site has signed you out, the watch says so,
+and notifies you once. With
+**Start at login** on (Settings), this keeps going on days you never open
+Symbiot. What's new is saved in `~/.config/symbiot/watch.json` (yours only).
+Your coding agent reads it too, so it can act on it with `symbiot screens`:
+
+```bash
+symbiot watch add <screen id> --every 15   # watch a mapped page (or: symbiot watch add gmail)
+symbiot watch new --hours 24               # what's new, newest first (JSON)
+symbiot watch check                        # read them all now (JSON)
+symbiot watch                              # what you watch, and what's new
+symbiot watch remove <id>
+```
+
 **More than one display?** Symbiot reads how your displays are laid out
 (`cosmic-randr`, `wlr-randr`, `kscreen-doctor` or `xrandr` on Linux, PowerShell on
 Windows, AppKit on macOS) and a picker appears next to Capture: **each display**

package/headless.mjs

@@ -7,6 +7,7 @@
 // site. On a site you trust (Settings), that goes ahead without asking. In the
 // app the browser stays open for a few minutes after each action, so the next
 // one carries on from the page as it is (type into a field, then press Send).
+// readPage reads a page without saving a screen, for Watch (watch.mjs).
 //
 // It drives Chrome / Chromium / Edge / Brave over the DevTools protocol on a pipe
 // (--remote-debugging-pipe: commands in on fd 3, replies out on fd 4, each JSON
@@ -154,7 +155,7 @@ function closeBrowser() { return shut(live); }
 // Give fn the hidden browser's page (the open one, else a new one), and what it
 // shows (b.shown). After: kept open for KEEP ms, or closed; closed on an error,
 // so the next action starts afresh.
-async function withPage(fn) {
+async function withPage(fn, keep = true) {
   if (live && live.c.closed()) await shut(live);
   let b = live;
   if (b) clearTimeout(b.timer); else b = live = await launch();
@@ -167,7 +168,7 @@ async function withPage(fn) {
   } catch (e) { await shut(b); throw e; }
   finally {
     clearTimeout(kill); b.busy = false;
-    if (live === b && KEEP && !b.c.closed()) b.timer = setTimeout(() => oneAtATime(() => live === b && !b.busy ? shut(b) : null), KEEP);
+    if (live === b && KEEP && keep && !b.c.closed()) b.timer = setTimeout(() => oneAtATime(() => live === b && !b.busy ? shut(b) : null), KEEP);
     else await shut(b);
   }
 }
@@ -239,25 +240,36 @@ const COLLECT = `(() => {
     const top = document.elementFromPoint((x + x2) / 2, (y + y2) / 2);
     if (!top || !(top === e || e.contains(top) || top.contains(e))) continue;
     kinds.set(e, kind);
-    const r = { label: labelOf(e).slice(0, 80) || kind, kind, x: Math.round(x), y: Math.round(y), w: Math.round(x2 - x), h: Math.round(y2 - y), selector: cssPath(e) };
+    const full = labelOf(e);
+    const r = { label: full.slice(0, 80) || kind, kind, x: Math.round(x), y: Math.round(y), w: Math.round(x2 - x), h: Math.round(y2 - y), selector: cssPath(e) };
+    if (full.length > 80) r.text = full.slice(0, 400); // all of a long one (an inbox row), for Watch
     if (e.href && /^https?:/.test(e.href)) r.href = String(e.href).slice(0, 500);
     out.push(r);
   }
   return { url: location.href, title: document.title, items: out };
 })()`;
 
-// The page as it is now, saved as a screen with its regions.
-async function snapshot(page, name) {
+// What's on the page now: { url, title, items }.
+async function collect(page) {
   const { result, exceptionDetails } = await page.send("Runtime.evaluate", { expression: COLLECT, returnByValue: true });
   if (exceptionDetails) throw new Error("Couldn't read the page: " + ((exceptionDetails.exception && exceptionDetails.exception.description) || exceptionDetails.text));
-  const info = (result && result.value) || { url: "", title: "", items: [] };
+  return (result && result.value) || { url: "", title: "", items: [] };
+}
+// A sign-in page instead of the site.
+function signInPage(url) {
+  const host = hostOf(url);
+  return /(^|\.)(accounts\.google|login\.(microsoftonline|live)|signin\.aws|auth0|okta)\./i.test(host + ".") || /\/(log-?in|sign-?in|auth|sso)\b/i.test(String(url || ""));
+}
+
+// The page as it is now, saved as a screen with its regions.
+async function snapshot(page, name) {
+  const info = await collect(page);
   const { data } = await page.send("Page.captureScreenshot", { format: "png" });
-  let host = ""; try { host = new URL(info.url).hostname.replace(/^www\./, ""); } catch {}
+  const host = hostOf(info.url);
   const s = addPageScreen(String(name || "").trim() || info.title || host || "Page", Buffer.from(data, "base64"), info, info.items);
   if (s.error) return s;
   // a sign-in page instead of the site: say how to get past it once
-  const login = /(^|\.)(accounts\.google|login\.(microsoftonline|live)|signin\.aws|auth0|okta)\./i.test(host + ".") || /\/(log-?in|sign-?in|auth|sso)\b/i.test(info.url);
-  return login ? { ...s, note: `This looks like a sign-in page (${host}). Click Sign in, sign in once in the window that opens, close it, then map again: the hidden browser keeps that sign-in.` } : s;
+  return signInPage(info.url) ? { ...s, note: `This looks like a sign-in page (${host}). Click Sign in, sign in once in the window that opens, close it, then map again: the hidden browser keeps that sign-in.` } : s;
 }
 
 // Map a site: open it in the hidden browser and save what's on it as a screen.
@@ -267,6 +279,21 @@ function mapPage(input, name) {
   return oneAtATime(() => withPage(async (page) => { await open(page, url); return snapshot(page, name); })).catch((e) => ({ error: String((e && e.message) || e) }));
 }
 
+// Read a site as it is now, without saving a screen: { url, title, items, login }.
+// For Watch (watch.mjs), which only looks: nothing is pressed or typed. While the
+// browser is open for you or an agent (type, then press), it leaves it alone
+// ({ busy }) rather than take its page somewhere else; and it doesn't keep the
+// browser open after.
+function readPage(input) {
+  const url = siteUrl(input);
+  if (!url) return Promise.resolve({ error: "Give a site to read: a name (gmail), a host or a web address." });
+  return oneAtATime(() => browserOpen() ? { busy: true } : withPage(async (page) => {
+    await open(page, url);
+    const info = await collect(page);
+    return { ...info, login: signInPage(info.url) };
+  }, false)).catch((e) => ({ error: String((e && e.message) || e) }));
+}
+
 // Trusted sites (Settings → Screens): on a page from one of these, press and type
 // go ahead without asking, for you and for agents. Anywhere else each one asks.
 // A host covers its subdomains (google.com covers mail.google.com). Only the app's
@@ -359,4 +386,4 @@ async function signIn(input) {
   return { ok: true, url };
 }
 
-export { siteUrl, browserArgs, mapPage, pressRegion, typeRegion, signIn, keepBrowserOpen, closeBrowser, browserOpen, trustedSites, isTrusted, trustSite, untrustSite, PROFILE };
+export { siteUrl, browserArgs, mapPage, readPage, pressRegion, typeRegion, signIn, keepBrowserOpen, closeBrowser, browserOpen, trustedSites, isTrusted, trustSite, untrustSite, PROFILE };

package/index.mjs

@@ -35,6 +35,7 @@ import { gitDefaultBranch, loadDeploys, driftRepo } from "./drift.mjs";
 import { loadScreens, screenImage, captureScreen, splitScreen, listMonitors, allowScreenshots, importScreen, setRegions, renameScreen, removeScreen, blueprint, clickRegion } from "./screens.mjs";
 import { mapPage, pressRegion, typeRegion, signIn, keepBrowserOpen, isTrusted, trustedSites, trustSite, untrustSite } from "./headless.mjs";
 import { weeklyState, setWeekly, runWeekly, startWeekly, autostartState, setAutostart } from "./desktop.mjs";
+import { watchState, addWatch, setEvery, removeWatch, clearNews, newsSince, checkWatch, startWatches } from "./watch.mjs";
 
 const HERE = fileURLToPath(new URL(".", import.meta.url));
 let VERSION = "0"; try { VERSION = JSON.parse(readFileSync(join(HERE, "package.json"), "utf8")).version; } catch {}
@@ -732,16 +733,22 @@ function storageBlocked() {
 // home folders in $PREFIX/var/lib/proot-distro/installed-rootfs/<distro>, outside
 // Termux's home, and that's where projects worked on in it live. Symbiot in
 // Termux reads them there: /root and /home/<user> of each installed distro.
-function prootHomes() {
+const subdirs = (p) => { try { return readdirSync(p, { withFileTypes: true }).filter((d) => d.isDirectory()).map((d) => join(p, d.name)); } catch { return []; } };
+// The folder each installed distro sees as "/".
+function prootDistros() {
   if (!process.env.PREFIX) return [];
-  const base = join(process.env.PREFIX, "var", "lib", "proot-distro", "installed-rootfs"), out = [];
-  const dirs = (p) => { try { return readdirSync(p, { withFileTypes: true }).filter((d) => d.isDirectory()).map((d) => join(p, d.name)); } catch { return []; } };
-  for (const distro of dirs(base)) {
-    if (existsSync(join(distro, "root"))) out.push(join(distro, "root"));
-    out.push(...dirs(join(distro, "home")));
+  return subdirs(join(process.env.PREFIX, "var", "lib", "proot-distro", "installed-rootfs"));
+}
+// Each distro's home folders, with the distro they're in.
+function prootHomeDirs() {
+  const out = [];
+  for (const rootfs of prootDistros()) {
+    if (existsSync(join(rootfs, "root"))) out.push({ rootfs, home: join(rootfs, "root") });
+    for (const home of subdirs(join(rootfs, "home"))) out.push({ rootfs, home });
   }
   return out;
 }
+function prootHomes() { return prootHomeDirs().map((h) => h.home); }
 // Where to look when you haven't picked folders: your home folder (and in Termux,
 // the homes of its proot-distro Linuxes).
 function scanDefaults() { return [scanHome(), ...prootHomes()]; }
@@ -1118,9 +1125,13 @@ function detectFolder(path) {
 // Projects you've run an AI coding agent on. Claude Code stores one dir per
 // project under ~/.claude/projects, named by the project path with every
 // non-alphanumeric char → "-" (so "/" "." "_" "-" all collide). Returns
-// { "<encoded path>": { agent, last, path } } — last = newest session mtime
+// { "<key>": { agent, last, path, rootfs, enc } } — last = newest session mtime
 // (epoch secs); path = the real project dir, read from the "cwd" a session
-// records (empty when no session says, then callers fall back to decoding).
+// records (empty when no session says, then callers fall back to decoding enc).
+// In Termux it also reads Claude Code's history inside each proot-distro (in
+// the distro's /root and /home/<user>). Paths there are the distro's own
+// ("/root/work/proj"), so rootfs is the distro's folder ("" outside one), path
+// is prefixed with it, and key = agentKey(rootfs, enc).
 // (Gemini's dir is global config, Codex's is empty, so no reliable per-project
 // signal there yet; add them here when there is.)
 const claudeEnc = (p) => String(p || "").replace(/[^a-zA-Z0-9]/g, "-");
@@ -1130,9 +1141,21 @@ function sessionCwd(file) {
   if (!m) return "";
   try { return JSON.parse(`"${m[1]}"`); } catch { return ""; }
 }
+const agentKey = (rootfs, enc) => (rootfs ? rootfs + "\0" : "") + enc;
+// The keys a project folder's history could be under: its path, and its path as
+// seen from inside the proot-distro it's in (if any), each encoded both ways.
+function agentKeys(path, distros) {
+  const enc = (p) => [claudeEnc(p), p.replace(/\//g, "-")]; // older Claude Code mapped only "/"
+  const rootfs = distros.find((r) => path.startsWith(r + "/"));
+  return [...enc(path), ...(rootfs ? enc(path.slice(rootfs.length)).map((e) => agentKey(rootfs, e)) : [])];
+}
 function claudeProjects() {
-  const base = join(homedir(), ".claude", "projects");
   const out = {};
+  readClaudeProjects(join(homedir(), ".claude", "projects"), "", out);
+  for (const { rootfs, home } of prootHomeDirs()) readClaudeProjects(join(home, ".claude", "projects"), rootfs, out);
+  return out;
+}
+function readClaudeProjects(base, rootfs, out) {
   let dirs = [];
   try { dirs = sh(`ls -1 ${JSON.stringify(base)} 2>/dev/null`).split("\n").filter(Boolean); } catch {}
   for (const enc of dirs) {
@@ -1145,9 +1168,10 @@ function claudeProjects() {
       if (cwd && (claudeEnc(cwd) === enc || cwd.replace(/\//g, "-") === enc)) path = cwd; // only trust a cwd that matches this dir
     }
     if (!last) { try { last = Math.floor(statSync(join(base, enc)).mtimeMs / 1000); } catch {} }
-    out[enc] = { agent: "Claude Code", last, path };
+    const key = agentKey(rootfs, enc);
+    if (out[key] && out[key].last >= last) continue; // one project worked on from two of the distro's homes: keep the newest
+    out[key] = { agent: "Claude Code", last, path: path && rootfs + path, rootfs, enc };
   }
-  return out;
 }
 // Async only to YIELD between repos, so the app server can answer /api/scan
 // (progress) mid-scan; the git calls themselves stay synchronous. Concurrent
@@ -1212,10 +1236,10 @@ async function buildMapScan() {
   // Agent projects: badge the repo/folder nodes an AI coding agent has worked,
   // and surface agent-worked projects the scan missed as their own nodes.
   try {
-    const ap = claudeProjects(); const used = new Set();
+    const ap = claudeProjects(), distros = prootDistros(); const used = new Set();
     for (const n of nodes) {
       if ((n.type === "repo" || n.type === "folder") && n.meta && n.meta.path) {
-        const e = [claudeEnc(n.meta.path), n.meta.path.replace(/\//g, "-")].find((k) => ap[k]); // older Claude Code mapped only "/"
+        const e = agentKeys(n.meta.path, distros).find((k) => ap[k]);
         if (e) { n.meta.agents = [{ agent: ap[e].agent, last: ap[e].last }]; used.add(e); }
       }
     }
@@ -1223,7 +1247,7 @@ async function buildMapScan() {
     for (const e of Object.keys(ap)) {
       if (used.has(e) || extra >= 20) continue;
       // the session's recorded cwd; else best-effort decode (names with - . _ won't resolve and are skipped)
-      const decoded = ap[e].path || e.replace(/-/g, "/");
+      const decoded = ap[e].path || ap[e].rootfs + ap[e].enc.replace(/-/g, "/");
       if (!existsSync(decoded) || !statSync(decoded).isDirectory()) continue;
       if (nodes.some((n) => n.meta && n.meta.path === decoded)) continue;
       const isGit = existsSync(join(decoded, ".git"));
@@ -1773,6 +1797,13 @@ async function cmdApp() {
       if (u.pathname === "/api/screens/trusted/add" && req.method === "POST") { const b = await readBody(req); return json(res, trustSite(b.site)); }
       if (u.pathname === "/api/screens/trusted/remove" && req.method === "POST") { const b = await readBody(req); return json(res, untrustSite(b.site)); }
       if (u.pathname === "/api/screens/signin" && req.method === "POST") { const b = await readBody(req); return json(res, await signIn(b.site)); }
+      // Watch (watch.mjs): a mapped page read again every few minutes, and what's new on it.
+      if (u.pathname === "/api/watch") return json(res, watchState());
+      if (u.pathname === "/api/watch/add" && req.method === "POST") { const b = await readBody(req); return json(res, addWatch({ screen: b.screen ? String(b.screen) : "", site: b.site, every: b.every })); }
+      if (u.pathname === "/api/watch/every" && req.method === "POST") { const b = await readBody(req); return json(res, setEvery(String(b.id || ""), b.every)); }
+      if (u.pathname === "/api/watch/remove" && req.method === "POST") { const b = await readBody(req); return json(res, removeWatch(String(b.id || ""))); }
+      if (u.pathname === "/api/watch/check" && req.method === "POST") { const b = await readBody(req); return json(res, await checkWatch(String(b.id || ""))); }
+      if (u.pathname === "/api/watch/clear" && req.method === "POST") return json(res, clearNews());
       // What symbiot-desktop added (desktop.mjs): the weekly write-up, start at login.
       if (u.pathname === "/api/desktop") return json(res, { weekly: weeklyState(), autostart: autostartState() });
       if (u.pathname === "/api/desktop/weekly" && req.method === "POST") { const b = await readBody(req); return json(res, setWeekly(b)); }
@@ -1819,6 +1850,7 @@ async function cmdApp() {
   server.listen(PORT, "127.0.0.1");
   checkLatest(); setInterval(checkLatest, 2 * 60 * 1000).unref(); // background update check (every 2 min)
   startWeekly(produce); // the weekly write-up + notification, when switched on in Settings
+  startWatches(); // pages you watch (Screens → Watch), read every few minutes
 }
 
 // `symbiot mail [--on|--off] [--add <path>]`: what mail it can read, and a preview.
@@ -1903,7 +1935,43 @@ async function cmdScreens() {
   if (sub !== "help") process.exitCode = 1;
 }
 
-const HELP = `${c.b("symbiot")} — your week, written from your real work.
+// ---- `symbiot watch`: pages Symbiot keeps track of, and what's new on them ----
+// new, add, remove and check print JSON, for you or an agent.
+async function cmdWatch() {
+  const [sub = "list", a1] = argv.slice(1).filter((x, i, all) => !x.startsWith("--") && !["--every", "--hours"].includes(all[i - 1]));
+  const out = (x) => { console.log(JSON.stringify(x, null, 2)); if (x && x.error) process.exitCode = 1; };
+  const hours = Number(flag("hours", 24)) || 24;
+  if (sub === "list") {
+    const st = watchState();
+    if (!st.watches.length) console.log(c.d("Not watching anything yet. Map a page (symbiot screens map gmail), then  symbiot watch add <screen id>,  or click Watch on it in the app."));
+    for (const w of st.watches) console.log(`${w.id}  ${w.name}  ${c.d(`every ${w.every} min · ${w.checked ? "last read " + new Date(w.checked).toLocaleString() : "not read yet"}${w.error ? " · " + w.error : ""}`)}`);
+    const news = newsSince(hours);
+    if (st.watches.length) console.log("\n" + c.b(`${news.length} new in the last ${hours} hours`) + (news.length ? "" : c.d("  (the app reads each page every few minutes while it runs)")));
+    for (const n of news.slice(0, 20)) console.log(`  ${c.d(new Date(n.ts).toLocaleString())}  ${n.text.slice(0, 110)}  ${c.d(n.name.slice(0, 30))}`);
+    return;
+  }
+  if (sub === "new") return out(newsSince(hours));
+  if (sub === "add") { const screen = loadScreens().some((s) => s.id === a1) ? a1 : ""; return out(addWatch({ screen, site: screen ? "" : a1, every: flag("every", 15) })); }
+  if (sub === "remove") return out(removeWatch(String(a1 || "")));
+  if (sub === "check") {
+    // through the app when it runs: its hidden browser may be open, and one profile takes one browser
+    const ids = a1 ? [a1] : watchState().watches.map((w) => w.id), done = [];
+    for (const id of ids) done.push((await viaApp("/api/watch/check", { id })) || await checkWatch(id));
+    return out(a1 ? done[0] : done);
+  }
+  console.log(`${c.b("symbiot watch")} ${c.d("— experimental")}
+  symbiot watch                                the pages you watch, and what's new
+  symbiot watch add <screen id | site> [--every 5|15|30|60]
+                                               watch a mapped page (or a site) for new rows
+  symbiot watch new [--hours 24]               what's new, newest first (JSON)
+  symbiot watch check [id]                     read them now (JSON)
+  symbiot watch remove <id>                    stop watching it
+  While the app runs it reads each page every few minutes in its hidden browser
+  (only reads: nothing is pressed or typed), and notifies you of what's new.`);
+  if (sub !== "help") process.exitCode = 1;
+}
+
+const HELP =`${c.b("symbiot")} — your week, written from your real work.
 
 ${c.b("Usage")}
   symbiot ${c.d("(or)")} symbiot week      write up your last ${SINCE_WEEK} days
@@ -1924,6 +1992,8 @@ ${c.b("Experimental")}
   symbiot setup-local [--model X]   install/run a free local model (Ollama)
   symbiot screens map <site>        map a web page's buttons in a hidden browser
                                     (symbiot screens help for more)
+  symbiot watch add <screen id>     keep track of a mapped page: what's new on it
+                                    (symbiot watch help for more)
 
 ${c.b("Options")}
   --dir <path>    where your repos are (default: ${homedir()})
@@ -1955,6 +2025,7 @@ async function main() {
   if (cmd === "push") return cmdPush();
   if (cmd === "mail" || cmd === "email") return cmdMail();
   if (cmd === "screens" || cmd === "screen") return cmdScreens();
+  if (cmd === "watch") return cmdWatch();
   if (cmd === "week") return cmdRun("week");
   if (cmd === "standup") return cmdRun("standup");
   if (cmd === "todo") return cmdRun("todo");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "symbiot",
-  "version": "0.40.2",
+  "version": "0.40.4",
   "description": "Your week, written from your real work. Reads your local git and writes it up with the AI of your choice — Claude, OpenAI, Gemini, or a local model.",
   "type": "module",
   "bin": {
@@ -15,6 +15,7 @@
     "mail.mjs",
     "screens.mjs",
     "headless.mjs",
+    "watch.mjs",
     "desktop.mjs",
     "README.md",
     "LICENSE"

package/ui.mjs

@@ -169,10 +169,11 @@ label.check input{width:auto}
 <div id="review" class="review hidden"></div>
 <div style="margin-top:22px;border-top:1px solid var(--line);padding-top:4px">
 <div class="tgroup">Screens <span class="tcount">experimental &middot; blueprints for screen automation</span></div>
-<div class="note muted" style="margin-top:2px">Capture a screen, then drag a box over each part that matters (a button, a field, a menu) and name it. Each region keeps its pixel coordinates and its centre, ready for automation to aim at. With more than one display, pick which one to capture, or one screen per display. <b>Click here</b> on a region clicks its centre on your real screen, after you confirm. Or let Symbiot do it all for a web page: <b>Map page</b> opens it in a hidden browser, takes its screenshot and marks every button, link and field by itself, and <b>Press</b> on one of them follows it there and maps the next page; <b>Type</b> on a field types into it there. Only a mapped page is typed into: nothing types on your real screen.</div>
+<div class="note muted" style="margin-top:2px">Capture a screen, then drag a box over each part that matters (a button, a field, a menu) and name it. Each region keeps its pixel coordinates and its centre, ready for automation to aim at. With more than one display, pick which one to capture, or one screen per display. <b>Click here</b> on a region clicks its centre on your real screen, after you confirm. Or let Symbiot do it all for a web page: <b>Map page</b> opens it in a hidden browser, takes its screenshot and marks every button, link and field by itself, and <b>Press</b> on one of them follows it there and maps the next page; <b>Type</b> on a field types into it there. Only a mapped page is typed into: nothing types on your real screen. <b>Watch</b> on a mapped page (your inbox, say) has Symbiot read it again every few minutes while it runs and tell you what's new there.</div>
 <div class="row" style="margin-top:10px"><input id="pagesite" placeholder="a web page to map by itself: gmail, github.com/pulls or a web address" style="flex:1"><button class="act" id="mappage">Map page</button><button class="ghost" id="pagesignin" title="open this site in Symbiot's own browser as a window, to sign in once; close it when you're done">Sign in</button></div>
 <div class="row" style="margin-top:10px"><input id="screenname" placeholder="name the screen, e.g. GitHub PR page" style="flex:1"><select id="screenwhich" class="hidden" title="which display to capture" style="flex:0 0 auto;width:auto"></select><select id="screendelay" title="wait first, so you can bring the right window to the front" style="flex:0 0 auto;width:auto"><option value="0">now</option><option value="3">in 3s</option><option value="5">in 5s</option><option value="10">in 10s</option></select><button class="ghost" id="capture">Capture screen</button><button class="ghost" id="screenload" title="use a PNG screenshot you already have">Load image</button><input type="file" id="screenfile" accept="image/png" class="hidden"></div>
 <div id="screenmsg"></div>
+<div id="watchbox"></div>
 <div id="screenlist" class="taskfilter"></div>
 <div id="screenview"></div>
 </div>
@@ -658,7 +659,7 @@ box.querySelectorAll('.fchip').forEach(function(b){b.addEventListener('click',fu
 function scrPct(v,of){return (v/of*100).toFixed(3)+'%';}
 function scrBox(r,s,cls){return "<div class='scrbox"+(cls?" "+cls:"")+"' style='left:"+scrPct(r.x,s.w)+";top:"+scrPct(r.y,s.h)+";width:"+scrPct(r.w,s.w)+";height:"+scrPct(r.h,s.h)+"'>"+(r.label?"<span>"+esc(r.label)+"</span>":"")+"</div>";}
 function renderScreen(){var v=$('screenview'),s=SCREEN;if(!s){v.innerHTML='';return;}
-var h="<div class='row' style='margin-top:10px'><input id='scrname' title='rename this screen' style='flex:1'><span class='muted'>"+(s.monitor?esc(s.monitor.name)+(s.monitor.where?" ("+esc(s.monitor.where)+")":"")+" &middot; ":"")+s.w+" &times; "+s.h+" px</span>"+(s.page?"<button class='ghost' id='scrremap' title='open this page in the hidden browser again and map it as it is now'>Map again</button>":"")+(!s.monitor&&!s.page&&MONITORS.length>1?"<button class='ghost' id='scrsplit' title='cut this screenshot into one screen per display, regions included (this one stays)'>Split by display</button>":"")+"<button class='ghost' id='scrcopy' title='copy the regions and their coordinates as JSON'>Copy blueprint</button><button class='ghost' id='scrdel'>Delete</button></div>";
+var h="<div class='row' style='margin-top:10px'><input id='scrname' title='rename this screen' style='flex:1'><span class='muted'>"+(s.monitor?esc(s.monitor.name)+(s.monitor.where?" ("+esc(s.monitor.where)+")":"")+" &middot; ":"")+s.w+" &times; "+s.h+" px</span>"+(s.page?"<button class='ghost' id='scrremap' title='open this page in the hidden browser again and map it as it is now'>Map again</button>"+(watchOf(s)?"<button class='ghost' id='scrwatch' title='Symbiot reads this page every few minutes and tells you what&#39;s new: click to stop'>Watching &#10003;</button>":"<button class='ghost' id='scrwatch' title='read this page again every few minutes while Symbiot runs, and tell me what&#39;s new on it'>Watch</button>"):"")+(!s.monitor&&!s.page&&MONITORS.length>1?"<button class='ghost' id='scrsplit' title='cut this screenshot into one screen per display, regions included (this one stays)'>Split by display</button>":"")+"<button class='ghost' id='scrcopy' title='copy the regions and their coordinates as JSON'>Copy blueprint</button><button class='ghost' id='scrdel'>Delete</button></div>";
 if(s.page)h+="<div class='muted' style='font-size:12px;margin-top:6px;overflow-wrap:anywhere'>Mapped in the hidden browser: "+esc(s.page.url)+"</div>";
 h+="<div class='scrwrap' id='scrwrap'><img src='/api/screens/image?id="+encodeURIComponent(s.id)+"&t="+encodeURIComponent(T)+"' alt='' draggable='false'>"+(s.regions||[]).map(function(r){return scrBox(r,s,'');}).join('')+(SPEND?scrBox(SPEND,s,'draw'):"")+"<div class='scrbox draw hidden' id='scrdraw'></div></div>";
 h+="<div class='mapbar' id='scrbar'>Drag on the screenshot to mark a region &middot; coordinates are screenshot pixels</div>";
@@ -693,7 +694,32 @@ $('scrregions').querySelectorAll('.scrclick').forEach(function(b){b.addEventList
 $('scrregions').querySelectorAll('.scrpress').forEach(function(b){b.addEventListener('click',function(){pressUI(s,+b.closest('.task').getAttribute('data-i'),b);});});
 $('scrregions').querySelectorAll('.scrtype').forEach(function(b){b.addEventListener('click',function(){typeUI(s,+b.closest('.task').getAttribute('data-i'),b);});});
 var te=$('screnter');if(te)te.addEventListener('change',function(){STYPEENTER=!!te.checked;});
-var rm=$('scrremap');if(rm)rm.addEventListener('click',function(){mapUI(s.page.url,rm);});}
+var rm=$('scrremap');if(rm)rm.addEventListener('click',function(){mapUI(s.page.url,rm);});
+var wb=$('scrwatch');if(wb)wb.addEventListener('click',function(){watchUI(s,wb);});}
+// Watch (watch.mjs): a mapped page read again every few minutes while Symbiot
+// runs, and what's new on it. Only reads: nothing there is pressed or typed.
+var WATCH={watches:[],news:[],every:[5,15,30,60]};
+function watchOf(s){var w=null;(WATCH.watches||[]).forEach(function(x){if(s&&s.page&&x.url===s.page.url)w=x;});return w;}
+function agoTxt(t){var m=Math.max(0,(Date.now()-t)/60000);return m<1.5?'just now':m<90?Math.round(m)+' min ago':m<2160?Math.round(m/60)+' h ago':Math.round(m/1440)+' days ago';}
+function loadWatchUI(){api('/api/watch').then(function(d){if(d&&d.watches)WATCH=d;renderWatch();});}
+function watchUI(s,b){var w=watchOf(s);
+if(w){if(typeof confirm==='function'&&!confirm('Stop watching '+w.name+'? What it found goes too.'))return;api('/api/watch/remove',{id:w.id}).then(function(){api('/api/watch').then(function(d){if(d&&d.watches)WATCH=d;renderWatch();renderScreen();});});return;}
+b.disabled=true;api('/api/watch/add',{screen:s.id,every:15}).then(function(x){b.disabled=false;if(!x||x.error){screenErr((x&&x.error)||'failed');return;}
+$('screenmsg').innerHTML="<div class='note ok'>&#10003; Watching "+esc(x.name)+". Symbiot reads it every "+x.every+" minutes while it runs (first within a minute, to learn what's there) and notifies you of anything new. It's listed under Watching, just below.</div>";
+api('/api/watch').then(function(d){if(d&&d.watches)WATCH=d;renderWatch();renderScreen();});});}
+function renderWatch(){var box=$('watchbox'),ws=WATCH.watches||[],ns=WATCH.news||[];if(!ws.length){box.innerHTML='';return;}
+var h="<div class='tgroup'>Watching <span class='tcount'>read again while Symbiot runs &middot; only reads, never presses</span></div>";
+h+=ws.map(function(w,i){return "<div class='task' data-i='"+i+"'><span class='t'><b>"+esc(w.name)+"</b> <span class='muted' style='font-size:12px'>"+(w.checked?"read "+agoTxt(w.checked):w.last?"tried "+agoTxt(w.last):"first read within a minute")+"</span>"+(w.error?"<br><span class='err' style='font-size:12px'>"+esc(w.error)+"</span>":"")+"</span><select class='wevery' title='how often to read it' style='flex:0 0 auto;width:auto'>"+(WATCH.every||[]).map(function(m){return "<option value='"+m+"'"+(m===w.every?" selected":"")+">every "+m+" min</option>";}).join('')+"</select><button class='ghost wcheck' title='read it now'>Check now</button><button class='rm wrm' title='stop watching it'>&times;</button></div>";}).join('');
+h+=ns.length?"<div class='row' style='margin-top:8px'><span class='fl' style='margin-left:0;flex:1'>New &middot; "+ns.length+"</span><button class='ghost' id='wclear' title='clear this list (Symbiot still remembers what it has seen)'>Clear</button></div>"+ns.slice(0,20).map(function(n,i){return "<div class='task' data-i='"+i+"'><span class='t'>"+esc(n.text)+" <span class='muted' style='font-size:12px'>"+esc(n.name)+" &middot; "+agoTxt(n.ts)+"</span></span>"+(n.href?"<button class='ghost wopen' title='open it in your browser'>Open</button>":"")+"</div>";}).join('')
+:"<div class='muted' style='font-size:12px;margin-top:6px'>Nothing new yet. New rows show up here, and as a notification. Your agent reads them with <b>symbiot watch new</b>.</div>";
+box.innerHTML=h;
+box.querySelectorAll('.wevery').forEach(function(sel){sel.addEventListener('change',function(){var w=ws[+sel.closest('.task').getAttribute('data-i')];api('/api/watch/every',{id:w.id,every:+sel.value}).then(loadWatchUI);});});
+box.querySelectorAll('.wrm').forEach(function(b){b.addEventListener('click',function(){var w=ws[+b.closest('.task').getAttribute('data-i')];if(typeof confirm==='function'&&!confirm('Stop watching '+w.name+'? What it found goes too.'))return;api('/api/watch/remove',{id:w.id}).then(function(){api('/api/watch').then(function(d){if(d&&d.watches)WATCH=d;renderWatch();renderScreen();});});});});
+box.querySelectorAll('.wcheck').forEach(function(b){b.addEventListener('click',function(){var w=ws[+b.closest('.task').getAttribute('data-i')];b.disabled=true;b.textContent='Reading…';
+api('/api/watch/check',{id:w.id}).then(function(x){b.disabled=false;b.textContent='Check now';if(!x||x.error){screenErr((x&&x.error)||'failed');loadWatchUI();return;}var m=x.busy?"The hidden browser is busy with a map, press or type. It reads "+esc(w.name)+" once that's done.":x.learned!=null?"Read "+esc(x.name)+": learned the "+x.learned+" things listed there now. From here on, anything new is noted.":x["new"]&&x["new"].length?"&#10003; "+x["new"].length+" new on "+esc(x.name)+".":"Read "+esc(x.name)+": nothing new.";
+$('screenmsg').innerHTML="<div class='note "+(x["new"]&&x["new"].length?"ok":"muted")+"'>"+m+"</div>";loadWatchUI();}).catch(function(e){b.disabled=false;b.textContent='Check now';screenErr(String((e&&e.message)||e));});});});
+box.querySelectorAll('.wopen').forEach(function(b){b.addEventListener('click',function(){var n=ns[+b.closest('.task').getAttribute('data-i')];if(n&&/^https?:/.test(n.href))window.open(n.href,'_blank','noopener');});});
+var wc=$('wclear');if(wc)wc.addEventListener('click',function(){api('/api/watch/clear',{}).then(loadWatchUI);});}
 // A web page, mapped by itself in the hidden browser (headless.mjs): no capture,
 // no dragging. It takes a few seconds, so the button says so meanwhile.
 function mapUI(site,b){site=(site||'').trim();if(!site){screenErr('Type a site to map first: gmail, github.com/pulls or a web address.');return;}b.disabled=true;
@@ -835,5 +861,5 @@ function appBar(p){var b=$('appbar');if(!b||!p.termux||window.SymbiotAndroid||ty
 function doUpdate(){updBusy=true;try{localStorage.setItem('symbiot_update_tried',document.getElementById('ver').textContent.replace(/^v/,''));}catch(e){}var b=ubar();b.className='updatebar show';b.textContent='Updating & restarting… this page will reload itself when it is back.';api('/api/update',{});}
 setInterval(heartbeat,4000);heartbeat(true);
 window.addEventListener('focus',function(){heartbeat(true);}); // re-check for updates when you come back to the window
-initGraphEvents();syncP();refresh();loadMap();loadAgentCfg();loadScanRoots();loadPhone();loadTrusted();loadMail();loadScreensUI();loadMonitorsUI();loadDesktop();
+initGraphEvents();syncP();refresh();loadMap();loadAgentCfg();loadScanRoots();loadPhone();loadTrusted();loadMail();loadScreensUI();loadMonitorsUI();loadDesktop();loadWatchUI();setInterval(loadWatchUI,60000);
 </script></body></html>`;

package/watch.mjs

@@ -0,0 +1,160 @@
+// symbiot — Watch: keep track of a mapped web page (your Gmail inbox, GitHub's
+// notifications) while the app runs. Every few minutes Symbiot reads the page
+// again in its hidden browser (headless.mjs readPage: no screenshot, nothing
+// pressed or typed) and compares what's listed there with what it has seen
+// before. What's new is kept, newest first, and you get a notification. The
+// first read only learns what's there, so it never announces your whole inbox.
+// An agent reads what's new with `symbiot watch new`, and can act on it with
+// `symbiot screens press` / `type`.
+//
+// Stored in ~/.config/symbiot/watch.json, readable by you only:
+// { watches: [{ id, name, url, every (minutes), added, last, checked?, error?, seen: [key…] }],
+//   news: [{ id, watch, name, ts, text, href? }] }
+// `last` is when it was last read, `checked` when a read last worked; `seen`
+// holds what's been listed, as itemKey()s.
+import { join } from "node:path";
+import { readFileSync, writeFileSync, mkdirSync, chmodSync } from "node:fs";
+import { randomBytes } from "node:crypto";
+import { CONFIG_DIR } from "./core.mjs";
+import { readPage, siteUrl } from "./headless.mjs";
+import { loadScreens } from "./screens.mjs";
+import { desktopNotify } from "./desktop.mjs";
+
+const WATCH_FILE = join(CONFIG_DIR, "watch.json");
+const EVERY = [5, 15, 30, 60]; // minutes between reads
+const MAX_WATCHES = 12, MAX_SEEN = 1000, MAX_NEWS = 200, MAX_PER_READ = 25;
+
+function loadWatch() {
+  try { const d = JSON.parse(readFileSync(WATCH_FILE, "utf8")); return { watches: Array.isArray(d.watches) ? d.watches : [], news: Array.isArray(d.news) ? d.news : [] }; }
+  catch { return { watches: [], news: [] }; }
+}
+// What's new can be your mail's senders and subjects, so it's yours only (0600).
+function saveWatch(d) {
+  try { mkdirSync(CONFIG_DIR, { recursive: true }); writeFileSync(WATCH_FILE, JSON.stringify(d, null, 2), { mode: 0o600 }); try { chmodSync(WATCH_FILE, 0o600); } catch {} return true; }
+  catch { return false; }
+}
+const hostOf = (url) => { try { return new URL(url).hostname.replace(/^www\./, ""); } catch { return ""; } };
+const everyOf = (v, def) => (EVERY.includes(Number(v)) ? Number(v) : def);
+
+// ---- what's on the page, and what's new ----------------------------------------
+// What a page lists: its rows (an inbox, a table of notifications), else its
+// links. Each { text, href? }, the whole text of a long row (headless.mjs keeps it).
+const tidy = (s) => String(s || "").replace(/^\s*unread\s*,?\s*/i, "").replace(/\s+/g, " ").trim();
+function itemsOf(page) {
+  const all = (page && page.items) || [], rows = all.filter((r) => r.kind === "row");
+  return (rows.length ? rows : all.filter((r) => r.kind === "link"))
+    .filter((r) => r.label && r.label !== r.kind)
+    .map((r) => ({ text: tidy(r.text || r.label), ...(r.href ? { href: r.href } : {}) }))
+    .filter((x) => x.text.length > 2);
+}
+// The same item from one read to the next, though its time reads differently
+// ("9:05 AM" today, "Oct 5" tomorrow, "2 hours ago") or it's been read or starred.
+const MONTH = "(?:jan(?:uary)?|feb(?:ruary)?|mar(?:ch)?|apr(?:il)?|may|june?|july?|aug(?:ust)?|sep(?:t(?:ember)?)?|oct(?:ober)?|nov(?:ember)?|dec(?:ember)?)\\.?";
+const WHEN = [
+  /\b\d{1,2}:\d{2}(?::\d{2})?(?:\s*[ap]\.?m\b\.?)?/gi,                                     // 9:05 AM, 08:24
+  new RegExp(`\\b${MONTH}\\s+\\d{1,2}\\b(?:,?\\s+\\d{4}\\b)?`, "gi"),                         // Oct 5, Oct 5, 2026
+  new RegExp(`\\b\\d{1,2}\\s+${MONTH}(?=\\W|$)(?:\\s+\\d{4}\\b)?`, "gi"),                      // 5 Oct
+  /\b\d{1,4}[/-]\d{1,2}[/-]\d{1,4}\b/g,                                                      // 10/5/26, 2026-10-05
+  /\b(?:\d+|an?)\s+(?:seconds?|secs?|minutes?|mins?|hours?|hrs?|days?|weeks?|months?|years?)\s+ago\b/gi,
+  /\b(?:just now|yesterday|today)\b/gi,
+  /\b(?:unread|not starred|starred)\b/gi,
+];
+function itemKey(text) {
+  let s = String(text || "").toLowerCase();
+  for (const re of WHEN) s = s.replace(re, " ");
+  return s.replace(/[\s,;·•|]+/g, " ").trim().slice(0, 240);
+}
+// The items not seen before, top first, and the keys of everything listed now.
+function newItems(seen, items) {
+  const known = new Set(seen), keys = new Set(), fresh = [];
+  for (const it of items) {
+    const k = itemKey(it.text); if (!k || keys.has(k)) continue;
+    keys.add(k); if (!known.has(k)) fresh.push(it);
+  }
+  return { fresh, keys: [...keys] };
+}
+// Remember what's listed now as the most recent, and forget the oldest.
+function remember(seen, keys) { const now = new Set(keys); return [...(seen || []).filter((k) => !now.has(k)), ...keys].slice(-MAX_SEEN); }
+
+// ---- watches -------------------------------------------------------------------
+const view = (w) => ({ id: w.id, name: w.name, url: w.url, every: w.every, added: w.added, last: w.last || 0, ...(w.checked ? { checked: w.checked } : {}), ...(w.error ? { error: w.error } : {}), known: (w.seen || []).length });
+function watchState() { const d = loadWatch(); return { watches: d.watches.map(view), news: d.news.slice(0, 50), every: EVERY }; }
+
+// Watch a mapped page (`screen`: its id) or a site (`site`). Watching the same
+// address again just changes how often.
+function addWatch({ screen, site, every, name } = {}) {
+  const s = screen ? loadScreens().find((x) => x.id === screen) : null;
+  if (screen && !s) return { error: `No screen ${screen}.` };
+  if (s && !s.page) return { error: "Watch reads a web page you mapped (Map page). A screenshot of your screen can't be read again by itself." };
+  const url = s ? s.page.url : siteUrl(site);
+  if (!url) return { error: "Give a mapped page or a site to watch: gmail, github.com/notifications or a web address." };
+  const d = loadWatch(), had = d.watches.find((w) => w.url === url);
+  if (had) { had.every = everyOf(every, had.every); return saveWatch(d) ? view(had) : { error: "Couldn't write " + WATCH_FILE + "." }; }
+  if (d.watches.length >= MAX_WATCHES) return { error: `You're watching ${MAX_WATCHES} pages already. Stop watching one first.` };
+  const w = { id: randomBytes(4).toString("hex"), name: String(name || (s && s.name) || hostOf(url)).trim().slice(0, 80) || hostOf(url), url, every: everyOf(every, 15), added: Date.now(), last: 0, seen: [] };
+  d.watches.push(w);
+  return saveWatch(d) ? view(w) : { error: "Couldn't write " + WATCH_FILE + "." };
+}
+function setEvery(id, every) {
+  const d = loadWatch(), w = d.watches.find((x) => x.id === id); if (!w) return { error: `No watch ${id}.` };
+  if (!EVERY.includes(Number(every))) return { error: `Every ${EVERY.join(", ")} minutes.` };
+  w.every = Number(every); saveWatch(d); return view(w);
+}
+// Stop watching, and forget what it found.
+function removeWatch(id) {
+  const d = loadWatch(); if (!d.watches.some((x) => x.id === id)) return { error: `No watch ${id}.` };
+  d.watches = d.watches.filter((x) => x.id !== id); d.news = d.news.filter((n) => n.watch !== id);
+  saveWatch(d); return { ok: true };
+}
+function clearNews() { const d = loadWatch(); d.news = []; saveWatch(d); return { ok: true }; }
+// What's new in the last `hours`, newest first (what an agent reads).
+function newsSince(hours = 24, now = Date.now()) { return loadWatch().news.filter((n) => n.ts >= now - hours * 3600000); }
+
+// Read a watched page now and note what's new. `read` and `notify` are
+// headless.mjs's readPage and a desktop notification (the tests pass their own).
+// Gives the watch, plus `new` (what was new) or `learned` (the first read), or
+// `busy` when the hidden browser is in use (nothing changes: it's read later).
+async function checkWatch(id, { read = readPage, notify = desktopNotify } = {}) {
+  const w0 = loadWatch().watches.find((x) => x.id === id); if (!w0) return { error: `No watch ${id}.` };
+  const page = (await read(w0.url)) || { error: "Nothing came back from the page." };
+  if (page.busy) return { ...view(w0), busy: true };
+  // read again: the file may have changed while the page loaded
+  const d = loadWatch(), w = d.watches.find((x) => x.id === id); if (!w) return { error: "That watch was removed." };
+  w.last = Date.now();
+  const items = page.error || page.login ? [] : itemsOf(page), before = w.error || "";
+  if (page.login) w.error = `Signed out of ${hostOf(page.url) || hostOf(w.url)}. Under Screens, type ${hostOf(w.url)} and click Sign in, sign in once and close the window.`;
+  else if (page.error) w.error = page.error;
+  else if (!items.length) w.error = "Found nothing listed on the page this time.";
+  if (page.error || page.login || !items.length) {
+    saveWatch(d);
+    // signed out needs you; the rest (the browser busy with Sign in, a slow page) usually passes by itself
+    if (page.login && w.error !== before) notify("Symbiot", `${w.name}: ${w.error}`);
+    return view(w);
+  }
+  delete w.error;
+  const first = !w.checked, { fresh, keys } = newItems(w.seen, items);
+  w.seen = remember(w.seen, keys); w.checked = w.last;
+  const news = first ? [] : fresh.slice(0, MAX_PER_READ).map((it) => ({ id: randomBytes(4).toString("hex"), watch: w.id, name: w.name, ts: w.last, text: it.text.slice(0, 300), ...(it.href ? { href: it.href } : {}) }));
+  d.news = [...news, ...d.news].slice(0, MAX_NEWS);
+  saveWatch(d);
+  if (news.length) notify(`${news.length} new · ${w.name.slice(0, 50)}`, news.slice(0, 3).map((n) => n.text.slice(0, 90)).join("\n") + (news.length > 3 ? `\n…and ${news.length - 3} more in Symbiot` : ""));
+  return { ...view(w), ...(first ? { learned: keys.length } : { new: news }) };
+}
+// The watches that are due, longest-waiting first.
+function dueWatches(now = Date.now()) { return loadWatch().watches.filter((w) => now - (w.last || 0) >= w.every * 60000).sort((a, b) => (a.last || 0) - (b.last || 0)); }
+
+// While the app runs: once a minute, read the watches that are due, one at a
+// time. Returns a stop function.
+function startWatches(opts = {}) {
+  let busy = false;
+  const tick = async () => {
+    if (busy) return; busy = true;
+    try { for (const w of dueWatches()) { const r = await checkWatch(w.id, opts); if (r && r.busy) break; } }
+    catch {} finally { busy = false; }
+  };
+  const first = setTimeout(tick, 20000), every = setInterval(tick, 60 * 1000);
+  first.unref(); every.unref();
+  return () => { clearTimeout(first); clearInterval(every); };
+}
+
+export { WATCH_FILE, EVERY, itemsOf, itemKey, newItems, remember, watchState, addWatch, setEvery, removeWatch, clearNews, newsSince, checkWatch, dueWatches, startWatches };