import { NewsItem } from "./NewsItem";
import styles from "./newsList.module.scss";

export const NewsList = ({
  heading,
  featured,
  limit,
}: {
  heading: string;
  featured: boolean;
  limit: number;
}) => {
  return (
    <section className={styles.newsWrapper}>
      {heading && <h2 className="suphead">{heading}</h2>}
      <ul className={`${styles.newsList} ${featured && styles.featured}`}>
        {limit === 3 ? (
          <>
            <NewsItem />
            <NewsItem />
            <NewsItem />
          </>
        ) : (
          <>
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
            <NewsItem />
          </>
        )}
      </ul>
    </section>
  );
};