import { useState } from 'react'; import classNames from 'classnames'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faFacebookSquare, faTwitterSquare, faRedditSquare, faGithubSquare } from '@fortawesome/free-brands-svg-icons' import { PageHeader, RoadmapMeta, ShareRoadmap, Sidebar, Summary, SummaryContainer, MobileNavHeader, SidebarButton, MobileSidebar, MobileSidebarWrap, DesktopSidebarWrap, PageTitle, PageDetail } from './style'; import { faBars } from '@fortawesome/free-solid-svg-icons' import { getFacebookShareUrl } from 'lib/url'; import { ShareIcon } from 'components/share-icon'; import { getRedditShareUrl, getTwitterShareUrl } from 'lib/url'; import siteConfig from "storage/site"; import MdRenderer from 'components/md-renderer'; const DetailedRoadmap = ({ roadmap }) => { const [menuActive, setMenuState] = useState(false); const { sidebar = {}, page: currentPage = {}, author = {} } = roadmap; const roadmapPages = Object.keys(sidebar || {}).map(groupTitle => { if (groupTitle.startsWith('_')) { return; } return (

{ groupTitle }

); }); const filePath = currentPage.path.replace(/^\//, ''); const RoadmapContent = require(`../../storage/${filePath}`).default; return (

{ roadmap.title }

Roadmap contributed by { author.name } { roadmap.contributorsCount > 1 && ` and ${roadmap.contributorsCount} others`}

setMenuState((prevMenuActive) => !prevMenuActive)}> { currentPage.title }
{ roadmapPages }
{ roadmapPages } { currentPage.title }
) }; export default DetailedRoadmap;