Use updated RelatedEntities component to display relations
authorFrank Bessou <frank.bessou@logilab.fr>
Thu, 27 Apr 2017 13:52:59 +0200
changeset 144 1356e8b593ba
parent 143 85c29903f060
child 145 a58c5d2d5428
Use updated RelatedEntities component to display relations The RelatedEntities component was already existing but it was not used. This changeset adds it to the Entity component. This component appears when the displayed resource has a rel='related' link.
src/components/Entity.js
--- a/src/components/Entity.js	Tue May 02 11:45:34 2017 +0200
+++ b/src/components/Entity.js	Thu Apr 27 13:52:59 2017 +0200
@@ -133,9 +133,9 @@
                 </div>
             );
         } else {
-            relatedItems = this.state.related.map(
-                entity => (
-                    <li className="list-group-item" key={entity.eid}>
+            relatedItems = this.state.related.data.mapItems(
+                (entity) => (
+                    <li className="list-group-item" key={entity.uniqueId}>
                         <CollectionItemLink entity={entity} />
                     </li>
                 )
@@ -162,7 +162,7 @@
 
 RelatedEntities.propTypes = {
     etype: React.PropTypes.string.isRequired,
-    eid: React.PropTypes.number.isRequired,
+    eid: React.PropTypes.string.isRequired,
     rtype: React.PropTypes.string.isRequired,
 };
 
@@ -279,6 +279,17 @@
         return <EntityMeta data={this.props.entity.data} />;
     }
 
+    renderRelated() {
+        const links = this.props.entity.data.links('related');
+        if (links.length > 0) {
+            const {etype, eid} = this.props.entity;
+            return Array.prototype.map.call(links, (link) => {
+                return <RelatedEntities key={link.title} etype={etype} eid={eid} rtype={link.title}/>
+            });
+        }
+        return null;
+    }
+
     render() {
         const {entity} = this.props;
         if (entity === null) {
@@ -291,6 +302,7 @@
                 <h3>{ this.renderTitle() }</h3>
                 { this.renderAttributes() }
                 { this.renderFooter() }
+                { this.renderRelated() }
             </div>
         );
     }