import React, { Component } from 'react';
import Widget from '../../../core/components/generics/widget.jsx';
import registry from '../../../core/registry';
import { connect } from 'react-redux';
import PropertyViewer from '../../../core/components/entityRelated/EntityPropertyViewer.jsx';

class EntityProperty extends Component {
    render() {

        const { entity } = this.props;

        if ( !entity ) {
            let isLoading = true;
            return (<Widget title="Extra Information" loading={isLoading}></Widget>)
        }

        return (<Widget title="Extra Information">
            <PropertyViewer entity={entity}></PropertyViewer>
        </Widget>);
    }
}

function select( state ) {
    return {
        entity: state.entity.selectedEntity,
        isFetchingEntity: state.entity.isFetchingEntity
    };
}

registry.register( 'EntityProperty', connect( select )( EntityProperty ) );