import React from "react" import { callAI } from "call-ai" import { useFireproof } from "use-fireproof" const POSITIONS = [ { id: "realism", name: "Moral Realism", claim: "Moral facts exist independently of what anyone thinks.", stake: "If wrong: morality may be illusion." }, { id: "expressivism", name: "Expressivism", claim: "Moral statements express attitudes, not facts.", stake: "If right: argument is persuasion, not proof." }, { id: "constructivism", name: "Constructivism", claim: "Moral facts are constructed by rational agreement.", stake: "What grounds the agreement?" }, { id: "error-theory", name: "Error Theory", claim: "All moral statements are false — nothing has intrinsic value.", stake: "If right: 'murder is wrong' is literally false." }, ] export default function App() { const { database, useLiveQuery } = useFireproof("metaethics-codex") const [selected, setSelected] = React.useState("realism") const { docs: bookmarks } = useLiveQuery("type", { key: "bookmark" }) const bookmarked = new Set(bookmarks.map(b => b.positionId)) async function toggleBookmark(pid) { const existing = bookmarks.find(b => b.positionId === pid && b.userSlug === "visitor") if (existing) await database.del(existing._id) else await database.put({ type: "bookmark", positionId: pid, userSlug: "visitor", createdAt: Date.now() }) } const [reflection, setReflection] = React.useState("") const [isExamining, setIsExamining] = React.useState(false) const [isPosting, setIsPosting] = React.useState(false) async function postReflection() { if (!reflection.trim()) return setIsPosting(true) try { await database.put({ type: "reflection", positionId: selected, body: reflection.trim(), authorUserSlug: "visitor", authorDisplayName: "visitor", createdAt: Date.now(), }) setReflection("") } finally { setIsPosting(false) } } async function examineReflection() { if (!reflection.trim()) return setIsExamining(true) const pos = POSITIONS.find(p => p.id === selected) try { const raw = await callAI( `A user is reflecting on the metaethical position "${pos.name}" (${pos.claim}). Their reflection: "${reflection.trim()}". Provide a structured critique.`, { schema: { properties: { analysis: { type: "string", description: "Direct analysis of the user's reflection" }, counterargument: { type: "string", description: "A counterargument from a rival metaethical position, naming that position" }, followUp: { type: "string", description: "A follow-up question to deepen inquiry" }, }}} ) const data = JSON.parse(raw) await database.put({ type: "examination", positionId: selected, originalReflection: reflection.trim(), analysis: data.analysis, counterargument: data.counterargument, followUp: data.followUp, authorUserSlug: "visitor", authorDisplayName: "visitor", createdAt: Date.now(), }) setReflection("") } finally { setIsExamining(false) } } async function suggestReflection() { setIsExamining(true) const pos = POSITIONS.find(p => p.id === selected) try { const raw = await callAI( `Suggest a single thoughtful one-sentence reflection or question a student might pose about ${pos.name}: ${pos.claim}`, { schema: { properties: { suggestion: { type: "string" }}}} ) setReflection(JSON.parse(raw).suggestion) } finally { setIsExamining(false) } } const Spinner = () => function FeedSection({ c, selected }) { const { useLiveQuery } = useFireproof("metaethics-codex") const { docs: reflections } = useLiveQuery("type", { key: "reflection" }) const { docs: examinations } = useLiveQuery("type", { key: "examination" }) const [filter, setFilter] = React.useState("all") const entries = [...reflections, ...examinations] .filter(e => filter === "all" || e.positionId === selected) .sort((a,b) => b.createdAt - a.createdAt) return (

The Shared Codex

{entries.length === 0 ? (

No entries yet. Inscribe the first.

) : (

{e.authorDisplayName} {pos?.name} {e.type === "examination" && Examined}
{e.type === "reflection" ? (
{e.body}
) : (

"{e.originalReflection}"

Analysis. {e.analysis}

Counter. {e.counterargument}

Consider. {e.followUp}

)}

)}

) } const c = { page: "min-h-screen bg-[oklch(0.06_0_0)] text-[oklch(0.90_0_0)] font-['Cinzel',serif]", header: "border-b border-[oklch(0.40_0_0)] bg-[oklch(0.17_0_0)] px-4 py-5 sticky top-0 z-10", title: "text-2xl tracking-[0.2em] text-[oklch(0.73_0.10_78)] font-['Cinzel_Decorative',serif]", tagline: "text-xs text-[oklch(0.55_0_0)] mt-1 tracking-widest uppercase", main: "max-w-2xl mx-auto px-4 py-6 space-y-6 pb-32", section: "border border-[oklch(0.40_0_0)] bg-[oklch(0.17_0_0)] rounded-sm p-5", h2: "text-lg tracking-[0.15em] text-[oklch(0.97_0.07_100)] uppercase mb-4 font-['Cinzel_Decorative',serif]", btn: "min-h-[44px] px-4 py-3 bg-[oklch(0.32_0.10_25)] border border-[oklch(0.73_0.10_78)] text-[oklch(0.90_0_0)] tracking-widest text-sm uppercase hover:bg-[oklch(0.20_0.07_22)] disabled:opacity-50", btnGhost: "min-h-[44px] px-4 py-3 bg-transparent border border-[oklch(0.40_0_0)] text-[oklch(0.90_0_0)] tracking-widest text-sm uppercase hover:border-[oklch(0.73_0.10_78)]", input: "w-full bg-[oklch(0.06_0_0)] border border-[oklch(0.40_0_0)] text-[oklch(0.90_0_0)] px-3 py-3 min-h-[44px] focus:border-[oklch(0.73_0.10_78)] outline-none font-['Cinzel',serif]", avatar: "w-7 h-7 rounded-full border border-[oklch(0.73_0.10_78)]", muted: "text-[oklch(0.55_0_0)] text-sm", gold: "text-[oklch(0.73_0.10_78)]", pill: "inline-block px-2 py-1 text-[10px] tracking-widest uppercase border border-[oklch(0.40_0_0)] text-[oklch(0.55_0_0)]", } return (

The Four Positions

{POSITIONS.map((p) => (

{selected === p.id && ( )}

))}

Inscribe a Reflection

On {POSITIONS.find(p => p.id === selected)?.name} — pose a question or thought. The Codex will examine it.