Use Link component for links instead of mithril route patch (#2315)

This new component now also supports external links.

js/src/common/components/Link.js

@@ -0,0 +1,47 @@
+import Component from '../Component';
+import extract from '../utils/extract';
+
+/**
+ * The link component enables both internal and external links.
+ * It will return a regular HTML link for any links to external sites,
+ * and it will use Mithril's m.route.Link for any internal links.
+ *
+ * Links will default to internal; the 'external' attr must be set to
+ * `true` for the link to be external.
+ */
+export default class Link extends Component {
+  view(vnode) {
+    let { options = {}, ...attrs } = vnode.attrs;
+
+    attrs.href = attrs.href || '';
+
+    // For some reason, m.route.Link does not like vnode.text, so if present, we
+    // need to convert it to text vnodes and store it in children.
+    const children = vnode.children || { tag: '#', children: vnode.text };
+
+    if (attrs.external) {
+      return <a {...attrs}>{children}</a>;
+    }
+
+    // If the href URL of the link is the same as the current page path
+    // we will not add a new entry to the browser history.
+    // This allows us to still refresh the Page component
+    // without adding endless history entries.
+    if (attrs.href === m.route.get()) {
+      if (!('replace' in options)) options.replace = true;
+    }
+
+    // Mithril 2 does not completely rerender the page if a route change leads to the same route
+    // (or the same component handling a different route).
+    // Here, the `force` parameter will use Mithril's key system to force a full rerender
+    // see https://mithril.js.org/route.html#key-parameter
+    if (extract(attrs, 'force')) {
+      if (!('state' in options)) options.state = {};
+      if (!('key' in options.state)) options.state.key = Date.now();
+    }
+
+    attrs.options = options;
+
+    return <m.route.Link {...attrs}>{children}</m.route.Link>;
+  }
+}