/* eslint-disable */
// News screen, full listing of all articles with Show More toggle.
// Reuses the FeaturedRow component which already handles sort + pagination.

const NewsScreen = ({ setRoute }) => {
  const t = (window.useT && window.useT()) || ((k) => k);
  React.useEffect(() => { window.scrollTo({top: 0, behavior: 'instant'}); }, []);

  return (
    <div data-screen-label="News">
      <section className="cbm-section cbm-section--dark" style={{paddingTop: 72, paddingBottom: 40}}>
        <div className="cbm-section__inner">
          <span className="cbm-eyebrow">{t('news_eyebrow')}</span>
          <div className="cbm-section-rule" />
          <h1 className="cbm-section__title">{t('news_title')}</h1>
          <p className="cbm-section__lede" style={{marginTop: 14}}>{t('news_lede')}</p>
        </div>
      </section>
      <section className="cbm-section" style={{padding: '8px 0'}}>
        <div className="cbm-section__inner">
          <AdSlot format="leaderboard" position="news-top" hideOnMobile={true} />
        </div>
      </section>
      <FeaturedRow onArticle={() => setRoute('article')} />
    </div>
  );
};

Object.assign(window, { NewsScreen });