/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module Notification
 */
import * as React from "react";
import { OutputMessagePriority } from "@itwin/core-frontend";
import { FooterPopup, MessageCenter, MessageCenterDialog, MessageCenterMessage, MessageCenterTab, } from "@itwin/appui-layout-react";
import { MessageManager } from "../messages/MessageManager";
import { MessageDiv, MessageSpan } from "../messages/MessageSpan";
import { UiFramework } from "../UiFramework";
import { Icon } from "@itwin/core-react";
/** Enum for the [[MessageCenterField]] active tab
 * @internal
 */
var MessageCenterActiveTab;
(function (MessageCenterActiveTab) {
    MessageCenterActiveTab[MessageCenterActiveTab["AllMessages"] = 0] = "AllMessages";
    MessageCenterActiveTab[MessageCenterActiveTab["Problems"] = 1] = "Problems";
})(MessageCenterActiveTab || (MessageCenterActiveTab = {}));
/** Message Center Field React component.
 * @public
 */
export class MessageCenterField extends React.Component {
    constructor(p) {
        super(p);
        this._indicator = React.createRef();
        this._title = UiFramework.translate("messageCenter.messages");
        this._handleMessagesUpdatedEvent = () => {
            // istanbul ignore else
            if (this._unloadMessagesUpdatedHandler)
                this.setState({ messageCount: MessageManager.messages.length });
        };
        this._handleOpenMessageCenterEvent = () => {
            this.setIsOpen(true);
        };
        this._handleClose = () => {
            this.setIsOpen(false);
        };
        this._handleOutsideClick = (e) => {
            if (!this._indicator.current ||
                !(e.target instanceof Node) ||
                this._indicator.current.contains(e.target))
                return;
            this._handleClose();
        };
        this._handleMessageIndicatorClick = () => {
            this.setIsOpen(!this.state.isOpen);
        };
        this._changeActiveTab = (tab) => {
            this.setState({ activeTab: tab });
        };
        this.state = {
            activeTab: MessageCenterActiveTab.AllMessages,
            target: null,
            messageCount: MessageManager.messages.length,
            isOpen: false,
        };
    }
    /** @internal */
    componentDidMount() {
        this._unloadMessagesUpdatedHandler =
            MessageManager.onMessagesUpdatedEvent.addListener(this._handleMessagesUpdatedEvent, this);
        this._removeOpenMessagesCenterHandler =
            MessageManager.onOpenMessageCenterEvent.addListener(this._handleOpenMessageCenterEvent, this);
        MessageManager.registerAnimateOutToElement(this._indicator.current);
    }
    /** @internal */
    componentWillUnmount() {
        // istanbul ignore else
        if (this._unloadMessagesUpdatedHandler) {
            this._unloadMessagesUpdatedHandler();
            this._unloadMessagesUpdatedHandler = undefined;
        }
        // istanbul ignore else
        if (this._removeOpenMessagesCenterHandler) {
            this._removeOpenMessagesCenterHandler();
            this._removeOpenMessagesCenterHandler = undefined;
        }
    }
    render() {
        const tooltip = `${this.state.messageCount} ${this._title}`;
        const divStyle = { ...this.props.style, height: "100%" };
        const footerMessages = (React.createElement(React.Fragment, null,
            React.createElement("div", { className: this.props.className, style: divStyle, title: tooltip },
                React.createElement(MessageCenter, { indicatorRef: this._indicator, label: this._title, onClick: this._handleMessageIndicatorClick }, this.state.messageCount.toString())),
            React.createElement(FooterPopup, { isOpen: this.state.isOpen, onClose: this._handleClose, onOutsideClick: this._handleOutsideClick, target: this._indicator.current },
                React.createElement(MessageCenterDialog, { prompt: UiFramework.translate("messageCenter.prompt"), tabs: React.createElement(React.Fragment, null,
                        React.createElement(MessageCenterTab, { isActive: this.state.activeTab === MessageCenterActiveTab.AllMessages, onClick: () => this._changeActiveTab(MessageCenterActiveTab.AllMessages) }, UiFramework.translate("messageCenter.all")),
                        React.createElement(MessageCenterTab, { isActive: this.state.activeTab === MessageCenterActiveTab.Problems, onClick: () => this._changeActiveTab(MessageCenterActiveTab.Problems) }, UiFramework.translate("messageCenter.errors"))), title: this._title }, this.getMessages()))));
        return footerMessages;
    }
    getMessages() {
        const messages = MessageManager.messages.slice(0).reverse();
        const tabRows = new Array();
        messages.forEach((details, index) => {
            /* istanbul ignore else */
            if (this.state.activeTab === MessageCenterActiveTab.AllMessages ||
                this.isProblemStatus(details.priority)) {
                const iconClassName = MessageManager.getIconClassName(details);
                const iconSpec = MessageManager.getIconSpecFromDetails(details);
                const message = details.briefMessage;
                tabRows.push(React.createElement(MessageCenterMessage, { key: index.toString(), icon: React.createElement(Icon, { iconSpec: iconSpec, className: iconClassName }) },
                    React.createElement(MessageSpan, { message: message }),
                    details.detailedMessage && (React.createElement(MessageDiv, { className: "iui-text-small", message: details.detailedMessage }))));
            }
        });
        return tabRows;
    }
    isProblemStatus(priority) {
        // See priority values in DgnPlatform defined in NotificationManager
        if (priority === OutputMessagePriority.Error ||
            priority === OutputMessagePriority.Fatal)
            return true;
        return false;
    }
    setIsOpen(isOpen) {
        this.setState({ isOpen });
    }
}
//# sourceMappingURL=MessageCenter.js.map