fix: links

chore: proper router config
YUCLing · Dec 7, 2024 · f839449 · f839449
1 parent 65b66e2
commit f839449
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 7 deletions.
diff --git a/framework/core/js/src/admin/AdminApplication.tsx b/framework/core/js/src/admin/AdminApplication.tsx
@@ -145,7 +145,7 @@ export default class AdminApplication extends Application {
     // we need to go to https://example.com/admin#/ explicitly.
     if (!document.location.hash) document.location.hash = '#/';
 
-    super.mount('#');
+    super.mount('', '#');
 
     m.mount(document.getElementById('app-navigation')!, () => <Navigation className="App-backControl" drawer />);
     m.mount(document.getElementById('header-navigation')!, () => <Navigation />);

diff --git a/framework/core/js/src/common/Application.tsx b/framework/core/js/src/common/Application.tsx
@@ -345,7 +345,7 @@ export default class Application {
     });
   }
 
-  protected mount(routePrefix = '/', basePath: string = '') {
+  protected mount(basePath: string = '', routePrefix: string = '') {
     // An object with a callable view property is used in order to pass arguments to the component; see https://mithril.js.org/mount.html
     this.redraw.modal = m.mount(document.getElementById('modal')!, () => <ModalManager state={this.modal} />);
     this.redraw.alert = m.mount(document.getElementById('alerts')!, () => <AlertManager state={this.alerts} />);

diff --git a/framework/core/js/src/common/utils/patchMithril.js b/framework/core/js/src/common/utils/patchMithril.js
@@ -112,6 +112,37 @@ function Trust(attrs) {
   ];
 }
 
+// from mithril, modified
+const Link = () => {
+	var href, opts, setRoute
+	var listener = (ev) => {
+		if (
+			!ev.defaultPrevented &&
+			(ev.button === 0 || ev.which === 0 || ev.which === 1) &&
+			(!ev.currentTarget.target || ev.currentTarget.target === "_self") &&
+			!ev.ctrlKey && !ev.metaKey && !ev.shiftKey && !ev.altKey
+		) {
+			setRoute(href, opts)
+			return m.capture(ev)
+		}
+	}
+
+	return function (attrs, old) {
+		setRoute = app.routing.set
+		href = attrs.h
+		opts = attrs.o
+		return [
+			m.layout((dom) => {
+				dom.href = app.routing.prefix + href
+				if (!old) dom.addEventListener("click", listener)
+			}),
+			m.remove((dom) => {
+				dom.removeEventListener("click", listener)
+			}),
+		]
+	}
+}
+
 function getOrCreateComponentFunc(comp) {
   let func = componentFuncs.get(comp);
   if (!func) {
@@ -131,12 +162,13 @@ export default function patchMithril(global) {
 
     if (comp === '__LINK__') {
       const attrs = args[0];
-      const className = attrs.className ?? attrs.class ?? '';
-      const classes = className != '' ? className.split(' ') : [];
       return defaultMithril(
-        'a' + classes.map((v) => '.' + v).join(''),
-        // this doesn't work since other roots won't have a router.
-        /*defaultMithril.link(attrs.href, attrs.options)*/ { ...attrs, className: undefined, class: undefined },
+        'a',
+        {
+          className: attrs.className,
+          class: attrs.class
+        },
+        m(Link, {h: `${attrs.href}`, o: attrs.options}),
         args.slice(1)
       );
     }