feat(flags): put /about and /blog behind flags, dark by default
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m15s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 20s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m21s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 12s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 1m39s
PR Checks / Frontend Typecheck + Tests (pull_request) Successful in 1m15s
PR Checks / Backend Smoke (pull_request) Successful in 9s
PR Checks / Build Backend (no push) (pull_request) Successful in 20s
PR Checks / Build Frontend (no push) (pull_request) Successful in 1m21s
PR Checks / Build Pipeline (no push) (pull_request) Successful in 12s
PR Checks / AI Code Review (Claude) (pull_request) Successful in 1m39s
Both features ship dark. Neither is reachable in an environment where its flag is off, and every flag in this system starts off, so a deploy of this commit makes both disappear until someone turns them on deliberately. Two independent flags rather than one, which makes blog-on-about-off a reachable state. That state is the whole reason the change is larger than four notFound() calls: the blog leans on the About page for its author identity. The Person entity is anchored at /about#tudor, and that URL 404s while about_page is dark, so a post published in that state would claim an author resolving to nothing. Worse than having no named author. Both bylines fall back to unlinked text and the BlogPosting attributes to the publisher instead, so every combination of the two flags renders something correct. Gated: /about, /blog, /blog/[slug], the RSS feed, both footer links, and the matching content-sitemap entries. A sitemap must never advertise a URL that 404s. With both dark it emits a valid empty urlset rather than a 404, because robots.txt names it unconditionally. Not gated: /admin. Posts have to be writable before the blog is worth switching on, so flagging the panel would make the flag unflippable. getFlags takes a revalidate rather than always using the 300s constant. Reading a flag pins the calling route to the lowest revalidate among its fetches, and the footer links live in the root layout, so a naive gate there would have dropped every school and place page from a weekly cache to a 5-minute one. The layout passes 604800, the floor those routes already declare, and the build confirms all four SSG route families still prerender. The cost is one-way latency: pages follow a flip in minutes, footer links within a week. The e2e journeys follow the existing paired shape from the admission_distance flag: a lit journey and a dark one for each flag, reading state from whether /about and /blog respond rather than from /api/flags, which another journey asserts is not publicly reachable. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01DXnXQKnPpZBBP61fBQiFkq
This commit is contained in:
1 parent
eb6d918650
commit
6fc7fce948
15 files changed
+338
-38
No files matched your search
@@ -1,6 +1,8 @@
|
||||
import type { Metadata } from 'next';
|
||||
import Image from 'next/image';
|
||||
import { notFound } from 'next/navigation';
|
||||
import { absoluteUrl } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
import { personJsonLd, organizationJsonLd } from '@/lib/jsonld';
|
||||
import styles from './About.module.css';
|
||||
|
||||
@@ -11,7 +13,18 @@ export const metadata: Metadata = {
|
||||
alternates: { canonical: absoluteUrl('/about') },
|
||||
};
|
||||
|
||||
export default function AboutPage() {
|
||||
/*
|
||||
* Gated on about_page. The default 300s read is the right floor here: this
|
||||
* page declares no revalidate of its own, so nothing is lost by it, and a flip
|
||||
* lands within five minutes.
|
||||
*
|
||||
* notFound(), not a redirect: while the flag is dark this URL does not exist,
|
||||
* and a 404 is what tells a crawler not to keep it.
|
||||
*/
|
||||
export default async function AboutPage() {
|
||||
const flags = await getFlags();
|
||||
if (flags.about_page !== true) notFound();
|
||||
|
||||
const jsonLd = {
|
||||
'@context': 'https://schema.org',
|
||||
'@graph': [personJsonLd(), organizationJsonLd()],
|
||||
|
||||
@@ -7,6 +7,7 @@ import type { JSXConvertersFunction } from '@payloadcms/richtext-lexical/react';
|
||||
import { getCachedPayload } from '@/lib/payload';
|
||||
import type { Post, Media } from '@/payload-types';
|
||||
import { absoluteUrl } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
import {
|
||||
blogPostingJsonLd,
|
||||
breadcrumbJsonLd,
|
||||
@@ -112,6 +113,15 @@ export default async function PostPage(
|
||||
{ params }: { params: Promise<{ slug: string }> },
|
||||
) {
|
||||
const { slug } = await params;
|
||||
|
||||
/*
|
||||
* Flags read at this route's own declared floor, so gating costs it nothing.
|
||||
* Checked before the post is fetched: a dark blog should not query Payload.
|
||||
*/
|
||||
const flags = await getFlags(3600);
|
||||
if (flags.blog !== true) notFound();
|
||||
const namedAuthor = flags.about_page === true;
|
||||
|
||||
const post = await findPost(slug);
|
||||
if (!post) notFound();
|
||||
|
||||
@@ -120,10 +130,15 @@ export default async function PostPage(
|
||||
|
||||
const jsonLd = {
|
||||
'@context': 'https://schema.org',
|
||||
/*
|
||||
* The Person entity is anchored at /about#tudor, so it is declared only
|
||||
* when that page exists. Claiming an author whose URL 404s is a worse
|
||||
* signal than attributing the post to the publisher.
|
||||
*/
|
||||
'@graph': [
|
||||
blogPostingJsonLd(summary),
|
||||
blogPostingJsonLd(summary, { namedAuthor }),
|
||||
breadcrumbJsonLd(summary),
|
||||
personJsonLd(),
|
||||
...(namedAuthor ? [personJsonLd()] : []),
|
||||
organizationJsonLd(),
|
||||
],
|
||||
};
|
||||
@@ -142,7 +157,10 @@ export default async function PostPage(
|
||||
<h1 className={styles.heading}>{summary.title}</h1>
|
||||
|
||||
<p className={styles.byline}>
|
||||
By <Link href="/about" className={styles.link}>Tudor</Link>
|
||||
{/* Unlinked while about_page is dark; the flags are independent. */}
|
||||
By {namedAuthor
|
||||
? <Link href="/about" className={styles.link}>Tudor</Link>
|
||||
: 'Tudor'}
|
||||
{' · '}
|
||||
<time dateTime={summary.publishedAt}>
|
||||
{new Date(summary.publishedAt).toLocaleDateString('en-GB', {
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
import type { Metadata } from 'next';
|
||||
import Link from 'next/link';
|
||||
import { notFound } from 'next/navigation';
|
||||
import { getCachedPayload } from '@/lib/payload';
|
||||
import { absoluteUrl } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
import styles from './Blog.module.css';
|
||||
|
||||
/*
|
||||
@@ -31,6 +33,9 @@ function formatDate(value: string) {
|
||||
}
|
||||
|
||||
export default async function BlogIndexPage() {
|
||||
const flags = await getFlags();
|
||||
if (flags.blog !== true) notFound();
|
||||
|
||||
const payload = await getCachedPayload();
|
||||
const { docs } = await payload.find({
|
||||
collection: 'posts',
|
||||
@@ -48,7 +53,11 @@ export default async function BlogIndexPage() {
|
||||
<p className={styles.standfirst}>
|
||||
What school performance data shows, what it doesn't, and how to
|
||||
read it without being misled. Written by{' '}
|
||||
<Link href="/about" className={styles.link}>Tudor</Link>.
|
||||
{/* Plain text when about_page is dark: the two flags are
|
||||
independent, so this link would otherwise point at a 404. */}
|
||||
{flags.about_page === true
|
||||
? <Link href="/about" className={styles.link}>Tudor</Link>
|
||||
: 'Tudor'}.
|
||||
</p>
|
||||
</header>
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { getCachedPayload } from '@/lib/payload';
|
||||
import { absoluteUrl } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
|
||||
/*
|
||||
* Dynamic, not ISR.
|
||||
@@ -18,6 +19,11 @@ function escapeXml(value: string): string {
|
||||
}
|
||||
|
||||
export async function GET() {
|
||||
// A dark blog has no feed. 404 rather than an empty channel: an empty feed
|
||||
// is a live feed with nothing in it, which a reader would keep polling.
|
||||
const flags = await getFlags();
|
||||
if (flags.blog !== true) return new Response('Not found', { status: 404 });
|
||||
|
||||
const payload = await getCachedPayload();
|
||||
const { docs } = await payload.find({
|
||||
collection: 'posts',
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
*/
|
||||
import { getCachedPayload } from '@/lib/payload';
|
||||
import { absoluteUrl } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
|
||||
/*
|
||||
* Dynamic, not ISR.
|
||||
@@ -21,18 +22,33 @@ import { absoluteUrl } from '@/lib/site';
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
export async function GET() {
|
||||
const payload = await getCachedPayload();
|
||||
const { docs } = await payload.find({
|
||||
collection: 'posts',
|
||||
where: { _status: { equals: 'published' } },
|
||||
sort: '-publishedAt',
|
||||
limit: 500,
|
||||
depth: 0,
|
||||
});
|
||||
/*
|
||||
* A dark page must not be advertised. Submitting a URL that 404s is the one
|
||||
* thing a sitemap is not allowed to do, so each entry is gated on the same
|
||||
* flag that gates the page itself.
|
||||
*
|
||||
* With both flags dark this emits a valid, empty <urlset> rather than a 404:
|
||||
* robots.txt names this sitemap unconditionally, and an empty sitemap is a
|
||||
* well-formed statement that there is nothing here yet.
|
||||
*/
|
||||
const flags = await getFlags();
|
||||
const aboutEnabled = flags.about_page === true;
|
||||
const blogEnabled = flags.blog === true;
|
||||
|
||||
// Only query Payload when the blog is actually being advertised.
|
||||
const docs = blogEnabled
|
||||
? (await (await getCachedPayload()).find({
|
||||
collection: 'posts',
|
||||
where: { _status: { equals: 'published' } },
|
||||
sort: '-publishedAt',
|
||||
limit: 500,
|
||||
depth: 0,
|
||||
})).docs
|
||||
: [];
|
||||
|
||||
const urls: Array<{ loc: string; lastmod: string | null }> = [
|
||||
{ loc: absoluteUrl('/about'), lastmod: null },
|
||||
{ loc: absoluteUrl('/blog'), lastmod: null },
|
||||
...(aboutEnabled ? [{ loc: absoluteUrl('/about'), lastmod: null }] : []),
|
||||
...(blogEnabled ? [{ loc: absoluteUrl('/blog'), lastmod: null }] : []),
|
||||
...docs.map((post) => ({
|
||||
loc: absoluteUrl(`/blog/${post.slug}`),
|
||||
lastmod: new Date(String(post.updatedAt ?? post.publishedAt)).toISOString(),
|
||||
|
||||
@@ -7,6 +7,7 @@ import { ComparisonToast } from '@/components/ComparisonToast';
|
||||
import { RouteTrail } from '@/components/RouteTrail';
|
||||
import { ComparisonProvider } from '@/context/ComparisonProvider';
|
||||
import { SITE_URL } from '@/lib/site';
|
||||
import { getFlags } from '@/lib/flags';
|
||||
import './globals.css';
|
||||
|
||||
// Manrope carries headings and key messaging — the guideline's "friendly,
|
||||
@@ -78,11 +79,28 @@ export const metadata: Metadata = {
|
||||
},
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
/*
|
||||
* The footer's About and Blog links are flagged, which makes this the one
|
||||
* place on the site that reads a flag on every route.
|
||||
*
|
||||
* 604800 is deliberate and load-bearing: it is the revalidate every SEO route
|
||||
* here already declares. Next pins a route to the LOWEST revalidate among its
|
||||
* fetches, so reading flags at the 300s default would drop the whole school
|
||||
* and place corpus from a weekly cache to a 5-minute one — a large origin-load
|
||||
* regression to hide two footer links.
|
||||
*
|
||||
* The cost is latency in one direction only. The pages themselves read the
|
||||
* same flags at their own floors and flip within minutes; the footer links
|
||||
* follow within a week. Turning a feature on early therefore shows the page
|
||||
* before its footer link, which is harmless. Turning one off leaves a link to
|
||||
* a 404 until the cache turns over, so a rollback that matters wants a purge.
|
||||
*/
|
||||
export default async function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
const flags = await getFlags(604800);
|
||||
return (
|
||||
// The font variable classes must sit on <html>, not <body>. globals.css
|
||||
// declares --font-display on :root as var(--font-manrope) and --font-ui as
|
||||
@@ -126,7 +144,10 @@ export default function RootLayout({
|
||||
{children}
|
||||
</main>
|
||||
<ComparisonToast />
|
||||
<Footer />
|
||||
<Footer
|
||||
aboutEnabled={flags.about_page === true}
|
||||
blogEnabled={flags.blog === true}
|
||||
/>
|
||||
</ComparisonProvider>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in new issue
Block a user