create-zenbu-app 0.0.12 → 0.0.14

package/dist/index.mjs

@@ -409,8 +409,6 @@ async function main() {
 	if (!fs.existsSync(templateDir)) bail(`No template found for configuration "${slug}".`);
 	const pm = detectPackageManager();
 	p.log.step(`Scaffolding Zenbu ${pluginMode ? "plugin" : "app"} in "${displayName}" (template: ${slug})`);
-	if (pm.fallback) p.log.info(`couldn't detect invoking package manager; defaulting to ${pm.type}@${pm.version}.`);
-	else p.log.info(`detected ${pm.type}@${pm.version} as the invoking package manager`);
 	const ctx = pluginMode ? {
 		projectName: displayName,
 		className: toPascalCase(displayName),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-zenbu-app",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "description": "Scaffold a new Zenbu app",
   "type": "module",
   "publishConfig": {
@@ -34,7 +34,7 @@
   },
   "scripts": {
     "build": "pnpm run build:agents && tsdown",
-    "build:agents": "sh -c 'for d in vanilla tailwind plugin; do { printf \"# Zenbu.js docs\\n\\n\"; curl -fsSL https://zenbulabs.mintlify.app/llms-full.txt; } > templates/$d/AGENTS.md; done'",
+    "build:agents": "sh -c 'for d in vanilla tailwind plugin; do { printf \"# Zenbu.js docs\\n\\n\"; curl -fsSL https://zenbulabs.mintlify.app/llms-full.txt; printf \"\\n\\n# General rules\\n\\n- never use any, every api in the app is fully type safe\\n- use zen link after making changes to sync types if it did not happen automatically\\n- always use <pm> run db:generate after making a schema change otherwise it will not take affect\\n- always prefer to make db updates via the replica so that updates are instant. if you used rpc to update a replica it would serve 0 purpose and just add an extra round trip\\n- prefer one component per file\\n\"; } > templates/$d/AGENTS.md; done'",
     "typecheck": "tsc --noEmit -p tsconfig.json"
   }
 }

package/templates/plugin/AGENTS.md

@@ -1432,3 +1432,12 @@ export default defineConfig({
 </CardGroup>
 
 
+
+
+# General rules
+
+- never use any, every api in the app is fully type safe
+- use zen link after making changes to sync types if it did not happen automatically
+- always use <pm> run db:generate after making a schema change otherwise it will not take affect
+- always prefer to make db updates via the replica so that updates are instant. if you used rpc to update a replica it would serve 0 purpose and just add an extra round trip
+- prefer one component per file

package/templates/tailwind/AGENTS.md

@@ -1432,3 +1432,12 @@ export default defineConfig({
 </CardGroup>
 
 
+
+
+# General rules
+
+- never use any, every api in the app is fully type safe
+- use zen link after making changes to sync types if it did not happen automatically
+- always use <pm> run db:generate after making a schema change otherwise it will not take affect
+- always prefer to make db updates via the replica so that updates are instant. if you used rpc to update a replica it would serve 0 purpose and just add an extra round trip
+- prefer one component per file

package/templates/tailwind/package.json

@@ -8,8 +8,7 @@
     "build:source": "zen build:source",
     "build:electron": "zen build:electron",
     "publish:source": "zen publish:source",
-    "link": "zen link",
-    "db:generate": "zen db generate"
+    "link": "zen link"
   },
   "dependencies": {
     "@zenbujs/core": "^0.0.15",
@@ -18,8 +17,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tailwindcss": "^4.2.0",
-    "vite": "^6.0.0",
-    "zod": "^4.0.0"
+    "vite": "^6.0.0"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",

package/templates/tailwind/src/renderer/App.tsx.tmpl

@@ -1,10 +1,10 @@
-import { useDb, useDbClient, useRpc } from "@zenbujs/core/react"
+import { useRpc } from "@zenbujs/core/react"
 import { useState } from "react"
 
 function Titlebar() {
   return (
     <div
-      className="h-10 flex items-center justify-end px-3 pl-[72px] shrink-0"
+      className="h-10 shrink-0 border-b border-[#222]"
       // @ts-expect-error webkit property
       style={{ WebkitAppRegion: "drag" }}
     />
@@ -12,78 +12,42 @@ function Titlebar() {
 }
 
 function Home() {
-  const db = useDb()
-  const client = useDbClient()
   const rpc = useRpc()
   const [cwd, setCwd] = useState<string | null>(null)
-
-  const issues = db.app.issues
+  const [copied, setCopied] = useState(false)
 
   return (
-    <main className="flex-1 px-8 pb-8 font-sans text-[#e5e5e5]">
+    <main className="flex-1 px-8 pt-6 pb-8 font-sans text-[#e5e5e5]">
       <h1 className="text-2xl font-bold mb-2">Welcome to Zenbu</h1>
       <p className="text-[#888] mb-6">
         Edit <code>src/renderer/App.tsx</code> to get started.
       </p>
 
-      <form
-        className="flex flex-col gap-3 bg-[#18181b] rounded-xl p-4 max-w-md mb-6"
-        onSubmit={(e) => {
-          e.preventDefault()
-          const form = e.currentTarget
-          const title = (form.elements.namedItem("title") as HTMLInputElement).value
-          if (!title.trim()) return
-          client.update((db) => {
-            db.app.issues.push({
-              id: crypto.randomUUID(),
-              title,
-              createdAt: Date.now(),
-            })
-          })
-          form.reset()
-        }}
-      >
-        <input
-          name="title"
-          placeholder="New issue title"
-          autoComplete="off"
-          className="px-3 py-2 rounded bg-[#222] border border-[#333] outline-none focus:border-indigo-500"
-        />
-        <button
-          type="submit"
-          className="bg-indigo-600 hover:bg-indigo-700 transition text-white font-semibold px-4 py-2 rounded"
-        >
-          + add
-        </button>
-      </form>
-
-      <div className="max-w-md mb-6">
-        {issues.length === 0 ? (
-          <div className="text-[#888] italic">No issues yet — try adding one.</div>
-        ) : (
-          issues.map((issue) => (
-            <div
-              key={issue.id}
-              className="mb-2 p-3 rounded-lg bg-[#222] border border-[#2a2a2a] flex items-center justify-between"
-            >
-              <span>{issue.title}</span>
-              <span className="text-xs text-[#666]">
-                {new Date(issue.createdAt).toLocaleTimeString()}
-              </span>
-            </div>
-          ))
-        )}
-      </div>
-
       <button
-        className="bg-zinc-800 hover:bg-zinc-700 px-4 py-2 rounded text-sm"
-        onClick={async () => setCwd(await rpc.repo.getCwd())}
+        className="bg-indigo-600 hover:bg-indigo-700 transition text-white font-semibold px-4 py-2 rounded text-sm"
+        onClick={async () => {
+          setCopied(false)
+          setCwd(await rpc.app.repo.getCwd())
+        }}
       >
-        rpc → main process cwd
+        Get main-process cwd
       </button>
+
       {cwd && (
-        <div className="mt-2 p-2 rounded bg-[#232328] text-[#b0b0b0] w-fit text-xs">
-          {cwd}
+        <div className="mt-3 flex items-center gap-2 max-w-md">
+          <code className="flex-1 p-2 rounded bg-[#232328] text-[#b0b0b0] text-xs truncate">
+            {cwd}
+          </code>
+          <button
+            className="bg-zinc-800 hover:bg-zinc-700 px-3 py-2 rounded text-xs"
+            onClick={async () => {
+              await navigator.clipboard.writeText(cwd)
+              setCopied(true)
+              setTimeout(() => setCopied(false), 1500)
+            }}
+          >
+            {copied ? "Copied!" : "Copy"}
+          </button>
         </div>
       )}
     </main>

package/templates/tailwind/zenbu.config.ts.tmpl

@@ -5,9 +5,6 @@ import {
 } from "@zenbujs/core/config"
 
 export default defineConfig({
-  // Where the kyju database lives (relative to this file).
-  db: "./.zenbu/db",
-
   // Boot-window HTML. The single ui entrypoint for the whole app.
   uiEntrypoint: "./src/renderer",
 
@@ -17,7 +14,6 @@ export default defineConfig({
     definePlugin({
       name: "app",
       services: ["./src/main/services/*.ts"],
-      schema: "./src/main/schema.ts",
     }),
   ],
 

package/templates/vanilla/AGENTS.md

@@ -1432,3 +1432,12 @@ export default defineConfig({
 </CardGroup>
 
 
+
+
+# General rules
+
+- never use any, every api in the app is fully type safe
+- use zen link after making changes to sync types if it did not happen automatically
+- always use <pm> run db:generate after making a schema change otherwise it will not take affect
+- always prefer to make db updates via the replica so that updates are instant. if you used rpc to update a replica it would serve 0 purpose and just add an extra round trip
+- prefer one component per file

package/templates/vanilla/package.json

@@ -8,16 +8,14 @@
     "build:source": "zen build:source",
     "build:electron": "zen build:electron",
     "publish:source": "zen publish:source",
-    "link": "zen link",
-    "db:generate": "zen db generate"
+    "link": "zen link"
   },
   "dependencies": {
     "@zenbujs/core": "^0.0.15",
     "@vitejs/plugin-react": "^5.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "vite": "^6.0.0",
-    "zod": "^4.0.0"
+    "vite": "^6.0.0"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",

package/templates/vanilla/src/renderer/App.tsx.tmpl

@@ -1,4 +1,4 @@
-import { useDb, useDbClient, useRpc } from "@zenbujs/core/react"
+import { useRpc } from "@zenbujs/core/react"
 import { useState } from "react"
 
 function Titlebar() {
@@ -12,12 +12,9 @@ function Titlebar() {
 }
 
 function Home() {
-  const db = useDb()
-  const client = useDbClient()
   const rpc = useRpc()
   const [cwd, setCwd] = useState<string | null>(null)
-
-  const issues = db.app.issues
+  const [copied, setCopied] = useState(false)
 
   return (
     <main className="home">
@@ -26,49 +23,31 @@ function Home() {
         Edit <code>src/renderer/App.tsx</code> to get started.
       </p>
 
-      <form
-        className="add-form"
-        onSubmit={(e) => {
-          e.preventDefault()
-          const form = e.currentTarget
-          const title = (form.elements.namedItem("title") as HTMLInputElement).value
-          if (!title.trim()) return
-          client.update((db) => {
-            db.app.issues.push({
-              id: crypto.randomUUID(),
-              title,
-              createdAt: Date.now(),
-            })
-          })
-          form.reset()
-        }}
-      >
-        <input name="title" placeholder="New issue title" autoComplete="off" />
-        <button type="submit">+ add</button>
-      </form>
-
-      <div className="issues">
-        {issues.length === 0 ? (
-          <div className="issues-empty">No issues yet — try adding one.</div>
-        ) : (
-          issues.map((issue) => (
-            <div key={issue.id} className="issue">
-              <span>{issue.title}</span>
-              <span className="issue-time">
-                {new Date(issue.createdAt).toLocaleTimeString()}
-              </span>
-            </div>
-          ))
-        )}
-      </div>
-
       <button
-        className="rpc-button"
-        onClick={async () => setCwd(await rpc.repo.getCwd())}
+        className="primary-button"
+        onClick={async () => {
+          setCopied(false)
+          setCwd(await rpc.app.repo.getCwd())
+        }}
       >
-        rpc → main process cwd
+        Get main-process cwd
       </button>
-      {cwd && <div className="rpc-result">{cwd}</div>}
+
+      {cwd && (
+        <div className="cwd-row">
+          <code className="cwd-value">{cwd}</code>
+          <button
+            className="copy-button"
+            onClick={async () => {
+              await navigator.clipboard.writeText(cwd)
+              setCopied(true)
+              setTimeout(() => setCopied(false), 1500)
+            }}
+          >
+            {copied ? "Copied!" : "Copy"}
+          </button>
+        </div>
+      )}
     </main>
   )
 }

package/templates/vanilla/src/renderer/app.css

@@ -23,16 +23,13 @@ body {
 
 .titlebar {
   height: 40px;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  padding: 0 12px 0 72px;
   flex-shrink: 0;
+  border-bottom: 1px solid #222;
 }
 
 .home {
   flex: 1;
-  padding: 0 32px 32px;
+  padding: 24px 32px 32px;
   color: #e5e5e5;
 }
 
@@ -51,93 +48,54 @@ body {
   font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
 }
 
-.add-form {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  background: #18181b;
-  border-radius: 12px;
-  padding: 16px;
-  max-width: 28rem;
-  margin-bottom: 24px;
-}
-
-.add-form input {
-  padding: 8px 12px;
-  border-radius: 4px;
-  background: #222;
-  border: 1px solid #333;
-  color: inherit;
-  outline: none;
-  font: inherit;
-}
-
-.add-form input:focus {
-  border-color: #6366f1;
-}
-
-.add-form button {
+.primary-button {
   background: #4f46e5;
   color: white;
   font-weight: 600;
   padding: 8px 16px;
   border-radius: 4px;
   border: 0;
+  font-size: 14px;
   cursor: pointer;
   transition: background 120ms ease;
 }
 
-.add-form button:hover {
+.primary-button:hover {
   background: #4338ca;
 }
 
-.issues {
-  max-width: 28rem;
-  margin-bottom: 24px;
-}
-
-.issues-empty {
-  color: #888;
-  font-style: italic;
-}
-
-.issue {
-  margin-bottom: 8px;
-  padding: 12px;
-  border-radius: 8px;
-  background: #222;
-  border: 1px solid #2a2a2a;
+.cwd-row {
+  margin-top: 12px;
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  gap: 8px;
+  max-width: 28rem;
 }
 
-.issue-time {
+.cwd-value {
+  flex: 1;
+  padding: 8px;
+  border-radius: 4px;
+  background: #232328;
+  color: #b0b0b0;
   font-size: 12px;
-  color: #666;
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
-.rpc-button {
+.copy-button {
   background: #27272a;
   color: inherit;
   border: 0;
-  padding: 8px 16px;
+  padding: 8px 12px;
   border-radius: 4px;
-  font-size: 14px;
+  font-size: 12px;
   cursor: pointer;
   transition: background 120ms ease;
 }
 
-.rpc-button:hover {
+.copy-button:hover {
   background: #3f3f46;
 }
-
-.rpc-result {
-  margin-top: 8px;
-  padding: 8px;
-  border-radius: 4px;
-  background: #232328;
-  color: #b0b0b0;
-  width: fit-content;
-  font-size: 12px;
-}

package/templates/vanilla/zenbu.config.ts.tmpl

@@ -5,9 +5,6 @@ import {
 } from "@zenbujs/core/config"
 
 export default defineConfig({
-  // Where the kyju database lives (relative to this file).
-  db: "./.zenbu/db",
-
   // Boot-window HTML. The single ui entrypoint for the whole app.
   uiEntrypoint: "./src/renderer",
 
@@ -17,7 +14,6 @@ export default defineConfig({
     definePlugin({
       name: "app",
       services: ["./src/main/services/*.ts"],
-      schema: "./src/main/schema.ts",
     }),
   ],
 

package/templates/tailwind/src/main/schema.ts.tmpl

@@ -1,13 +0,0 @@
-import { createSchema, z } from "@zenbujs/core/db"
-
-export default createSchema({
-  issues: z
-    .array(
-      z.object({
-        id: z.string(),
-        title: z.string(),
-        createdAt: z.number(),
-      }),
-    )
-    .default([]),
-})

package/templates/vanilla/src/main/schema.ts.tmpl

@@ -1,13 +0,0 @@
-import { createSchema, z } from "@zenbujs/core/db"
-
-export default createSchema({
-  issues: z
-    .array(
-      z.object({
-        id: z.string(),
-        title: z.string(),
-        createdAt: z.number(),
-      }),
-    )
-    .default([]),
-})