---
const route = Astro.locals.starlightRoute;
const data = route?.entry?.data ?? {};

const lastCommit = data.lastCommit as
  | { subject: string; hash: string; date: string }
  | undefined;

const changedSections = data.changedSections as string[] | undefined;

const badge = data.badge as
  | { text: string; variant: string }
  | undefined;

const daysAgo = lastCommit
  ? Math.floor((Date.now() - new Date(lastCommit.date + "T00:00:00Z").getTime()) / 86_400_000)
  : null;

// Show "what changed" callout on pages that have a lastCommit and a New/Updated badge
const showCallout = !!lastCommit && (badge?.text?.startsWith("New") || badge?.text === "Updated");

const commitUrl = lastCommit
  ? `https://github.com/tylerjrbuell/reactive-agents-ts/commit/${lastCommit.hash}`
  : undefined;

const id = route?.entry?.id ?? "";
---

<h1 id="_top" class="ra-page-title" data-page-id={id}>
  {data.title}
</h1>

{lastCommit && (
  <p class="ra-last-updated">
    Last updated {daysAgo === 0 ? "today" : `${daysAgo} day${daysAgo === 1 ? "" : "s"} ago`}
    {" · "}
    <a href={commitUrl} target="_blank" rel="noopener noreferrer">
      {lastCommit.hash.slice(0, 7)}
    </a>
  </p>
)}

{showCallout && lastCommit && (
  <details class="ra-updated-callout">
    <summary>
      <span class="ra-updated-icon">↑</span>
      {daysAgo === 0
        ? "Updated today"
        : daysAgo === 1
        ? "Updated yesterday"
        : `Updated ${daysAgo} days ago`}
    </summary>
    <p class="ra-updated-detail">
      <span class="ra-updated-subject">"{lastCommit.subject}"</span>
      {" · "}
      <a href={commitUrl} target="_blank" rel="noopener" class="ra-updated-hash">
        {lastCommit.hash}
      </a>
      {" · "}
      <span class="ra-updated-date">{lastCommit.date}</span>
    </p>
    {changedSections && changedSections.length > 0 && (
      <ul class="ra-changed-sections">
        {changedSections.map(s => <li>{s}</li>)}
      </ul>
    )}
  </details>
)}

<script define:vars={{ changedSections: changedSections ?? [] }}>
  function applyUpdateIndicators() {
    // Sidebar dots — find ALL <a> elements site-wide that contain a .sl-badge
    document.querySelectorAll('a').forEach(function(a) {
      const badge = a.querySelector('.sl-badge');
      if (badge && (badge.classList.contains('note') || badge.classList.contains('success'))) {
        a.dataset.raUpdated = '1';
      }
    });

    // TOC section dots — find TOC links matching changedSections
    if (changedSections.length > 0) {
      const tocLinks = document.querySelectorAll('starlight-toc a');
      tocLinks.forEach(function(a) {
        const linkText = a.textContent.trim().toLowerCase();
        const matched = changedSections.some(function(section) {
          const clean = section.replace(/^#{1,6}\s*/, '').toLowerCase().trim();
          return linkText === clean || linkText.includes(clean) || clean.includes(linkText);
        });
        if (matched) {
          a.dataset.raChanged = '1';
        }
      });
    }
  }

  document.addEventListener('astro:page-load', applyUpdateIndicators);
  applyUpdateIndicators();
</script>
