feat: add option to show breadcrumbs for empty path routes

[lukasmatta]

Currently, if there is an empty path child route (it can be that the route is using matcher instead of path), its breadcrumb is not rendered as a separate breadcrumb, but instead, it replaces parent route breadcrumb.

This PR introduces breadcrumb option force, when set to true, it forces breadcrumb of an empty path route to be rendered as a separate one.

To illustrate on an example:

export const ROUTES: Route[] = [
  {
    path: 'sample',
    component: SampleComponent,
    data: {
      breadcrumb: {
        label: 'Sample Component',
      },
    },
    children: [
      {
        matcher: (url) => (url.length === 1 && url[0].path === 'hello-world' ? { consumed: url } : null),
        component: HelloWorldComponent,
        data: {
          breadcrumb: {
            label: 'Hello World',
            force: true, // note the force option
          },
        },
      },
    ],
  },
];

Currently, the breadcrumbs for this route structure when visiting /sample/hello-world route looks like this: Sample Component. With this PR it will look like this: Sample Component / Hello World.

Resolves #148 and #199 in a non-breaking way.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
xng-breadcrumb	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 29, 2024 9:24am

[nx-cloud]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit a712f95. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution

---

✅ Successfully ran 3 targets

• nx affected -t e2e-ci --parallel=1
• nx affected -t lint build --parallel=3
• nx build material-ui

---

Sent with 💌 from NxCloud.

[github-actions]

This PR has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.