// Google reviews — six reviews from the Google Business Profile, quoted word for word (no edits), first name +
// last initial only, no photos. Rating as shown on Google on 26 Oct 2026; update GOOGLE_RATING when it changes.
// Deliberately no Review / AggregateRating JSON-LD: Google ignores (and may flag) reviews a business marks up about itself.
// Words around the quotes live in src/i18n.js (rv.*); the quotes stay in their original English in both languages.
const GOOGLE_RATING = { score: '5.0', count: 17 };
const GOOGLE_LISTING_URL = 'https://www.google.com/maps/search/?api=1&query=666+Website+Services+Kuala+Lumpur';
const GOOGLE_REVIEWS = [
  { who: 'Althea R.', year: 2026, text: 'Wilson from 666 Website Services gave me really helpful advice on improving my website. He explained things clearly, without the technical jargon, and his suggestions were practical and easy to act on. Looking forward to seeing the finished result. Highly recommended.' },
  { who: 'Agnes C.', year: 2023, text: 'Fair and reasonable price. Affordable especially for SME new enterprise. They will come out some idea to help you save cost' },
  { who: 'Yun Zhuang N.', year: 2023, text: 'Finally I found the professional and friendly web designer. Their staff are responsible and friendly. Highly recommend.' },
  { who: 'Baby Dragon', year: 2023, text: 'Great service and product. Will look for this web development company for my another business as well. Keep the great work up 👍' },
  { who: 'Ally', year: 2023, text: 'Great and excellent service, satisfied with all the work done, 10/10!' },
  { who: 'Sean C.', year: 2023, text: 'very responsible and value for money' },
];

function Reviews() {
  const { t } = useLang();
  return (
    <section className="section" id="reviews">
      <div className="wrap">
        <div className="section-head">
          <div className="reveal">
            <div className="kicker"><span className="dot"></span><span>{t('rv.kicker')}</span><span className="bar"></span><span>{t('rv.kicker.right')}</span></div>
            <h2 className="section-title" style={{marginTop:20}} dangerouslySetInnerHTML={tHtml('rv.title.html')}/>
          </div>
          <div className="reveal d1">
            <p className="lead">{t('rv.lead', GOOGLE_RATING)}</p>
          </div>
        </div>

        <div className="case-grid">
          {GOOGLE_REVIEWS.map((r, i) => (
            <figure key={r.who} className={'case-card review-card reveal d' + ((i % 3) + 1)}>
              <div className="review-top">
                <span className="review-stars" role="img" aria-label={t('rv.stars')}>★★★★★</span>
                <span className="case-tag">{t('rv.source')} · {r.year}</span>
              </div>
              <blockquote lang="en">{r.text}</blockquote>
              <figcaption className="review-by">{r.who}</figcaption>
            </figure>
          ))}
        </div>

        <div className="case-more review-more reveal">
          <a href={GOOGLE_LISTING_URL} target="_blank" rel="noopener" className="link-arrow">{t('rv.more', GOOGLE_RATING)}<Icon.arrowUR/></a>
          <span className="review-note">{t('rv.note')}</span>
        </div>
      </div>
    </section>
  );
}
window.Reviews = Reviews;