Add make dev target for running the dev server

Local CPE (192.168.100.1) is always monitored. On startup, probe
192.168.1.1, 192.168.0.1, 192.168.8.1, and 10.0.0.1 in parallel
and add whichever responds first as "Local Gateway".

.prettierrc

@@ -1,3 +1,4 @@
 {
-    "tabWidth": 4
+    "tabWidth": 4,
+    "proseWrap": "always"
 }

Makefile

@@ -1,4 +1,7 @@
-.PHONY: test lint fmt fmt-check check docker
+.PHONY: dev test lint fmt fmt-check check docker
+
+dev:
+	yarn dev
 
 test:
 	timeout 30 yarn build

README.md

@@ -1,4 +1,7 @@
-NetWatch is an MIT-licensed JavaScript single-page application by [@sneak](https://sneak.berlin) that provides real-time network latency monitoring to common internet hosts, displayed with color-coded figures and sparkline graphs, served from a static bucket or Docker container.
+NetWatch is an MIT-licensed JavaScript single-page application by
+[@sneak](https://sneak.berlin) that provides real-time network latency
+monitoring to common internet hosts, displayed with color-coded figures and
+sparkline graphs, served from a static bucket or Docker container.
 
 ## Getting Started
 
@@ -22,27 +25,48 @@ docker run -p 8080:8080 netwatch
 
 ## Rationale
 
-When debugging network issues, it's useful to have a persistent at-a-glance view of latency and reachability to multiple well-known internet endpoints. NetWatch provides this as a zero-dependency SPA that can be deployed anywhere static files are served, with no backend required.
+When debugging network issues, it's useful to have a persistent at-a-glance view
+of latency and reachability to multiple well-known internet endpoints. NetWatch
+provides this as a zero-dependency SPA that can be deployed anywhere static
+files are served, with no backend required.
 
 ## Design
 
-The application is a single-page app built with Vite and Tailwind CSS v4. All code lives in `src/main.js` with a class-based architecture:
+The application is a single-page app built with Vite and Tailwind CSS v4. All
+code lives in `src/main.js` with a class-based architecture:
 
-- **`CONFIG`**: Frozen configuration object (update interval, timeouts, axis ticks, etc.)
+- **`CONFIG`**: Frozen configuration object (update interval, timeouts, axis
-- **`HostState`**: Per-host state management — history buffer, latency tracking, status transitions
+  ticks, etc.)
-- **`AppState`**: Top-level state container — WAN hosts, local hosts, pause state, aggregate stats
+- **`HostState`**: Per-host state management — history buffer, latency tracking,
-- **`SparklineRenderer`**: Canvas 2D sparkline drawing with fixed axes, color-coded line segments, error regions, and DPR-aware scaling
+  status transitions
-- **UI functions**: `buildUI()` constructs the DOM, `updateHostRow()` / `updateSummary()` / `updateHealthBox()` handle incremental updates
+- **`AppState`**: Top-level state container — WAN hosts, local hosts, pause
-- **`tick()`**: Main loop — measures all hosts in parallel via `Promise.all`, pushes samples, redraws UI. When paused, pushes blank markers (no probes, no false outage)
+  state, aggregate stats
+- **`SparklineRenderer`**: Canvas 2D sparkline drawing with fixed axes,
+  color-coded line segments, error regions, and DPR-aware scaling
+- **UI functions**: `buildUI()` constructs the DOM, `updateHostRow()` /
+  `updateSummary()` / `updateHealthBox()` handle incremental updates
+- **`tick()`**: Main loop — measures all hosts in parallel via `Promise.all`,
+  pushes samples, redraws UI. When paused, pushes blank markers (no probes, no
+  false outage)
 
 ### Monitoring targets
 
-- **9 WAN hosts**: Google Cloud Console, AWS Console, GitHub, Cloudflare, Azure, DigitalOcean, Fastly, Akamai, datavi.be
+- **11 WAN hosts**: datavi.be, Anthropic API, OpenAI API, AWS, GCP, Azure,
-- **1 Local host**: Local Gateway (192.168.100.1), tracked separately from WAN stats
+  DigitalOcean, Cloudflare, Fastly, Akamai, GitHub
+- **Local CPE**: Cable modem at 192.168.100.1 (always monitored)
+- **Local Gateway**: Auto-detected on startup by probing common default gateway
+  addresses (192.168.1.1, 192.168.0.1, 192.168.8.1, 10.0.0.1); first responder
+  wins. Note: modern browsers enforce Private Network Access restrictions that
+  block public-origin pages from reaching RFC1918 addresses, so local targets
+  only work when NetWatch is served from localhost or a private address.
+
+Local hosts are tracked separately from WAN stats.
 
 ### Latency measurement
 
-HEAD requests with `mode: 'no-cors'` and `cache: 'no-store'`, timed with `performance.now()`. 1-second timeout; anything over 1000ms is clamped to unreachable. IPv4 only.
+HEAD requests with `mode: 'no-cors'` and `cache: 'no-store'`, timed with
+`performance.now()`. 1-second timeout; anything over 1000ms is clamped to
+unreachable. IPv4 only.
 
 ### Color coding
 
@@ -72,31 +96,40 @@ dist/
 - Summary stats: reachable count, min/max/avg latency across WAN hosts only
 - Fixed chart axes: Y-axis 0–1000ms, X-axis 0–300s
 - Color-coded latency figures and sparkline line segments
-- Play/pause: pause stops probes but history keeps scrolling (blank gaps, no false outage)
+- Play/pause: pause stops probes but history keeps scrolling (blank gaps, no
+  false outage)
 - Clickable service URLs
 - Canvas-based sparkline rendering with devicePixelRatio scaling
 - Zero runtime dependencies: all resources bundled into build artifacts
 
 ## Deployment
 
-After running `yarn build`, deploy the contents of the `dist/` directory to any static file host (S3, GCS, Cloudflare Pages, Vercel, Netlify, GitHub Pages) or use the Docker image behind a reverse proxy.
+After running `yarn build`, deploy the contents of the `dist/` directory to any
+static file host (S3, GCS, Cloudflare Pages, Vercel, Netlify, GitHub Pages) or
+use the Docker image behind a reverse proxy.
 
 The Docker image:
 
 - Listens on port 8080 by default (override with `PORT` env var)
-- Trusts `X-Forwarded-For` from RFC1918 reverse proxies (10/8, 172.16/12, 192.168/16)
+- Trusts `X-Forwarded-For` from RFC1918 reverse proxies (10/8, 172.16/12,
+  192.168/16)
 - Sends access logs to stdout
 - Caches static assets with immutable headers
 
 ## Browser Compatibility
 
-Requires a modern browser with ES modules, Fetch API, Canvas API, and CSS custom properties.
+Requires a modern browser with ES modules, Fetch API, Canvas API, and CSS custom
+properties.
 
 ## Limitations
 
-- **CORS**: Some hosts may block cross-origin HEAD requests. The app uses `no-cors` mode which allows the request but provides opaque responses. Latency is still measurable based on request timing.
+- **CORS**: Some hosts may block cross-origin HEAD requests. The app uses
-- **Local gateway**: The 192.168.100.1 endpoint requires the host to be accessible from your network.
+  `no-cors` mode which allows the request but provides opaque responses. Latency
-- **Network conditions**: Measurements reflect browser-to-endpoint latency, which includes your local network, ISP, and internet routing.
+  is still measurable based on request timing.
+- **Local gateway**: The 192.168.100.1 endpoint requires the host to be
+  accessible from your network.
+- **Network conditions**: Measurements reflect browser-to-endpoint latency,
+  which includes your local network, ISP, and internet routing.
 
 ## TODO
 

REPO_POLICIES.md

@@ -1,23 +1,22 @@
 # Development Policies
 
-- Docker image references by tag are server-mutable, therefore using them is
+- Docker image references by tag are server-mutable, therefore using them is an
-  an RCE vulnerability. All docker image references must use cryptographic
+  RCE vulnerability. All docker image references must use cryptographic hashes
-  hashes to securely specify the exact image that is expected.
+  to securely specify the exact image that is expected.
 
-- Correspondingly, `go install` commands using things like '@latest' are
+- Correspondingly, `go install` commands using things like '@latest' are also
-  also dangerous RCE. Whenever writing scripts or tools, ALWAYS specify go
+  dangerous RCE. Whenever writing scripts or tools, ALWAYS specify go install
-  install targets using commit hashes which are cryptographically secure.
+  targets using commit hashes which are cryptographically secure.
 
-- Every repo with software in it must have a Makefile in the root. Each
+- Every repo with software in it must have a Makefile in the root. Each such
-  such Makefile should support `make test` (runs the project-specific
+  Makefile should support `make test` (runs the project-specific tests),
-  tests), `make lint`, `make fmt` (writes), `make fmt-check` (readonly), and
+  `make lint`, `make fmt` (writes), `make fmt-check` (readonly), and
-  `make check` (has `test`, `lint`, and `fmt-check` as prereqs), `make
+  `make check` (has `test`, `lint`, and `fmt-check` as prereqs), `make docker`
-docker` (builds docker image).
+  (builds docker image).
 
-- Every repo should have a Dockerfile. If the repo contains non-server
+- Every repo should have a Dockerfile. If the repo contains non-server software,
-  software, the Dockerfile should bring up a development environment and
+  the Dockerfile should bring up a development environment and `make check`
-  `make check` (i.e. the docker build should fail if the branch is not
+  (i.e. the docker build should fail if the branch is not green).
-  green).
 
 - Platform-specific standard formatting should be used. `black` for python,
   `prettier` for js/css/etc, `go fmt` for go. The only changes to default
@@ -25,27 +24,27 @@ docker` (builds docker image).
   everything except `go fmt`).
 
 - If local testing is possible (it is not always), `make check` should be a
-  pre-commit hook. If it is not possible, `make lint && make fmt-check`
+  pre-commit hook. If it is not possible, `make lint && make fmt-check` should
-  should be a pre-commit hook.
+  be a pre-commit hook.
 
-- If a working `make test` takes more than 20 seconds, that's a bug that
+- If a working `make test` takes more than 20 seconds, that's a bug that needs
-  needs fixing. In fact, there should be a timeout specified in the
+  fixing. In fact, there should be a timeout specified in the `Makefile` that
-  `Makefile` that fails it automatically if it takes >30s.
+  fails it automatically if it takes >30s.
 
 - Docker builds should time out in 5 minutes or less.
 
 - `main` must always pass `make check`, no exceptions.
 
-- Do all changes on a feature branch. You can do whatever you want on a
+- Do all changes on a feature branch. You can do whatever you want on a feature
-  feature branch.
+  branch.
 
 - We have a standardized `.golangci.yml` which we reuse and is _NEVER_ to be
   modified by an agent, only manually by the user. It can be copied from
   `~/dev/upaas/.golangci.yml` if it exists at that location.
 
 - When specifying images or packages by hash in Dockerfiles or
-  `docker-compose.yml`, put a comment above the line and show the version
+  `docker-compose.yml`, put a comment above the line and show the version and
-  and date at which it was current.
+  date at which it was current.
 
 - For javascript, always use `yarn` over `npm`.
 
@@ -54,11 +53,11 @@ docker` (builds docker image).
 - Simple projects should be configured with environment variables, as is
   standard for Dockerized applications.
 
-- Dockerized web services should listen on the default HTTP port of 8080
+- Dockerized web services should listen on the default HTTP port of 8080 unless
-  unless overridden with the `PORT` environment variable.
+  overridden with the `PORT` environment variable.
 
-- The `README.md` is a project's primary documentation. It should contain
+- The `README.md` is a project's primary documentation. It should contain at a
-  at a minimum the following sections:
+  minimum the following sections:
     - Description
         - Include a short and complete description of the functionality and
           purpose of the software as the first line in the readme. It must
@@ -68,10 +67,10 @@ docker` (builds docker image).
             - the category (web server, SPA, command line tool, etc)
             - the license
             - the author
-            - eg: "µPaaS is an MIT-licensed Go web application by @sneak
+            - eg: "µPaaS is an MIT-licensed Go web application by @sneak that
-              that receives git-frontend webhooks and interacts with a
+              receives git-frontend webhooks and interacts with a Docker server
-              Docker server to build and deploy applications in realtime as
+              to build and deploy applications in realtime as certain branches
-              certain branches are updated."
+              are updated."
     - Getting Started
         - a code block with copy-pasteable installation/use sections
     - Rationale
@@ -79,28 +78,27 @@ docker` (builds docker image).
     - Design
         - how is the program structured?
     - TODO
-        - This is your TODO list for the project - update it meticulously,
+        - This is your TODO list for the project - update it meticulously, even
-          even in between commits. Whenever planning, put your todo list in
+          in between commits. Whenever planning, put your todo list in the
-          the README so that a separate agent with new context can pick up
+          README so that a separate agent with new context can pick up where you
-          where you left off.
+          left off.
     - License
-        - GPL or MIT or WTFPL - ask the user when beginning a new project
+        - GPL or MIT or WTFPL - ask the user when beginning a new project and
-          and include a LICENSE file in the root and in a section in the
+          include a LICENSE file in the root and in a section in the README.
-          README.
     - Author
         - @sneak (link `@sneak` to `https://sneak.berlin`).
 
-- When beginning a new project, initialize a git repo and make the first
+- When beginning a new project, initialize a git repo and make the first commit
-  commit simply the first version of the README.md in the root of the repo.
+  simply the first version of the README.md in the root of the repo.
 
-- For Go packages, the module root is `sneak.berlin/go/...`, such
+- For Go packages, the module root is `sneak.berlin/go/...`, such as
-  as `sneak.berlin/go/dnswatcher`.
+  `sneak.berlin/go/dnswatcher`.
 
 - We use SemVer always.
 
 - If no tag `1.0.0` or greater exists in the repository, modify the existing
-  migrations and assume no installed base or existing databases. If
+  migrations and assume no installed base or existing databases. If `>=1.0.0`,
-  `>=1.0.0`, database changes add new migration files.
+  database changes add new migration files.
 
 - New repos must have at a minimum the following files:
     - `README.md`, `.git`, `.gitignore`

src/main.js

@@ -2,6 +2,9 @@ import "./styles.css";
 
 // --- Configuration -----------------------------------------------------------
 
+// Timing, axis labels, and display constants. Latency above maxLatency is
+// clamped to "unreachable". The history buffer holds maxHistoryPoints
+// samples (historyDuration / updateInterval).
 const CONFIG = Object.freeze({
     updateInterval: 2000,
     historyDuration: 300,
@@ -15,19 +18,72 @@ const CONFIG = Object.freeze({
     },
 });
 
+// WAN endpoints to monitor. These are used for the aggregate health/stats
+// display (min/max/avg). Ordered: personal, LLM APIs, big-3 cloud, then
+// CDN/hosting/other.
 const WAN_HOSTS = [
-    { name: "Google Cloud Console", url: "https://console.cloud.google.com" },
+    { name: "datavi.be", url: "https://datavi.be" },
+    { name: "Anthropic API", url: "https://api.anthropic.com" },
+    { name: "OpenAI API", url: "https://api.openai.com" },
     { name: "AWS Console", url: "https://console.aws.amazon.com" },
-    { name: "GitHub", url: "https://github.com" },
+    { name: "Google Cloud Console", url: "https://console.cloud.google.com" },
-    { name: "Cloudflare", url: "https://www.cloudflare.com" },
     { name: "Microsoft Azure", url: "https://portal.azure.com" },
     { name: "DigitalOcean", url: "https://www.digitalocean.com" },
+    { name: "Cloudflare", url: "https://www.cloudflare.com" },
     { name: "Fastly CDN", url: "https://www.fastly.com" },
     { name: "Akamai", url: "https://www.akamai.com" },
-    { name: "datavi.be", url: "https://datavi.be" },
+    { name: "GitHub", url: "https://github.com" },
 ];
 
-const LOCAL_HOSTS = [{ name: "Local Gateway", url: "http://192.168.100.1" }];
+// The cable modem / CPE upstream of the local gateway — always monitored.
+const LOCAL_CPE = { name: "Local CPE", url: "http://192.168.100.1" };
+
+// Common default gateway addresses. On startup we probe each one and use
+// whichever responds first as the "Local Gateway" monitor target.
+//
+// NOTE: Modern browsers enforce Private Network Access (PNA) restrictions
+// that block pages served from public origins from making requests to
+// RFC1918 addresses. These local targets will likely only work when
+// NetWatch is served from localhost or another private address.
+const GATEWAY_CANDIDATES = [
+    "http://192.168.1.1",
+    "http://192.168.0.1",
+    "http://192.168.8.1",
+    "http://10.0.0.1",
+];
+
+// --- Gateway Detection -------------------------------------------------------
+
+// Probe each gateway candidate with a short timeout. Returns the first one
+// that responds, or null if none do. We race them all in parallel and take
+// whichever wins.
+async function detectGateway() {
+    try {
+        const result = await Promise.any(
+            GATEWAY_CANDIDATES.map(async (url) => {
+                const controller = new AbortController();
+                const timeoutId = setTimeout(() => controller.abort(), 1500);
+                try {
+                    await fetch(url, {
+                        method: "HEAD",
+                        mode: "no-cors",
+                        cache: "no-store",
+                        signal: controller.signal,
+                    });
+                    clearTimeout(timeoutId);
+                    return { name: "Local Gateway", url };
+                } catch {
+                    clearTimeout(timeoutId);
+                    throw new Error("no response");
+                }
+            }),
+        );
+        return result;
+    } catch {
+        // All candidates failed
+        return null;
+    }
+}
 
 // --- App State ---------------------------------------------------------------
 
@@ -73,9 +129,9 @@ class HostState {
 }
 
 class AppState {
-    constructor() {
+    constructor(localHosts) {
         this.wan = WAN_HOSTS.map((h) => new HostState(h));
-        this.local = LOCAL_HOSTS.map((h) => new HostState(h));
+        this.local = localHosts.map((h) => new HostState(h));
         this.paused = false;
     }
 
@@ -541,8 +597,13 @@ function handleResize(state) {
 
 // --- Bootstrap ---------------------------------------------------------------
 
-function init() {
+async function init() {
-    const state = new AppState();
+    // Probe common gateway IPs to find the local router
+    const gateway = await detectGateway();
+    const localHosts = [LOCAL_CPE];
+    if (gateway) localHosts.push(gateway);
+
+    const state = new AppState(localHosts);
     buildUI(state);
 
     document