Temporary fix for History's first load behavior

Author: Archmonger

src/js/src/index.js

@@ -56,6 +56,28 @@ export function History({ onHistoryChangeCallback }) {
   return null;
 }
 
+/**
+ * FirstLoad component that captures the URL during the initial page load and notifies the server.
+ *
+ * @param {Object} props - The properties object.
+ * @param {Function} props.onFirstLoadCallback - Callback function to notify the server about the first load.
+ * @returns {null} This component does not render any visible output.
+ * @description
+ * This component sends the current URL to the server during the initial page load.
+ * @see https://github.com/reactive-python/reactpy/pull/1224
+ */
+export function FirstLoad({ onFirstLoadCallback }) {
+  // FIXME: This component only exists because of a ReactPy core rendering bug, and should be removed when the bug
+  // is fixed. Ideally all this logic would be handled by the `History` component.
+  React.useEffect(() => {
+    onFirstLoadCallback({
+      pathname: window.location.pathname,
+      search: window.location.search,
+    });
+    return () => {};
+  }, []);
+  return null;
+}
 
 /**
  * Link component that captures clicks on anchor links and notifies the server.

src/reactpy_router/components.py

@@ -32,6 +32,11 @@
 )
 """Client-side portion of the navigate component"""
 
+FirstLoad = export(
+    module_from_file("reactpy-router", file=Path(__file__).parent / "static" / "bundle.js"),
+    ("FirstLoad"),
+)
+
 link_js_content = (Path(__file__).parent / "static" / "link.js").read_text(encoding="utf-8")
 
 

src/reactpy_router/routers.py

@@ -11,7 +11,7 @@
 from reactpy.backend.types import Connection, Location
 from reactpy.types import ComponentType, VdomDict
 
-from reactpy_router.components import History
+from reactpy_router.components import FirstLoad, History
 from reactpy_router.hooks import _route_state_context, _RouteState
 from reactpy_router.resolvers import StarletteResolver
 from reactpy_router.types import CompiledRoute, Resolver, Router, RouteType
@@ -46,6 +46,7 @@ def router(
 
     old_conn = use_connection()
     location, set_location = use_state(old_conn.location)
+    first_load, set_first_load = use_state(True)
 
     resolvers = use_memo(
         lambda: tuple(map(resolver, _iter_routes(routes))),
@@ -69,8 +70,15 @@ def on_history_change(event: dict[str, Any]) -> None:
             if location != new_location:
                 set_location(new_location)
 
+        def on_first_load(event: dict[str, Any]) -> None:
+            """Callback function used within the JavaScript `FirstLoad` component."""
+            if first_load:
+                set_first_load(False)
+            on_history_change(event)
+
         return ConnectionContext(
             History({"onHistoryChangeCallback": on_history_change}),  # type: ignore[return-value]
+            FirstLoad({"onFirstLoadCallback": on_first_load}) if first_load else "",
             *route_elements,
             value=Connection(old_conn.scope, location, old_conn.carrier),
         )