import Ionicons from '@expo/vector-icons/Ionicons';
import * as Clipboard from 'expo-clipboard';
import React, { useState } from 'react';
import { StyleSheet, TouchableOpacity } from 'react-native';

const CopyButton = ({ textToCopy }: { textToCopy: string }) => {
    const [isCopied, setIsCopied] = useState(false);

    const handleCopy = async () => {
        await Clipboard.setStringAsync(textToCopy);
        setIsCopied(true);
        setTimeout(() => setIsCopied(false), 2000);
    };

    return (
        <TouchableOpacity onPress={handleCopy} style={styles.button}>
            {isCopied ? (
                <Ionicons name="checkmark-circle" size={12} color="#FFB645" />
            ) : (
                <Ionicons name="copy-outline" size={12} color="#333" />
            )}
        </TouchableOpacity>
    );
};

const styles = StyleSheet.create({
    button: {
        flexDirection: 'row',
        alignItems: 'center',
        padding: 4,
    },
    text: {
        marginLeft: 8,
        fontSize: 16,
    },
});

export default CopyButton;