Fix using screen names in `Link` (#8473)

* use our router in favour of useLinkBuilder

* test feature using Home header feeds button

* handle non-string params properly

1 files changed, 4 insertions, 4 deletions

diff --git a/src/lib/routes/router.ts b/src/lib/routes/router.ts
index 45f9c85fd..ba76b1bda 100644
--- a/src/lib/routes/router.ts
+++ b/src/lib/routes/router.ts
@@ -1,4 +1,4 @@
-import {Route, RouteParams} from './types'
+import {type Route, type RouteParams} from './types'
 
 export class Router {
   routes: [string, Route][] = []
@@ -45,7 +45,7 @@ function createRoute(pattern: string): Route {
   })
   const matcherRe = new RegExp(`^${matcherReInternal}([?]|$)`, 'i')
   return {
-    match(path: string) {
+    match(path) {
       const {pathname, searchParams} = new URL(path, 'http://throwaway.com')
       const addedParams = Object.fromEntries(searchParams.entries())
 
@@ -55,10 +55,10 @@ function createRoute(pattern: string): Route {
       }
       return undefined
     },
-    build(params: Record<string, string>) {
+    build(params = {}) {
       const str = pattern.replace(
         /:([\w]+)/g,
-        (_m, name) => params[name] || 'undefined',
+        (_m, name) => params[encodeURIComponent(name)] || 'undefined',
       )
 
       let hasQp = false