import Link from "next/link";
import type { ComponentType } from "react";

interface Props {
  href: string;
  icon: ComponentType<{ className?: string }>;
  label: string;
}

export function QuickAction({ href, icon: Icon, label }: Props) {
  return (
    <Link
      href={href}
      className="group inline-flex h-11 items-center gap-2.5 rounded-full border border-slate-200/70 bg-white px-4 text-sm font-semibold text-slate-700 transition hover:-translate-y-0.5 hover:border-slate-300 hover:shadow-soft dark:border-slate-800/80 dark:bg-slate-900/70 dark:text-slate-200 dark:hover:border-slate-700"
    >
      <Icon className="icon-md text-slate-400 transition-colors group-hover:text-brand-600 dark:group-hover:text-brand-400" />
      {label}
    </Link>
  );
}