fix: prevent book cards duplicating in continue-reading on repeated back-navigation
Some checks failed
CI / Lint (push) Has been cancelled
CI / Test (push) Has been cancelled
CI / Build (push) Has been cancelled

HTMX was snapshotting the post-JS mutated home DOM into history; on back-navigation
it restored the stale snapshot then re-ran the inline script, appending cards that
were already present. Fix by:
- hx-history="false" on the home root div so HTMX never caches the mutated DOM
- clearing #continue-reading-grid before each script run as a defensive guard
This commit is contained in:
Admin
2026-03-01 20:09:06 +05:00
parent c431fc5869
commit ffadf7a0c6

View File

@@ -119,7 +119,7 @@ func (s *Server) respond(w http.ResponseWriter, r *http.Request, title, fragment
// ─── GET / — book catalogue ───────────────────────────────────────────────────
const homeTmpl = `
<div class="max-w-4xl mx-auto px-4 py-10">
<div class="max-w-4xl mx-auto px-4 py-10" hx-history="false">
<div class="flex items-center justify-between mb-2">
<h1 class="text-3xl font-bold text-zinc-100">libnovel</h1>
<a href="/ranking" hx-get="/ranking" hx-target="#main-content" hx-push-url="true" hx-swap="innerHTML" class="text-sm px-3 py-1.5 rounded-lg bg-amber-700 hover:bg-amber-600 text-white">Browse Rankings</a>
@@ -205,6 +205,10 @@ const homeTmpl = `
var continueGrid = document.getElementById('continue-reading-grid');
var availableHeading = document.getElementById('available-heading');
// Clear any stale cards from a previous render (e.g. HTMX re-executing this
// script after a history restore) before re-populating.
if (continueGrid) continueGrid.innerHTML = '';
if (inProgress.length > 0) {
var moved = 0;
inProgress.forEach(function(slug) {