---
import { getI18n } from '../../lib/i18n';

type FaqItem = {
  question: string;
  answer: string;
};

interface Props {
  badge?: string;
  kicker?: string;
  title: string;
  summary: string;
  highlights?: string[];
  faqs?: FaqItem[];
}

const {
  badge = 'ai brief',
  kicker = 'geo / summary',
  title,
  summary,
  highlights = [],
  faqs = [],
} = Astro.props as Props;
const { locale } = getI18n(Astro);
const isEnglish = locale.startsWith('en');
---

<section class="sr-only" data-discovery-brief>
  <p>{badge}</p>
  <p>{kicker}</p>
  <h3>{title}</h3>
  <p>{summary}</p>

  <div>
    <h4>{isEnglish ? 'Key signals' : '关键信号'}</h4>
    {highlights.length > 0 ? (
      <ul>
        {highlights.map((item) => (
          <li>{item}</li>
        ))}
      </ul>
    ) : (
      <p>{summary}</p>
    )}
  </div>

  <div>
    <h4>{isEnglish ? 'FAQ' : '常见问答'}</h4>
    {faqs.length > 0 ? (
      <div>
        {faqs.slice(0, 3).map((item) => (
          <article>
            <p>{item.question}</p>
            <p>{item.answer}</p>
          </article>
        ))}
      </div>
    ) : (
      <p>{summary}</p>
    )}
  </div>
</section>
