fix #52: correct the StackedRouter on 'replace'

src/platform/StackedRouter.tsx

@@ -1,10 +1,14 @@
-import { StaticRouter, type RouterProps } from "@solidjs/router";
+import {
+  Router,
+  type RouterProps,
+  type StaticRouterProps,
+  createRouter,
+} from "@solidjs/router";
 import {
   Component,
   createContext,
   createMemo,
   createRenderEffect,
-  createUniqueId,
   Index,
   onMount,
   Show,
@@ -12,6 +16,9 @@ import {
   useContext,
   onCleanup,
   type Accessor,
+  children,
+  createSignal,
+  createRoot,
 } from "solid-js";
 import { createStore, unwrap } from "solid-js/store";
 import "./StackedRouter.css";
@@ -393,6 +400,24 @@ function animateUntil(
   execStep();
 }
 
+function noOp() {}
+
+function StaticRouter(props: StaticRouterProps) {
+  const url = () => props.url || "";
+
+  // TODO: support onBeforeLeave, see
+  // https://github.com/solidjs/solid-router/blob/main/src/routers/Router.ts
+
+  return createRouter({
+    get: url,
+    set: noOp,
+    init(notify) {
+      createRenderEffect(() => notify(url()));
+      return noOp;
+    },
+  })(props);
+}
+
 /**
  * The cache key of saved stack for hot reload.
  *
@@ -463,7 +488,7 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
     };
 
     createRenderEffect(() => {
-      loadStack()
+      loadStack();
     });
   }
 
@@ -478,10 +503,13 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
       };
 
       const replace = opts?.replace;
-      if (replace === "all") {
+      if (replace === "all" || stack.length === 0) {
         mutStack([frame]);
+      } else if (replace) {
+        const idx = stack.length - 1;
+        mutStack(idx, frame);
       } else {
-        mutStack(replace ? stack.length - 1 : stack.length, frame);
+        mutStack(stack.length, frame);
       }
 
       const savedStack = serializableStack(stack);
@@ -547,13 +575,15 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
       }
     });
 
-  createRenderEffect(() => {
-    if (stack.length === 0) {
-      pushFrame(window.location.pathname, {
-        replace: "all",
-      });
-    }
-  });
+  createRenderEffect(() =>
+    untrack(() => {
+      if (stack.length === 0) {
+        pushFrame(window.location.pathname, {
+          replace: "all",
+        });
+      }
+    }),
+  );
 
   createRenderEffect(() => {
     makeEventListener(window, "popstate", (event) => {
@@ -642,7 +672,9 @@ const StackedRouter: Component<StackedRouterProps> = (oprops) => {
           const currentFrame = () => {
             return {
               index,
-              frame: frame(),
+              get frame() {
+                return frame();
+              },
             };
           };