---
import BlogLayout from "../../layouts/BlogLayout.astro";
import { readContentCache } from "../../lib/content/cache";
import { wordpressCategories, wordpressPages } from "../../lib/content/selectors";

const cache = await readContentCache();
const categories = wordpressCategories(cache);
const pages = wordpressPages(cache);
---

<BlogLayout
  title="Blog Pages | SanthoshJ"
  description="Pages from my WordPress site."
  canonicalPath="/blog/pages"
  categories={categories}
  activeCategorySlug="__pages"
>
  <section class="section">
    <div class="section-header">
      <h2>Pages</h2>
      <span class="muted">{pages.length} page{pages.length === 1 ? "" : "s"}</span>
    </div>

    {pages.length > 0 ? (
      <div class="empty">
        {pages.map((p) => (
          <div style="padding: 6px 0;">
            <a
              href={`/blog/page/${p.slug}`}
              data-umami-event="click"
              data-umami-event-target_id={`blog.pages.link.${p.slug}`}
              data-umami-event-placement="blog.pages.list"
              data-umami-event-target_url={`/blog/page/${p.slug}`}
              data-umami-event-title={p.title}
              data-umami-event-type="blog_page"
            >
              {p.title}
            </a>
          </div>
        ))}
      </div>
    ) : (
      <div class="empty">No pages yet.</div>
    )}
  </section>
</BlogLayout>
