cluedin-widget/core/components/entities/epic.jsx

This project contains all the pages needed for browsing entities and searching them. The aim is to replace the CluedIn.Webapp project with this one when all the pages ( including the Admin page ) will be ported to REACT.

import React, { Component } from 'react';
import EntityAuthors from '../entityRelated/EntityAuthors.jsx';
import { makeNoValueRow, makePropHtml, findFromKey, makeBadgeHtml } from '../../helpers/properties.jsx';
import EntityValueRow from '../entityRelated/EntityValueRow.jsx';
import EntityDefaultHeader from '../entityRelated/EntityDefaultHeader.jsx';

let noEnd = makeNoValueRow('end');
let noStart = makeNoValueRow('start');
let noLocation = makeNoValueRow('location');
let noOrganizerName = makeNoValueRow('Organizer');

export default class Issue extends Component {
  render() {
    const { entity, openInNewTab, q } = this.props;

    let startProp = findFromKey(entity.properties, 'start');
    let endProp = findFromKey(entity.properties, 'end');
    let locationProp = findFromKey(entity.properties, 'location');
    let organizerProp = findFromKey(entity.properties, 'OrganizerName');

    let startHtml = startProp ? makeBadgeHtml(startProp) : noStart;
    let endHtml = endProp ? makePropHtml(endProp) : noEnd;
    let locationHtml = locationProp ? makePropHtml(locationProp) : noLocation;
    let organizerHtml = organizerProp ? makePropHtml(organizerProp) : noOrganizerName;

    /*
    * <div className="cluedIn_row cluedIn_row_notCentered cluedIn_entity_table">
     <div className="cluedIn_col s6">
     <EntityValueRow name="Author(s)">
     <EntityAuthors entity={entity}></EntityAuthors>
     </EntityValueRow>
     </div>
     <div className="cluedIn_col s6">
     <EntityValueRow name="Creation Date">
     {entity.data.createdDateFormatted}
     </EntityValueRow>
     </div>
     </div>
    * */
    return (
      <div className="cluedIn_entity_row">
        <EntityDefaultHeader q={q} openInNewTab={openInNewTab} entity={entity}></EntityDefaultHeader>
      </div>
    );
  }
}