import React from 'react';
import AlertCircle from '@pisell/icon/es/AlertCircle';
import { Tooltip } from 'antd';
import useEngineContext from "../../../../../hooks/useEngineContext";
import "./index.less";
import XClose from '@pisell/icon/es/XClose';
var RenderScheduleItem = function RenderScheduleItem(_ref) {
  var _appHelper$utils;
  var item = _ref.item,
    onItemClick = _ref.onItemClick,
    onDelete = _ref.onDelete,
    showDeleteIcon = _ref.showDeleteIcon;
  var _useEngineContext = useEngineContext(),
    appHelper = _useEngineContext.appHelper;
  return /*#__PURE__*/React.createElement("div", {
    key: item.id,
    className: "pisell-lowcode__schedule-list-item",
    onClick: function onClick() {
      return onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(item);
    }
  }, /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__schedule-list-item-color",
    style: {
      backgroundColor: item.color
    }
  }), /*#__PURE__*/React.createElement("div", {
    className: "pisell-lowcode__schedule-list-item-content"
  }, appHelper === null || appHelper === void 0 || (_appHelper$utils = appHelper.utils) === null || _appHelper$utils === void 0 ? void 0 : _appHelper$utils.translationShop(item.name)), item.conflict && /*#__PURE__*/React.createElement(Tooltip, {
    title: "Days conflict with another schedule"
  }, /*#__PURE__*/React.createElement(AlertCircle, {
    className: "pisell-lowcode__schedule-list-item-conflict"
  })), showDeleteIcon && /*#__PURE__*/React.createElement(XClose, {
    className: "pisell-lowcode__schedule-list-item-delete",
    onClick: function onClick(e) {
      e.stopPropagation();
      onDelete === null || onDelete === void 0 || onDelete(item);
    }
  }));
};
export default RenderScheduleItem;