import React from 'react';
import ReactMarkdown from 'react-markdown';
import { Link } from 'react-router-dom';
import { intro } from '../resources/const';
const markdown = require('../resources/markdown.json');

function getSectionLinks() {
  return (
    <ul>
    {markdown.map((section, sIndex) => (
      <li key={sIndex}><Link to={section.path}>{section.title}</Link></li>
    ))}
    </ul>
  );
}

class Home extends React.Component {
  render() {
    return (
      <div className="page">
        <div className="breadcrumb-wrapper">
          <span className="breadcrumb light-blue-text"><i className="material-icons">home</i></span>
          <span className="breadcrumb grey-text">Accueil</span>
        </div>
        <h4 className="header orange-text">Accueil</h4>
        <ReactMarkdown source={intro} />
        {getSectionLinks()}
      </div>

    );
  }
}

export default Home;
