resources/js/components/techniques/Outline.js

   1 import PropTypes from 'prop-types';
   2 import React from 'react';
   3 import { ListGroup } from 'react-bootstrap';
   4
   5 const Outline = ({ technique }) => technique.chapters && technique.chapters.length ?
   6         <aside className="tech-outline mb-3 ms-3">
   7                 <ListGroup>
   8                         {technique.chapters.map(chapter => chapter.pivot.level ?
   9                                 <ListGroup.Item
  10                                         action
  11                                         href={`#c${chapter.id}`}
  12                                         key={`c${chapter.id}`}
  13                                         title={chapter.short || null}
  14                                 >
  15                                         {chapter.title}
  16                                 </ListGroup.Item>
  17                         : null)}
  18                 </ListGroup>
  19         </aside>
  20 : null;
  21
  22 Outline.propTypes = {
  23         technique: PropTypes.shape({
  24                 chapters: PropTypes.arrayOf(PropTypes.shape({
  25                 })),
  26         }),
  27 };
  28
  29 export default Outline;