chore: add tests

packages/components/src/templates/next/layouts/NotFound/SearchButton.tsx

@@ -26,10 +26,7 @@ export const NotFoundSearchButton = ({
 
   return (
     <LinkButton
-      href={{
-        pathname: "/search",
-        query: { q: missingPath },
-      }}
+      href={`/search?q=${missingPath}`}
       size="lg"
       LinkComponent={LinkComponent}
       isWithFocusVisibleHighlight

packages/components/src/utils/__tests__/getWordsFromPermalink.test.ts

@@ -0,0 +1,66 @@
+import { describe, expect, it } from "vitest"
+
+import { getWordsFromPermalink } from "~/utils"
+
+describe("getWordsFromPermalink", () => {
+  it("should trim out all symbols and return the permalink as a space separated sentence for single level permalinks", () => {
+    // Arrange
+    const singleLevelPermalink = "/this-._single=level|"
+    const expected = "this+single+level"
+
+    // Act
+    const actual = getWordsFromPermalink(singleLevelPermalink)
+
+    // Assert
+    expect(actual).toBe(expected)
+  })
+
+  it("should trim out all symbols and return the last section as a space separated sentence for nested permalinks", () => {
+    // Arrange
+    const nestedPermalink = "/nested/deeply/this-._nest'fff=level|"
+    const expected = "this+nest+fff+level"
+
+    // Act
+    const actual = getWordsFromPermalink(nestedPermalink)
+
+    // Assert
+    expect(actual).toBe(expected)
+  })
+
+  it("should preserve `=` in the original permalink", () => {
+    // Arrange
+    const singleLevelPermalink = "/this-._single=level|"
+    const expected = "this+single+level"
+
+    // Act
+    const actual = getWordsFromPermalink(singleLevelPermalink)
+
+    // Assert
+    expect(actual).toBe(expected)
+  })
+
+  it("should handle uri-encoded strings correctly", () => {
+    // Arrange
+    const singleLevelPermalink = "/this-._single=level|"
+    const encodedPermalink = encodeURIComponent(singleLevelPermalink)
+    const expected = "this+single+level"
+
+    // Act
+    const actual = getWordsFromPermalink(encodedPermalink)
+
+    // Assert
+    expect(actual).toBe(expected)
+  })
+
+  it("should work with a trailing /", () => {
+    // Arrange
+    const singleLevelPermalink = "/this-._single=level|/"
+    const expected = "this+single+level"
+
+    // Act
+    const actual = getWordsFromPermalink(singleLevelPermalink)
+
+    // Assert
+    expect(actual).toBe(expected)
+  })
+})

packages/components/src/utils/getWordsFromPermalink.ts

@@ -1,10 +1,13 @@
 export const getWordsFromPermalink = (permalink: string): string => {
-  const lastUrlSegment = permalink.split("/").at(-1) ?? ""
+  const trimmedPermalink = permalink.endsWith("/")
+    ? permalink.slice(0, -1)
+    : permalink
+  const lastUrlSegment = trimmedPermalink.split("/").at(-1) ?? ""
   // NOTE: Replace all non-alphanumeric characters with spaces
   // then remove all spaces and join by `+`.
   // This is because we might have run-on spaces from sequences of symbols
   // like: `+=`, which would lead to 2 spaces
-  return lastUrlSegment
+  return decodeURIComponent(lastUrlSegment)
     .replaceAll(/[\W_]/gi, " ")
     .split(" ")
     .filter((v) => !!v)