Exercise 2: Replacing the Breadcrumb Loop — Possible Solution
====================================================================

// src/layouts/PageLayout.astro (updated)
---
import { db } from '../db/client';
import { pages } from '../db/schema';
import { eq } from 'drizzle-orm';

interface Props {
  page: typeof pages.$inferSelect;
}

const { page } = Astro.props;

const pageWithAncestors = await db.query.pages.findFirst({
  where: eq(pages.id, page.id),
  with: {
    parent: {
      with: {
        parent: {
          with: {
            parent: {
              with: { parent: true }
            }
          }
        }
      }
    }
  }
});

function flattenAncestors(node: typeof pageWithAncestors) {
  const chain = [];
  let current = node;
  while (current) {
    chain.unshift(current);
    current = current.parent ?? null;
  }
  return chain;
}

const breadcrumb = flattenAncestors(pageWithAncestors);
---

CONFIRMATION
------------------------------
For the same three-level Programming/General-Purpose Languages/Java
page from Chapter 4's own Exercise 2, this produces the identical
[Programming, General-Purpose Languages, Java] array - same correct
order, now built from one eagerly-loaded query result instead of a
loop issuing one query per level.

WHY THIS WORKS AS AN ANSWER
------------------------------
It correctly replaces the query-per-level loop with a single
db.query.pages.findFirst({ with: ... }) call, and correctly confirms
the resulting breadcrumb order matches what the original, less
efficient version already produced.