ts-puzzles/sitemap-parser

Assignment

Challenge: Create a Sitemap Tree from a List of URLs

Context

You are connecting an headless CMS to a frontend and want the editors to specify how the pages are structured from within the CMS. The CMS however does not provide sitemap functionality out of the box, instead it only gives you the option to request a list of all pages.

An example request would return you this payload:

[
  { "id": 1, "slug": "root", "parent": null },
  { "id": 2, "slug": "contact", "parent": 1 },
  { "id": 3, "slug": "email", "parent": 2 },
  { "id": 4, "slug": "phone", "parent": 2 },
  { "id": 5, "slug": "products", "parent": 1 },
  { "id": 6, "slug": "electronics", "parent": 5 },
  { "id": 7, "slug": "cameras", "parent": 6 },
  { "id": 8, "slug": "books", "parent": 1 },
  { "id": 9, "slug": "fiction", "parent": 8 },
  { "id": 10, "slug": "children", "parent": 8 }
]

Tasks:

Task 1: Given a list of URLs, create a tree-like sitemap structure. Each node in the tree should represent a path segment in a URL, encapsulated in a children field. This function should by typed to return a Tree type and the output should be similar to this, however you can have a different output type with reason:

{
  "name": "root",
  "id": 1,
  "children": [
    {
      "name": "contact",
      "id": 2,
      "children": [
        {
          "name": "email",
          "id": 3,
          "children": []
        },
        {
          "name": "phone",
          "id": 4,
          "children": []
        }
      ]
    },
    /* ... (Other branches for 'products', and 'books', each with the associated IDs) ... */
  ]
}

Task 2: Write a resolveByPath function that takes in a path as a string and returns the id of a page if found. A few test cases are:

• / => 1
• /contact => 2
• /contact/email => 3
• /contact/whatsapp => null
• /products/electronics/cameras => 7