import { ChevronUp } from "@sofa-design/icons";
import classNames from "clsx";
import React, { memo, useContext } from "react";
import { ActionIconBox } from "../../Components/ActionIconBox";
import { useRefFunction } from "../../Hooks/useRefFunction";
import { I18nContext } from "../../I18n";
import { getArrowRotation, hasTaskContent } from "../constants";
import { StatusIcon } from "./StatusIcon";
export var TaskListItem = /*#__PURE__*/ memo(function(param) {
    var item = param.item, isLast = param.isLast, prefixCls = param.prefixCls, hashId = param.hashId, expandedKeys = param.expandedKeys, onToggle = param.onToggle;
    var locale = useContext(I18nContext).locale;
    var isCollapsed = !expandedKeys.includes(item.key);
    var hasContent = hasTaskContent(item.content);
    var handleToggle = useRefFunction(function() {
        onToggle(item.key);
    });
    var arrowTitle = isCollapsed ? (locale === null || locale === void 0 ? void 0 : locale['taskList.expand']) || '展开' : (locale === null || locale === void 0 ? void 0 : locale['taskList.collapse']) || '收起';
    return /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-thoughtChainItem"), hashId),
        "data-testid": "task-list-thoughtChainItem"
    }, /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-left"), hashId),
        onClick: handleToggle,
        "data-testid": "task-list-left"
    }, /*#__PURE__*/ React.createElement(StatusIcon, {
        status: item.status,
        prefixCls: prefixCls,
        hashId: hashId
    }), /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-content-left"), hashId)
    }, !isLast && /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-dash-line"), hashId),
        "data-testid": "task-list-dash-line"
    }))), /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-right"), hashId),
        "data-testid": "task-list-right"
    }, /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-top"), hashId),
        onClick: handleToggle
    }, /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-title"), hashId)
    }, item.title), hasContent && /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-arrowContainer"), hashId),
        "data-testid": "task-list-arrowContainer"
    }, /*#__PURE__*/ React.createElement(ActionIconBox, {
        title: arrowTitle,
        iconStyle: getArrowRotation(isCollapsed),
        loading: false
    }, /*#__PURE__*/ React.createElement(ChevronUp, {
        "data-testid": "task-list-arrow"
    })))), !isCollapsed && /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-body"), hashId)
    }, /*#__PURE__*/ React.createElement("div", {
        className: classNames("".concat(prefixCls, "-content"), hashId)
    }, item.content))));
});
TaskListItem.displayName = 'TaskListItem';
