import Icon from '@mdi/react';
import { mdiClose, mdiInformation } from '@mdi/js';
import { Typography } from '@material-ui/core';
import { IconButton } from '@livechat/ui-kit';
import React from 'react';
import { isStringNotBlank } from '@tecsinapse/es-utils/build/object';
import { makeStyles } from '@material-ui/styles';
var useStyle = makeStyles(function (_ref) {
  var spacing = _ref.spacing;
  return {
    rootDiv: {
      display: 'flex',
      justifyContent: 'space-between',
      padding: spacing(5 / 12, 1, 5 / 12, 1.5),
      alignItems: 'center',
      backgroundColor: function backgroundColor(_ref2) {
        var isWarning = _ref2.isWarning;
        return isWarning ? '#f69c00' : '#fa1854';
      }
    },
    textDiv: {
      display: 'flex',
      flexDirection: 'row',
      alignItems: 'center'
    },
    typo: {
      fontSize: '14px',
      color: '#fff',
      fontWeight: 400
    }
  };
});
export var Warning = function Warning(_ref3) {
  var setWarning = _ref3.setWarning,
      message = _ref3.message,
      isError = _ref3.isError,
      isBlocked = _ref3.isBlocked;
  var errorMessage = message.errorMessage,
      warningMessage = message.warningMessage;
  var isWarning = isStringNotBlank(warningMessage);
  var classes = useStyle({
    isWarning: isWarning
  });
  var error = isError && isStringNotBlank(errorMessage) && errorMessage;
  var warning = isWarning && warningMessage;
  var blocked = isBlocked && React.createElement(React.Fragment, null, "O envio de mensagem expirou por ", React.createElement("strong", null, "inatividade"), ".");
  var warningText = error || warning || blocked;
  var marginRight = {
    marginRight: '8px'
  };
  return React.createElement("div", {
    className: classes.rootDiv
  }, React.createElement("div", {
    className: classes.textDiv
  }, React.createElement(Icon, {
    path: mdiInformation,
    size: 0.8,
    style: marginRight,
    color: "#fff"
  }), React.createElement(Typography, {
    className: classes.typo
  }, warningText)), React.createElement(IconButton, {
    onClick: function onClick() {
      return setWarning(false);
    }
  }, React.createElement(Icon, {
    path: mdiClose,
    size: 0.8,
    color: "#fff"
  })));
};