cluedin-widget/core/components/entityRelated/EntityIcon.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 wms from '../../../wms';
import Radium, { Style } from 'radium';

const EntityIconStyle = {
  wrapper: {
    width: '42px',
    display: 'inline-block',
    marginRight: 0,
    marginLeft: 0,
  },
  icon: {
    width: '40px',
    height: '40px',
    borderRadius: '40px',
    border: '1px #ccc solid',
    position: 'relative',
    overflow: 'hidden',
    textAlign: 'center'
  }
};

const styleIcon = {
  i: {
    fontSize: '20px',
    marginTop: 0,
    paddingTop: '9px',
    color: '#646464',
    display: 'block',
    paddingLeft: '1px',
  },
};

class EntityIcon extends Component {
  render() {
    const { entityType } = this.props;
    const entityConfig = wms.getEntityConfiguration(entityType);
    const icon = entityConfig ? entityConfig.icon : '';
    const destroyTooltip = true;

    return (
      <div style={EntityIconStyle.wrapper}>
        <div className="cluedIn_EntityIcon_icon" style={EntityIconStyle.icon}>
          <Style
            scopeSelector=".cluedIn_EntityIcon_icon"
            rules={styleIcon}
          />
          <div dangerouslySetInnerHTML={{__html: icon}}></div>
        </div>
      </div>
    );
  }
}

export default Radium(EntityIcon);