import { Link, useNavigate } from 'react-router-dom';

export function CustomLink({ to, children, className, onClick, ...props }) {
  const navigate = useNavigate();

  const handleClick = (e) => {
    e.preventDefault();
    
    // Сначала выполняем плавную прокрутку
    window.scrollTo({
      top: 0,
      behavior: 'smooth'
    });

    // Затем с небольшой задержкой выполняем переход
    setTimeout(() => {
      navigate(to);
      if (onClick) onClick(e);
    }, 300); // Задержка должна быть меньше времени прокрутки
  };

  return (
    <Link
      to={to}
      className={className}
      onClick={handleClick}
      {...props}
    >
      {children}
    </Link>
  );
}
