import styles from './telegramLink.module.scss';
import Link, { LinkProps } from 'next/link';
import TelegramIcon from '@/assets/icons/telegram.svg';
import clsx from 'clsx';
import { CursorEffect } from '@/components/cursor';

type TelegramLinkProps = Omit<LinkProps, 'href'> & { className?: string };

export function TelegramLink(props: TelegramLinkProps) {
  const { className: restClassName, ...restProps } = props;

  return (
    <CursorEffect
      effectDistance={48}
      effectForce={4}
      cursorPadding={0}
      className={clsx(styles.linkWrapper)}
    >
      <Link
        {...restProps}
        className={clsx(styles.link, restClassName)}
        target="_blank"
        href="https://t.me/ridebus"
        prefetch={false}
      >
        <TelegramIcon className={styles.linkIcon} />
      </Link>
    </CursorEffect>
  );
}