// src/pages/Sitemap.js
import React, { useEffect } from 'react';
import { getArticles } from '../firebase';

const Sitemap = () => {
  useEffect(() => {
    const generateSitemap = async () => {
      try {
        // Fetch articles from Firebase
        const articles = await getArticles();
        const today = new Date().toISOString().split('T')[0];
        
        // Start building sitemap
        let sitemap = `<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
        xmlns:news="http://www.google.com/schemas/sitemap-news/0.9">
  
  <!-- ===== STATIC PAGES ===== -->
  
  <url>
    <loc>https://kohlanewspakistan.asia/</loc>
    <lastmod>${today}</lastmod>
    <changefreq>daily</changefreq>
    <priority>1.0</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/about</loc>
    <lastmod>${today}</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.5</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/news</loc>
    <lastmod>${today}</lastmod>
    <changefreq>daily</changefreq>
    <priority>0.9</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/features</loc>
    <lastmod>${today}</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/breaking</loc>
    <lastmod>${today}</lastmod>
    <changefreq>daily</changefreq>
    <priority>0.9</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/latest</loc>
    <lastmod>${today}</lastmod>
    <changefreq>daily</changefreq>
    <priority>0.9</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/contact</loc>
    <lastmod>${today}</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.5</priority>
  </url>

  <url>
    <loc>https://kohlanewspakistan.asia/subscribe</loc>
    <lastmod>${today}</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.4</priority>
  </url>`;

        // ===== ADD REAL ARTICLES FROM FIREBASE =====
        if (articles && articles.length > 0) {
          articles.forEach(article => {
            if (article.slug) {
              const articleDate = article.date || today;
              const articleTitle = article.title || 'Untitled';
              const articleTags = article.tags ? article.tags.join(', ') : '';
              
              sitemap += `
  
  <url>
    <loc>https://kohlanewspakistan.asia/news/${article.slug}</loc>
    <lastmod>${articleDate}</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.8</priority>
    <news:news>
      <news:publication>
        <news:name>Kohla News</news:name>
        <news:language>en</news:language>
      </news:publication>
      <news:publication_date>${articleDate}</news:publication_date>
      <news:title>${articleTitle}</news:title>
      <news:keywords>${articleTags}</news:keywords>
    </news:news>
  </url>`;
            }
          });
        }

        sitemap += `
</urlset>`;

        // Display the sitemap
        document.body.innerHTML = `<pre style="font-family: monospace; white-space: pre-wrap; padding: 20px; font-size: 14px; background: #f5f5f5;">${sitemap}</pre>`;
        
      } catch (error) {
        console.error('Error generating sitemap:', error);
        document.body.innerHTML = `Error generating sitemap: ${error.message}`;
      }
    };

    generateSitemap();
  }, []);

  return null;
};

export default Sitemap;