import { View, Image, Text } from "@tarojs/components";
import style from './index.module.less'
import IconCopy from "@/components/icon/IconCopy";
import IconDislike from "@/components/icon/IconDislike";
import IconDislikeBlue from "@/components/icon/IconDislikeBlue";
import IconLike from "@/components/icon/IconLike";
import IconLikeBlue from "@/components/icon/IconLikeBlue";
import IconSpeaker from "@/components/icon/icon-speaker";
import { TAgentDetail } from "@/types/agent";
import Taro from "@tarojs/taro";
import ThinkAnimation from '../think-animation/index'
import { dislikeMessage, likeMessage } from "@/service/bot";
import { TMessage } from "@/types/bot";
import { getLoginId, isSuccess } from "@/utils";
import { useState } from "react";
interface Props {
  agent?: TAgentDetail | null,
  text: string,
  textReasoning: string,
  message: TMessage
}
export default ({agent, text, message, textReasoning=''}:Props) => {
  const [isDislike, setIsDislike] = useState(message.isDislike)
  const [isLike, setIsLike] = useState(message.isLike)
  const handleCopy = (e: any)=> {
    e.stopPropagation();
    // 手动复制并 toast 提示
    if(text){
      Taro.setClipboardData({
        data: text,
        success(){
          Taro.showToast({
            title: '复制成功',
            icon: 'none'
          })
        },fail(res) {
          console.log(res)
          Taro.showToast({
            title: '复制失败',
            icon: 'none'
          })
        },
      })
    }
  }
  const loginId = getLoginId();
  const handleDislike = async (disLike: boolean) => {
    if(!agent?.agentId){
      return;  
    }
    const response = await dislikeMessage({
      agentId: agent?.agentId,
      dislikeReason: '',
      isDislike: !disLike,
      loginId,
      msgUk: message.msgUk
    })
    if(isSuccess(response.status)){
      setIsDislike(!disLike)
    }
  }
  const handleLike = async (like: boolean) => {
    if(!agent?.agentId){
      return;  
    }
    const response = await likeMessage({
      agentId: agent?.agentId,
      isLike: !like,
      loginId,
      msgUk: message.msgUk
    })
    if(isSuccess(response.status)){
      setIsLike(!like)
    }
  }

  return <View>
      {agent && <View className="flex gap-8 mb-10">
        <View className={style.avatarContainer}>
          {agent?.avatarUrl && (
            <Image
              mode="aspectFill"
              className={style.avatar}
              src={agent.avatarUrl}
            />
          )}
        </View>
        <View className="font-medium text-16 leading-24">{agent?.name}</View>
      </View>}

      <View className={`${style.message } ${style.messageRobot} gap-10`}>
        <View className={style.messageContent}>
        {textReasoning && <View className={style.deepThinkContainer}>
            <View className="font-bold">深度思考：</View>
            <Text>
              {textReasoning}
            </Text>
          </View>}

        {text.length === 0 && <ThinkAnimation></ThinkAnimation>}
          <Text>{text}</Text>
        </View>
        <View className="flex gap-8">
          <View onClick={handleCopy}><IconCopy /></View>
          {/* <IconSpeaker></IconSpeaker> */}
          <View onClick={()=> handleDislike(message.isDislike)}>
            {isDislike ? <IconDislikeBlue/> : <IconDislike/>}
          </View>
          <View onClick={()=> handleLike(message.isLike)}>
            {isLike ? <IconLikeBlue/> : <IconLike/>}
          </View>
        </View>
    </View>
  </View>
}


