cluedin-widget/widget/entity/entityPersonList/index.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 Widget from '../../../core/components/generics/widget.jsx';
import { register } from "../../../core/registry";
import { connect } from 'react-redux'
import { shouldFetchGenericLatest } from '../../../core/action/entity'
import PersonDetailed from './../../../core/components/entities/personDetailed.jsx'

const currentType = 'Person';

class EntityPersonList extends Component {

    componentWillMount() {
        const { entityId } = this.props;

        this.props.dispatch( shouldFetchGenericLatest( currentType, entityId ) );
    }

    render() {
        let minHeight = 'auto';

        const { isFetching, entities } = this.props;

        var content = 'loading...';

        if( entities ) {
            content = (<div className="cluedIn_entity_person_list">
                { entities.map( ( person )=> {
                    return (
                        <PersonDetailed key={person.id} entity={person}></PersonDetailed>
                    );
                } ) }
            </div>);
        }

        return (
            <Widget loading={isFetching} title="Employees linked to your Team" minHeight={minHeight}>
                {content}
            </Widget>
        );

    }
}

function select( state ) {
    return {
        entities: state.entity.genericLatestEntities[ currentType ],
        isFetching: state.entity.isFetchingGenericLatest[ currentType ]
    };
}

register( 'EntityPersonList', connect( select )( EntityPersonList ) );