import { ActionLink } from '@/components/actions/ActionLink';
import styles from './FooterLinkGroup.module.css';

export interface FooterLinkItem {
  id: string;
  label: string;
  href?: string;
  disabledReason?: string;
}

export function FooterLinkGroup({ title, links }: { title: string; links: FooterLinkItem[] }) {
  return (
    <section className={styles.group}>
      <h2>{title}</h2>
      <ul>
        {links.map((link) => (
          <li key={link.id}>
            <ActionLink
              href={link.href ?? '/'}
              variant="muted"
              {...(link.disabledReason ? { disabledReason: link.disabledReason } : {})}
            >
              {link.label}
            </ActionLink>
          </li>
        ))}
      </ul>
    </section>
  );
}
