@metron-labs/quote-react 0.1.32 → 0.1.34

package/dist/app/QuickQuote.js

@@ -97,10 +97,13 @@ function QuickQuoteInner({ fullPage = false, hideHeader = false, internal = fals
         // Our own state only - copying the host's (e.g. Turbolinks' restoration id) makes its
         // router treat back/forward between our steps as its page visits and re-render the page,
         // wiping the quote. Next.js's patched pushState adds its own fields back.
-        window.history.pushState({ boqQuoteStage: next }, "", url);
+        // New results while the URL still carries one of our steps (start over, or the host
+        // re-rendered the page under us) reuse that entry, or back would land on a stale copy.
+        const stale = next === "results" && (window.location.hash === "#matched-products" || window.location.hash === "#quote-request");
+        window.history[stale ? "replaceState" : "pushState"]({ boqQuoteStage: next }, "", url);
     }, []);
     useEffect(() => {
-        const onPopState = () => {
+        const onPopState = (event) => {
             const hash = window.location.hash;
             if (hash === "#quote-request")
                 setStage("basket");
@@ -109,14 +112,16 @@ function QuickQuoteInner({ fullPage = false, hideHeader = false, internal = fals
             else
                 setStage("entry");
             // Turbo's popstate listener (registered before ours, so it can't be pre-empted) stamps its
-            // restoration id over our entries. On the next back/forward it then treats them as its own
-            // page visits and reloads the page, dropping the user on entry. Put our state back once
-            // every listener has run.
+            // restoration id over any entry without one - ours, or the host's own entry for this page.
+            // On the next back/forward it then treats that entry as its page visit and re-renders the
+            // page, wiping the quote. Once every listener has run, undo the stamp.
+            const original = event.state;
+            const href = window.location.href;
             setTimeout(() => {
-                const current = window.location.hash;
-                if (current !== "#quote-request" && current !== "#matched-products")
+                if (original?.turbo || window.location.href !== href)
                     return;
-                window.history.replaceState({ boqQuoteStage: current === "#quote-request" ? "basket" : "results" }, "", window.location.href);
+                if (window.history.state?.turbo)
+                    window.history.replaceState(original, "", href);
             });
         };
         window.addEventListener("popstate", onPopState);
@@ -127,11 +132,10 @@ function QuickQuoteInner({ fullPage = false, hideHeader = false, internal = fals
         setStage("basket");
     }, [writeQuoteHistory]);
     const backToResults = useCallback(() => {
+        // Step back over the basket entry goToBasket pushed (popstate picks the screen), rather
+        // than rewriting it: each rewrite left an extra results entry the browser back had to cross.
         if (window.location.hash === "#quote-request") {
-            const url = new URL(window.location.href);
-            url.hash = "matched-products";
-            window.history.replaceState({ boqQuoteStage: "results" }, "", url);
-            setStage("results");
+            window.history.back();
             return;
         }
         setStage(scheduleResult ? "results" : "entry");