[object Object]

← back to Stringwallpaper

Wire sort select to API: hydrate state.sort from localStorage before first grid load and pass sort param

30b0b46f4f9a44665b773f5c08388fb48fbf8f09 · 2026-05-19 08:05:08 -0700 · Steve Abrams

The sort select set state.sort but loadGridPage never appended it to the
/api/products query, so sorting silently did nothing. Also the saved value
was applied after the initial load. Now state.sort is hydrated from
localStorage before loadFacets/loadGridPage run, and is sent as the sort param.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Files touched

Diff

commit 30b0b46f4f9a44665b773f5c08388fb48fbf8f09
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Tue May 19 08:05:08 2026 -0700

    Wire sort select to API: hydrate state.sort from localStorage before first grid load and pass sort param
    
    The sort select set state.sort but loadGridPage never appended it to the
    /api/products query, so sorting silently did nothing. Also the saved value
    was applied after the initial load. Now state.sort is hydrated from
    localStorage before loadFacets/loadGridPage run, and is sent as the sort param.
    
    Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 public/index.html | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/public/index.html b/public/index.html
index 0988137..7d46d11 100644
--- a/public/index.html
+++ b/public/index.html
@@ -395,7 +395,15 @@ textarea:focus-visible,
 </script>
 
 <script>
-const state = { q:'', facet:'all', page:1, pages:1, total:0, loading:false, exhausted:false };
+const state = { q:'', facet:'all', sort:'newest', page:1, pages:1, total:0, loading:false, exhausted:false };
+// Hydrate saved sort BEFORE first grid load so the initial fetch honors it.
+(function(){
+  try {
+    const KEY = location.hostname.replace(/\./g, '_') + '_sort';
+    const saved = localStorage.getItem(KEY);
+    if (saved) state.sort = saved;
+  } catch(e){}
+})();
 const LABELS = {"string":"String"};
 
 function escAttr(s) { return String(s == null ? '' : s).replace(/[&<>"']/g, c => ({ '&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;' }[c])); }
@@ -508,6 +516,7 @@ async function loadGridPage() {
   const params = new URLSearchParams({ page:state.page, limit:24 });
   if (state.q) params.set('q', state.q);
   if (state.facet !== 'all') params.set('aesthetic', state.facet);
+  if (state.sort && state.sort !== 'newest') params.set('sort', state.sort);
   let data;
   try {
     const r = await fetch('/api/products?' + params);

← 75566af hero-4grid: relocate json from data/ to public/ for Express  ·  back to Stringwallpaper  ·  Untrack snapshot files; broaden .gitignore and add static-ro 119aa24 →