// import { MouseEvent, useState } from 'react';
// import { useTranslation } from 'react-i18next';
import Linkify from "linkify-react";
import 'linkify-plugin-mention';
import URLPreview from './Message/URLPreview';
import Mention from './Message/Mention';

type Props = {
    url?: boolean,
    mention?: boolean,
    mentionTextOnly?: boolean,
    mentionPopOver?: boolean,
    text: string,
    cid?: number
}

const LinkifyText = ({ url = true, mention = true, mentionTextOnly = false, mentionPopOver = true, text, cid }: Props) => {
    // const { t } = useTranslation();
    // const 
    return (
        <Linkify options={
            {
                render: {
                    email: ({ content, attributes: { href: link } }) => {
                        if (mentionTextOnly) return <>
                            {content}
                        </>;
                        return <a className="link" href={link} rel="noreferrer">
                            {content}
                        </a>;
                    },
                    url: ({ content, attributes: { href: link } }) => {
                        console.log("attr", link);
                        if (!url) return <>{content}</>;
                        return <>
                            <a className="link" target="_blank" href={link} rel="noreferrer">
                                {content}
                            </a>
                            <URLPreview url={link} />
                        </>;
                    },
                    mention: ({ content }) => {
                        if (!mention) return <>{content}</>;
                        // console.log();
                        if (/@[0-9]+/.test(content)) {
                            const uid = content.trim().slice(1);
                            return <Mention uid={+uid} cid={cid} popover={mentionPopOver} textOnly={mentionTextOnly} />;
                        }
                        return <>{content}</>;
                    }
                }
            }
        }>
            {text}
        </Linkify>
    );
};

export default LinkifyText;