// Uygulamaya özel kullanım şartları sayfaları.
//
// Play Console "satıcı durumu beyanı" ile birlikte UYGULAMA BAŞINA bir hizmet
// şartları adresi istiyor; App Store da EULA bağlantısını uygulama başına
// alıyor. Bu yüzden veri silme sayfalarında olduğu gibi her uygulamanın kendi
// adresi var (/kullanim-sartlari/<slug>, /en/terms/<enSlug>). Genel sayfa
// (/kullanim-sartlari) yerinde duruyor — eski uygulama sürümleri ve mağaza
// kayıtları oraya bağlı — üstünde uygulama seçici var.
//
// İçerik terms.jsx'te: `apps.<key>` o uygulamanın maddeleri, `common()` her
// sayfanın altına eklenen ortak maddeler (lisans, mağaza şartları, sorumluluk,
// hukuk). Uygulamada satın alma, reklam ya da sosyal özellik değişince ilgili
// bölüm güncellenmeli.

// Dile bağlı olmayan kimlik. Görünen ad `t.appsMeta[key].name`den geliyor.
const TERMS_APPS = [
  { key: 'tenax',      slug: 'tenax',       enSlug: 'tenax',       pkg: 'com.kolabs.tenax',      logo: 'assets/tenax-logo.png',      accent: '#b9ff3a' },
  { key: 'zikirmatik', slug: 'zikirmatik',  enSlug: 'zikirmatik',  pkg: 'com.kolabs.zikirmatik', logo: 'assets/zikirmatik-logo.png', accent: '#2E9E4A' },
  { key: 'ramazan',    slug: 'vakit',       enSlug: 'vakit',       pkg: 'com.kolabs.imsakiye',   logo: 'assets/ramazan-logo.jpg',    accent: '#f5b83d' },
  { key: 'noctavia',   slug: 'noctavia',    enSlug: 'noctavia',    pkg: 'com.kolabs.noctavia',   logo: 'assets/noctavia-logo.png',   accent: '#b69bff' },
  { key: 'kelimebul',  slug: 'kelime-bul',  enSlug: 'word-find',   pkg: 'com.kolabs.kelimebul',  logo: 'assets/kelimebul-logo.jpg',  accent: '#ffb45a' },
  { key: 'hesapvakti', slug: 'hesap-vakti', enSlug: 'bill-time',   pkg: 'com.kolabs.hesapvakti', logo: 'assets/hesapvakti-logo.png', accent: '#ff5a82' },
  { key: 'patisstray', slug: 'patisstray',  enSlug: 'patisstray',  pkg: 'com.kolabs.patisstray', logo: 'assets/patisstray-logo.png', accent: '#8b5cf6' },
  { key: 'palet',      slug: 'palet',       enSlug: 'palet',       pkg: 'com.kolabs.palet',      logo: 'assets/palet-logo.png',      accent: '#ffb547' },
  { key: 'thaw',       slug: 'thaw',        enSlug: 'thaw',        pkg: 'com.kolabs.thaw',       logo: 'assets/thaw-logo.png',       accent: '#ffd166' },
];

// /kullanim-sartlari/<slug> ve /terms/<enSlug>. app.jsx yolu TR'ye
// kanonikleştirip veriyor; /terms/... (önekisiz İngilizce) de tutsun diye iki
// kök de kabul ediliyor.
function termsRoute(path) {
  const p = path.length > 1 ? path.replace(/\/+$/, '') : path;
  const m = p.match(/^\/(?:kullanim-sartlari|terms)\/([^/]+)$/);
  if (!m) return null;
  return TERMS_APPS.find(a => a.slug === m[1] || a.enSlug === m[1]) || null;
}

function termsPath(app) {
  return `/kullanim-sartlari/${app.slug}`;
}

// Genel şartlar sayfasının üstündeki seçici: mağaza inceleyicisi ya da
// kullanıcı kendi uygulamasının sayfasına buradan geçer.
function TermsAppPicker() {
  const t = useT();
  const s = t.termsApps;
  return (
    <section style={{marginBottom: 56}}>
      <h2>{s.pickTitle}</h2>
      <p>{s.pickDesc}</p>
      <div className="del-apps">
        {TERMS_APPS.map(app => (
          <Link key={app.key} to={termsPath(app)} className="del-app-card" style={{'--page-accent': app.accent}}>
            <img src={app.logo} alt="" />
            <div>
              <div className="del-app-name">{t.appsMeta[app.key].name}</div>
              <div className="del-app-pkg">{app.pkg}</div>
            </div>
            <span className="arrow">→</span>
          </Link>
        ))}
      </div>
    </section>
  );
}

// Bölümler numaralı: önce uygulamanın kendi maddeleri, sonra ortak maddeler —
// numara kesintisiz sürüyor, metinde "bkz. madde N" demek mümkün olsun diye.
function TermsSections({ sections }) {
  return sections.map((s, i) => (
    <React.Fragment key={i}>
      <h2>{i + 1}. {s.h}</h2>
      {s.body}
    </React.Fragment>
  ));
}

function TermsAppPage({ app }) {
  const t = useT();
  const s = t.termsApps;
  const a = s.apps[app.key];
  const name = t.appsMeta[app.key].name;
  const sections = [...a.sections, ...s.common({ app, name, a })];

  return (
    <main className="legal-page">
      <div className="detail-wrap" style={{maxWidth: 900}}>
        <Crumbs items={[{label:'kolabs',to:'/'},{label:s.crumb,to:'/kullanim-sartlari'},{label:name}]} />
        <header className="del-head" style={{'--page-accent': app.accent}}>
          <img className="del-logo" src={app.logo} alt="" />
          <div>
            <div className="detail-eyebrow"><span className="pill">{s.eyebrow}</span></div>
            <h1 className="detail-h1" style={{fontSize:'clamp(34px, 5vw, 54px)', marginBottom: 14}}>{s.titlePrefix} {name}</h1>
            <p className="del-pkg">{a.platforms} · <code>{app.pkg}</code></p>
            <p className="del-updated">{t.legalLastUpdated} {a.lastUpdated || s.lastUpdated}</p>
          </div>
        </header>

        <div className="legal-body">
          <p className="legal-lead">{s.lead(name)}</p>
          <TermsSections sections={sections} />

          <h2>{s.otherAppsTitle}</h2>
          <div className="row-flex" style={{marginTop: 4}}>
            {TERMS_APPS.filter(x => x.key !== app.key).map(x => (
              <Link key={x.key} to={termsPath(x)} className="btn btn-ghost">
                <span>{t.appsMeta[x.key].name}</span><span className="arrow">→</span>
              </Link>
            ))}
          </div>
        </div>
      </div>
    </main>
  );
}

Object.assign(window, { TERMS_APPS, termsRoute, termsPath, TermsAppPicker, TermsAppPage });
