emdash 0.0.0-a → 0.0.1

package/src/comments/notifications.ts

@@ -0,0 +1,144 @@
+/**
+ * Comment Notification Emails
+ *
+ * Sends email notifications to content authors when comments are
+ * approved on their content. Used by:
+ *   - Public comment POST route (comment:afterCreate, if auto-approved)
+ *   - Admin moderation route (comment:afterModerate, when approving)
+ */
+
+import type { Kysely } from "kysely";
+
+import { escapeHtml } from "../api/escape.js";
+import type { Database } from "../database/types.js";
+import { validateIdentifier } from "../database/validate.js";
+import type { EmailPipeline } from "../plugins/email.js";
+import type { EmailMessage } from "../plugins/types.js";
+
+const NOTIFICATION_SOURCE = "emdash-comments";
+const MAX_EXCERPT_LENGTH = 500;
+const CRLF_RE = /[\r\n]/g;
+
+export interface CommentNotificationData {
+	commentAuthorName: string;
+	commentBody: string;
+	contentTitle: string;
+	collection: string;
+	adminBaseUrl: string;
+}
+
+/**
+ * Build an email notification for a new comment.
+ */
+export function buildCommentNotificationEmail(
+	to: string,
+	data: CommentNotificationData,
+): EmailMessage {
+	const title = data.contentTitle || `${data.collection} item`;
+	const subject = `New comment on "${title}"`.replace(CRLF_RE, " ");
+
+	const excerpt =
+		data.commentBody.length > MAX_EXCERPT_LENGTH
+			? data.commentBody.slice(0, MAX_EXCERPT_LENGTH) + "..."
+			: data.commentBody;
+
+	const adminUrl = `${data.adminBaseUrl}/admin/comments`;
+
+	const text = [
+		`${data.commentAuthorName} commented on "${title}":`,
+		"",
+		excerpt,
+		"",
+		`View in admin: ${adminUrl}`,
+	].join("\n");
+
+	const html = [
+		`<p><strong>${escapeHtml(data.commentAuthorName)}</strong> commented on &ldquo;${escapeHtml(title)}&rdquo;:</p>`,
+		`<blockquote style="border-left:3px solid #ccc;padding-left:12px;margin:12px 0;color:#555">${escapeHtml(excerpt)}</blockquote>`,
+		`<p><a href="${escapeHtml(adminUrl)}">View in admin</a></p>`,
+	].join("\n");
+
+	return { to, subject, text, html };
+}
+
+/**
+ * Send a comment notification to the content author if all conditions are met:
+ * 1. Comment status is "approved"
+ * 2. Content author exists and has an email
+ * 3. Email provider is configured
+ * 4. Commenter is not the content author (no self-notifications)
+ *
+ * Returns true if the email was sent, false if skipped.
+ */
+export async function sendCommentNotification(params: {
+	email: EmailPipeline;
+	comment: {
+		authorName: string;
+		authorEmail: string;
+		body: string;
+		status: string;
+		collection: string;
+	};
+	contentTitle?: string;
+	contentAuthor?: { email: string; name: string | null };
+	adminBaseUrl: string;
+}): Promise<boolean> {
+	const { email, comment, contentAuthor, adminBaseUrl } = params;
+
+	if (comment.status !== "approved") return false;
+	if (!contentAuthor?.email) return false;
+	if (!email.isAvailable()) return false;
+	if (comment.authorEmail.toLowerCase() === contentAuthor.email.toLowerCase()) return false;
+
+	const message = buildCommentNotificationEmail(contentAuthor.email, {
+		commentAuthorName: comment.authorName,
+		commentBody: comment.body,
+		contentTitle: params.contentTitle || "",
+		collection: comment.collection,
+		adminBaseUrl,
+	});
+
+	await email.send(message, NOTIFICATION_SOURCE);
+	return true;
+}
+
+/**
+ * Look up a content item's author from the database.
+ *
+ * Used by the admin moderation route where content info isn't
+ * readily available (only the comment record is at hand).
+ */
+export async function lookupContentAuthor(
+	db: Kysely<Database>,
+	collection: string,
+	contentId: string,
+): Promise<{
+	slug: string;
+	author?: { id: string; email: string; name: string | null };
+} | null> {
+	validateIdentifier(collection, "collection");
+
+	const contentRow = await db
+		.selectFrom(`ec_${collection}` as never)
+		.select(["slug" as never, "author_id" as never])
+		.where("id" as never, "=", contentId as never)
+		.executeTakeFirst();
+
+	if (!contentRow) return null;
+
+	const typed = contentRow as { slug: string; author_id: string | null };
+
+	let author: { id: string; email: string; name: string | null } | undefined;
+	if (typed.author_id) {
+		const userRow = await db
+			.selectFrom("users")
+			.select(["id", "name", "email", "email_verified"])
+			.where("id", "=", typed.author_id)
+			.executeTakeFirst();
+		if (userRow && userRow.email_verified) {
+			author = { id: userRow.id, email: userRow.email, name: userRow.name };
+		}
+	}
+
+	return { slug: typed.slug, author };
+}

package/src/comments/query.ts

@@ -0,0 +1,105 @@
+/**
+ * Comment query functions for Astro templates
+ *
+ * Same pattern as getMenu() — uses getDb() for ambient DB access.
+ * These are called from .astro pages/components, not from API routes.
+ */
+
+import type { Kysely } from "kysely";
+
+import { CommentRepository } from "../database/repositories/comment.js";
+import type { PublicComment } from "../database/repositories/comment.js";
+import type { Database } from "../database/types.js";
+import { getDb } from "../loader.js";
+
+export interface GetCommentsOptions {
+	collection: string;
+	contentId: string;
+	threaded?: boolean;
+}
+
+export interface GetCommentsResult {
+	items: PublicComment[];
+	total: number;
+}
+
+/**
+ * Get approved comments for a content item.
+ *
+ * @example
+ * ```ts
+ * import { getComments } from "emdash";
+ *
+ * const { items, total } = await getComments({
+ *   collection: "posts",
+ *   contentId: post.id,
+ *   threaded: true,
+ * });
+ * ```
+ */
+export async function getComments(options: GetCommentsOptions): Promise<GetCommentsResult> {
+	const db = await getDb();
+	return getCommentsWithDb(db, options);
+}
+
+/**
+ * Get approved comments with an explicit db handle.
+ *
+ * @internal Use `getComments()` in templates. This variant is for routes
+ * that already have a database handle.
+ */
+export async function getCommentsWithDb(
+	db: Kysely<Database>,
+	options: GetCommentsOptions,
+): Promise<GetCommentsResult> {
+	const repo = new CommentRepository(db);
+
+	const total = await repo.countByContent(options.collection, options.contentId, "approved");
+
+	// Server-rendered: fetch all comments (capped for safety).
+	// The API route handles paginated access; this is for full-page renders.
+	const MAX_COMMENTS = 500;
+
+	const result = await repo.findByContent(options.collection, options.contentId, {
+		status: "approved",
+		limit: MAX_COMMENTS,
+	});
+
+	if (options.threaded) {
+		const threaded = CommentRepository.assembleThreads(result.items);
+		const items = threaded.map((c) => CommentRepository.toPublicComment(c));
+		return { items, total };
+	}
+
+	const items = result.items.map((c) => CommentRepository.toPublicComment(c));
+	return { items, total };
+}
+
+/**
+ * Get the count of approved comments for a content item.
+ *
+ * @example
+ * ```ts
+ * import { getCommentCount } from "emdash";
+ *
+ * const count = await getCommentCount("posts", post.id);
+ * ```
+ */
+export async function getCommentCount(collection: string, contentId: string): Promise<number> {
+	const db = await getDb();
+	return getCommentCountWithDb(db, collection, contentId);
+}
+
+/**
+ * Get comment count with an explicit db handle.
+ *
+ * @internal Use `getCommentCount()` in templates.
+ */
+export async function getCommentCountWithDb(
+	db: Kysely<Database>,
+	collection: string,
+	contentId: string,
+): Promise<number> {
+	const repo = new CommentRepository(db);
+	return repo.countByContent(collection, contentId, "approved");
+}

package/src/comments/service.ts

@@ -0,0 +1,213 @@
+/**
+ * Comment Service
+ *
+ * Orchestrates comment creation through the hook pipeline:
+ *   1. Run comment:beforeCreate pipeline (transform/reject)
+ *   2. Query priorApprovedCount for first-time moderation
+ *   3. Invoke comment:moderate exclusive hook (or built-in fallback)
+ *   4. Save comment with determined status
+ *   5. Fire comment:afterCreate (fire-and-forget)
+ *
+ * Also handles admin moderation (status changes) with afterModerate hooks.
+ */
+
+import type { Kysely } from "kysely";
+
+import { CommentRepository } from "../database/repositories/comment.js";
+import type { Comment, CommentStatus } from "../database/repositories/comment.js";
+import type { Database } from "../database/types.js";
+import type {
+	CollectionCommentSettings,
+	CommentAfterCreateEvent,
+	CommentAfterModerateEvent,
+	CommentBeforeCreateEvent,
+	CommentModerateEvent,
+	ModerationDecision,
+	StoredComment,
+} from "../plugins/types.js";
+
+// ---------------------------------------------------------------------------
+// Types
+// ---------------------------------------------------------------------------
+
+export interface CommentCreateInput {
+	collection: string;
+	contentId: string;
+	parentId?: string | null;
+	authorName: string;
+	authorEmail: string;
+	authorUserId?: string | null;
+	body: string;
+	ipHash?: string | null;
+	userAgent?: string | null;
+}
+
+export interface CommentCreateResult {
+	comment: Comment;
+	decision: ModerationDecision;
+}
+
+/**
+ * Hook runner interface — injected from the runtime so the service
+ * doesn't need to know about the hook pipeline internals.
+ */
+export interface CommentHookRunner {
+	/** Run comment:beforeCreate pipeline. Returns modified event or false. */
+	runBeforeCreate(event: CommentBeforeCreateEvent): Promise<CommentBeforeCreateEvent | false>;
+
+	/** Run comment:moderate exclusive hook. Returns moderation decision. */
+	runModerate(event: CommentModerateEvent): Promise<ModerationDecision>;
+
+	/** Fire comment:afterCreate (fire-and-forget). */
+	fireAfterCreate(event: CommentAfterCreateEvent): void;
+
+	/** Fire comment:afterModerate (fire-and-forget). */
+	fireAfterModerate(event: CommentAfterModerateEvent): void;
+}
+
+// ---------------------------------------------------------------------------
+// Service
+// ---------------------------------------------------------------------------
+
+/**
+ * Create a comment through the full hook pipeline.
+ *
+ * Returns null if the comment was rejected by a beforeCreate handler.
+ */
+export async function createComment(
+	db: Kysely<Database>,
+	input: CommentCreateInput,
+	collectionSettings: CollectionCommentSettings,
+	hooks: CommentHookRunner,
+	contentInfo?: {
+		id: string;
+		collection: string;
+		slug: string;
+		title?: string;
+		author?: { id: string; name: string | null; email: string };
+	},
+): Promise<CommentCreateResult | null> {
+	const repo = new CommentRepository(db);
+
+	// 1. Build the beforeCreate event
+	const beforeCreateEvent: CommentBeforeCreateEvent = {
+		comment: {
+			collection: input.collection,
+			contentId: input.contentId,
+			parentId: input.parentId ?? null,
+			authorName: input.authorName,
+			authorEmail: input.authorEmail,
+			authorUserId: input.authorUserId ?? null,
+			body: input.body,
+			ipHash: input.ipHash ?? null,
+			userAgent: input.userAgent ?? null,
+		},
+		metadata: {},
+	};
+
+	// 2. Run comment:beforeCreate pipeline
+	const result = await hooks.runBeforeCreate(beforeCreateEvent);
+	if (result === false) {
+		return null; // Rejected
+	}
+
+	const event = result;
+
+	// 3. Query prior approved count for first-time moderation
+	const priorApprovedCount = await repo.countApprovedByEmail(event.comment.authorEmail);
+
+	// 4. Run comment:moderate exclusive hook
+	const moderateEvent: CommentModerateEvent = {
+		comment: event.comment,
+		metadata: event.metadata,
+		collectionSettings,
+		priorApprovedCount,
+	};
+
+	const decision = await hooks.runModerate(moderateEvent);
+
+	// 5. Save comment with determined status
+	const comment = await repo.create({
+		collection: event.comment.collection,
+		contentId: event.comment.contentId,
+		parentId: event.comment.parentId,
+		authorName: event.comment.authorName,
+		authorEmail: event.comment.authorEmail,
+		authorUserId: event.comment.authorUserId,
+		body: event.comment.body,
+		status: decision.status as CommentStatus,
+		ipHash: event.comment.ipHash,
+		userAgent: event.comment.userAgent,
+		moderationMetadata: Object.keys(event.metadata).length > 0 ? event.metadata : null,
+	});
+
+	// 6. Fire comment:afterCreate (fire-and-forget)
+	if (contentInfo) {
+		const afterEvent: CommentAfterCreateEvent = {
+			comment: commentToStored(comment),
+			metadata: event.metadata,
+			content: {
+				id: contentInfo.id,
+				collection: contentInfo.collection,
+				slug: contentInfo.slug,
+				title: contentInfo.title,
+			},
+			contentAuthor: contentInfo.author,
+		};
+		hooks.fireAfterCreate(afterEvent);
+	}
+
+	return { comment, decision };
+}
+
+/**
+ * Admin moderation — change a comment's status.
+ * Fires comment:afterModerate hook.
+ */
+export async function moderateComment(
+	db: Kysely<Database>,
+	id: string,
+	newStatus: CommentStatus,
+	moderator: { id: string; name: string | null },
+	hooks: CommentHookRunner,
+): Promise<Comment | null> {
+	const repo = new CommentRepository(db);
+	const existing = await repo.findById(id);
+	if (!existing) return null;
+
+	const previousStatus = existing.status;
+	const updated = await repo.updateStatus(id, newStatus);
+	if (!updated) return null;
+
+	// Fire comment:afterModerate (fire-and-forget)
+	const afterEvent: CommentAfterModerateEvent = {
+		comment: commentToStored(updated),
+		previousStatus,
+		newStatus,
+		moderator,
+	};
+	hooks.fireAfterModerate(afterEvent);
+
+	return updated;
+}
+
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+
+function commentToStored(comment: Comment): StoredComment {
+	return {
+		id: comment.id,
+		collection: comment.collection,
+		contentId: comment.contentId,
+		parentId: comment.parentId,
+		authorName: comment.authorName,
+		authorEmail: comment.authorEmail,
+		authorUserId: comment.authorUserId,
+		body: comment.body,
+		status: comment.status,
+		moderationMetadata: comment.moderationMetadata,
+		createdAt: comment.createdAt,
+		updatedAt: comment.updatedAt,
+	};
+}

package/src/components/Break.astro

@@ -0,0 +1,45 @@
+---
+/**
+ * Portable Text Break/Separator block component
+ *
+ * Renders horizontal rules and page breaks.
+ */
+export interface Props {
+	node: {
+		_type: "break";
+		_key: string;
+		style?: "line" | "dots" | "space";
+	};
+}
+
+const { node } = Astro.props;
+const style = node?.style || "line";
+---
+
+{
+	style === "dots" ? (
+		<div class="emdash-break emdash-break-dots">• • •</div>
+	) : style === "space" ? (
+		<div class="emdash-break emdash-break-space" />
+	) : (
+		<hr class="emdash-break emdash-break-line" />
+	)
+}
+
+<style>
+	.emdash-break {
+		margin: 2rem 0;
+	}
+	.emdash-break-line {
+		border: none;
+		border-top: 1px solid #e0e0e0;
+	}
+	.emdash-break-dots {
+		text-align: center;
+		color: #999;
+		letter-spacing: 0.5em;
+	}
+	.emdash-break-space {
+		height: 2rem;
+	}
+</style>

package/src/components/Button.astro

@@ -0,0 +1,71 @@
+---
+import { sanitizeHref } from "../utils/url.js";
+
+/**
+ * Portable Text Button block component
+ *
+ * Renders a single button from WordPress imports.
+ */
+export interface Props {
+	node: {
+		_type: "button";
+		_key: string;
+		text: string;
+		url?: string;
+		style?: "default" | "outline" | "fill";
+	};
+}
+
+const { node } = Astro.props;
+const { text, url: rawUrl, style = "default" } = node ?? {};
+const url = rawUrl ? sanitizeHref(rawUrl) : undefined;
+---
+
+{
+	url ? (
+		<a href={url} class:list={["emdash-button", `emdash-button--${style}`]}>
+			{text}
+		</a>
+	) : (
+		<span class:list={["emdash-button", `emdash-button--${style}`]}>{text}</span>
+	)
+}
+
+<style>
+	.emdash-button {
+		display: inline-block;
+		padding: 0.75em 1.5em;
+		border-radius: 4px;
+		text-decoration: none;
+		font-weight: 500;
+		cursor: pointer;
+		transition:
+			background-color 0.2s,
+			border-color 0.2s,
+			color 0.2s;
+	}
+
+	.emdash-button--default,
+	.emdash-button--fill {
+		background-color: var(--emdash-button-bg, #0073aa);
+		color: var(--emdash-button-color, #fff);
+		border: 2px solid var(--emdash-button-bg, #0073aa);
+	}
+
+	.emdash-button--default:hover,
+	.emdash-button--fill:hover {
+		background-color: var(--emdash-button-bg-hover, #005177);
+		border-color: var(--emdash-button-bg-hover, #005177);
+	}
+
+	.emdash-button--outline {
+		background-color: transparent;
+		color: var(--emdash-button-bg, #0073aa);
+		border: 2px solid var(--emdash-button-bg, #0073aa);
+	}
+
+	.emdash-button--outline:hover {
+		background-color: var(--emdash-button-bg, #0073aa);
+		color: var(--emdash-button-color, #fff);
+	}
+</style>

package/src/components/Buttons.astro

@@ -0,0 +1,49 @@
+---
+/**
+ * Portable Text Buttons container component
+ *
+ * Renders a group of buttons from WordPress imports.
+ */
+import Button from "./Button.astro";
+
+export interface Props {
+	node: {
+		_type: "buttons";
+		_key: string;
+		buttons: Array<{
+			_type: "button";
+			_key: string;
+			text: string;
+			url?: string;
+			style?: "default" | "outline" | "fill";
+		}>;
+		layout?: "horizontal" | "vertical";
+	};
+}
+
+const { node } = Astro.props;
+const { buttons = [], layout = "horizontal" } = node ?? {};
+---
+
+<div class:list={["emdash-buttons", `emdash-buttons--${layout}`]}>
+	{buttons.map((button) => <Button node={button} />)}
+</div>
+
+<style>
+	.emdash-buttons {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 0.75rem;
+		margin: 1.5rem 0;
+	}
+
+	.emdash-buttons--vertical {
+		flex-direction: column;
+		align-items: flex-start;
+	}
+
+	.emdash-buttons--horizontal {
+		flex-direction: row;
+		align-items: center;
+	}
+</style>

package/src/components/Code.astro

@@ -0,0 +1,59 @@
+---
+/**
+ * Portable Text Code block component
+ *
+ * Renders code blocks with optional syntax highlighting class.
+ */
+export interface Props {
+	node: {
+		_type: "code";
+		_key: string;
+		code: string;
+		language?: string;
+		filename?: string;
+	};
+}
+
+const { node } = Astro.props;
+
+if (!node?.code) {
+	return null;
+}
+
+const { code, language, filename } = node;
+const languageClass = language ? `language-${language}` : "";
+---
+
+<div class="emdash-code">
+	{filename && <div class="emdash-code-filename">{filename}</div>}
+	<pre class={languageClass}><code class={languageClass}>{code}</code></pre>
+</div>
+
+<style>
+	.emdash-code {
+		margin: 1.5rem 0;
+	}
+	.emdash-code-filename {
+		font-size: 0.75rem;
+		font-family: monospace;
+		background: #2d2d2d;
+		color: #ccc;
+		padding: 0.5rem 1rem;
+		border-radius: 0.5rem 0.5rem 0 0;
+	}
+	.emdash-code pre {
+		margin: 0;
+		padding: 1rem;
+		background: #1e1e1e;
+		border-radius: 0.5rem;
+		overflow-x: auto;
+	}
+	.emdash-code-filename + pre {
+		border-radius: 0 0 0.5rem 0.5rem;
+	}
+	.emdash-code code {
+		font-family: "Fira Code", "Consolas", monospace;
+		font-size: 0.875rem;
+		color: #e0e0e0;
+	}
+</style>