/* Die 3 Analysen, die im Newsletter (Öffnungsrate) und auf YouTube (Views) zugleich vorn lagen.
   Auswahl 26.10.2026 aus DB Content, je ein anderes Thema: Strategie, Arbeitsweise, China.
   Bilder sind die Newsletter-Thumbnails (Beehiiv), nicht die YouTube-Thumbnails. */
const TOP_ANALYSEN_DE = [
    {
      date: '2026-09-06',
      title: 'Volkswagen erlebt seinen Nokia-Moment (und wir streiten über Werke)',
      line: 'Volkswagen entwickelt seine Autos bald nicht mehr selbst.',
      read: 'https://www.autopreneur.de/p/vw-krise-2026-werke-stellenabbau',
      watch: 'https://www.youtube.com/watch?v=cRgYIb2hnrs',
      thumb: 'assets/analysen/vw.jpg',
    },
    {
      date: '2026-07-19',
      title: 'Mercedes will mehr Produktivität. Und bekommt mehr Bullshit',
      line: 'Nicht die Stunden sind das Problem, sondern die Arbeitsweise im Konzern.',
      read: 'https://www.autopreneur.de/p/mercedes-40-stunden-woche-gleiches-geld',
      watch: 'https://www.youtube.com/watch?v=K4oN0CxS2mQ',
      thumb: 'assets/analysen/mercedes.jpg',
    },
    {
      date: '2026-04-05',
      title: 'BYD stürzt ab. Und genau das ist Chinas Plan',
      line: 'Warum der Absturz BYD gefährlicher macht.',
      read: 'https://www.autopreneur.de/p/byd-china-europa-elektroauto-strategie',
      watch: 'https://www.youtube.com/watch?v=Wx7h3e5ToXA',
      thumb: 'assets/analysen/byd.jpg',
    },
];

const TOP_ANALYSEN_TEXT_DE = {
  title: 'Meine meistgelesenen Analysen',
  read: 'Lesen',
  watch: 'Auf YouTube ansehen',
  archive: 'Alle Analysen im Archiv',
  archiveHref: 'https://www.autopreneur.de/archive',
  locale: 'de-DE',
  dateFormat: { day: '2-digit', month: '2-digit', year: 'numeric' },
};

// Defaults sind die deutsche Seite, /ueber-mich/en reicht Karten und Texte durch.
// timeZone UTC: das ISO-Datum ist ein Kalendertag, sonst rutscht es westlich von UTC einen Tag zurück.
function TopAnalysen({ items = TOP_ANALYSEN_DE, t: tIn = {} }) {
  const t = { ...TOP_ANALYSEN_TEXT_DE, ...tIn };
  const fmt = new Intl.DateTimeFormat(t.locale, { ...t.dateFormat, timeZone: 'UTC' });
  return (
    <section className="section analysen">
      <div className="container-narrow">
        <h2 className="section-title">{t.title}</h2>
        <div className="analysen-list">
          {items.map((a, i) => (
            <article key={i} className="analyse-card">
              <img className="analyse-thumb" src={a.thumb} alt="" width="640" height="357" loading="lazy" />
              <div className="analyse-body">
                <time className="analyse-date" dateTime={a.date}>{fmt.format(new Date(a.date + 'T00:00:00Z'))}</time>
                <h3 className="analyse-title">{a.title}</h3>
                <p className="analyse-line">{a.line}</p>
                <div className="analyse-links">
                  <a href={a.read} target="_blank" rel="noopener noreferrer" aria-label={t.read + ': ' + a.title}>{t.read} →</a>
                  <a href={a.watch} target="_blank" rel="noopener noreferrer" aria-label={t.watch + ': ' + a.title}>{t.watch} →</a>
                </div>
              </div>
            </article>
          ))}
        </div>
        <a className="analysen-archiv" href={t.archiveHref} target="_blank" rel="noopener noreferrer">{t.archive} →</a>
      </div>
    </section>
  );
}
window.TopAnalysen = TopAnalysen;