import $i18n from '../../../locales/i18n.js';
import React from 'react';
import { useTypewriter } from '../../hooks/use-typewriter';
import { CnTooltip } from '@cainiaofe/cn-ui';
import { armsHottagLog } from '../../../utils/arms/arms-hot-tag-log.js';
import { useBrandAssets } from '../../../theme/context.js';
/**
 * 跟单任务摘要卡片
 */
export const FollowOrderCard = ({ count, loading = false, onClick, iconUrl, }) => {
    const brandAssets = useBrandAssets();
    const bodyText = loading
        ? $i18n.get({ id: 'LoadingDocumentaryTasks', dm: '正在加载跟单任务...' })
        : $i18n.get({
            id: 'YouCurrentlyHaveCountTasksToFocu_1851507076',
            dm: '当前你有{count}个需要重点关注的任务～',
        }, { count });
    const displayText = useTypewriter(bodyText, { speed: 50, enabled: true });
    const cardElement = (React.createElement("div", { className: `cn-ai-agent__summary-card${onClick ? ' cn-ai-agent__summary-card--clickable' : ''}`, role: onClick ? 'button' : undefined, tabIndex: onClick ? 0 : undefined, onClick: () => {
            if (onClick) {
                armsHottagLog({
                    hottag: 'cn-ai-agent.followOrderCard.click',
                    name: $i18n.get({ id: 'ClickOnTheDocumentaryTaskCard', dm: '点击跟单任务卡片' }),
                    c6: count,
                });
                onClick();
            }
        } },
        React.createElement("div", { className: "cn-ai-agent__summary-card-header" },
            React.createElement("span", { className: "cn-ai-agent__summary-card-icon" },
                React.createElement("img", { src: iconUrl || brandAssets.agent.followOrderIconUrl, alt: "", width: 16, height: 16 })),
            React.createElement("span", { className: "cn-ai-agent__summary-card-title" }, $i18n.get({ id: 'DocumentaryTaskDynamics', dm: '跟单任务动态' }))),
        React.createElement("p", { className: "cn-ai-agent__summary-card-body" }, displayText)));
    return onClick ? (React.createElement(CnTooltip, { trigger: cardElement, triggerType: "hover", align: "b" },
        React.createElement("span", { style: { whiteSpace: 'nowrap' } }, $i18n.get({
            id: 'ClickToSwitchToTheSmartMerchandi_916006378',
            dm: '点击切换到智能跟单视图',
        })))) : (cardElement);
};
FollowOrderCard.displayName = 'FollowOrderCard';
