soames-astro-theme 0.1.0 → 0.1.2

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "soames-astro-theme",
   "type": "module",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Shared Astro theme for the Soames ecosystem (WordPress headless + React islands). Successor to soames-gatsby-theme.",
   "keywords": [
     "astro",

package/src/routes/[...uri].astro

@@ -23,7 +23,19 @@ export async function getStaticPaths() {
     });
 }
 
-const { page } = Astro.props;
+let { page } = Astro.props;
+
+// Dev only: getStaticPaths (and the WP content it bakes into props) is cached for
+// the life of `astro dev`, so edits in WordPress wouldn't show until a restart.
+// Re-fetch the current page on each request in dev so a browser refresh reflects
+// content changes. Tree-shaken out of production builds (import.meta.env.DEV).
+if (import.meta.env.DEV) {
+  const clean = (Astro.params.uri ?? "").replace(/^\/+|\/+$/g, "");
+  const fresh = (await getPages()).find(
+    (p) => (p.uri ?? "").replace(/^\/+|\/+$/g, "") === clean
+  );
+  if (fresh) page = fresh;
+}
 ---
 <Base pageTitle={page.title} description={page.excerpt}>
   <HeroHeader

package/src/routes/blog/[...page].astro

@@ -36,8 +36,29 @@ export async function getStaticPaths() {
   });
 }
 
-const { posts, pageNum, totalPages, prevPath, nextPath, heroTitle, heroBg, heroOverlay } =
+let { posts, pageNum, totalPages, prevPath, nextPath, heroTitle, heroBg, heroOverlay } =
   Astro.props;
+
+// Dev only: refresh this archive page's data on each request (getStaticPaths is
+// cached for the life of `astro dev`, so WP edits wouldn't show until a restart).
+// Recomputes the same slice/hero as getStaticPaths for the current pageNum.
+// Removed from production builds (import.meta.env.DEV).
+if (import.meta.env.DEV) {
+  const [all, perPage, postsPage] = await Promise.all([
+    getPosts(),
+    getPostsPerPage(),
+    getPostsPage(),
+  ]);
+  const base = `/${postsPage?.slug || "blog"}`;
+  totalPages = Math.max(1, Math.ceil(all.length / perPage));
+  posts = all.slice((pageNum - 1) * perPage, pageNum * perPage);
+  prevPath = pageNum > 1 ? (pageNum === 2 ? `${base}/` : `${base}/${pageNum - 1}/`) : null;
+  nextPath = pageNum < totalPages ? `${base}/${pageNum + 1}/` : null;
+  heroTitle = postsPage?.title || "Blog";
+  heroBg = postsPage?.featuredImage?.sourceUrl ?? null;
+  heroOverlay = postsPage?.overlayOpacity ?? 0.6;
+}
+
 const fmtDate = (d: string) =>
   new Date(d).toLocaleDateString("en-US", { year: "numeric", month: "long", day: "2-digit" });
 

package/src/routes/blog/post/[...slug].astro

@@ -8,10 +8,17 @@ import HeroHeader from "@theme/components/HeroHeader";
 import Shortcodes from "@theme/components/shortcodes/Shortcodes";
 import Bio from "@theme/components/Bio";
 import BlogSidebar from "@theme/components/BlogSidebar";
-import { getPosts } from "../../../lib/wp";
+import { getPosts, getPostsPage } from "../../../lib/wp";
 
 export async function getStaticPaths() {
   const posts = await getPosts();
+  // Single posts inherit the posts page (blog roll) hero — title, background
+  // image, overlay — falling back to "Blog" / placeholder when none is set.
+  // Fetched once here and shared across all paths (one WP round-trip).
+  const postsPage = await getPostsPage();
+  const heroTitle = postsPage?.title ?? "Blog";
+  const heroBg = postsPage?.featuredImage?.sourceUrl ?? null;
+  const heroOverlay = postsPage?.overlayOpacity ?? null;
   return posts.map((post, i) => ({
     params: { slug: post.slug },
     props: {
@@ -19,17 +26,39 @@ export async function getStaticPaths() {
       posts,
       previous: posts[i + 1] ?? null, // posts are date DESC → next index is older
       next: posts[i - 1] ?? null,
+      heroTitle,
+      heroBg,
+      heroOverlay,
     },
   }));
 }
 
-const { post, posts, previous, next } = Astro.props;
+let { post, posts, previous, next, heroTitle, heroBg, heroOverlay } = Astro.props;
+
+// Dev only: re-fetch on each request so WP edits show on refresh without
+// restarting `astro dev` (getStaticPaths props are cached otherwise). Stripped
+// from production builds (import.meta.env.DEV).
+if (import.meta.env.DEV) {
+  const all = await getPosts();
+  const i = all.findIndex((p) => p.slug === Astro.params.slug);
+  if (i !== -1) {
+    posts = all;
+    post = all[i];
+    previous = all[i + 1] ?? null;
+    next = all[i - 1] ?? null;
+  }
+  const pp = await getPostsPage();
+  heroTitle = pp?.title ?? "Blog";
+  heroBg = pp?.featuredImage?.sourceUrl ?? null;
+  heroOverlay = pp?.overlayOpacity ?? null;
+}
+
 const img = post.featuredImage;
 const fmtDate = (d: string) =>
   new Date(d).toLocaleDateString("en-US", { year: "numeric", month: "long", day: "2-digit" });
 ---
 <Base pageTitle={post.title} description={post.excerpt}>
-  <HeroHeader title="Blog" subhead="" backgroundImage={null} overlayOpacity={0.6} />
+  <HeroHeader title={heroTitle} subhead="" backgroundImage={heroBg} overlayOpacity={heroOverlay} />
   <section>
     <div class="media-container-row">
       <div class="col-12 col-lg-8">

package/src/routes/docs/[...slug].astro

@@ -7,7 +7,7 @@ import Base from "@theme/layouts/Base.astro";
 import HeroHeader from "@theme/components/HeroHeader";
 import Shortcodes from "@theme/components/shortcodes/Shortcodes";
 import DocsSidebar from "@theme/components/DocsSidebar";
-import { getDocs, buildDocTree } from "../../lib/wp";
+import { getDocs, buildDocTree, getDocsPage } from "../../lib/wp";
 
 export async function getStaticPaths() {
   // Derive the [...slug] param from the doc's WP uri (e.g. /docs/getting-started/
@@ -19,19 +19,43 @@ export async function getStaticPaths() {
 
   const docs = await getDocs();
   const tree = buildDocTree(docs);
+  // Single docs inherit the /docs/ page hero — title, background image, overlay —
+  // falling back to "Documentation" / placeholder when none is set. Fetched once
+  // here and shared across all paths (one WP round-trip).
+  const docsPage = await getDocsPage();
+  const heroTitle = docsPage?.title ?? "Documentation";
+  const heroBg = docsPage?.featuredImage?.sourceUrl ?? null;
+  const heroOverlay = docsPage?.overlayOpacity ?? null;
   return docs
     .map((doc) => ({ doc, slug: toSlug(doc.uri) }))
     .filter(({ slug }) => slug.length > 0)
     .map(({ doc, slug }) => ({
       params: { slug },
-      props: { doc, tree },
+      props: { doc, tree, heroTitle, heroBg, heroOverlay },
     }));
 }
 
-const { doc, tree } = Astro.props;
+let { doc, tree, heroTitle, heroBg, heroOverlay } = Astro.props;
+
+// Dev only: re-fetch on each request so WP doc edits show on refresh without
+// restarting `astro dev` (getStaticPaths props are cached otherwise). Stripped
+// from production builds (import.meta.env.DEV).
+if (import.meta.env.DEV) {
+  const toSlug = (uri: string) => uri.replace(/^\/+|\/+$/g, "").replace(/^docs\/?/, "");
+  const docs = await getDocs();
+  const fresh = docs.find((d) => toSlug(d.uri) === Astro.params.slug);
+  if (fresh) {
+    doc = fresh;
+    tree = buildDocTree(docs);
+  }
+  const dp = await getDocsPage();
+  heroTitle = dp?.title ?? "Documentation";
+  heroBg = dp?.featuredImage?.sourceUrl ?? null;
+  heroOverlay = dp?.overlayOpacity ?? null;
+}
 ---
 <Base pageTitle={doc.title} description={doc.excerpt}>
-  <HeroHeader title="Documentation" subhead="" backgroundImage={null} overlayOpacity={0.6} />
+  <HeroHeader title={heroTitle} subhead="" backgroundImage={heroBg} overlayOpacity={heroOverlay} />
   <section>
     <div class="media-container-row">
       <div class="col-12 col-lg-8">