app/components/breadcrumb.tsx

Functions

Imports

It imports no other module of this repo. Imported by app/routes/content-page.tsx, app/routes/kb-library.tsx, app/routes/lab.kind.tsx, app/routes/lab.tsx, app/routes/phages.tsx, app/routes/procedure.tsx, app/routes/procedure.version.tsx, app/routes/protocols.tsx, app/routes/publications.$slug.tsx, app/routes/systems.tsx.

Source

1import { Link } from "react-router";
2
3/** Visible trail. The last step is the current page. Hubs (one step) render nothing. */
4export function Breadcrumb({ trail }: { trail: Array<[string, string]> }) {
5  if (trail.length < 2) return null;
6  return (
7    <nav className="page-breadcrumb" aria-label="Breadcrumb">
8      <ol>
9        {trail.map(([name, path], i) => {
10          const last = i === trail.length - 1;
11          return (
12            <li key={`${path}-${i}`}>
13              {last ? <span aria-current="page">{name}</span> : <Link to={path}>{name}</Link>}
14              {last ? null : <span aria-hidden="true"> / </span>}
15            </li>
16          );
17        })}
18      </ol>
19    </nav>
20  );
21}