Fix PageRegistry.getByPageMenuTarget issue when package name has special chars (#1380)

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

src/extensions/registries/__tests__/page-registry.test.ts

@@ -1,5 +1,6 @@
-import { getPageUrl } from "../page-registry"
+import { getPageUrl, globalPageRegistry } from "../page-registry"
 import { LensExtension } from "../../lens-extension"
+import React from "react";
 
 let ext: LensExtension = null
 
@@ -33,3 +34,49 @@ describe("getPageUrl", () => {
     expect(getPageUrl(ext, "test")).toBe("/extension/foo-bar/test")
   })
 })
+
+describe("globalPageRegistry", () => {
+  beforeEach(async () => {
+    ext = new LensExtension({
+      manifest: {
+        name: "@acme/foo-bar",
+        version: "0.1.1"
+      },
+      manifestPath: "/this/is/fake/package.json",
+      isBundled: false,
+      isEnabled: true
+    })
+    globalPageRegistry.add([
+      {
+        id: "test-page",
+        components: {
+          Page: () => React.createElement('Text')
+        }
+      },
+      {
+        id: "another-page",
+        components: {
+          Page: () => React.createElement('Text')
+        }
+      },
+    ], ext)
+  })
+
+  describe("getByPageMenuTarget", () => {
+    it("returns matching page", () => {
+      const page = globalPageRegistry.getByPageMenuTarget({
+        pageId: "test-page",
+        extensionId: ext.name
+      })
+      expect(page.id).toEqual("test-page")
+    })
+
+    it("returns null if target not found", () => {
+      const page = globalPageRegistry.getByPageMenuTarget({
+        pageId: "wrong-page",
+        extensionId: ext.name
+      })
+      expect(page).toBeNull()
+    })
+  })
+})

src/extensions/registries/page-registry.ts

@@ -20,11 +20,15 @@ export interface PageComponents {
 
 const routePrefix = "/extension/:name"
 
+export function sanitizeExtensioName(name: string) {
+  return name.replace("@", "").replace("/", "-")
+}
+
 export function getPageUrl(ext: LensExtension, baseUrl = "") {
   if (baseUrl !== "" && !baseUrl.startsWith("/")) {
     baseUrl = "/" + baseUrl
   }
-  const validUrlName = ext.name.replace("@", "").replace("/", "-");
+  const validUrlName = sanitizeExtensioName(ext.name);
   return compile(routePrefix)({ name: validUrlName }) + baseUrl;
 }
 
@@ -46,7 +50,8 @@ export class PageRegistry<T extends PageRegistration> extends BaseRegistry<T> {
     if (!target) {
       return null
     }
-    return this.getItems().find((page) => page.routePath.startsWith(`/extension/${target.extensionId}/`) && page.id === target.pageId)
+    const routePath = `/extension/${sanitizeExtensioName(target.extensionId)}/`
+    return this.getItems().find((page) => page.routePath.startsWith(routePath) && page.id === target.pageId) || null
   }
 }