import React, { useState, useEffect } from 'react';
import { evaluateRule, mapRule } from '../utilities/rules/RuleUtilities';
import { Chip, useTheme, makeStyles } from '@material-ui/core';
const useStyles = makeStyles((theme) => ({
    root: {
        display: 'grid',
        gridTemplateColumns: 'auto auto'
    },
    alertContainer: {
        margin: '0.3em'
    },
    chipStyle: {
        maxWidth: '150px',
        textOverflow: 'ellipsis'
    }
}));
export const AlertContainer = (props) => {
    const { data } = props;
    const theme = useTheme();
    const [alertData, setAlertData] = useState([]);
    const classes = useStyles(props);
    useEffect(() => {
        var _a;
        if ((_a = data === null || data === void 0 ? void 0 : data.properties) === null || _a === void 0 ? void 0 : _a.alerts) {
            let tempData = [];
            data.properties.alerts.forEach((alert) => {
                var _a;
                let res = mapRule(alert.propertyMapping, alert.jsonLogic);
                if (evaluateRule(res, data.nodeObj, (_a = data.properties) === null || _a === void 0 ? void 0 : _a.joiningEntityCatalogObjectKey, data.wasLazyLoaded)) {
                    tempData.push(alert);
                }
            });
            setAlertData(tempData);
        }
    }, [data]);
    if (alertData.length > 0) {
        return (React.createElement("div", { className: classes.root }, alertData
            .filter((item, i) => i % 2 === 0)
            .map((alert) => (React.createElement("div", { className: classes.alertContainer }, React.createElement(Chip, { label: alert.label, style: {
                backgroundColor: alert
                    ? alert.alertColor.hex
                    : theme.palette.secondary.main
            }, className: classes.chipStyle })))), alertData
            .filter((item, i) => i % 2 !== 0 && i !== 0)
            .map((alert) => (React.createElement("div", { className: classes.alertContainer }, React.createElement(Chip, { label: alert.label, style: {
                backgroundColor: alert
                    ? alert.alertColor.hex
                    : theme.palette.secondary.main
            }, className: classes.chipStyle }))))));
    }
    else {
        return null;
    }
};
//# sourceMappingURL=AlertContainer.js.map