1 files changed, 19 insertions, 5 deletions
diff --git a/packages/aml-backoffice-ui/src/route.ts b/packages/aml-backoffice-ui/src/route.ts
index 091b92d5c..f515a590a 100644
--- a/packages/aml-backoffice-ui/src/route.ts
+++ b/packages/aml-backoffice-ui/src/route.ts
@@ -1,8 +1,20 @@
 import { TranslatedString } from "@gnu-taler/taler-util";
 import { createHashHistory } from "history";
-import { h as create, VNode } from "preact";
-import { useEffect, useState } from "preact/hooks";
-const history = createHashHistory();
+import { ComponentChildren, h as create, createContext, VNode } from "preact";
+import { useContext, useEffect, useState } from "preact/hooks";
+
+type ContextType = {
+  onChange: (listener: () => void) => VoidFunction
+}
+const nullChangeListener = { onChange: () => () => { } }
+const Context = createContext<ContextType>(nullChangeListener);
+
+export const usePathChangeContext = (): ContextType => useContext(Context);
+
+export function HashPathProvider({ children }: { children: ComponentChildren }): VNode {
+  const history = createHashHistory();
+  return create(Context.Provider, { value: { onChange: history.listen }, children }, children)
+}
 
 type PageDefinition<DynamicPart extends Record<string, string>> = {
   pattern: string;
@@ -81,8 +93,9 @@ type Location = {
 };
 export function useCurrentLocation(pageList: Array<PageEntry<any>>): Location | undefined {
   const [currentLocation, setCurrentLocation] = useState<Location | null | undefined>(null);
+  const path = usePathChangeContext();
   useEffect(() => {
-    return history.listen(() => {
+    return path.onChange(() => {
       const result = doSync(window.location.hash, new URLSearchParams(window.location.search), pageList);
       setCurrentLocation(result);
     });
@@ -95,8 +108,9 @@ export function useCurrentLocation(pageList: Array<PageEntry<any>>): Location |
 
 export function useChangeLocation() {
   const [location, setLocation] = useState(window.location.hash)
+  const path = usePathChangeContext()
   useEffect(() => {
-    return history.listen(() => {
+    return path.onChange(() => {
       setLocation(window.location.hash)
     });
   }, []);