@redeemid/emdash 0.0.3 → 0.0.5

package/README.md

@@ -2,17 +2,20 @@
 
 Shopify customer accounts, member levels and paywalls for [EmDash](https://github.com/emdash-cms/emdash) sites. Shopify runs the store and the customer account; EmDash runs the content.
 
-**Status: 0.0.3, early.** Runs on Node and Cloudflare Workers. Sign-in, the member mirror, webhooks, levels, rules, the page gate, the Shopify cart and checkout are covered by an end-to-end test against a fake store.
+**Status: 0.0.5, early.** Runs on Node and Cloudflare Workers. Sign-in, the member mirror, webhooks, levels, rules, teasers, badges, the page gate, the Shopify cart and checkout are covered by an end-to-end test against a fake store.
 
 ## What it does
 
 - **Sign in with the store's customer account.** Members click "Sign in" on your site, sign in on the store's account page and come back signed in. They become EmDash Subscribers. That role only means "signed in"; it never grants content.
 - **Mirrors the customer.** Email, name, tags and enabled/disabled status, kept current by signed Shopify webhooks.
 - **Levels from tags.** You map Shopify customer tags to levels. Set tags in Shopify Flow or any app; RedeemID only reads them.
-- **Rules per collection or term.** Lock a collection, or only entries in a category or tag.
+- **Rules like RedeemID's on WordPress.** Lock a collection, entries with a term (and its child terms), or set a site default; a term can also open its entries to everyone. When several term rules cover an entry, readers must pass all of them.
+- **Teasers and badges.** Locked entries can show their first paragraphs, up to a word count. `<AccessBadge>` names the level an entry needs and shows a lock to readers it keeps out.
 - **Plans, cart and checkout.** `<Plan>` shows a Shopify product's price and adds it to the visitor's Shopify cart; `<Cart>` shows the count and opens Shopify checkout.
 - **Account.** Members get an Account link to their Shopify customer account (orders, profile, addresses) and Sign out, which also ends the Shopify session.
-- **Paywall break block.** Editors write one body and drop a "Paywall break" block where members-only content starts, picking which levels may read on. `<Content>` renders the body and leaves the rest off the page for everyone else.
+- **Paywall break block.** Editors write one body and drop a "Paywall break" block where members-only content starts, picking which levels may read on, or leaving it to the entry's rule. `<Content>` renders the body and leaves the rest off the page for everyone else.
+- **Members only block.** For a members part in the middle of a body: "Members only" (pick the levels) and "Members only: end". Everyone else sees the wall in its place and reads on after it.
+- **The wall.** Readers kept out see why and what to do next: sign in, or join, with each level's own wall text. `<Notices>` shows the messages sign-in, Buy, Cart and Account send readers back with.
 - **Plan block.** Editors add a Shopify product to any page with the "Plan" block: title, price and a buy button.
 - **In the admin.** RedeemID shows under Plugins with a Members page (Shopify customers, tags, levels), a Status page (secrets, store discovery, the URLs to give Shopify, levels and rules) and a dashboard widget.
 - **Keeps members out of EmDash's own APIs**, so the gate is the only way to read locked content.
@@ -33,7 +36,8 @@ const config = {
 	shop: "my-store.myshopify.com",
 	levels: [
 		{ slug: "member", name: "Member", tags: ["member"] },
-		{ slug: "pro", name: "Pro", tags: ["pro"] },
+		// wall: what the wall says to readers this level would let in; joinUrl overrides join.href.
+		{ slug: "pro", name: "Pro", tags: ["pro"], wall: "Pro members read every report." },
 		// match: "all" needs every tag, e.g. both memberships:
 		{ slug: "both", name: "Member + Pro", tags: ["member", "pro"], match: "all" },
 	],
@@ -41,6 +45,10 @@ const config = {
 		{ collection: "posts", taxonomy: "category", term: "members", levels: ["member", "pro"] },
 		{ collection: "posts", taxonomy: "category", term: "pro", levels: ["pro"] },
 	],
+	// Optional: where the wall's join link goes.
+	join: { href: "/join/", label: "Become a member" },
+	// Optional: locked posts with no paywall break show the paragraphs within their first 40 words.
+	teaser: { posts: 40 },
 };
 
 export default defineConfig({
@@ -76,6 +84,19 @@ In Shopify, give the Customer Account API client these settings:
 
 Point webhooks (`customers/create`, `customers/update`, `customers/delete`, `customers/disable`, `customers/enable`, `customers/merge`, `customer.tags_added`, `customer.tags_removed`, `customers/redact`) at `https://your-site.example/_emdash/api/auth/redeemid/webhook`.
 
+### Rules
+
+Each rule names a collection and the levels, any of which may read. An empty `levels` list, or the built-in `signed-in` level, means any signed-in member.
+
+| Rule | Covers |
+| --- | --- |
+| `{ collection: "reports", levels: ["gold"] }` | Every entry in the collection |
+| `{ collection: "posts", taxonomy: "category", term: "investigations", levels: ["gold"] }` | Entries with that term, or with a child of it in a hierarchical taxonomy. A child's own rule wins over its parent's. |
+| `{ collection: "posts", taxonomy: "tag", term: "free-to-read", levels: [], open: true }` | Opens entries with that term to everyone, whatever else covers them |
+| `{ collection: "*", levels: [] }` | The site default, for collections with no rule of their own |
+
+Term rules beat the collection's rule, which beats the site default. When several term rules cover one entry (a story in Investigations, Gold, and Culture, Silver), readers must pass every one of them, so only Gold + Silver members read it. Set `combine: "any"` to let one of them be enough.
+
 ## Use it in templates
 
 EmDash has no content filter hook, so templates decide what to render. Render the entry body with `<Content>` instead of `<PortableText>`:
@@ -89,10 +110,27 @@ import Content from "@redeemid/emdash/components/Content.astro";
 </Content>
 ```
 
-Everything before the first Paywall break block is shown to everyone. What follows reaches the page only for readers the break allows: the levels picked on it, or when none are picked the entry's rule, or else any signed-in member. A body with no break follows the entry's rule as a whole. Plain `<PortableText>` ignores the break and shows everything, so use `<Content>` for any body that may hold one.
+Everything before the first Paywall break block is shown to everyone. What follows reaches the page only for readers the break allows: the levels picked on it ("Signed in" for any member), or when none are picked the entry's rule. With none picked and no rule covering the entry, the break changes nothing, as on WordPress. A body with no break follows the entry's rule as a whole; readers it keeps out see the collection's `teaser` (the paragraphs within that many words, never half a paragraph), if one is set. Plain `<PortableText>` ignores the break and shows everything, so use `<Content>` for any body that may hold one.
+
+A "Members only" block starts a part for the levels picked on it (none picked: the entry's rule, or any signed-in member) that runs to the next "Members only: end" block. Readers who can't read it see the wall there, and the body goes on after the end block.
+
+The wall is `<LockedPanel>`: it says why the reader is kept out and offers sign-in or the join link, with the wall text of the first level they are missing. `<Content>` and `<Gate>` show it; its default slot (and `<Content>`'s "locked" slot) goes on top.
 
 To lock a part of a template that isn't the body, wrap it in `<Gate>` (`<Gate levels={["pro"]}>…</Gate>`).
 
+Show what an entry needs with `<AccessBadge>`, on cards and on the entry. It reads the entry's rules (and a paywall break's levels when you pass `content`), shows "Free" for open entries (`free=""` hides it), and adds `is-locked` and a lock for readers it keeps out. `data-redeemid-level` holds the level slugs, for colours:
+
+```astro
+---
+import AccessBadge from "@redeemid/emdash/components/AccessBadge.astro";
+---
+<AccessBadge collection="posts" terms={post.data.terms} content={post.data.content} />
+```
+
+In your own code (`@redeemid/emdash/access`), `entryRequirement(config, collection, terms)` gives what an entry needs (a list of clauses, each passed by any of its levels, or `null` when open), and `canRead(Astro, entry)` gives the verdict for the visitor.
+
+Put `<Notices />` near the top of your layout. It shows the message for a `?redeemid_notice=` code (see [docs/shopify-setup.md](docs/shopify-setup.md)) and nothing otherwise; pass `messages={{ cart_empty: "…" }}` to reword one.
+
 Add the account box and cart to your header. Visitors see Sign in; members see their name, levels, Account and Sign out. The cart shows how many items are in the visitor's Shopify cart and goes to its checkout:
 
 ```astro

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@redeemid/emdash",
-	"version": "0.0.3",
+	"version": "0.0.5",
 	"description": "Shopify customer accounts, member levels and paywalls for EmDash sites. Shopify runs commerce; EmDash runs content.",
 	"type": "module",
 	"license": "MIT",

package/src/access.ts

@@ -34,15 +34,33 @@ export interface Viewer {
 
 export type Reason = "open" | "allowed" | "sign_in" | "upgrade" | "disabled" | "unconfigured";
 
+/**
+ * What an entry needs, in conjunctive form: every clause must pass, and a
+ * clause passes when the reader holds any of its levels. An empty clause means
+ * any signed-in member. `null` means the entry is open to everyone.
+ */
+export type Requirement = string[][] | null;
+
+/**
+ * The built-in level every signed-in member holds, as on WordPress. A clause
+ * with it passes for any signed-in member, like an empty clause.
+ */
+export const SIGNED_IN = "signed-in";
+
 export interface Verdict {
 	allowed: boolean;
 	reason: Reason;
-	/** Levels any of which would unlock the entry. Empty = any signed-in member. */
-	required: string[];
+	/** What the entry needs (see Requirement). `[]` when it is open. */
+	required: string[][];
 	viewer: Viewer;
 }
 
-export type Terms = Record<string, Array<{ slug: string } | string> | undefined>;
+/** A term as EmDash hydrates it onto an entry, or just its slug. */
+export type TermRef = { slug: string; id?: string; parentId?: string | null } | string;
+export type Terms = Record<string, TermRef[] | undefined>;
+
+/** Parent slug by term slug, per taxonomy, for walking up a hierarchy. */
+export type TermTree = Record<string, Record<string, string | null>>;
 
 export function levelsFor(tags: string[], levels: LevelConfig[] = []): string[] {
 	const held = new Set(tags.map((t) => t.toLowerCase()));
@@ -55,25 +73,157 @@ export function levelsFor(tags: string[], levels: LevelConfig[] = []): string[]
 		.map((l) => l.slug);
 }
 
+const slugOf = (t: TermRef) => (typeof t === "string" ? t : t.slug);
+
+/**
+ * The clauses, simplified: duplicates go, a clause that contains another
+ * clause goes (needing Pro already passes "Member or Pro"), and an empty
+ * clause goes when a level clause is there (any level implies signed in).
+ */
+function reduce(clauses: string[][]): string[][] {
+	const seen = new Set<string>();
+	const out: string[][] = [];
+	for (const c of clauses) {
+		const sorted = c.includes(SIGNED_IN) ? [] : [...new Set(c)].sort();
+		const key = sorted.join("|");
+		if (seen.has(key)) continue;
+		seen.add(key);
+		out.push(sorted);
+	}
+	const levelled = out.filter((c) => c.length > 0);
+	if (levelled.length === 0) return out;
+	return levelled.filter((c) => !levelled.some((o) => o !== c && o.length < c.length && o.every((l) => c.includes(l))));
+}
+
+function combined(rules: RuleConfig[], mode: "all" | "any"): string[][] {
+	if (mode === "any") {
+		return rules.some((r) => r.levels.length === 0) ? [[]] : [[...new Set(rules.flatMap((r) => r.levels))]];
+	}
+	return reduce(rules.map((r) => r.levels));
+}
+
 /**
- * Required levels for an entry, or null when no rule covers it.
- * Term rules beat collection rules; several matching term rules combine.
+ * What an entry needs (see Requirement), from the site's rules.
+ *
+ * Each term the entry carries is walked up its taxonomy (with `tree`) to the
+ * nearest term that has a rule, so a child term takes its parent's rule unless
+ * it has its own. Any matching `open` rule opens the entry.
  */
-export function requiredLevels(rules: RuleConfig[] = [], collection: string, terms: Terms = {}): string[] | null {
+export function requirement(
+	rules: RuleConfig[] = [],
+	collection: string,
+	terms: Terms = {},
+	options: { combine?: "all" | "any"; tree?: TermTree } = {},
+): Requirement {
+	const mode = options.combine ?? "all";
 	const forCollection = rules.filter((r) => r.collection === collection);
-	const termRules = forCollection.filter((r) => {
-		if (!r.taxonomy || !r.term) return false;
-		const list = terms[r.taxonomy] ?? [];
-		return list.some((t) => (typeof t === "string" ? t : t.slug) === r.term);
+	const matched: RuleConfig[] = [];
+	for (const [taxonomy, list] of Object.entries(terms)) {
+		const taxRules = forCollection.filter((r) => r.taxonomy === taxonomy && r.term);
+		if (taxRules.length === 0) continue;
+		const parents = options.tree?.[taxonomy] ?? {};
+		for (const ref of list ?? []) {
+			let slug: string | null = slugOf(ref);
+			const seen = new Set<string>();
+			while (slug && !seen.has(slug)) {
+				seen.add(slug);
+				const own = taxRules.filter((r) => r.term === slug);
+				if (own.length > 0) {
+					matched.push(...own);
+					break;
+				}
+				slug = parents[slug] ?? null;
+			}
+		}
+	}
+	if (matched.some((r) => r.open)) return null;
+	if (matched.length > 0) return combined(matched, mode);
+	const whole = forCollection.filter((r) => !r.taxonomy && !r.term && !r.open);
+	if (whole.length > 0) return combined(whole, mode);
+	const site = rules.filter((r) => r.collection === "*" && !r.taxonomy && !r.term && !r.open);
+	if (site.length > 0) return combined(site, mode);
+	return null;
+}
+
+/** Does someone holding `held` pass `required`? Signed-in membership is checked by the caller. */
+export function passes(held: string[], required: string[][]): boolean {
+	return required.every((clause) => clause.length === 0 || clause.includes(SIGNED_IN) || clause.some((l) => held.includes(l)));
+}
+
+/**
+ * The requirement in words, for badges and admin pages: "Gold + Silver",
+ * "Silver or Gold", "Signed in". `null` gives `open`.
+ */
+export function describe(required: Requirement, levels: LevelConfig[] = [], open = "Free"): string {
+	if (required === null) return open;
+	const name = (slug: string) => levels.find((l) => l.slug === slug)?.name ?? slug;
+	const parts = reduce(required).filter((c) => c.length > 0).map((c) => c.map(name).join(" or "));
+	return parts.length ? parts.join(" + ") : "Signed in";
+}
+
+/**
+ * Parent slugs for the taxonomies whose rules could cover an entry through a
+ * parent term. Reads EmDash's term lists (cached by EmDash) only when a term
+ * on the entry has no rule of its own.
+ */
+export async function termTree(rules: RuleConfig[] = [], collection: string, terms: Terms = {}): Promise<TermTree> {
+	const tree: TermTree = {};
+	const forCollection = rules.filter((r) => r.collection === collection && r.taxonomy && r.term);
+	const wanted = Object.entries(terms).filter(([taxonomy, list]) => {
+		const own = new Set(forCollection.filter((r) => r.taxonomy === taxonomy).map((r) => r.term));
+		return own.size > 0 && (list ?? []).some((t) => !own.has(slugOf(t)));
 	});
-	const chosen = termRules.length > 0 ? termRules : forCollection.filter((r) => !r.taxonomy && !r.term);
-	if (chosen.length === 0) return null;
-	// Any rule that admits every member wins.
-	if (chosen.some((r) => r.levels.length === 0)) return [];
-	return [...new Set(chosen.flatMap((r) => r.levels))];
+	if (wanted.length === 0) return tree;
+	try {
+		const { getTaxonomyTerms } = await import("emdash");
+		for (const [taxonomy] of wanted) {
+			type Node = { id: string; slug: string; parentId?: string | null; children?: Node[] };
+			const flat: Node[] = [];
+			const walk = (list: Node[]) => list.forEach((n) => (flat.push(n), walk(n.children ?? [])));
+			walk((await getTaxonomyTerms(taxonomy)) as Node[]);
+			const byId = new Map(flat.map((n) => [n.id, n.slug]));
+			const byGroup = new Map(flat.map((n) => [(n as { translationGroup?: string | null }).translationGroup ?? n.id, n.slug]));
+			tree[taxonomy] = Object.fromEntries(
+				flat.map((n) => [n.slug, n.parentId ? (byId.get(n.parentId) ?? byGroup.get(n.parentId) ?? null) : null]),
+			);
+		}
+	} catch {
+		// No term lists (outside an EmDash request): only direct term rules apply.
+	}
+	return tree;
+}
+
+/** The entry's requirement with the site's config, walking term parents. */
+export async function entryRequirement(
+	config: RedeemIDConfig | null,
+	collection: string,
+	terms: Terms = {},
+): Promise<Requirement> {
+	if (!config) return null;
+	const tree = await termTree(config.rules, collection, terms);
+	return requirement(config.rules, collection, terms, { combine: config.combine, tree });
 }
 
+const viewers = new WeakMap<object, Promise<Viewer>>();
+
+/** The visitor, read once per request (badges on a list page all ask). */
 export async function viewer(astro: AstroLike): Promise<Viewer> {
+	const key = astro.locals as object;
+	if (key && typeof key === "object") {
+		const known = viewers.get(key);
+		if (known) {
+			const v = await known;
+			if (v.signedIn) astro.response?.headers.set("Cache-Control", "private, no-store");
+			return v;
+		}
+		const fresh = readViewer(astro);
+		viewers.set(key, fresh);
+		return fresh;
+	}
+	return readViewer(astro);
+}
+
+async function readViewer(astro: AstroLike): Promise<Viewer> {
 	const locals = astro.locals as Locals;
 	const user = locals.user;
 	if (!user?.id || user.disabled) return { signedIn: false, member: null, levels: [] };
@@ -90,14 +240,22 @@ export async function viewer(astro: AstroLike): Promise<Viewer> {
 	return { signedIn: true, member, levels };
 }
 
+/**
+ * May this visitor read the entry? `override` replaces the entry's rule, for a
+ * part of a page locked to its own levels (a paywall break with levels).
+ */
 export async function canRead(
 	astro: AstroLike,
 	entry: { collection: string; terms?: Terms },
-	override?: { levels: string[] },
+	override?: { levels: string[] } | { required: string[][] },
 ): Promise<Verdict> {
 	const locals = astro.locals as Locals;
 	const config: RedeemIDConfig | null = siteConfig(locals.emdash?.config);
-	const required = override ? override.levels : requiredLevels(config?.rules, entry.collection, entry.terms);
+	const required: Requirement = override
+		? "required" in override
+			? override.required
+			: [override.levels]
+		: await entryRequirement(config, entry.collection, entry.terms);
 	const v = await viewer(astro);
 
 	if (required === null) return { allowed: true, reason: "open", required: [], viewer: v };
@@ -105,7 +263,7 @@ export async function canRead(
 	if (!v.signedIn) return { allowed: false, reason: "sign_in", required, viewer: v };
 	if (v.member?.status === "disabled") return { allowed: false, reason: "disabled", required, viewer: v };
 	if (!v.member) return { allowed: false, reason: "upgrade", required, viewer: v };
-	const ok = required.length === 0 || required.some((l) => v.levels.includes(l));
+	const ok = passes(v.levels, required);
 	return { allowed: ok, reason: ok ? "allowed" : "upgrade", required, viewer: v };
 }
 

package/src/blocks/PaywallBreak.astro

@@ -1,6 +1,7 @@
 ---
 /**
- * The paywall break itself renders nothing. <Content> splits the body here
- * and leaves out what follows for readers who can't read it.
+ * RedeemID's marker blocks (Paywall break, Members only and its end) render
+ * nothing themselves. <Content> splits the body at them and leaves out what
+ * readers can't read.
  */
 ---

package/src/blocks/index.ts

@@ -2,10 +2,12 @@
  * Site-side renderers for RedeemID's Portable Text blocks, picked up by
  * EmDash from the plugin's `componentsEntry`.
  */
-import PaywallBreak from "./PaywallBreak.astro";
+import Marker from "./PaywallBreak.astro";
 import PlanBlock from "./PlanBlock.astro";
 
 export const blockComponents = {
-	"redeemid-paywall": PaywallBreak,
+	"redeemid-paywall": Marker,
+	"redeemid-members": Marker,
+	"redeemid-members-end": Marker,
 	"redeemid-plan": PlanBlock,
 };

package/src/blocks-names.ts

@@ -1,6 +1,9 @@
 /** Portable Text block types RedeemID adds to the editor. */
 export const PAYWALL_BLOCK = "redeemid-paywall";
 export const PLAN_BLOCK = "redeemid-plan";
+/** Starts a members-only part of the body; it runs to the next end block. */
+export const MEMBERS_BLOCK = "redeemid-members";
+export const MEMBERS_END_BLOCK = "redeemid-members-end";
 
 type Node = { _type?: unknown; levels?: unknown };
 
@@ -22,3 +25,61 @@ export function splitAtPaywall<T>(value: T[] | null | undefined): {
 	const levels = Array.isArray(raw) ? raw.filter((l): l is string => typeof l === "string" && l !== "") : [];
 	return { open: blocks.slice(0, at), locked: blocks.slice(at + 1), levels, paywall: true };
 }
+
+type TextNode = { _type?: unknown; children?: Array<{ text?: unknown }> };
+
+/**
+ * The text blocks within the first `words` words of a body, as on WordPress:
+ * a block is never cut in half, so a block that would pass the count ends the
+ * teaser. Images and custom blocks are left out. 0 gives nothing.
+ */
+export function teaser<T>(value: T[] | null | undefined, words: number): T[] {
+	if (!Array.isArray(value) || !(words > 0)) return [];
+	const out: T[] = [];
+	let count = 0;
+	for (const b of value) {
+		const node = b as TextNode;
+		if (node?._type !== "block") continue;
+		const text = (node.children ?? []).map((c) => (typeof c.text === "string" ? c.text : "")).join("");
+		count += text.split(/\s+/).filter(Boolean).length;
+		if (count > words) break;
+		out.push(b);
+	}
+	return out;
+}
+
+export interface Section<T> {
+	/** True for a part between a "Members only" block and its end. */
+	members: boolean;
+	/** Levels picked on the "Members only" block (empty = none picked). */
+	levels: string[];
+	blocks: T[];
+}
+
+const levelsOf = (raw: unknown) =>
+	Array.isArray(raw) ? raw.filter((l): l is string => typeof l === "string" && l !== "") : [];
+
+/**
+ * Split blocks into open parts and members-only parts. A "Members only" block
+ * starts a part that runs to the next "Members only: end" block (or the end of
+ * the blocks); the marker blocks themselves are dropped. A stray end block is
+ * dropped too.
+ */
+export function sections<T>(value: T[] | null | undefined): Section<T>[] {
+	const out: Section<T>[] = [];
+	let current: Section<T> = { members: false, levels: [], blocks: [] };
+	for (const b of Array.isArray(value) ? value : []) {
+		const type = (b as Node)?._type;
+		if (type === MEMBERS_BLOCK || type === MEMBERS_END_BLOCK) {
+			if (current.blocks.length > 0 || current.members) out.push(current);
+			current =
+				type === MEMBERS_BLOCK
+					? { members: true, levels: levelsOf((b as Node).levels), blocks: [] }
+					: { members: false, levels: [], blocks: [] };
+			continue;
+		}
+		current.blocks.push(b);
+	}
+	if (current.blocks.length > 0 || current.members) out.push(current);
+	return out;
+}

package/src/components/AccessBadge.astro

@@ -0,0 +1,45 @@
+---
+/**
+ * The level an entry needs, read from its rules (and from a paywall break
+ * with levels), like the Access Badge block on WordPress:
+ *
+ *   <AccessBadge collection="posts" terms={post.data.terms} content={post.data.content} />
+ *
+ * Open entries show `free` ("Free"; pass free="" to show nothing). The badge
+ * carries `data-redeemid-level` (the level slugs) for styling, and
+ * `is-locked` with a lock for readers who can't read the members part.
+ */
+import { canRead, describe, entryRequirement, type Terms } from "../access.js";
+import { splitAtPaywall } from "../blocks-names.js";
+import { siteConfig } from "../site-config.js";
+
+interface Props {
+	collection: string;
+	terms?: Terms;
+	/** The entry's body, so a paywall break's levels count. */
+	content?: unknown[] | null;
+	free?: string;
+	class?: string;
+}
+
+const { collection, terms, content, free = "Free", class: className } = Astro.props;
+const config = siteConfig((Astro.locals as { emdash?: { config?: unknown } }).emdash?.config);
+const split = splitAtPaywall(content);
+const required = split.paywall && split.levels.length
+	? [split.levels]
+	: await entryRequirement(config, collection, terms);
+const label = describe(required, config?.levels, free);
+const locked = required !== null && !(await canRead(Astro, { collection, terms }, { required })).allowed;
+const slugs = required?.flat().join(" ") || (required ? "signed-in" : "free");
+---
+
+{label && (
+	<span
+		class:list={["redeemid-badge", { "is-locked": locked }, className]}
+		data-redeemid-level={slugs}
+	>
+		{locked && <span class="redeemid-badge__lock" aria-hidden="true">🔒&#xFE0E; </span>}
+		{label}
+		{locked && <span style="position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap"> (locked)</span>}
+	</span>
+)}

package/src/components/Content.astro

@@ -1,20 +1,27 @@
 ---
 /**
- * An entry's body, with RedeemID's paywall break applied.
+ * An entry's body, with RedeemID's blocks applied.
  *
  *   <Content value={post.data.content} collection="posts" terms={post.data.terms} />
  *
- * Everything before the first "Paywall break" block is shown to everyone.
- * What follows reaches the page only for readers who may read it: the levels
- * picked on the break, or when none are picked the entry's rule, or else any
- * signed-in member. Others get the "locked" slot (or a built-in notice).
- * A body with no break follows the entry's rule as a whole.
+ * - "Paywall break": everything before the first one is shown to everyone.
+ *   What follows reaches the page only for readers who may read it: the
+ *   levels picked on the break, or when none are picked the entry's rule
+ *   (with no rule, the break changes nothing, as on WordPress).
+ * - "Members only" … "Members only: end": the part between is for the levels
+ *   picked on the start block, or the entry's rule, or any signed-in member.
+ *   Readers who can't read it see the wall in its place, and the body goes on.
+ * - No break: the entry's rule covers the whole body; readers it keeps out see
+ *   the collection's teaser (config `teaser`, in words), if any.
+ *
+ * Readers kept out get the wall (LockedPanel), with the "locked" slot on top.
  */
 import { PortableText } from "emdash/ui";
 
-import { canRead, requiredLevels, signInUrl, type Terms } from "../access.js";
-import { splitAtPaywall } from "../blocks-names.js";
+import { canRead, entryRequirement, type Terms, type Verdict } from "../access.js";
+import { sections, splitAtPaywall, teaser } from "../blocks-names.js";
 import { siteConfig } from "../site-config.js";
+import LockedPanel from "./LockedPanel.astro";
 
 interface Props {
 	value?: unknown[] | null;
@@ -25,29 +32,52 @@ interface Props {
 const { value, collection = "", terms } = Astro.props;
 const split = splitAtPaywall(value);
 const config = siteConfig((Astro.locals as { emdash?: { config?: unknown } }).emdash?.config);
-const levels = split.paywall
-	? split.levels.length
-		? split.levels
-		: (requiredLevels(config?.rules, collection, terms) ?? [])
-	: undefined;
-const verdict = await canRead(Astro, { collection, terms }, levels ? { levels } : undefined);
-const shown = split.paywall ? split.open : verdict.allowed ? split.open : [];
-const here = Astro.url.pathname + Astro.url.search;
+const entryRule = await entryRequirement(config, collection, terms);
+// A break with levels picked locks the rest to them; with none picked it
+// follows the entry's rule, and does nothing when no rule covers the entry.
+const required = split.paywall ? (split.levels.length ? [split.levels] : entryRule) : undefined;
+const verdict: Verdict | { allowed: true; reason: "open" } =
+	split.paywall && required === null
+		? { allowed: true, reason: "open" }
+		: await canRead(Astro, { collection, terms }, required ? { required } : undefined);
+const words = config?.teaser?.[collection] ?? 0;
+const shown = split.paywall ? split.open : verdict.allowed ? split.open : teaser(split.open, words);
+const rest = verdict.allowed ? split.locked : [];
+
+// Each "Members only" part gets its own verdict.
+async function parts(blocks: unknown[]) {
+	const out: Array<{ blocks: unknown[]; verdict?: Verdict }> = [];
+	for (const section of sections(blocks)) {
+		if (!section.members) {
+			out.push({ blocks: section.blocks });
+			continue;
+		}
+		const needs = section.levels.length ? [section.levels] : (entryRule ?? [[]]);
+		out.push({ blocks: section.blocks, verdict: await canRead(Astro, { collection, terms }, { required: needs }) });
+	}
+	return out;
+}
+const before = await parts(shown);
+const after = await parts(rest);
 ---
 
-{shown.length > 0 && <PortableText value={shown} />}
+{before.map((p) =>
+	!p.verdict || p.verdict.allowed ? (
+		p.blocks.length > 0 && <PortableText value={p.blocks} />
+	) : (
+		<LockedPanel reason={p.verdict.reason} required={p.verdict.required} held={p.verdict.viewer.levels} />
+	),
+)}
 {verdict.allowed ? (
-	split.locked.length > 0 && <PortableText value={split.locked} />
+	after.map((p) =>
+		!p.verdict || p.verdict.allowed ? (
+			p.blocks.length > 0 && <PortableText value={p.blocks} />
+		) : (
+			<LockedPanel reason={p.verdict.reason} required={p.verdict.required} held={p.verdict.viewer.levels} />
+		),
+	)
 ) : (
-	<div class="redeemid-locked" data-redeemid-reason={verdict.reason}>
+	<LockedPanel reason={verdict.reason} required={verdict.required} held={verdict.viewer.levels}>
 		<slot name="locked" />
-		{verdict.reason === "sign_in" && (
-			<p>
-				This is for members. <a href={signInUrl(here)}>Sign in</a> to read on.
-			</p>
-		)}
-		{verdict.reason === "upgrade" && <p>Your membership doesn't include the rest of this yet.</p>}
-		{verdict.reason === "disabled" && <p>Your account is turned off. Contact the store for help.</p>}
-		{verdict.reason === "unconfigured" && <p>This is for members.</p>}
-	</div>
+	</LockedPanel>
 )}

package/src/components/Gate.astro

@@ -10,7 +10,8 @@
  *
  * Pass `levels` to lock a part of a page to specific levels instead.
  */
-import { canRead, signInUrl, type Terms } from "../access.js";
+import { canRead, type Terms } from "../access.js";
+import LockedPanel from "./LockedPanel.astro";
 
 interface Props {
 	collection?: string;
@@ -20,21 +21,12 @@ interface Props {
 
 const { collection = "", terms, levels } = Astro.props;
 const verdict = await canRead(Astro, { collection, terms }, levels ? { levels } : undefined);
-const here = Astro.url.pathname + Astro.url.search;
 ---
 
 {verdict.allowed ? (
 	<slot />
 ) : (
-	<div class="redeemid-locked" data-redeemid-reason={verdict.reason}>
+	<LockedPanel reason={verdict.reason} required={verdict.required} held={verdict.viewer.levels}>
 		<slot name="locked" />
-		{verdict.reason === "sign_in" && (
-			<p>
-				This is for members. <a href={signInUrl(here)}>Sign in</a> to read it.
-			</p>
-		)}
-		{verdict.reason === "upgrade" && <p>Your membership doesn't include this yet.</p>}
-		{verdict.reason === "disabled" && <p>Your account is turned off. Contact the store for help.</p>}
-		{verdict.reason === "unconfigured" && <p>This is for members.</p>}
-	</div>
+	</LockedPanel>
 )}

package/src/components/LockedPanel.astro

@@ -0,0 +1,48 @@
+---
+/**
+ * The wall readers see in place of what they can't read: why, and what to do
+ * next (sign in, or join). <Content> and <Gate> show it; use it directly for
+ * your own locked parts.
+ *
+ * The level it offers is the first one the reader is missing. Its `wall` text
+ * and `joinUrl` come from the level's config, the join link from `join`.
+ * Anything in the default slot is shown above the built-in text.
+ */
+import { passes, signInUrl, type Reason } from "../access.js";
+import { siteConfig } from "../site-config.js";
+
+interface Props {
+	reason: Reason;
+	/** What the locked part needs (Verdict.required). */
+	required?: string[][];
+	/** Levels the reader holds (Verdict.viewer.levels). */
+	held?: string[];
+}
+
+const { reason, required = [], held = [] } = Astro.props;
+const config = siteConfig((Astro.locals as { emdash?: { config?: unknown } }).emdash?.config);
+const missing = required.find((clause) => clause.length > 0 && !passes(held, [clause]));
+const level = missing ? config?.levels?.find((l) => l.slug === missing[0]) : undefined;
+const joinHref = level?.joinUrl ?? config?.join?.href;
+const joinLabel = config?.join?.label ?? "Become a member";
+const here = Astro.url.pathname + Astro.url.search;
+---
+
+<div class="redeemid-locked" data-redeemid-reason={reason} data-redeemid-level={level?.slug}>
+	<slot />
+	{level?.wall && (reason === "sign_in" || reason === "upgrade") && <p class="redeemid-locked__wall">{level.wall}</p>}
+	{reason === "sign_in" && (
+		<p>
+			This is for members. <a href={signInUrl(here)}>Sign in</a> to read on.
+			{joinHref && <> Not a member yet? <a href={joinHref}>{joinLabel}</a>.</>}
+		</p>
+	)}
+	{reason === "upgrade" && (
+		<p>
+			{level ? `This is for ${level.name} members.` : "Your membership doesn't include this yet."}
+			{joinHref && <> <a href={joinHref}>{joinLabel}</a></>}
+		</p>
+	)}
+	{reason === "disabled" && <p>Your account is turned off. Contact the store for help.</p>}
+	{reason === "unconfigured" && <p>This is for members.</p>}
+</div>

package/src/components/Notices.astro

@@ -0,0 +1,36 @@
+---
+/**
+ * The message for a `?redeemid_notice=` code that sign-in, Buy, Cart and
+ * Account send readers back with. Renders nothing without one. Pass
+ * `messages` to reword any of them.
+ */
+interface Props {
+	messages?: Record<string, string>;
+}
+
+const DEFAULTS: Record<string, string> = {
+	not_configured: "Sign-in isn't set up on this site yet.",
+	sign_in_unavailable: "Sign-in isn't available right now. Try again in a few minutes.",
+	sign_in_expired: "That sign-in took too long. Try again.",
+	staff_account: "This account can't sign in here. Use a different email.",
+	site_not_ready: "This site isn't ready for sign-in yet.",
+	email_required: "Your account needs an email address to sign in.",
+	token_failed: "Sign-in didn't finish. Try again.",
+	bad_id_token: "Sign-in didn't finish. Try again.",
+	identity_failed: "Sign-in didn't finish. Try again.",
+	plan_unavailable: "That plan isn't available right now.",
+	checkout_failed: "Checkout didn't open. Try again.",
+	cart_empty: "Your cart is empty.",
+	account_unavailable: "Your account page isn't available right now. Try again in a few minutes.",
+};
+
+const { messages = {} } = Astro.props;
+const code = Astro.url.searchParams.get("redeemid_notice") ?? "";
+const text = code ? (messages[code] ?? DEFAULTS[code]) : undefined;
+---
+
+{text && (
+	<div class="redeemid-notice" role="status" data-redeemid-notice={code}>
+		<p>{text}</p>
+	</div>
+)}

package/src/config.ts

@@ -15,21 +15,39 @@ export interface LevelConfig {
 	tags: string[];
 	/** "any" (default): one of the tags is enough. "all": every tag is needed. */
 	match?: "any" | "all";
+	/** What the wall says to readers this level would let in, e.g. "Gold members read every investigation." */
+	wall?: string;
+	/** Where the wall's join link goes for this level. Falls back to `join.href`. */
+	joinUrl?: string;
 }
 
 /**
- * Who may read entries. A rule with `term` applies to entries that carry that
- * term; a rule without one applies to the whole collection. Term rules win
- * over collection rules for the same entry.
+ * Who may read entries, like RedeemID's content rules on WordPress:
+ *
+ * - A rule with `taxonomy` and `term` covers entries that carry that term, or
+ *   a child of it in a hierarchical taxonomy (a child's own rule wins over its
+ *   parent's).
+ * - A rule with neither covers the whole collection.
+ * - `collection: "*"` is the site default, for collections with no rule.
+ *
+ * Term rules beat the collection rule, which beats the site default. When
+ * several term rules cover one entry, a reader must pass every one of them
+ * (most restrictive), unless `combine` is "any".
  */
 export interface RuleConfig {
+	/** Collection slug, or "*" for the site default. */
 	collection: string;
 	/** Taxonomy slug, e.g. "category". Requires `term`. */
 	taxonomy?: string;
 	/** Term slug, e.g. "premium". */
 	term?: string;
-	/** Level slugs that may read. An empty list means signed-in members of any level. */
+	/** Level slugs, any of which may read. An empty list means any signed-in member. */
 	levels: string[];
+	/**
+	 * A term rule that opens its entries to everyone, whatever else covers them
+	 * ("Opens" on WordPress). `levels` is ignored.
+	 */
+	open?: boolean;
 }
 
 export interface RedeemIDConfig {
@@ -43,6 +61,19 @@ export interface RedeemIDConfig {
 	label?: string;
 	levels?: LevelConfig[];
 	rules?: RuleConfig[];
+	/** The wall's join link: where readers become members, e.g. { href: "/join/", label: "Become a member" }. */
+	join?: { href: string; label?: string };
+	/**
+	 * How several term rules on one entry combine: "all" (default, the most
+	 * restrictive: pass every rule) or "any" (pass one of them).
+	 */
+	combine?: "all" | "any";
+	/**
+	 * Teaser length in words, per collection, for locked entries with no paywall
+	 * break: readers who can't read on see this many words of the body. Without
+	 * one they see none of it.
+	 */
+	teaser?: Record<string, number>;
 	/**
 	 * Extra /_emdash path prefixes signed-in members may use. Everything else
 	 * under /_emdash is refused to Subscribers (see guard.ts).

package/src/plugin.ts

@@ -6,13 +6,17 @@
  *     plugins: [redeemidPlugin(config)],
  *   })
  *
- * It adds two Portable Text blocks to the editor, a Members page, a Status
+ * It adds four Portable Text blocks to the editor, a Members page, a Status
  * page and a dashboard widget. Sign-in, webhooks and checkout stay on the
  * auth provider's routes.
  *
  * - "Paywall break" (`redeemid-paywall`): everything after it in the body is
- *   for members. Pick the levels that may read on; none picked means any
- *   signed-in member, or the entry's rule when one covers it.
+ *   for members. Pick the levels that may read on ("Signed in" for any
+ *   member); none picked means the entry's rule, and nothing is locked when
+ *   no rule covers the entry, as on WordPress.
+ * - "Members only" (`redeemid-members`) and "Members only: end"
+ *   (`redeemid-members-end`): the part between is for the levels picked on
+ *   the start block; everyone else sees the wall there and reads on after.
  * - "Plan" (`redeemid-plan`): a Shopify product's title and price with a
  *   button that adds it to the cart and opens checkout.
  *
@@ -23,19 +27,22 @@
 import type { ResolvedPlugin, RouteContext } from "emdash";
 import { definePlugin } from "emdash";
 
-import { levelsFor } from "./access.js";
+import { describe, levelsFor, SIGNED_IN } from "./access.js";
 import { env, ENV, storeDomain, type RedeemIDConfig } from "./config.js";
 import { discover } from "./shopify.js";
 import { stores, type MemberRecord } from "./storage.js";
 import { PAGES, WIDGETS } from "./descriptor.js";
 import { VERSION } from "./version.js";
 
-import { PAYWALL_BLOCK, PLAN_BLOCK } from "./blocks-names.js";
+import { MEMBERS_BLOCK, MEMBERS_END_BLOCK, PAYWALL_BLOCK, PLAN_BLOCK } from "./blocks-names.js";
 
-export { PAYWALL_BLOCK, PLAN_BLOCK };
+export { MEMBERS_BLOCK, MEMBERS_END_BLOCK, PAYWALL_BLOCK, PLAN_BLOCK };
 
 function blocks(config: RedeemIDConfig) {
-	const levelOptions = (config.levels ?? []).map((l) => ({ label: l.name, value: l.slug }));
+	const levelOptions = [
+		{ label: "Signed in (any member)", value: SIGNED_IN },
+		...(config.levels ?? []).map((l) => ({ label: l.name, value: l.slug })),
+	];
 	return [
 		{
 			type: PAYWALL_BLOCK,
@@ -46,11 +53,32 @@ function blocks(config: RedeemIDConfig) {
 				{
 					type: "checkbox" as const,
 					action_id: "levels",
-					label: "Who can read on (none = any signed-in member)",
+					label: "Who can read on (none = the entry's rule)",
+					options: levelOptions,
+				},
+			],
+		},
+		{
+			type: MEMBERS_BLOCK,
+			label: "Members only",
+			icon: "users",
+			description: "What follows, up to \"Members only: end\", is for members",
+			fields: [
+				{
+					type: "checkbox" as const,
+					action_id: "levels",
+					label: "Who can read it (none = the entry's rule, or any signed-in member)",
 					options: levelOptions,
 				},
 			],
 		},
+		{
+			type: MEMBERS_END_BLOCK,
+			label: "Members only: end",
+			icon: "users",
+			description: "Ends the members-only part; everyone reads on from here",
+			fields: [],
+		},
 		{
 			type: PLAN_BLOCK,
 			label: "Plan",
@@ -255,10 +283,13 @@ async function statusPage(config: RedeemIDConfig, request: Request) {
 							{ key: "levels", label: "Who can read" },
 						],
 						rows: rules.map((r) => ({
-							where: r.taxonomy && r.term ? `${r.collection}, ${r.taxonomy}: ${r.term}` : `All ${r.collection}`,
-							levels: r.levels.length
-								? r.levels.map((s) => levels.find((l) => l.slug === s)?.name ?? s).join(" or ")
-								: "Any signed-in member",
+							where:
+								r.taxonomy && r.term
+									? `${r.collection === "*" ? "Every collection" : r.collection}, ${r.taxonomy}: ${r.term} (and its child terms)`
+									: r.collection === "*"
+										? "Site default (collections with no rule)"
+										: `All ${r.collection}`,
+							levels: r.open ? "Everyone (opens the entry)" : r.levels.length ? describe([r.levels], levels) : "Any signed-in member",
 						})),
 					}
 				: { type: "context", text: "No rules. Entries are open unless their body has a paywall break." },

package/src/version.ts

@@ -1 +1 @@
-export const VERSION = "0.0.3";
+export const VERSION = "0.0.5";