cluedin-widget/core/helpers/properties.jsx

This is the project for creating and managing widgets in CluedIn.

import React  from 'react';

const NAHtml = (<span>N/A</span>);

export function makeNoValueRow( key ) {
    return (
        <div className="cluedIn_m-t-xs">
            <div className="cluedIn_label">
                {key}
            </div>
            <div className="cluedIn_value">
                {NAHtml}
            </div>
        </div>
    );
}

export function makeBadgeHtml( prop ) {

    var badgeHtml   = NAHtml;
    var badgetClass = "cluedIn_badge";

    if ( prop.value === 'open' ) {
        badgetClass += " danger";
    }

    if ( prop.value ) {
        badgeHtml = <span className={badgetClass}>{prop.value}</span>
    }

    return (
        <div className="cluedIn_m-t-xs">
            <div className="cluedIn_label">
                {prop.displayName}
            </div>
            <div className="cluedIn_value">
                {badgeHtml}
            </div>
        </div>
    );
}

export function makePropHtml( prop ) {
    return (
        <div className="cluedIn_m-t-xs">
            <div className="cluedIn_label">
                {prop.displayName}
            </div>
            <div className="cluedIn_value">
                {prop.value || NAHtml }
            </div>
        </div>
    );
}

export function makeLinkHtml( prop ) {
    var linkHtml = NAHtml;

    if ( prop.value ) {
        linkHtml = <a href={prop.value}>{prop.value}</a>
    }

    return (
        <div className="cluedIn_m-t-xs">
            <div className="cluedIn_label">
                {prop.displayName}
            </div>
            <div className="cluedIn_value">
                {linkHtml}
            </div>
        </div>
    );
}

export function findFromKey( properties, key ) {
    return properties.find( function( prop ) {
        return ( prop.key === key );
    } );
}