fix: defer auto refresh while editing

This commit is contained in:
Андрей Бобырев
2026-06-07 01:40:50 +03:00
parent dfa2703e61
commit c6b1e9a080
2 changed files with 34 additions and 6 deletions

View File

@@ -538,6 +538,7 @@ const state = {
qrLink: "", qrLink: "",
pendingUsers: new Set(), pendingUsers: new Set(),
refreshingAll: false, refreshingAll: false,
deferredRefresh: false,
autoRefreshEnabled: localStorage.getItem("pcatelegram_web-auto-refresh") !== "0", autoRefreshEnabled: localStorage.getItem("pcatelegram_web-auto-refresh") !== "0",
}; };
@@ -616,7 +617,7 @@ function syncAutoRefreshTimer() {
} }
if (!state.autoRefreshEnabled) return; if (!state.autoRefreshEnabled) return;
autoRefreshTimer = setInterval(() => { autoRefreshTimer = setInterval(() => {
refreshAll().catch((err) => toast(err.message)); refreshAll({ background: true }).catch((err) => toast(err.message));
}, AUTO_REFRESH_MS); }, AUTO_REFRESH_MS);
} }
@@ -627,6 +628,22 @@ function setAutoRefresh(enabled) {
syncAutoRefreshTimer(); syncAutoRefreshTimer();
} }
function activeEditable() {
const el = document.activeElement;
if (!el || el === document.body) return null;
return el.closest?.("input, select, textarea, [contenteditable='true']");
}
function isUserEditing() {
return Boolean(activeEditable());
}
function runDeferredRefresh() {
if (!state.deferredRefresh || isUserEditing()) return;
state.deferredRefresh = false;
refreshAll({ background: true }).catch((err) => toast(err.message));
}
async function api(path, options = {}) { async function api(path, options = {}) {
const headers = { const headers = {
"Accept": "application/json", "Accept": "application/json",
@@ -1516,11 +1533,15 @@ function renderRoutingSettings(payload = null) {
setRoutingNotes(routing); setRoutingNotes(routing);
} }
async function refreshAll() { async function refreshAll(options = {}) {
if (options.background && isUserEditing()) {
state.deferredRefresh = true;
return;
}
if (state.refreshingAll) return; if (state.refreshingAll) return;
state.refreshingAll = true; state.refreshingAll = true;
const btn = $("#refreshBtn"); const btn = $("#refreshBtn");
btn.disabled = true; if (!options.background) btn.disabled = true;
try { try {
state.overview = await api("/api/overview"); state.overview = await api("/api/overview");
state.backupSchedule = state.overview.backup_schedule || state.backupSchedule; state.backupSchedule = state.overview.backup_schedule || state.backupSchedule;
@@ -1543,6 +1564,10 @@ async function refreshAll() {
status: state.overview.stats_status || state.stats.status || {}, status: state.overview.stats_status || state.stats.status || {},
}; };
} }
if (options.background && isUserEditing()) {
state.deferredRefresh = true;
return;
}
renderOverview(); renderOverview();
renderUsers(); renderUsers();
renderRoutingSettings(); renderRoutingSettings();
@@ -1556,7 +1581,7 @@ async function refreshAll() {
} catch (err) { } catch (err) {
toast(err.message); toast(err.message);
} finally { } finally {
btn.disabled = false; if (!options.background) btn.disabled = false;
state.refreshingAll = false; state.refreshingAll = false;
updateAutoRefreshToggle(); updateAutoRefreshToggle();
} }
@@ -2041,6 +2066,9 @@ $("#routingPort").addEventListener("change", (eventObj) => checkRoutingPort(even
$("#warpSettingsForm").addEventListener("submit", saveWarpSettings); $("#warpSettingsForm").addEventListener("submit", saveWarpSettings);
$("#warpScope").addEventListener("change", renderWarpSettings); $("#warpScope").addEventListener("change", renderWarpSettings);
$("#warpUserSelect").addEventListener("change", renderWarpSettings); $("#warpUserSelect").addEventListener("change", renderWarpSettings);
document.addEventListener("focusout", () => {
setTimeout(runDeferredRefresh, 120);
});
window.addEventListener("hashchange", () => setPage((location.hash || "#dashboard").slice(1), false)); window.addEventListener("hashchange", () => setPage((location.hash || "#dashboard").slice(1), false));
setPage((location.hash || "#dashboard").slice(1), false); setPage((location.hash || "#dashboard").slice(1), false);

View File

@@ -11,7 +11,7 @@
document.documentElement.dataset.theme = theme; document.documentElement.dataset.theme = theme;
}()); }());
</script> </script>
<link rel="stylesheet" href="/styles.css?v=2.5.0-admin27"> <link rel="stylesheet" href="/styles.css?v=2.5.0-admin28">
</head> </head>
<body> <body>
<div class="app-shell"> <div class="app-shell">
@@ -482,6 +482,6 @@
<button id="qrCopyBtn" type="button" class="soft" data-i18n="copyLink">Copy link</button> <button id="qrCopyBtn" type="button" class="soft" data-i18n="copyLink">Copy link</button>
</div> </div>
</div> </div>
<script src="/app.js?v=2.5.0-admin27" type="module"></script> <script src="/app.js?v=2.5.0-admin28" type="module"></script>
</body> </body>
</html> </html>