From 81583d45cafe80757bcd07be0d26ada6d928009a Mon Sep 17 00:00:00 2001
From: Masen Furer <m_github@0x26.net>
Date: Thu, 21 Nov 2024 10:27:44 -0800
Subject: [PATCH] [HOS-313] state.js: when a routing error occurs, delete it
 (#4410)

In some cases, a routing failure can cause the failure to be cached. When the
router has a cached failure, pushing such a route will never call
routeChangeComplete, and thus on_load event will never be fired for that route.

Purposely clearing the error from the router allows the page to properly load
on subsequent attempts without refreshing the app.
---
 reflex/.templates/web/utils/state.js | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/reflex/.templates/web/utils/state.js b/reflex/.templates/web/utils/state.js
index 3899ddc89..72733777e 100644
--- a/reflex/.templates/web/utils/state.js
+++ b/reflex/.templates/web/utils/state.js
@@ -762,7 +762,7 @@ export const useEventLoop = (
     window.onunhandledrejection = function (event) {
       addEvents([
         Event(`${exception_state_name}.handle_frontend_exception`, {
-          stack: event.reason.stack,
+          stack: event.reason?.stack,
           component_stack: "",
         }),
       ]);
@@ -837,11 +837,20 @@ export const useEventLoop = (
       }
     };
     const change_complete = () => addEvents(onLoadInternalEvent());
+    const change_error = () => {
+      // Remove cached error state from router for this page, otherwise the
+      // page will never send on_load events again.
+      if (router.components[router.pathname].error) {
+        delete router.components[router.pathname].error;
+      }
+    }
     router.events.on("routeChangeStart", change_start);
     router.events.on("routeChangeComplete", change_complete);
+    router.events.on("routeChangeError", change_error);
     return () => {
       router.events.off("routeChangeStart", change_start);
       router.events.off("routeChangeComplete", change_complete);
+      router.events.off("routeChangeError", change_error);
     };
   }, [router]);