import { useCallback } from "react";
import { Text, Pressable } from "react-native";
import * as Clipboard from "expo-clipboard";
import { Ionicons } from "@expo/vector-icons";

interface CopyableTextProps {
  children: string;
  className?: string;
  textClassName?: string;
  showIcon?: boolean;
  iconSize?: number;
  iconColor?: string;
  selectable?: boolean;
  onCopy?: () => void;
}

const DEFAULT_ICON_SIZE = 16;
const DEFAULT_ICON_COLOR = "#6B7280";
const DEFAULT_HIT_SLOP = 4;

export function CopyableText({
  children,
  className = "",
  textClassName = "",
  showIcon = true,
  iconSize = DEFAULT_ICON_SIZE,
  iconColor = DEFAULT_ICON_COLOR,
  selectable = true,
  onCopy,
}: CopyableTextProps) {
  const handleCopy = useCallback(async () => {
    try {
      await Clipboard.setStringAsync(children);
      onCopy?.();
    } catch (error) {
      console.error("Failed to copy text:", error);
    }
  }, [children, onCopy]);

  return (
    <Pressable
      className={`flex-row items-center gap-2 ${className}`}
      onPress={handleCopy}
      hitSlop={DEFAULT_HIT_SLOP}
    >
      <Text className={`flex-1 ${textClassName}`} selectable={selectable}>
        {children}
      </Text>
      {showIcon && (
        <Ionicons name="copy-outline" size={iconSize} color={iconColor} />
      )}
    </Pressable>
  );
}