@adaptabletools/adaptable
Version:
Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
66 lines (65 loc) • 3.3 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { AdaptablePopover } from '../AdaptablePopover';
import { DataSource, InfiniteTableGrid } from '../../components/InfiniteTable';
import CheckIcon from '../../components/icons/check';
import UIHelper from '../UIHelper';
import { Card } from '../../components/Card';
const columnsMap = {
InitialValue: {
field: 'InitialValue',
defaultFlex: 1,
header: 'Current',
align: 'center',
renderMenuIcon: false,
},
ComputedValue: {
field: 'ComputedValue',
defaultFlex: 1,
header: 'New',
align: 'center',
renderMenuIcon: false,
},
ValidInfo: {
field: 'ValidInfo',
defaultWidth: 80,
header: 'Valid',
align: 'center',
renderMenuIcon: false,
},
};
const ROW_HEIGHT = 35;
const HEADER_HEIGHT = 30;
export class PreviewResultsPanel extends React.Component {
render() {
let previewHeader = this.props.showHeader && this.props.previewInfo != null
? 'Preview Results: ' +
(this.props.selectedColumn ? this.props.selectedColumn.friendlyName : '')
: '';
let successColor = UIHelper.getColorByMessageType('Success');
const dataSource = this.props.previewInfo.previewResults.map((previewResult, index) => {
return {
Id: index,
InitialValue: previewResult.initialValue,
ComputedValue: previewResult.computedValue,
ValidInfo: previewResult.validationRules.length > 0 ? (_jsx(_Fragment, { children: this.props.previewInfo.previewValidationSummary.validationResult != 'None' && (_jsx(AdaptablePopover, { showEvent: "mouseenter", hideEvent: "mouseleave", headerText: 'Validation Error', bodyText: [this.getValidationErrorMessage(previewResult.validationRules)], MessageType: 'Error' })) })) : (_jsxs(_Fragment, { children: [' ', _jsx(CheckIcon, { style: { color: successColor, fill: 'currentColor' } })] })),
};
});
const tableHeight = HEADER_HEIGHT + dataSource.length * ROW_HEIGHT;
const tableDOMProps = {
style: { height: tableHeight, maxWidth: 500 },
};
return this.props.showPanel ? (_jsxs(Card, { className: "twa:flex-1 twa:overflow-hidden twa:min-w-70 twa:min-h-50", shadow: false, children: [_jsx(Card.Title, { children: previewHeader }), _jsx(Card.Body, { children: _jsx(DataSource, { data: dataSource, primaryKey: "Id", children: _jsx(InfiniteTableGrid, { sortable: false, domProps: tableDOMProps, columns: columnsMap }) }) })] })) : null;
}
getValidationErrorMessage(alertDefinitions) {
let validationService = this.props.api.internalApi.getValidationService();
let returnString = [];
for (let alertDefinition of alertDefinitions) {
let expressionDescription = 'Rule' in alertDefinition && alertDefinition.Rule.BooleanExpression
? ' when ' + alertDefinition.Rule.BooleanExpression
: '';
returnString.push(validationService.createValidationDescription(alertDefinition) + expressionDescription);
}
return returnString.join('\n');
}
}