// Milfers · Reseñas reales · rotación día / semana / mes
// Datos (con traducción ES/VAL/EN) en reviews-data.js → window.MF_REVIEWS
// =====================================================================

const REVIEWS = window.MF_REVIEWS || [];

// localiza la fecha real al idioma activo (mes + año)
function localizeDate(date) {
  const map = (window.MF_MONTHS && window.MF_MONTHS[window.MF_LANG]) || null;
  if (!map) return date;
  return date.replace(/^([a-zñ]+)/i, (m) => map[m.toLowerCase()] || m);
}
// cuerpo en el idioma activo, con fallback a español
function reviewBody(r) {
  if (r.body && typeof r.body === 'object') return r.body[window.MF_LANG] || r.body.es;
  return r.body;
}

// ── ROTACIÓN DETERMINÍSTICA ──────────────────────────────────────────────
// hash simple para barajar reproduciblemente según un seed (día/semana/mes)
function pickRotating(list, count, seed) {
  if (list.length <= count) return list;
  const arr = list.map((r, i) => ({ r, k: hashStr(r.name + seed + i) }));
  arr.sort((a, b) => a.k - b.k);
  return arr.slice(0, count).map(x => x.r);
}
function hashStr(s) {
  let h = 2166136261;
  for (let i = 0; i < s.length; i++) { h = (h ^ s.charCodeAt(i)) * 16777619; h |= 0; }
  return h;
}

function buildTodayPool() {
  const today = new Date();
  const dayKey = `${today.getFullYear()}-${today.getMonth() + 1}-${today.getDate()}`;
  const weekKey = `${today.getFullYear()}-W${Math.ceil((today.getDate() + new Date(today.getFullYear(), today.getMonth(), 1).getDay()) / 7)}-${today.getMonth()}`;
  const monthKey = `${today.getFullYear()}-${today.getMonth() + 1}`;

  const daily = REVIEWS.filter(r => r.tier === 'daily');
  const weekly = REVIEWS.filter(r => r.tier === 'weekly');
  const monthly = REVIEWS.filter(r => r.tier === 'monthly');

  const pick = [
    ...pickRotating(daily, 2, dayKey),
    ...pickRotating(weekly, 1, weekKey),
    ...pickRotating(monthly, 1, monthKey),
  ];

  while (pick.length < 4 && REVIEWS.length > pick.length) {
    const next = REVIEWS.find(r => !pick.includes(r));
    if (next) pick.push(next);
    else break;
  }
  return pick.slice(0, 4);
}

function ReviewsSection() {
  const todayReviews = React.useMemo(() => buildTodayPool(), []);

  return (
    <section className="mf-reviews" id="resenas">
      {/* EDIT: brand corner bursts + cursive "Milfers" stamp as background texture */}
      <div className="mf-reviews-burst mf-reviews-burst--tl" aria-hidden="true"><i className="bg bg--burst-tl"></i></div>
      <div className="mf-reviews-burst mf-reviews-burst--br" aria-hidden="true"><i className="bg bg--burst-tl"></i></div>
      <div className="mf-reviews-stamp" aria-hidden="true"><i className="bg bg--stamp"></i></div>
      <div className="mf-reviews-inner">
        <div className="mf-reviews-head">
          <div className="mf-reviews-head-l reveal">
            <span className="ed-sec-title" style={{color:'var(--milfers-black)'}}>
              <span className="n">5.</span>&nbsp;<span dangerouslySetInnerHTML={{__html: window.t('reviews.eyebrow')}} />
            </span>
            <h2 className="mf-reviews-head-title" dangerouslySetInnerHTML={{__html: window.t('reviews.title')}} />
          </div>
          <div className="mf-reviews-head-r reveal delay-2">
            <a className="mf-reviews-link" href="https://share.google/IEUlIormxKDAg1FU7" target="_blank" rel="noreferrer">
              {window.t('reviews.link')}
            </a>
          </div>
        </div>

        <div className="mf-reviews-grid">
          {todayReviews.map((r, i) => (
            <article className={`mf-review reveal delay-${(i%4)+1}`} key={r.name + i}>
              <div className="mf-review-stars">★★★★★</div>
              <p className="mf-review-body">"{reviewBody(r)}"</p>
              <div className="mf-review-meta">
                <span className="mf-review-name">{r.name}</span>
                <span className="mf-review-date">{localizeDate(r.date)} · {window.t('reviews.source')}</span>
              </div>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}

window.ReviewsSection = ReviewsSection;