Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 | 1x 1x 1x 1x 1x 1x 1x 3x 3x 3x 3x 3x 3x 3x 3x 3x 1x 1x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 1x 1x 1x 1x 1x 1x 1x | import React from "react" import { SubNavId } from "../../clientUtils/owidTypes" import { getSubnavItem, SubnavItem, subnavs } from "../SiteSubnavigation" import { FontAwesomeIcon } from "@fortawesome/react-fontawesome" import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight" export const getSubnavParent = ( currentItem: SubnavItem | undefined, subnavItems: SubnavItem[] ) => { const parentId = currentItem?.parentId // We want to avoid matching elements with potentially undefined id. // Static typing prevents id from being undefined but this might not be // the case in a future API powered version. return parentId ? subnavItems.find((item) => item.id === parentId) : undefined } export const getBreadcrumbItems = ( subnavCurrentId: string | undefined, subnavItems: SubnavItem[] ): SubnavItem[] | undefined => { const breadcrumb = [] let currentItem = getSubnavItem(subnavCurrentId, subnavItems) if (!currentItem) return breadcrumb.push(currentItem) while (currentItem && currentItem.parentId) { currentItem = getSubnavParent(currentItem, subnavItems) if (currentItem) breadcrumb.push(currentItem) } if (currentItem !== subnavItems[0]) breadcrumb.push(subnavItems[0]) // add topic as parent return breadcrumb.reverse() } const BreadcrumbSeparator = () => ( <span className="separator"> <FontAwesomeIcon icon={faAngleRight} /> </span> ) export const Breadcrumb = ({ subnavId, subnavCurrentId, }: { subnavId?: SubNavId subnavCurrentId?: string }) => { const breadcrumbItems = subnavId ? getBreadcrumbItems(subnavCurrentId, subnavs[subnavId]) : null return breadcrumbItems ? ( <div className="breadcrumb"> <a href="/">Home</a> <BreadcrumbSeparator /> {breadcrumbItems.map((item, idx) => ( <React.Fragment key={item.href}> {idx !== breadcrumbItems.length - 1 ? ( <> <a data-track-note="breadcrumb" href={item.href}> {item.label} </a> <BreadcrumbSeparator /> </> ) : ( <span>{item.label}</span> )} </React.Fragment> ))} </div> ) : null } |