Function DataItem

packages/sanddance-explorer/src/controls/dataItem.tsx:102–165

(props: Props)

}

export function DataItem(props: Props) {
    if (!props.item) {
        return null;
    }
    const nameValuePairs: NameValuePair[] = [];
    for (const columnName in props.item) {
        if (columnName === SandDance.constants.GL_ORDINAL && !props.showSystemFields) {
            continue;
        }
        if (SandDance.util.isInternalFieldName(columnName)) {
            continue;
        }
        const nameValuePair: NameValuePair = {
            columnName,
            value: props.item[columnName],
        };
        if (!props.bingSearchDisabled) {
            nameValuePair.bingSearch = bingSearchLink(props.columns.filter(c => c.name === columnName)[0], props.item[columnName]);
        }
        nameValuePairs.push(nameValuePair);
    }
    return (
        <div className="sanddance-dataItem">
            {nameValuePairs.map((nameValuePair, i) => {
                const ex: InputSearchExpression = {
                    key: 0,
                    name: nameValuePair.columnName,
                    operator: '==',
                    value: nameValuePair.value,
                };
                if (nameValuePair.value === null || nameValuePair.value === '') {
                    ex.operator = 'isnullorEmpty';
                    delete ex.value;
                }
                const searchClick = (e: React.MouseEvent<HTMLTableDataCellElement>) => {
                    const search: InputSearchExpressionGroup = {
                        key: 0,
                        expressions: [ex],
                    };
                    props.onSearch(e, [search]);
                };
                const title = strings.tooltipSearch(nameValuePair.columnName, displayValue(nameValuePair.value).display);
                return (
                    <div
                        key={i}
                        onClick={!props.disabled ? searchClick : null}
                        title={title}
                        onKeyUp={e => {
                            if (e.keyCode === KeyCodes.ENTER) {
                                searchClick(e as any);
                            }
                        }}
                        tabIndex={0}
                        className="name-value"
                    >
                        <div className="column-name">{nameValuePair.columnName}</div>
                        <div className="column-value">{displayValueElement(nameValuePair)}</div>
                        {nameValuePair.bingSearch}