cluedin-widget
Version:
This is the project for creating and managing widgets in CluedIn.
75 lines (57 loc) • 2.21 kB
JSX
import React, { Component } from 'react'
import iso from '../../../iso'
import { providers as providersConfig, excludedProviders } from '../../config'
const validationHelper = iso.validation;
const collectionHelper = iso.collection;
export default class ProviderIcons extends Component {
render() {
var { providers } = this.props;
let wrapperClass = "";
if ( !providers ) {
return (<div>CluedIn</div>);
}
if ( validationHelper.is.a.string( providers ) ) {
providers = [ providers ];
}
providers = collectionHelper.reject( providers, function( n ) {
return ( excludedProviders[ n.toLowerCase() ] );
} );
if ( providers.length > 1 ) {
if ( providers.length < 5 ) {
wrapperClass += 'cluedin_provider_icons_wrapper_' + providers.length;
} else {
wrapperClass += 'cluedin_provider_icons_wrapper_4';
providers = providers.filter( function( p ) {
return p.toLowerCase() !== 'cluedin';
} );
if ( providers.length > 4 ) {
providers = providers.splice( 0, 4 );
}
}
}
let content = providers.map( ( provider, i ) => {
let lowerProviderName = provider.toLowerCase();
let providerInfo = providersConfig[ lowerProviderName ];
if ( !providerInfo ) {
return;
}
let url = providerInfo.icon;
let name = providerInfo.name;
let providerIconClass = 'cluedin_provider_image ';
if ( i === 0 ) {
providerIconClass += 'first';
}
if ( i === ( providers.length - 1 ) ) {
providerIconClass += 'last';
}
return (<img key={i} className={providerIconClass} alt={name} src={url}/>);
} );
return (
<div className="cluedin_provider_icons">
<div className={wrapperClass}>
{content}
</div>
</div>
);
}
};