import React, { FC } from 'react'; import assert from '../../utils/assert'; import { DISPLAY_DOMAIN } from '../../utils/env'; const urlPathComponents = (path : string): string[] => { assert(path.length > 0, "empty path"); let canonicalizedPath = path[path.length - 1] === '/' ? path.substr(0, path.length - 1) : path; if(canonicalizedPath.length === 0) { return []; } else { canonicalizedPath = canonicalizedPath[0] == '/' ? path.substr(1, path.length - 1) : path; } return canonicalizedPath.split('/') } const urlPathComponentsToFullPath = (urlPathComponents : string[]): string[] => { const fullPaths = new Array(urlPathComponents.length + 1); fullPaths[0] = ''; for(let i = 0; i < urlPathComponents.length; i++) { fullPaths[i + 1] = fullPaths[i] + '/' + urlPathComponents[i]; } fullPaths[0] = '/'; return fullPaths; }; export type PathCrumbsProps = { path: string; style?: React.CSSProperties; }; import { BreadCrumbs , LinkCrumb } from '../../components/BreadCrumbs'; const PathCrumbs: FC = ({ path, style }) => { const pathComponents = urlPathComponents(path); const fullPaths = urlPathComponentsToFullPath(pathComponents); const linksComponents = fullPaths.map((fullPath, i) => ( { i === 0 ? DISPLAY_DOMAIN : pathComponents[i - 1] } )); return ( {linksComponents} ); }; export default PathCrumbs;