"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PreviewResultsPanel = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const AdaptablePopover_1 = require("../AdaptablePopover");
const InfiniteTable_1 = require("../../components/InfiniteTable");
const check_1 = tslib_1.__importDefault(require("../../components/icons/check"));
const UIHelper_1 = tslib_1.__importDefault(require("../UIHelper"));
const Card_1 = require("../../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;
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_1.default.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 ? (React.createElement(React.Fragment, null, this.props.previewInfo.previewValidationSummary.validationResult != 'None' && (React.createElement(AdaptablePopover_1.AdaptablePopover, { showEvent: "mouseenter", hideEvent: "mouseleave", headerText: 'Validation Error', bodyText: [this.getValidationErrorMessage(previewResult.validationRules)], MessageType: 'Error' })))) : (React.createElement(React.Fragment, null,
                    ' ',
                    React.createElement(check_1.default, { style: { color: successColor, fill: 'currentColor' } }))),
            };
        });
        const tableHeight = HEADER_HEIGHT + dataSource.length * ROW_HEIGHT;
        const tableDOMProps = {
            style: { height: tableHeight, maxWidth: 500 },
        };
        return this.props.showPanel ? (React.createElement(Card_1.Card, { className: "twa:overflow-hidden", style: { maxWidth: 500 }, shadow: false },
            React.createElement(Card_1.Card.Title, null, previewHeader),
            React.createElement(Card_1.Card.Body, null,
                React.createElement(InfiniteTable_1.DataSource, { data: dataSource, primaryKey: "Id" },
                    React.createElement(InfiniteTable_1.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 = alertDefinition.Rule.BooleanExpression
                ? ' when ' + alertDefinition.Rule.BooleanExpression
                : '';
            returnString.push(validationService.createValidationDescription(alertDefinition) + expressionDescription);
        }
        return returnString.join('\n');
    }
}
exports.PreviewResultsPanel = PreviewResultsPanel;
