mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-10-12 19:37:23 +00:00
Part E of #2128: a logged-in user watches nodes and gets one mail when a watched node goes offline, comes back, or reports a low battery. Admins can add instance events: a new foreign node, and an observer going offline or back. This covers the per-user mail part of #775. Stacked on #2139 (part D, which builds on #2138). Review the commits after that branch. ## The situation A sysop learns that a repeater went silent, or that its battery is running down, only by opening CoreScope. #775 asks for notifications. Accounts (part A) now give a verified address to mail and a mailer with delivery status. ## What this PR adds **Events.** They use the instance thresholds, so a mail does not disagree with the node page: - `node.offline`: silent for the role's `healthThresholds` window. Last heard comes from the packet store, and repeaters and rooms count relayed traffic (#1598). - `node.battery`: advert telemetry below `batteryThresholds.lowMv`, recovered at `lowMv + 100`. - Admins only: `foreign.new` (once per node) and `observer.offline`. **Store.** Schema v5 with `notification_prefs`, `notification_watches` and `notification_state`. **Server** (only with `userManagement.notifications.enabled`) - A notifier next to the janitor, every `intervalMinutes` (5). The evaluator is a pure function of watches, prefs, stored states and node snapshots. - No burst after a restart or a new watch: a subject's first evaluation stores its state without mailing. The loop waits for the startup load. While ingest is stale (newest packet older than 30 minutes) the offline checks pause, and after recovery they wait one silent window. - One mail per user per check. Limits: 20 per user and 100 per instance per rolling 24 hours, 50 watches per user. A change over a limit is recorded and never mailed later. - Every mail has a one-click unsubscribe (`List-Unsubscribe` and `List-Unsubscribe-Post`). The GET only redirects to a confirm page, so link scanners cannot unsubscribe anyone. Node names are cleaned of control and bidi characters before they go into a mail. - Routes: `GET`/`PUT /api/account/notifications`, `PUT`/`DELETE /api/account/notifications/watches/{pubkey}`, `POST /api/account/notifications/watch-my-nodes` (copies the synced "my nodes" list), `GET`/`POST /api/notifications/unsubscribe`. `mailer.Message` gains `Headers`. **Frontend.** A "Notify me" toggle on the node pages, a Notifications section on the account page (`#/account?section=notifications`), an unsubscribe page, and the notification mail count on the admin overview. Spec: [`docs/specs/2026-10-07-node-notifications-design.md`](https://github.com/efiten/CoreScope/blob/feat/notifications/docs/specs/2026-10-07-node-notifications-design.md). ## Performance Each check reads watches, prefs and states from `users.db` (one query each), the watched nodes from the analyzer DB in chunks of 500, and last-heard times from the packet store. | Measurement | Result | |---|---| | One check on our staging instance, 130,000 packets in memory, 1 watcher | 6.9 ms, of which 0.93 ms holding the store read lock | | Evaluator benchmark, 100 users with 50 watches each, 2,000 nodes | 1.75 ms | No work is added to ingest, broadcast or any request path. ## Verification - `internal/users` and `internal/mailer` with `-race`; the `cmd/server` suite plus `-race` on the notifier tests; 74 new Go tests. The same Windows-only failure as noted in #2138 applies. - `sh test-all.sh` exits 0; the XSS gate in diff mode passes. - User-management E2E: 26 of 26 steps locally. With notifications off the new steps fail, so they do test the flag. - On our staging and production instance since 7 October 2026. ## Not in this PR - Other channels (Discord, Telegram, webhooks). Detection is separate from delivery, so one can be added. - The topology, RF and anomaly alerts of #775. - If the whole server starts after a feed outage that already ended, the grace window is unknown and a watcher can get one wrong offline mail. The user guide says so. --------- Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
109 lines
8.7 KiB
CSS
109 lines
8.7 KiB
CSS
/* Optional user management: header control, account pages, admin table. */
|
|
.nav-account-wrap { position: relative; }
|
|
.nav-account-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; min-width: 48px; padding: 6px 12px;
|
|
background: none; border: 1px solid var(--border); border-radius: 6px; color: var(--nav-text-muted); font: inherit; font-size: 14px;
|
|
text-decoration: none; cursor: pointer; touch-action: manipulation; transition: background .15s, color .15s; }
|
|
.nav-account-btn:hover { background: var(--nav-bg2); color: var(--nav-text); }
|
|
.nav-account-label { max-width: 12ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-sm); }
|
|
.nav-account-menu { position: fixed; right: 0; top: 100%; min-width: 160px; z-index: 1200;
|
|
background: var(--card-bg); border: 1px solid var(--border); border-radius: 8px; padding: 4px 0; }
|
|
.nav-account-menu[hidden] { display: none; }
|
|
.nav-account-menu a, .nav-account-menu button { display: flex; align-items: center; width: 100%; text-align: left; padding: 8px 14px; min-height: 48px;
|
|
color: var(--text); background: none; border: 0; font: inherit; text-decoration: none; cursor: pointer; box-sizing: border-box; }
|
|
.nav-account-menu a:hover, .nav-account-menu button:hover { background: var(--row-hover); }
|
|
|
|
.account-page { display: flex; justify-content: center; padding: var(--space-md); }
|
|
.account-card { width: 100%; max-width: 520px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px; padding: 20px; }
|
|
.account-card h2 { margin-top: 0; }
|
|
.account-card h3 { margin: 24px 0 8px; font-size: 1rem; }
|
|
.account-form { display: flex; flex-direction: column; gap: 12px; }
|
|
.account-field { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-sm); color: var(--text-muted); }
|
|
.account-field input { padding: 8px 10px; min-height: 48px; border: 1px solid var(--border); border-radius: 6px;
|
|
background: var(--input-bg); color: var(--text); font: inherit; box-sizing: border-box; }
|
|
/* The global .btn-primary is white on --accent (2.75:1), so account forms use
|
|
their own buttons: --text-on-accent on --accent-strong, as .tab-btn.active does. */
|
|
.account-btn { align-self: flex-start; min-height: 48px; padding: 8px 20px; border-radius: 6px; font: inherit; cursor: pointer; touch-action: manipulation; }
|
|
.account-btn-primary { background: var(--accent-strong); color: var(--text-on-accent); border: 1px solid var(--accent-strong); }
|
|
.account-btn-primary:hover { background: var(--palette-blue-700); }
|
|
.account-btn-secondary { background: var(--surface-1); color: var(--text); border: 1px solid var(--border); }
|
|
.account-btn-secondary:hover { background: var(--row-hover); }
|
|
.account-hint { font-size: var(--fs-sm); color: var(--text-muted); margin: 0; }
|
|
.account-msg { margin: 0; min-height: 1.2em; font-size: var(--fs-sm); }
|
|
.account-msg.ok { color: var(--status-green-text); }
|
|
.account-msg.err { color: var(--status-red-text); }
|
|
.account-links { font-size: var(--fs-sm); }
|
|
.account-links a { color: var(--link-color); }
|
|
.account-mail { text-align: center; padding: 32px 20px; }
|
|
.account-card.account-mail .account-mail-icon { display: block; width: 4.5rem; height: 4.5rem; font-size: 4.5rem; margin: 0 auto 12px; color: var(--accent-strong); }
|
|
.account-mail-title { margin: 0 0 12px; font-size: var(--fs-2xl); }
|
|
.account-mail-title:focus { outline: none; }
|
|
.account-mail-intro { font-size: var(--fs-lg); margin: 0 0 12px; }
|
|
.account-mail .account-links { font-size: var(--fs-md); }
|
|
.account-sessions { list-style: none; padding: 0; margin: 0; }
|
|
.account-sessions li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
|
|
|
|
.cs-auth-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 2000; opacity: 0; pointer-events: none;
|
|
background: var(--card-bg); color: var(--text); border: 1px solid var(--border); border-radius: 8px; padding: 10px 16px; transition: opacity .2s; }
|
|
.cs-auth-toast.visible { opacity: 1; }
|
|
|
|
.um-page { padding: var(--space-md); }
|
|
.um-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
|
|
.um-filters input, .um-filters select { padding: 6px 8px; min-height: 48px; border: 1px solid var(--border); border-radius: 6px; background: var(--input-bg); color: var(--text); box-sizing: border-box; }
|
|
.um-table-wrap { overflow-x: auto; }
|
|
.um-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
|
|
.um-table th, .um-table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--border); vertical-align: top; }
|
|
.um-table tr:hover td { background: var(--row-hover); }
|
|
.um-actions { display: flex; flex-wrap: wrap; gap: 4px; }
|
|
.um-actions button { min-height: 48px; padding: 4px 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-1); color: var(--text); cursor: pointer; touch-action: manipulation; }
|
|
.um-status, .um-chip { display: inline-block; padding: 1px 8px; border-radius: 10px; border: 1px solid var(--border); white-space: nowrap; }
|
|
.um-status-active, .um-chip-delivered, .um-chip-opened, .um-chip-clicked { color: var(--status-green-tint-text); }
|
|
.um-status-pending, .um-chip-sent, .um-chip-deferred, .um-chip-soft_bounce { color: var(--status-yellow-text); }
|
|
.um-status-disabled, .um-chip-hard_bounce, .um-chip-invalid_email, .um-chip-blocked, .um-chip-spam, .um-chip-error, .um-chip-bouncing { color: var(--status-red-text); }
|
|
.um-chip-unsubscribed { color: var(--text-muted); }
|
|
.um-status-approved { color: var(--status-green-tint-text); }
|
|
.um-status-rejected, .um-status-revoked { color: var(--status-red-text); }
|
|
.account-proposals { list-style: none; padding: 0; margin: 0; }
|
|
.account-proposals li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
|
|
.account-proposals li .account-hint { flex-basis: 100%; margin: 0; }
|
|
.um-detail { margin-top: 16px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
|
|
.um-detail ol { padding-left: 18px; }
|
|
@media (max-width: 760px) { .um-col-optional { display: none; } }
|
|
.account-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
|
|
a.account-btn { display: inline-flex; align-items: center; text-decoration: none; box-sizing: border-box; }
|
|
.um-detail-close { float: right; }
|
|
|
|
/* Compact controls on precise pointers; touch keeps the 48px targets above. */
|
|
@media (pointer: fine) {
|
|
.nav-account-btn { min-height: 36px; min-width: 36px; padding: 3px 10px; }
|
|
.nav-account-menu a, .nav-account-menu button { min-height: 36px; padding: 4px 14px; }
|
|
.account-field input { min-height: 36px; padding: 4px 10px; }
|
|
.account-btn { min-height: 36px; padding: 4px 16px; }
|
|
.um-filters input, .um-filters select { min-height: 36px; padding: 3px 8px; }
|
|
.um-actions button { min-height: 36px; padding: 2px 12px; }
|
|
}
|
|
|
|
/* Settings sync dialogs (settings-sync.js) on the shared .modal. */
|
|
.cs-dialog { display: flex; flex-direction: column; gap: 8px; color: var(--text); }
|
|
.cs-dialog h3 { margin: 0; }
|
|
.cs-dialog-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
|
|
|
|
/* Node notifications toggle (notifications.js) on the node side pane and full page. */
|
|
.node-notify-slot { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-left: 4px; }
|
|
.node-notify-slot:empty { display: none; }
|
|
.node-notify-btn { white-space: nowrap; }
|
|
/* Sized like the neighbouring buttons, which carry inline sizes in nodes.js
|
|
(side pane: Details/Analytics/Reach; full page: Copy URL/Reach). */
|
|
#nodeNotifySlot .node-notify-btn { font-size: 11px; padding: 2px 8px; }
|
|
#nodeNotifySlotFull { margin-left: 0; } /* the full page row spaces its buttons with gap */
|
|
#nodeNotifySlotFull .node-notify-btn { font-size: 12px; padding: 4px 10px; }
|
|
.node-notify-btn[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--status-green-text); }
|
|
.node-notify-hint { color: var(--text-muted); font-size: var(--fs-sm); }
|
|
.node-notify-hint:empty { display: none; }
|
|
|
|
/* Notifications section (notifications.js) on the account page. */
|
|
.account-check { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); }
|
|
.account-fieldset { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 8px 12px; border: 1px solid var(--border); border-radius: 6px; }
|
|
#notifyForm + h4 { margin-top: var(--space-lg); }
|
|
.account-watches { list-style: none; padding: 0; margin: 0 0 8px; }
|
|
.account-watches li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
|