From 1697a5d7c2128aa31943eaa68b0efabb78848218 Mon Sep 17 00:00:00 2001 From: boban Date: Thu, 25 Jun 2026 01:59:39 +0200 Subject: [PATCH] feat(metrics): persist the history-chart range in the URL MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Clicking a range now writes ?range= (replaceState — no history spam) and the chart restores it on init, so reloading the SAME page keeps the chosen range. Opening the page fresh (no param) still defaults to 24h. Co-Authored-By: Claude Opus 4.8 --- resources/js/app.js | 16 +++++++++++++++- 1 file changed, 15 insertions(+), 1 deletion(-) diff --git a/resources/js/app.js b/resources/js/app.js index df3b42b..0680086 100644 --- a/resources/js/app.js +++ b/resources/js/app.js @@ -261,13 +261,27 @@ document.addEventListener('alpine:init', () => { W: 1000, H: 260, + ranges: ['1h', '24h', '7d', '30d'], + init() { + // Restore the range from the URL (?range=) so a reload of the SAME page keeps the choice; + // opening the page fresh (no param) falls back to the 24h default. + const r = new URL(window.location.href).searchParams.get('range'); + if (this.ranges.includes(r)) this.range = r; this.reload(); this._timer = setInterval(() => this.reload(true), 60000); // keep it fresh }, destroy() { clearInterval(this._timer); }, - setRange(r) { if (r !== this.range) { this.range = r; this.reload(); } }, + setRange(r) { + if (r === this.range || ! this.ranges.includes(r)) return; + this.range = r; + // Reflect the choice in the URL (replace, not push — no history spam) so it survives a reload. + const url = new URL(window.location.href); + url.searchParams.set('range', r); + window.history.replaceState(window.history.state, '', url); + this.reload(); + }, reload(silent = false) { if (! silent) this.loading = true;