fix(routing): useActiveRouteEvents not re-rendering

Because the context value was a mutable ref it never triggered a context change so the hook only ran when the component rendered for other reasons

This causes the context value to be re-created every time the active route changes to ensure components using it will re-render when that happens

Author: UberMouse

src/tests/asyncRouteRedirects.spec.tsx

@@ -89,7 +89,7 @@ describe("async route redirects", () => {
 
     childRoute.navigate({ params: { bar: "redirect", notFoo: "foo" } });
 
-    await delay(140);
+    await delay(200);
     expect(queryByText("redirected")).toBeDefined();
     expect(hist.location.pathname).toBe("/notFoo/foo/redirected/child/");
   });

src/xstateTree.tsx

@@ -495,14 +495,16 @@ export function buildRootComponent(
     }, []);
 
     const routingProviderValue = useMemo(() => {
+      // Just to satisfy linter, need this memo to be re-calculated on route changes
+      activeRoute;
       if (!routing) {
         return null;
       }
 
       return {
         activeRouteEvents: activeRouteEventsRef,
       };
-    }, []);
+    }, [activeRoute]);
 
     if (!interpreter.initialized) {
       setTimeout(() => forceRender(!forceRenderValue), 0);