import type { Metadata } from "next";

export const metadata: Metadata = { title: "RSS Beslemeleri" };

const feeds = [
  {
    name: "Tüm İçerikler",
    url: "/api/rss/all",
    desc: "Blog, infosec yazıları ve notebook notlarının tamamı tek beslemede",
    icon: "⊞",
  },
  {
    name: "Personal Blog",
    url: "/api/rss/blog",
    desc: "Yalnızca kişisel blog yazıları",
    icon: "✍",
  },
  {
    name: "Infosec Posts",
    url: "/api/rss/infosec",
    desc: "Yalnızca teknik güvenlik yazıları",
    icon: "⚔",
  },
  {
    name: "Podcast",
    url: "/api/rss/podcast",
    desc: "Podcast bölümleri — yakında",
    icon: "◉",
  },
];

export default function RssBeslemeleriPage() {
  return (
    <div style={{ maxWidth: "100%" }}>
      <div className="page-title">RSS Beslemeleri</div>
      <p style={{ fontSize: "0.8rem", color: "var(--text-muted)", marginBottom: "2rem" }}>
        İçerikleri RSS ile takip edin — algoritmalar olmadan
      </p>

      {/* Feed List */}
      <div style={{ display: "flex", flexDirection: "column", gap: "0.75rem", marginBottom: "2rem" }}>
        {feeds.map((feed) => (
          <div key={feed.name} className="card">
            <div style={{ display: "flex", alignItems: "center", gap: "1rem" }}>
              <div style={{ width: "36px", height: "36px", background: "#f26522", borderRadius: "6px", display: "flex", alignItems: "center", justifyContent: "center", color: "#fff", fontSize: "1rem", flexShrink: 0 }}>
                {feed.icon}
              </div>
              <div style={{ flex: 1 }}>
                <div style={{ fontSize: "0.88rem", fontWeight: 600, color: "var(--text)", marginBottom: "0.15rem" }}>{feed.name}</div>
                <div style={{ fontSize: "0.75rem", color: "var(--text-muted)" }}>{feed.desc}</div>
              </div>
              <a
                href={feed.url}
                style={{ fontSize: "0.75rem", color: "var(--accent)", fontWeight: 600, display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 }}
              >
                Abone Ol →
              </a>
            </div>
          </div>
        ))}
      </div>

      {/* What is RSS */}
      <div className="card prose">
        <h2>RSS Nedir?</h2>
        <p>
          RSS (Really Simple Syndication), web sitelerinin yeni içeriklerini otomatik olarak
          takipçilerine bildirmesini sağlayan bir teknolojidir. 2000&apos;li yılların başında
          popülerleşen bu teknoloji, günümüzde hâlâ aktif olarak kullanılmaktadır.
        </p>

        <h2>Neden RSS?</h2>
        <ul>
          <li><strong>Algoritma yok:</strong> Hangi içeriği göreceğinizi siz seçersiniz</li>
          <li><strong>Reklam yok:</strong> Doğrudan içerik, gürültüsüz</li>
          <li><strong>Gizlilik:</strong> Okuma alışkanlıklarınız üçüncü taraflarla paylaşılmaz</li>
          <li><strong>Merkezi değil:</strong> Tek platform bağımlılığı yok</li>
          <li><strong>Hız:</strong> Yeni içerikler anında ulaşır</li>
        </ul>

        <h2>Nasıl Kullanılır?</h2>
        <p>
          Bir RSS okuyucusuna ihtiyacınız var. Önerilen okuyucular:
        </p>
        <ul>
          <li><strong>Miniflux</strong> — Self-hosted, minimalist, açık kaynak</li>
          <li><strong>Feedbin</strong> — Bulut tabanlı, güzel arayüz</li>
          <li><strong>NetNewsWire</strong> — macOS/iOS için ücretsiz</li>
          <li><strong>Reeder</strong> — iOS/macOS için ücretli ama kaliteli</li>
        </ul>

        <p>
          RSS okuyucunuzu açın, yukarıdaki feed URL&apos;lerinden birini kopyalayın ve
          okuyucunuza ekleyin. Artık yeni içerikler otomatik olarak gelecek.
        </p>

        <h2>OPML Dosyası</h2>
        <p>
          Tüm beslemeleri tek seferde eklemek için OPML dosyasını indirin:
        </p>
        <pre>{`<opml version="2.0">
  <body>
    <outline text="denizbektas.com.tr Feeds">
      <outline type="rss" text="Tüm İçerikler"
               xmlUrl="https://denizbektas.com.tr/api/rss/all"/>
      <outline type="rss" text="Blog"
               xmlUrl="https://denizbektas.com.tr/api/rss/blog"/>
      <outline type="rss" text="Infosec"
               xmlUrl="https://denizbektas.com.tr/api/rss/infosec"/>
    </outline>
  </body>
</opml>`}</pre>
      </div>
    </div>
  );
}
