import { Fragment, h } from "@stencil/core";
import { ZIconButton } from "../internal-component/z-icon-button";
export const ProfileTicketAction = (props) => {
    const isFollowing = props.ticket?.ticket_followings?.find(f => f.business_user_id === props.ticket?.business_user?.id);
    const handleFollowToggle = (e) => {
        e.stopPropagation();
        if (props.onFollowClick) {
            props.onFollowClick(!!isFollowing);
        }
    };
    const handleCopyClick = (e) => {
        e.stopPropagation();
        const ticketId = props.ticket?.id;
        if (!ticketId)
            return;
        const hostEl = e.currentTarget;
        hostEl.style.pointerEvents = 'none';
        hostEl.style.opacity = '0.4';
        const restore = () => {
            setTimeout(() => {
                hostEl.style.pointerEvents = '';
                hostEl.style.opacity = '';
            }, 200);
        };
        navigator.clipboard.writeText(String(ticketId)).then(restore).catch(() => {
            const textarea = document.createElement('textarea');
            textarea.value = String(ticketId);
            textarea.style.position = 'fixed';
            textarea.style.opacity = '0';
            document.body.appendChild(textarea);
            textarea.select();
            document.execCommand('copy');
            document.body.removeChild(textarea);
            restore();
        });
        if (props.onCopyClick) {
            props.onCopyClick();
        }
    };
    return (h(Fragment, null, h(ZIconButton, { iconName: isFollowing ? "EyeOff" : "Eye", variant: "text", addClassIcon: props.addClassIcon, noPadding: true, noPaddingY: true, onClick: handleFollowToggle }), h(ZIconButton, { iconName: "Copy", variant: "text", addClassIcon: props.addClassIcon, noPadding: true, noPaddingY: true, onClick: handleCopyClick })));
};
