import { TextLink } from '#/components/molecules/text-link.jsx';
import { cn } from '#/lib/utils.js';

/** A "show all N / show fewer" toggle for a list capped to a first page. */
export function ShowMore({ total, cap, expanded, onToggle, noun, className }) {
  if (total <= cap) return null;
  return (
    <TextLink onClick={onToggle} className={cn('mt-3', className)}>
      {expanded ? 'Show fewer' : `Show all ${total} ${noun}`}
    </TextLink>
  );
}