// The content source for the blog.
//
// This is a plain in-repo array — the simplest stand-in for a CMS. In a
// real app, swap the body of `getStaticPaths` + the page loader to read
// from your CMS / database / filesystem instead. NOTHING else changes:
// the build still pre-renders one HTML file per entry.
//
// Because this module is imported by both the index page (the list) and
// the [slug] page (the detail) AND by `getStaticPaths`, it is the single
// source of truth for "which posts exist".

export interface Post {
  /** URL segment — `/blog/<slug>`. Must be unique + DNS-safe. */
  readonly slug: string
  readonly title: string
  /** ISO date, shown + used for ordering. */
  readonly date: string
  /** One-line summary — feeds the list + the `<meta name="description">`. */
  readonly excerpt: string
  readonly readingMinutes: number
  /** Body paragraphs, separated by a blank line. */
  readonly body: string
}

export const posts: ReadonlyArray<Post> = [
  {
    slug: 'hello-static',
    title: 'Why this blog ships zero JavaScript',
    date: '2025-01-15',
    excerpt: 'Every page is pre-rendered at build time, so the browser downloads HTML and nothing else.',
    readingMinutes: 3,
    body: `This page was rendered ONCE, when you ran \`voltro build\`. The result is a flat \`dist/blog/hello-static/index.html\` that any CDN can serve in single-digit milliseconds.

There is no server rendering per request, no React hydration on the list page, no rpc client on the wire. The list page even declares \`interactive = 'none'\`, which strips every \`<script>\` the framework would otherwise emit.

When you DO need a sprinkle of interactivity — a reading-progress bar, a copy button, a comment box — you reach for an island instead of hydrating the whole tree. Read the next post for how that works.`,
  },
  {
    slug: 'islands-not-hydration',
    title: 'Islands: hydrate the 5% that moves',
    date: '2025-01-22',
    excerpt: 'A static page with one interactive widget should ship one widget of JavaScript — not the whole page.',
    readingMinutes: 4,
    body: `Look at the top of this page: a thin progress bar tracks how far you have scrolled. That bar is an ISLAND — a single component the framework hydrates inside otherwise-static HTML.

This page declares \`interactive = 'islands'\`, so the framework renders the article once and only attaches React to the \`island()\`-wrapped component. The surrounding HTML has zero React lifecycle running.

Each island picks WHEN it wakes up via a hydrate strategy: \`load\` (immediately), \`idle\`, \`visible\` (on scroll-into-view), or \`interaction\` (on first click). The progress bar uses \`load\` because it must track scrolling from the very first frame.

The lesson: don't default to \`islands\` because it sounds fast. Use it when most of the page is static and only a few widgets move. A dashboard where everything is interactive wants \`full\` hydration instead.`,
  },
  {
    slug: 'cms-to-ssg',
    title: 'From CMS to static pages with getStaticPaths',
    date: '2025-02-03',
    excerpt: 'Enumerate your content once; the build emits one pre-rendered page per entry.',
    readingMinutes: 3,
    body: `A dynamic route like \`src/pages/blog/[slug].tsx\` matches infinitely many URLs. To pre-render it statically, the build needs to know WHICH slugs exist — that is what \`getStaticPaths\` answers.

In this template, \`getStaticPaths\` maps over the \`posts\` array in \`src/content/posts.ts\`. Point it at a CMS API, a database query, or a folder of markdown files instead, and the build will pre-render exactly those pages — the Next.js "static generation from a content source" pattern, with no extra config.

URLs you do not enumerate simply are not built. If a page ALSO sets \`renderMode = 'ssr' | 'isr'\`, \`voltro start\` renders the un-enumerated ones on demand; a pure \`'static'\` page 404s for unknown slugs, which is exactly what you want for a fixed content set.`,
  },
]