import { RoadmapType } from '../../lib/roadmap'; import { SimpleGrid, Tag } from '@chakra-ui/react'; import { HomeRoadmapItem } from '../roadmap/home-roadmap-item'; type FeaturedRoadmapsListProps = { roadmaps: RoadmapType[]; title: string; }; export const upcomingRoadmaps = [ { type: 'Role Based', title: 'Software Architect', description: 'Roadmap to become a modern Software Architect', id: 'software-architect' }, { type: 'Role Based', title: 'React Native', description: 'Step by step guide to become a React Native Developer', id: 'react-native' } ]; export function FeaturedRoadmapsList(props: FeaturedRoadmapsListProps) { const { roadmaps, title } = props; return ( <> {title} <> {roadmaps.map((roadmap: RoadmapType, counter: number) => ( ))} {upcomingRoadmaps .filter(roadmap => roadmap.type === title) .map((roadmap, counter) => ( ))} ); }