import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import { useI18n } from '../../../i18n';
import { FcrAvatar } from '../../avatar';
import { FcrIcon } from '../../icon';
import { FcrIconType } from '../../icon/type';
import { FcrToolTip } from '../../tooltip';
import { ActionBarItem } from '../item';
import './index.css';
import { useState } from 'react';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var Chat = function Chat(_ref) {
  var id = _ref.id,
    order = _ref.order;
  var t = useI18n();
  var title = t('fmt_chat_window_title');
  var tooltip = t('fmt_chat_window_title');
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    tooltipVisible = _useState2[0],
    setTooltipVisible = _useState2[1];
  var _useState3 = useState(false),
    _useState4 = _slicedToArray(_useState3, 2),
    chatTooltipVisible = _useState4[0],
    setChatTooltipVisible = _useState4[1];
  var handleTooltipVisibleChange = function handleTooltipVisibleChange(visible) {
    if (visible && chatTooltipVisible) {
      setTooltipVisible(false);
    } else {
      setTooltipVisible(visible);
    }
  };
  var handleChatTooltipVisibleChange = function handleChatTooltipVisibleChange(visible) {
    if (visible && tooltipVisible) {
      setTooltipVisible(false);
    }
    setChatTooltipVisible(visible);
  };
  return /*#__PURE__*/_jsxs("div", {
    className: "fcr-action-bar-chat-wrapper",
    children: [/*#__PURE__*/_jsx("div", {
      className: "fcr-action-bar-chat-unread-count",
      children: "99"
    }), /*#__PURE__*/_jsx(FcrToolTip, {
      onVisibleChange: handleChatTooltipVisibleChange,
      overlayClassName: "fcr-chatroom-tooltip",
      overlayInnerStyle: {
        padding: '15px 12px',
        background: 'var(--fcr_mobile_ui_scene_color_popup_fill1)',
        border: "1px solid var(--fcr_ui_scene_line2)",
        boxShadow: 'none'
      },
      arrowContent: /*#__PURE__*/_jsx(FcrIcon, {
        colors: {
          iconPrimary: 'var(--fcr_mobile_ui_scene_color_popup_fill1)',
          iconSecondary: 'var(--fcr_ui_scene_line2)'
        },
        type: FcrIconType.FCR_TOOLTIP_ARROW,
        size: 16
      }),
      visible: chatTooltipVisible,
      content: /*#__PURE__*/_jsx(FcrChatroomTooltipContent, {
        onClick: function onClick() {},
        message: null
      }),
      children: /*#__PURE__*/_jsx(FcrToolTip, {
        onVisibleChange: handleTooltipVisibleChange,
        visible: tooltipVisible,
        content: tooltip,
        children: /*#__PURE__*/_jsx(ActionBarItem, {
          id: id,
          order: order,
          className: "fcr-action-bar-chat",
          icon: FcrIconType.FCR_CHAT2,
          title: title,
          iconColors: {
            iconPrimary: 'var(--fcr_web_ui_scene_mainicon1)'
          }
        })
      })
    })]
  });
};
var FcrChatroomTooltipContent = function FcrChatroomTooltipContent(_ref2) {
  var message = _ref2.message,
    onClick = _ref2.onClick;
  var transI18n = useI18n();
  var isPrivateMessage = false;
  var msg = '这是什么意思？这是什么意思？是好ajskajsajslkajslajsajshakjs是这是什么意思？这是什么意思？是好ajskajsajslkajslajsajshakjs...';
  var nickName = 'aaa';
  return /*#__PURE__*/_jsxs("div", {
    className: "fcr-chatroom-tooltip-content",
    onClick: onClick,
    children: [/*#__PURE__*/_jsx("div", {
      className: "fcr-chatroom-tooltip-content-close",
      children: /*#__PURE__*/_jsx(FcrIcon, {
        type: FcrIconType.FCR_CLOSE,
        size: 10,
        colors: {
          iconPrimary: 'var(--fcr_ui_scene_icontext1)'
        }
      })
    }), /*#__PURE__*/_jsx(FcrAvatar, {
      size: 32,
      textSize: 15,
      nickName: nickName
    }), /*#__PURE__*/_jsxs("div", {
      className: "fcr-chatroom-tooltip-content-text",
      children: [/*#__PURE__*/_jsxs("div", {
        className: "fcr-chatroom-tooltip-content-from",
        children: [/*#__PURE__*/_jsxs("span", {
          children: [transI18n('fmt_chats_label_from'), " \xA0", /*#__PURE__*/_jsx("span", {
            children: nickName
          })]
        }), isPrivateMessage && /*#__PURE__*/_jsxs("span", {
          className: "fcr-chatroom-tooltip-content-from-private",
          children: ["\xA0(", transI18n('fcr_chat_label_private'), ")"]
        })]
      }), /*#__PURE__*/_jsx("div", {
        className: "fcr-chatroom-tooltip-content-msg",
        children: /*#__PURE__*/_jsx("span", {
          children: msg
        })
      })]
    })]
  });
};