fix: prevent book cards duplicating in continue-reading on repeated back-navigation
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:
@@ -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) {
|
||||
|
||||
Reference in New Issue
Block a user