fix: make demo prompts fully standalone

Author: mohsinht

README.md

@@ -82,7 +82,7 @@ make tutorial
 
 Everything else, including custom sources, encrypted storage, full theme tokens, and automatic deployment, is optional and documented separately.
 
-Synthetic demo mode includes a **Component lab** with the JSON contract beside each rendered block. Every demo source also includes a **Recreate this page** drawer containing the current base worker and source-specific Markdown prompt, ready for placeholder review and use in a scheduled LLM workflow.
+Synthetic demo mode includes a **Component lab** with the JSON contract beside each rendered block. Every demo source also includes a **Recreate this page** drawer containing one standalone scheduled-task prompt. It includes the resolved worker and source, permission boundary, and current executable schemas; the user only replaces the code repository, private data repository, and timezone placeholders before review and use.
 
 The canonical daily bundle contains agenda, inbox attention, work focus, money, news, and the dependency-backed daily overview. Prompt Studio can also create smaller independent bundles, and now generates the matching private-repository setup command.
 

docs/llm-contract.md

@@ -86,4 +86,4 @@ Use [`prompts/base-worker.md`](../prompts/base-worker.md) as the operational con
 
 The safe contract composes complexity in three layers: a page `layout` (`dashboard`, `focus`, or `timeline`), a block `span` (`one`, `two`, or `full`), and up to 16 audited blocks. The producer chooses information shape; it never chooses React components, CSS classes, renderer props, or executable behavior.
 
-In synthetic demo mode, open **Component lab** to inspect a validated JSON block beside its live rendered result. Every synthetic source page also exposes **Recreate this page**, which combines the current base worker and registered domain prompt into copy-ready Markdown. These demonstrations come from the same schemas and renderer used for private snapshots, not a separate mock UI.
+In synthetic demo mode, open **Component lab** to inspect a validated JSON block beside its live rendered result. Every synthetic source page also exposes **Recreate this page**, which produces one standalone Markdown document. It resolves the source and worker IDs and embeds the base worker, domain instructions, exact source registration and permission boundary, snapshot schema, UI schema, registered domain schema, LLM contract, and privacy contract. Only the code repository, private data repository, and timezone placeholders remain. These demonstrations come from the same schemas and renderer used for private snapshots, not a separate mock UI.

scripts/build-data-index.mjs

@@ -1,6 +1,7 @@
 import { mkdir, readFile, readdir, writeFile } from "node:fs/promises"
 import path from "node:path"
 import { decryptSnapshotEnvelope, loadSnapshotKey } from "./lib/snapshot-crypto.mjs"
+import { assembleStandaloneDemoPrompt } from "./lib/demo-prompt.mjs"
 import { snapshotFreshness } from "./lib/freshness.mjs"
 import { resolvedExperience } from "./lib/setup-options.mjs"
 
@@ -68,15 +69,37 @@ const latest = sourceDefinitions.map((definition) => ({
   snapshot: bySource[definition.id]?.at(-1) || null,
   freshnessState: snapshotFreshness(bySource[definition.id]?.at(-1) || null),
 }))
+const demoContract = demoMode
+  ? await Promise.all([
+      readFile(path.join(root, "prompts/base-worker.md"), "utf8"),
+      readJson("schemas/snapshot.schema.json"),
+      readJson("schemas/ui-blocks.schema.json"),
+      readFile(path.join(root, "docs/llm-contract.md"), "utf8"),
+      readFile(path.join(root, "docs/privacy.md"), "utf8"),
+    ])
+  : null
 const demoPromptsBySource = demoMode
   ? Object.fromEntries(
       await Promise.all(
         sourceDefinitions.map(async (definition) => {
-          const [basePrompt, domainPrompt] = await Promise.all([
-            readFile(path.join(root, "prompts/base-worker.md"), "utf8"),
+          const [domainPrompt, domainSchema] = await Promise.all([
             readFile(path.join(root, definition.prompt), "utf8"),
+            readJson(definition.schema_ref),
           ])
-          return [definition.id, `${basePrompt.trim()}\n\n---\n\n${domainPrompt.trim()}\n`]
+          const [basePrompt, snapshotSchema, uiBlocksSchema, llmContract, privacyContract] = demoContract
+          return [
+            definition.id,
+            assembleStandaloneDemoPrompt({
+              basePrompt,
+              domainPrompt,
+              definition,
+              snapshotSchema,
+              uiBlocksSchema,
+              domainSchema,
+              llmContract,
+              privacyContract,
+            }),
+          ]
         }),
       ),
     )

scripts/lib/demo-prompt.mjs

@@ -0,0 +1,86 @@
+const stripHeading = (markdown) => markdown.trim().replace(/^# .+\n+/, "")
+
+const nestHeadings = (markdown) => markdown.trim().replace(/^(#{1,4}) /gm, (_, hashes) => `${"#".repeat(Math.min(6, hashes.length + 2))} `)
+
+const resolveRegistration = (markdown, definition) =>
+  markdown.replaceAll("{{SOURCE_ID}}", definition.id).replaceAll("{{WORKER_ID}}", definition.worker_id)
+
+export function assembleStandaloneDemoPrompt({
+  basePrompt,
+  domainPrompt,
+  definition,
+  snapshotSchema,
+  uiBlocksSchema,
+  domainSchema,
+  llmContract,
+  privacyContract,
+}) {
+  const workerInstructions = resolveRegistration(stripHeading(basePrompt), definition)
+    .replace(/^Copy this contract together with one domain prompt[^\n]*\n+/, "")
+    .replace("- the domain prompt supplied with this contract", "- the embedded domain instructions in this document")
+  const domainInstructions = resolveRegistration(stripHeading(domainPrompt), definition)
+    .replace(/^Use with \[`base-worker\.md`\]\(base-worker\.md\)\.\n+/, "")
+    .replace(
+      `Set ${definition.id} to ${definition.id} and ${definition.worker_id} to ${definition.worker_id}.`,
+      `This document is registered for source ${definition.id} and worker ${definition.worker_id}.`,
+    )
+  const embeddedLlmContract = llmContract.replace(/^Use \[`prompts\/base-worker\.md`\][^\n]*\n+/m, "")
+  const json = (value) => JSON.stringify(value, null, 2)
+
+  return `# ${definition.label} scheduled-task prompt
+
+> This is a standalone Zaati OS prompt. The worker instructions, registered source, permission boundary, and current executable schemas are embedded below; no linked local prompt file is required.
+
+## Replace before scheduling
+
+Replace these three environment-specific placeholders everywhere they appear:
+
+- \`{{CODE_REPOSITORY}}\` — the public Zaati OS code repository
+- \`{{DATA_REPOSITORY}}\` — the private repository that owns real snapshots
+- \`{{TIMEZONE}}\` — the user's IANA timezone, such as \`Asia/Karachi\`
+
+The source and worker identifiers are already resolved to \`${definition.id}\` and \`${definition.worker_id}\`. Review the embedded permission boundary before giving the workflow access to any source.
+
+## Worker instructions
+
+${workerInstructions}
+
+## Domain instructions
+
+${domainInstructions}
+
+## Registered source and permission boundary
+
+\`\`\`json
+${json(definition)}
+\`\`\`
+
+## Snapshot envelope schema
+
+\`\`\`json
+${json(snapshotSchema)}
+\`\`\`
+
+## Safe UI blocks schema
+
+\`\`\`json
+${json(uiBlocksSchema)}
+\`\`\`
+
+## Registered domain schema
+
+\`\`\`json
+${json(domainSchema)}
+\`\`\`
+
+## LLM contract
+
+The embedded contract is the copy-time baseline. The worker must still read and obey the current default-branch files on every run and stop if they are missing or incompatible.
+
+${nestHeadings(embeddedLlmContract)}
+
+## Privacy contract
+
+${nestHeadings(privacyContract)}
+`
+}

src/App.tsx

@@ -672,11 +672,28 @@ function DashboardPage({
 }
 
 function PromptDrawer({ prompt, sourceLabel }: { prompt: string; sourceLabel: string }) {
-  const [copied, setCopied] = useState(false)
+  const [copyState, setCopyState] = useState<"idle" | "copied" | "failed">("idle")
   const copyPrompt = async () => {
-    await navigator.clipboard.writeText(prompt)
-    setCopied(true)
-    window.setTimeout(() => setCopied(false), 1800)
+    try {
+      await Promise.race([
+        navigator.clipboard.writeText(prompt),
+        new Promise<never>((_, reject) => window.setTimeout(() => reject(new Error("Clipboard permission timed out.")), 600)),
+      ])
+      setCopyState("copied")
+    } catch {
+      const field = document.createElement("textarea")
+      field.value = prompt
+      field.setAttribute("readonly", "")
+      field.style.position = "fixed"
+      field.style.opacity = "0"
+      document.body.append(field)
+      field.focus()
+      field.select()
+      const copied = document.execCommand("copy")
+      field.remove()
+      setCopyState(copied ? "copied" : "failed")
+    }
+    window.setTimeout(() => setCopyState("idle"), 2400)
   }
   return (
     <Dialog>
@@ -691,12 +708,13 @@ function PromptDrawer({ prompt, sourceLabel }: { prompt: string; sourceLabel: st
           <div>
             <DialogTitle className="text-base font-semibold">{sourceLabel} scheduled-task prompt</DialogTitle>
             <DialogDescription className="mt-1 text-sm leading-6 text-muted-foreground">
-              Replace every placeholder, review the permission boundary, then paste this Markdown into your LLM workflow.
+              One standalone Markdown prompt with the worker, source registration, permissions, and current schemas included. Replace the
+              three environment placeholders, review it, then paste the complete document into your LLM workflow.
             </DialogDescription>
           </div>
           <Button aria-live="polite" onClick={() => void copyPrompt()} size="sm" variant="secondary">
-            {copied ? <Check className="size-3.5" /> : <Copy className="size-3.5" />}
-            {copied ? "Copied" : "Copy"}
+            {copyState === "copied" ? <Check className="size-3.5" /> : <Copy className="size-3.5" />}
+            {copyState === "copied" ? "Complete prompt copied" : copyState === "failed" ? "Select and copy below" : "Copy complete prompt"}
           </Button>
         </div>
         <div className="min-h-0 flex-1 overflow-auto bg-muted/35 p-4 sm:p-5">

tests/contracts.test.mjs

@@ -1,10 +1,49 @@
 import assert from "node:assert/strict"
 import { readFile } from "node:fs/promises"
 import test from "node:test"
+import { assembleStandaloneDemoPrompt } from "../scripts/lib/demo-prompt.mjs"
 import { validateSnapshotPolicy } from "../scripts/lib/snapshot-policy.mjs"
 import { validateCustomTheme } from "../scripts/lib/theme-contrast.mjs"
 
 const readJson = async (file) => JSON.parse(await readFile(file, "utf8"))
+test("demo scheduled-task prompts are standalone and embed the complete contract", async () => {
+  const registry = await readJson("config/sources.json")
+  const definition = registry.sources.find((source) => source.id === "money:pulse")
+  const [basePrompt, domainPrompt, snapshotSchema, uiBlocksSchema, domainSchema, llmContract, privacyContract] = await Promise.all([
+    readFile("prompts/base-worker.md", "utf8"),
+    readFile(definition.prompt, "utf8"),
+    readJson("schemas/snapshot.schema.json"),
+    readJson("schemas/ui-blocks.schema.json"),
+    readJson(definition.schema_ref),
+    readFile("docs/llm-contract.md", "utf8"),
+    readFile("docs/privacy.md", "utf8"),
+  ])
+  const prompt = assembleStandaloneDemoPrompt({
+    basePrompt,
+    domainPrompt,
+    definition,
+    snapshotSchema,
+    uiBlocksSchema,
+    domainSchema,
+    llmContract,
+    privacyContract,
+  })
+
+  assert.match(prompt, /This is a standalone Zaati OS prompt/)
+  assert.match(prompt, /You are a registered Zaati OS snapshot worker/)
+  assert.match(prompt, /Use only user-approved normalized totals/)
+  assert.match(prompt, /registered for source money:pulse and worker money-pulse-daily/)
+  assert.doesNotMatch(prompt, /Set money:pulse to money:pulse/)
+  assert.match(prompt, /"id": "money:pulse"/)
+  assert.match(prompt, /"worker_id": "money-pulse-daily"/)
+  assert.match(prompt, /"target_path": "data\/snapshots\/money\/pulse/)
+  assert.ok(prompt.includes(JSON.stringify(snapshotSchema, null, 2)))
+  assert.ok(prompt.includes(JSON.stringify(uiBlocksSchema, null, 2)))
+  assert.ok(prompt.includes(JSON.stringify(domainSchema, null, 2)))
+  assert.doesNotMatch(prompt, /base-worker\.md/)
+  assert.doesNotMatch(prompt, /\{\{SOURCE_ID\}\}|\{\{WORKER_ID\}\}/)
+  assert.deepEqual([...new Set(prompt.match(/\{\{[A-Z_]+\}\}/g))].sort(), ["{{CODE_REPOSITORY}}", "{{DATA_REPOSITORY}}", "{{TIMEZONE}}"])
+})
 test("safe UI contract exposes only audited block kinds", async () => {
   const schema = await readJson("schemas/ui-blocks.schema.json")
   const kinds = schema.$defs.block.oneOf.map((item) => item.$ref.split("/").at(-1)).sort()