chore: add link to headscale acl faq on acl page

app/components/Link.tsx

@@ -0,0 +1,31 @@
+import { LinkExternalIcon } from '@primer/octicons-react'
+
+import { cn } from '~/utils/cn'
+
+/* eslint-disable unicorn/no-keyword-prefix */
+type Properties = {
+	readonly to: string;
+	readonly name: string;
+	readonly children: string;
+	readonly className?: string;
+}
+
+export default function Link({ to, name: alt, children, className }: Properties) {
+	return (
+		<a
+			href={to}
+			aria-label={alt}
+			target='_blank'
+			rel='noreferrer'
+			className={cn(
+				'inline-flex items-center gap-x-1',
+				'text-blue-500 hover:text-blue-700',
+				'dark:text-blue-400 dark:hover:text-blue-300',
+				className
+			)}
+		>
+			{children}
+			<LinkExternalIcon className='h-3 w-3'/>
+		</a>
+	)
+}