list/search/accounts: fully(?) page-based search

searches are triggered by setting the search QP, and ran by a listener
set on PageManager. same with details. Works surprisingly well, but i'm
sure theres bugs.

ts/modules/pages.ts

@@ -1,26 +1,19 @@
-export interface Page {
-    name: string;
-    title: string;
-    url: string;
-    show: () => boolean;
-    hide: () => boolean;
-    shouldSkip: () => boolean;
-    index?: number;
-}
-
 export interface PageConfig {
     hideOthersOnPageShow: boolean;
     defaultName: string;
     defaultTitle: string;
 }
 
-export class PageManager {
+export class PageManager implements Pages {
     pages: Map<string, Page>;
     pageList: string[];
     hideOthers: boolean;
     defaultName: string = "";
     defaultTitle: string = "";
 
+    private _listeners: Map<string, { params: string[]; func: (qp: URLSearchParams) => void }> = new Map();
+    private _previousParams = new URLSearchParams();
+
     private _overridePushState = () => {
         const pushState = window.history.pushState;
         window.history.pushState = function (data: any, __: string, _: string | URL) {
@@ -32,6 +25,8 @@ export class PageManager {
     };
 
     private _onpopstate = (event: PopStateEvent) => {
+        const prevParams = this._previousParams;
+        this._previousParams = new URLSearchParams(window.location.search);
         let name = event.state;
         if (name == null) {
             // Attempt to use hash from URL, if it isn't there, try the last part of the URL.
@@ -48,6 +43,14 @@ export class PageManager {
         if (!success) {
             return;
         }
+        if (this._listeners.has(name)) {
+            for (let qp of this._listeners.get(name).params) {
+                if (prevParams.get(qp) != this._previousParams.get(qp)) {
+                    this._listeners.get(name).func(this._previousParams);
+                    break;
+                }
+            }
+        }
         if (!this.hideOthers) {
             return;
         }
@@ -115,4 +118,17 @@ export class PageManager {
         }
         this.loadPage(p);
     }
+
+    // FIXME: Make PageManager global.
+
+    // registerParamListener allows registering a listener which will be called when one or many of the given query param names are changed. It will only be called once per navigation.
+    registerParamListener(pageName: string, func: (qp: URLSearchParams) => void, ...qps: string[]) {
+        const p: { params: string[]; func: (qp: URLSearchParams) => void } = this._listeners.get(pageName) || {
+            params: [],
+            func: null,
+        };
+        if (func) p.func = func;
+        p.params.push(...qps);
+        this._listeners.set(pageName, p);
+    }
 }