1 

     2 import React from 'react';

     3 import PropTypes from 'prop-types';

     4 

     5 import { FormattedMessage } from 'react-intl';

     6 

     7 import DefinitionBlock from './DefinitionBlock';

     8 

     9 const DefinitionsCards = ({ annotations, metacategories, children }) => {

    10   const defBlocks = annotations.map(

    11     annotation => <DefinitionBlock key={`annotation-${annotation.id}`} annotation={annotation} metacategories={metacategories} />,

    12   );

    13 

    14   let noDefinitionContent = <FormattedMessage id="ui.definitionCards.noDefinition" defaultMessage="No definition yet" />;

    15 

    16   if (React.Children.count(children) > 0) {

    17     noDefinitionContent = children;

    18   }

    19 

    20   return (

    21     <div className="card-columns">

    22       { annotations.length === 0 ? noDefinitionContent : defBlocks }

    23     </div>

    24   );

    25 };

    26 

    27 DefinitionsCards.propTypes = {

    28   annotations: PropTypes.arrayOf(PropTypes.object),

    29   metacategories: PropTypes.arrayOf(PropTypes.object).isRequired,

    30   children: PropTypes.node,

    31 };

    32 

    33 DefinitionsCards.defaultProps = {

    34   annotations: [],

    35   children: null,

    36 };

    37 

    38 export default DefinitionsCards;