ferst-core 0.5.2 → 0.6.0

package/bin/cms-config.mjs

@@ -60,25 +60,37 @@ export function repoSlug() {
   return '';
 }
 
+export const PROD_GIT_BASE = 'https://signin.ferst.co.uk';
+export const DEV_GIT_BASE = 'https://signin-dev.ferst.co.uk';
+
 /**
- * The platform git-proxy origin (CMS `base_url` / `api_root`) for THIS site:
- *   FERST_GIT_BASE env → committed `ferst-site.json` `gitBase` → prod default.
- * The seeder writes `ferst-site.json` with the origin of the worker that provisioned
- * the site, so a dev-provisioned site points its CMS backend at the dev worker and a
- * prod one at prod — the "site respects the portal it was generated from" binding,
- * restored at build time.
+ * The platform git-proxy origin (CMS `base_url` / `api_root`) for THIS build:
+ *   1. `FERST_GIT_BASE` env — explicit override, always wins.
+ *   2. committed `ferst-site.json` `gitBase` — an explicit per-site pin (e.g. a
+ *      custom proxy); a BYO/seeded site can hard-bind its origin this way.
+ *   3. otherwise DERIVE from the deploy environment: the production branch talks to
+ *      the prod git-proxy, every other (preview/dev) branch talks to the dev
+ *      git-proxy. So a templated repo self-configures per environment on deploy — a
+ *      dev-branch build points its CMS at the dev worker and main at prod — with NO
+ *      per-client config. (The production branch defaults to `main`; override via
+ *      `FERST_PROD_BRANCH` env or `ferst-site.json` `productionBranch`.)
+ * This restores the "site respects the environment it's deployed in" binding the old
+ * per-branch site config gave, without a per-client file to maintain.
  */
-export function resolveGitBase(cwd = process.cwd()) {
+export function resolveGitBase(cwd = process.cwd(), branch = deploymentBranch()) {
   const fromEnv = env('FERST_GIT_BASE');
   if (fromEnv) return fromEnv;
+  let prodBranch = env('FERST_PROD_BRANCH') || 'main';
   try {
-    const raw = readFileSync(resolve(cwd, 'ferst-site.json'), 'utf8');
-    const site = JSON.parse(raw);
+    const site = JSON.parse(readFileSync(resolve(cwd, 'ferst-site.json'), 'utf8'));
     if (site && typeof site.gitBase === 'string' && site.gitBase.trim()) return site.gitBase.trim();
+    if (!env('FERST_PROD_BRANCH') && site && typeof site.productionBranch === 'string' && site.productionBranch.trim()) {
+      prodBranch = site.productionBranch.trim();
+    }
   } catch {
-    /* no ferst-site.json (e.g. the template repo itself) — fall through to the default */
+    /* no ferst-site.json (e.g. the template repo itself) — derive from the branch */
   }
-  return 'https://signin.ferst.co.uk';
+  return branch === prodBranch ? PROD_GIT_BASE : DEV_GIT_BASE;
 }
 
 /** The deployment branch: CF Pages env → current git branch → main. */
@@ -123,9 +135,9 @@ function main() {
     console.error('ferst-cms-config: could not determine the repo — set GITHUB_REPOSITORY=owner/name.');
     process.exit(1);
   }
-  // The platform git-proxy origin for this site (env → ferst-site.json → prod default).
-  const base = resolveGitBase();
+  // Branch first, so the git-proxy origin can be derived from the deploy environment.
   const branch = deploymentBranch();
+  const base = resolveGitBase(process.cwd(), branch);
 
   let tpl;
   try {

package/components/NewsList.astro

@@ -0,0 +1,52 @@
+---
+/**
+ * NewsList — a responsive grid of PostCards, shared by the posts index and tag
+ * pages. Promoted into core (from a client's src/custom/) so the ferst()
+ * integration can inject the blog routes for every client. Presentational: it
+ * renders whatever posts it is given (the route decides which — index, or a
+ * single tag). Core ships PostCard; this arranges them.
+ */
+import PostCard from './PostCard.astro';
+import { postLink } from '../content/posts';
+
+interface PostItem {
+  slug: string;
+  body?: string | null;
+  data: { title: string; date: Date | string; summary?: string; heroImage?: string; tags?: string[]; attachment?: string };
+}
+interface Props {
+  posts: PostItem[];
+  empty?: string;
+}
+const { posts, empty = 'No posts yet.' } = Astro.props;
+---
+
+{posts.length === 0 ? (
+  <p class="news-empty">{empty}</p>
+) : (
+  <div class="news-grid">
+    {posts.map((p) => {
+      // A post that is just an attached PDF (no body) links straight to the file.
+      const { href, newTab } = postLink(p);
+      return (
+        <PostCard
+          href={href}
+          newTab={newTab}
+          moreLabel={newTab ? 'Open PDF' : undefined}
+          title={p.data.title}
+          date={p.data.date}
+          summary={p.data.summary}
+          heroImage={p.data.heroImage}
+          tagLabels={p.data.tags}
+        />
+      );
+    })}
+  </div>
+)}
+
+<style>
+  .news-grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
+  @media (min-width: 40em) { .news-grid { grid-template-columns: repeat(2, 1fr); } }
+  @media (min-width: 60em) { .news-grid { grid-template-columns: repeat(3, 1fr); } }
+  .news-empty { color: var(--muted); }
+</style>

package/components/PostsFilter.astro

@@ -0,0 +1,73 @@
+---
+/**
+ * PostsFilter — a row of tag chips linking to each tag's page
+ * (/posts/tag/<slug>), with "All" back to /posts; the active tag is marked
+ * aria-current. No JS. Promoted into core (from a client's src/custom/) so the
+ * ferst() integration can inject the blog routes. Feed it core's getUsedTags
+ * (visible tags that actually have posts, with counts).
+ */
+interface Tag {
+  slug: string;
+  label: string;
+  count: number;
+}
+interface Props {
+  tags: Tag[];
+  /** The active tag slug; omit on the main index ("All"). */
+  active?: string;
+}
+const { tags, active } = Astro.props;
+---
+
+{tags.length > 0 && (
+  <nav class="posts-filter" aria-label="Filter posts by tag">
+    <a class:list={['posts-filter__chip', { 'is-active': !active }]} href="/posts" aria-current={!active ? 'page' : undefined}>
+      All
+    </a>
+    {tags.map((t) => (
+      <a
+        class:list={['posts-filter__chip', { 'is-active': active === t.slug }]}
+        href={`/posts/tag/${t.slug}`}
+        aria-current={active === t.slug ? 'page' : undefined}
+      >
+        {t.label}<span class="posts-filter__count">{t.count}</span>
+      </a>
+    ))}
+  </nav>
+)}
+
+<style>
+  .posts-filter {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.5rem;
+  }
+  .posts-filter__chip {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.4rem;
+    padding: 0.4rem 0.9rem;
+    border: var(--card-border);
+    border-radius: var(--radius-pill);
+    background: var(--bg-surface);
+    color: var(--accent);
+    font-family: var(--font-heading);
+    font-size: 0.85rem;
+    font-weight: 600;
+    text-decoration: none;
+    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
+  }
+  .posts-filter__chip:hover {
+    border-color: var(--gold);
+    color: var(--gold);
+  }
+  .posts-filter__chip.is-active {
+    background: var(--gold);
+    border-color: var(--gold);
+    color: var(--text-light);
+  }
+  .posts-filter__count {
+    font-size: 0.75em;
+    opacity: 0.7;
+  }
+</style>

package/integration.mjs

@@ -2,26 +2,30 @@
  * ferst() — the Astro integration that makes a client site's ROUTING package-owned.
  *
  * A thin client adds `integrations: [ferst()]` to astro.config.mjs and carries
- * ZERO page files: the page catch-all (which also owns the home page) and the
- * calendar route are injected from ferst-core. A routing fix then ships as a
- * package bump + rebuild — the same channel component fixes travel through — instead
- * of being hand-copied into every client repo.
+ * ZERO page files: the page catch-all (which also owns the home page), the
+ * calendar route and the blog routes are injected from ferst-core. A routing fix
+ * then ships as a package bump + rebuild — the same channel component fixes travel
+ * through — instead of being hand-copied into every client repo.
  *
  * Irreducible caveat (Astro 5): content collections must be defined in the CONSUMER,
  * so the one-line `src/content/config.ts` re-export stays. "Zero page files" is
  * reachable; "zero files" is not. Explicit client `.astro` routes still win over
  * these injected ones, so a one-off hand-built page is always possible.
  *
- * Blog routes (news index / posts / tags) are deliberately NOT injected yet — the
- * listing component (NewsList) is not in the package. They join once it is promoted
- * to core; individual routes would otherwise exist with no listing to reach them.
+ * The blog routes (posts index / individual post / tag pages) inject as a set:
+ * the listing components (NewsList, PostsFilter) now live in core, so `/posts`,
+ * `/posts/[...slug]` and `/posts/tag/[...tag]` all ship from the package. Turn
+ * the whole capability off with `blog: false` (then a client wanting posts hand-
+ * builds its own routes over `ferst-core/lib/posts`).
  *
  * @param {object} [options]
  * @param {boolean} [options.calendar=true] Inject the `/calendar` route.
+ * @param {boolean} [options.blog=true] Inject the blog routes (`/posts`,
+ *   `/posts/[...slug]`, `/posts/tag/[...tag]`).
  * @returns {import('astro').AstroIntegration}
  */
 export default function ferst(options = {}) {
-  const { calendar = true } = options;
+  const { calendar = true, blog = true } = options;
   return {
     name: 'ferst',
     hooks: {
@@ -38,6 +42,22 @@ export default function ferst(options = {}) {
             entrypoint: 'ferst-core/routes/calendar/index.astro',
           });
         }
+        if (blog) {
+          // The posts capability: index, individual post, and tag pages. Reads
+          // the `posts`/`tags`/`postsSettings` collections (content/collections.ts).
+          injectRoute({
+            pattern: '/posts',
+            entrypoint: 'ferst-core/routes/posts/index.astro',
+          });
+          injectRoute({
+            pattern: '/posts/[...slug]',
+            entrypoint: 'ferst-core/routes/posts/[...slug].astro',
+          });
+          injectRoute({
+            pattern: '/posts/tag/[...tag]',
+            entrypoint: 'ferst-core/routes/posts/tag/[...tag].astro',
+          });
+        }
       },
     },
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ferst-core",
-  "version": "0.5.2",
+  "version": "0.6.0",
   "type": "module",
   "description": "Ferst Core — the shared, brand-agnostic client-site system: Astro components, layouts, content schemas, the layered config resolver, and a neutral styling architecture that every client overrides.",
   "license": "BUSL-1.1",

package/routes/posts/[...slug].astro

@@ -0,0 +1,31 @@
+---
+/**
+ * An individual post (`/posts/<slug>`) — INJECTED by the ferst() integration
+ * (blog option). Renders the markdown body via core's PostArticle; tags link to
+ * `/posts/tag/<slug>` to match the injected tag pages.
+ */
+import Base from '../../layouts/Base.astro';
+import PostArticle from '../../components/PostArticle.astro';
+import { getPostRoutes, resolveTagLabels } from '../../lib/posts';
+
+export const getStaticPaths = getPostRoutes;
+
+const { entry } = Astro.props;
+const { Content } = await entry.render();
+const tags = await resolveTagLabels(entry.data.tags);
+---
+
+<Base title={entry.data.title} description={entry.data.summary} heroImage={entry.data.heroImage}>
+  <PostArticle
+    title={entry.data.title}
+    date={entry.data.date}
+    heroImage={entry.data.heroImage}
+    attachment={entry.data.attachment}
+    tags={tags}
+    tagBase="/posts/tag"
+    backHref="/posts"
+    backLabel="All posts"
+  >
+    <Content />
+  </PostArticle>
+</Base>

package/routes/posts/index.astro

@@ -0,0 +1,31 @@
+---
+/**
+ * Posts index (`/posts`) — INJECTED by the ferst() integration (blog option).
+ * The news / notices listing. Excludes any tag in postsSettings.excludeFromIndex
+ * (e.g. a newsletter series that has its own tag page). Content, not code — a
+ * client carries the post markdown + tag data; this route ships from core.
+ */
+import Base from '../../layouts/Base.astro';
+import NewsList from '../../components/NewsList.astro';
+import PostsFilter from '../../components/PostsFilter.astro';
+import { getIndexPosts, getPostsSettings, getUsedTags } from '../../lib/posts';
+
+const [posts, settings, tags] = await Promise.all([getIndexPosts(), getPostsSettings(), getUsedTags()]);
+---
+
+<Base title={settings.title} description={settings.intro || undefined}>
+  <section class="posts">
+    <header class="posts__head">
+      <h1>{settings.title}</h1>
+      {settings.intro && <p class="t-lead">{settings.intro}</p>}
+    </header>
+    <PostsFilter tags={tags} />
+    <NewsList posts={posts} empty="No posts yet." />
+  </section>
+</Base>
+
+<style>
+  .posts { display: flex; flex-direction: column; gap: 2rem; }
+  .posts__head { display: flex; flex-direction: column; gap: 0.5rem; }
+  .posts__head .t-lead { color: var(--muted); }
+</style>

package/routes/posts/tag/[...tag].astro

@@ -0,0 +1,37 @@
+---
+/**
+ * A tag page (`/posts/tag/<slug>`) — INJECTED by the ferst() integration (blog
+ * option). All posts carrying one tag. This is also how an excluded-from-index
+ * series (e.g. a newsletter) gets its own page.
+ */
+import Base from '../../../layouts/Base.astro';
+import NewsList from '../../../components/NewsList.astro';
+import PostsFilter from '../../../components/PostsFilter.astro';
+import { getTagRoutes, getPostsByTag, getUsedTags } from '../../../lib/posts';
+
+export const getStaticPaths = getTagRoutes;
+
+const { tag } = Astro.props;
+const [posts, tags] = await Promise.all([getPostsByTag(tag.slug), getUsedTags()]);
+---
+
+<Base title={tag.label} description={tag.description || undefined}>
+  <section class="posts">
+    <header class="posts__head">
+      <p class="posts__eyebrow">Tag</p>
+      <h1>{tag.label}</h1>
+      {tag.description && <p class="t-lead">{tag.description}</p>}
+    </header>
+    <PostsFilter tags={tags} active={tag.slug} />
+    <NewsList posts={posts} />
+    <a class="posts__back" href="/posts">&larr; All posts</a>
+  </section>
+</Base>
+
+<style>
+  .posts { display: flex; flex-direction: column; gap: 2rem; }
+  .posts__head { display: flex; flex-direction: column; gap: 0.35rem; }
+  .posts__eyebrow { margin: 0; font-family: var(--font-heading); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold); }
+  .posts__head .t-lead { color: var(--muted); }
+  .posts__back { font-weight: 600; color: var(--gold); }
+</style>