---
const { pathname } = Astro.url;
const { class: className = '', href, ...props } = Astro.props;

function isActiveLink(linkPath: string, currentPath: string) {
	return (
		linkPath === currentPath ||
		linkPath === (currentPath.endsWith('/') ? currentPath.slice(0, -1) : currentPath)
	);
}

const isActive = isActiveLink(href, pathname);
---

<a
	href={href}
	class={`inline-block ${className} ${isActive ? 'font-bold underline' : 'font-medium no-underline'}`}
	{...props}>
	<slot />
</a>
