function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import React, { useMemo, useRef } from "react";
import PlusCircle from "@pisell/icon/es/PlusCircle";
import DotsVertical from "@pisell/icon/es/DotsVertical";
import { Divider, Dropdown } from "antd";
import { useControllableValue } from "ahooks";
import { locales } from "@pisell/utils";
import useComponents from "../../../../hooks/useComponents";
import localeTexts from "../../locales";
import "./index.less";
import { getLocale } from "../../../../utils/locales";
locales.init(localeTexts, getLocale());
var _name = function _name(item) {
  if (item !== null && item !== void 0 && item.display_name) {
    var _item$display_name;
    return item === null || item === void 0 || (_item$display_name = item.display_name) === null || _item$display_name === void 0 ? void 0 : _item$display_name.trim();
  }
  if (item !== null && item !== void 0 && item.nickname) {
    var _item$nickname;
    return item === null || item === void 0 || (_item$nickname = item.nickname) === null || _item$nickname === void 0 ? void 0 : _item$nickname.trim();
  }
  if (item !== null && item !== void 0 && item.first_name || item !== null && item !== void 0 && item.last_name) {
    return (item === null || item === void 0 ? void 0 : item.first_name) + " " + (item === null || item === void 0 ? void 0 : item.last_name);
  }
  return "-";
};
var Contacts = function Contacts(props) {
  var _useControllableValue = useControllableValue(props, {
      defaultValue: []
    }),
    _useControllableValue2 = _slicedToArray(_useControllableValue, 2),
    state = _useControllableValue2[0],
    setState = _useControllableValue2[1];
  var operationType = useRef(null);
  var currentRef = useRef(null);
  var contactRef = useRef(null);
  var _useComponents = useComponents({
      components: ["ContactModal"]
    }),
    _useComponents2 = _slicedToArray(_useComponents, 1),
    ContactModal = _useComponents2[0];
  var menus = useMemo(function () {
    var list = [{
      key: "edit",
      label: locales.getText("pisell2.text.edit-profile")
    }, {
      key: "remove",
      label: locales.getText("pisell2.text.remove-contact")
    }];
    return list;
  }, []);
  var handleEditContact = function handleEditContact(item, index) {
    var _contactRef$current;
    operationType.current = "edit";
    currentRef.current = index;
    contactRef === null || contactRef === void 0 || (_contactRef$current = contactRef.current) === null || _contactRef$current === void 0 || _contactRef$current.open({
      detail: item
    });
  };
  var handleRemoveContact = function handleRemoveContact(item, index) {
    setState(function (v) {
      return (v || []).filter(function (_, i) {
        return i !== index;
      });
    });
  };
  var menuChange = function menuChange(key, item, index) {
    var maps = {
      edit: handleEditContact,
      remove: handleRemoveContact
    };
    maps[key](item, index);
  };
  var handleAddClick = function handleAddClick() {
    var _contactRef$current2;
    operationType.current = "add";
    contactRef === null || contactRef === void 0 || (_contactRef$current2 = contactRef.current) === null || _contactRef$current2 === void 0 || _contactRef$current2.open({
      detail: null,
      event_id: 0
    });
  };
  var handleChange = function handleChange(value) {
    if (operationType.current === "add") {
      setState(function (v) {
        return [].concat(_toConsumableArray(v || []), [value]);
      });
    } else if (operationType.current === "edit") {
      setState(function (v) {
        return (v || []).map(function (item, index) {
          if (index === currentRef.current) {
            return value;
          }
          return item;
        });
      });
    }
  };
  return /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__contacts"
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__contacts-title"
  }, locales.getText("pisell2.text.contacts")), !!(state !== null && state !== void 0 && state.length) && /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__contacts-value-wrap"
  }, (state || []).map(function (item, index) {
    var _item$country_calling;
    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__contacts-item",
      key: item.id
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__contacts-item-left"
    }, /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__contacts-name"
    }, _name(item)), item.email && /*#__PURE__*/React.createElement("div", null, item.email), item !== null && item !== void 0 && item.phone ? /*#__PURE__*/React.createElement("div", null, item !== null && item !== void 0 && item.country_calling_code ? "(".concat(item !== null && item !== void 0 && (_item$country_calling = item.country_calling_code) !== null && _item$country_calling !== void 0 && _item$country_calling.includes("+") ? "" : "+").concat(item === null || item === void 0 ? void 0 : item.country_calling_code, ")") : "", " ", item === null || item === void 0 ? void 0 : item.phone) : null), /*#__PURE__*/React.createElement("div", {
      className: "pisell-lowcode__contacts-item-menu"
    }, /*#__PURE__*/React.createElement(Dropdown, {
      menu: {
        items: menus,
        onClick: function onClick(e) {
          return menuChange(e.key, item, index);
        }
      },
      placement: "bottomRight"
    }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(DotsVertical, {
      style: {
        fontSize: 24,
        color: "#475467"
      }
    }))))), index !== (state === null || state === void 0 ? void 0 : state.length) - 1 && /*#__PURE__*/React.createElement(Divider, null));
  })), /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__contacts-add",
    onClick: handleAddClick
  }, /*#__PURE__*/React.createElement(PlusCircle, {
    style: {
      fontSize: 24
    }
  }), /*#__PURE__*/React.createElement("span", {
    className: "pisell-lowcode__contacts-add-text"
  }, locales.getText("pisell2.text.add-contacts"))), ContactModal && /*#__PURE__*/React.createElement(ContactModal, {
    ref: contactRef,
    type: "order",
    showRemoveBtn: false,
    onChange: handleChange
  }));
};
export default Contacts;