"use client";
import { MouseEvent, ReactNode } from "react";
import Link from "next/link";
import { Path, useNavigationStore } from "@/store/navigation-store";

type NavigationLinkProps = {
  path: Path;
  children: ReactNode;
  className?: string;
} & React.AnchorHTMLAttributes<HTMLAnchorElement>;

const NavigationLink = ({ path, children, className, ...rest }: NavigationLinkProps) => {
  const { setPath } = useNavigationStore();
  const handleClick = (e: MouseEvent) => {
    e.preventDefault();
    setPath(path);
  };
  return (
    <Link href={path!} onClick={handleClick} className={className} {...rest}>
      {children}
    </Link>
  );
};

export default NavigationLink;