"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SystemStatusViewPanel = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const react_redux_1 = require("react-redux");
const getStatusItemStyle_1 = require("./Utilities/getStatusItemStyle");
class SystemStatusViewPanelComponent extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        const currentSystemStatusMessageInfo = this.props.api.systemStatusApi.getCurrentSystemStatusMessageInfo();
        const { color, background } = (0, getStatusItemStyle_1.getStatusItemStyle)(currentSystemStatusMessageInfo);
        const message = currentSystemStatusMessageInfo?.statusMessage;
        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
        return (React.createElement(rebass_1.Flex, { alignItems: "stretch", className: `ab-${elementType}__SystemStatus__wrap` },
            React.createElement(rebass_1.Flex, { style: { borderRadius: 'var(--ab__border-radius)' }, className: `ab-${elementType}__SystemStatus__text`, marginRight: 2, padding: 2, color: color, backgroundColor: message ? background : '', fontSize: 'var( --ab-font-size-2)', alignItems: "center", "data-name": "system-status-message" }, message || '0 Messages')));
    }
}
function mapStateToProps(state) {
    return {
        SystemStatusMessageInfos: state.Internal.SystemStatusMessages,
    };
}
function mapDispatchToProps(dispatch) {
    return {};
}
exports.SystemStatusViewPanel = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(SystemStatusViewPanelComponent);
