import { View, Image, Text } from "@tarojs/components";
import IconCopyDashboard from "@/images/svgs/dashboard/IconCopy.svg";

import Taro from "@tarojs/taro";
interface Props {
  urls: string[];
}
export default ({ urls }: Props) => {
  const handleCopy = (e: any, textStr: string) => {
    e.stopPropagation();
    // 手动复制并 toast 提示
    if (textStr) {
      Taro.setClipboardData({
        data: textStr,
        success() {
          Taro.showToast({
            title: "复制成功",
            icon: "none",
          });
        },
        fail(res) {
          console.log(res);
          Taro.showToast({
            title: "复制失败",
            icon: "none",
          });
        },
      });
    }
  };
  if (urls.length === 0) {
    return <></>;
  }
  return (
    <>
      {urls.length ? <View className="leading-28 mb-8">查看链接: </View> : <></>}
      {urls.map((link: string) => {
        return (
          <View className="flex items-center gap-6 truncate overflow-hidden">
            <View
              className="truncate leading-28"
              user-select
            >
              {link}
            </View>
            <Image
              src={IconCopyDashboard}
              className="w-16 h-16 shrink-0"
              onClick={(e) => handleCopy(e, link)}
            ></Image>
          </View>
        );
      })}
    </>
  );
};
