new and create (push)

apps/basic/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "toes-app",
+  "name": "basic",
   "module": "src/index.ts",
   "type": "module",
   "private": true,
@@ -15,7 +15,7 @@
     "typescript": "^5.9.2"
   },
   "dependencies": {
-    "hype": "git+https://git.nose.space/defunkt/hype",
-    "forge": "git+https://git.nose.space/defunkt/forge"
+    "@because/forge": "^0.0.1",
+    "@because/hype": "^0.0.1"
   }
-}
+}

apps/clock/index.tsx

@@ -1,5 +1,5 @@
 import { Hype } from 'hype'
-import { define, stylesToCSS } from 'forge'
+import { define, stylesToCSS } from '@because/forge'
 
 const app = new Hype()
 

apps/clock/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "toes-clock",
+  "name": "clock",
   "module": "src/index.ts",
   "type": "module",
   "private": true,
@@ -18,7 +18,7 @@
     "typescript": "^5.9.2"
   },
   "dependencies": {
-    "hype": "git+https://git.nose.space/defunkt/hype",
-    "forge": "git+https://git.nose.space/defunkt/forge"
+    "@because/forge": "^0.0.1",
+    "@because/hype": "^0.0.1"
   }
-}
+}

apps/clock2/bun.lock

@@ -0,0 +1,38 @@
+{
+  "lockfileVersion": 1,
+  "configVersion": 1,
+  "workspaces": {
+    "": {
+      "name": "clock2",
+      "dependencies": {
+        "forge": "git+https://git.nose.space/defunkt/forge",
+        "hype": "git+https://git.nose.space/defunkt/hype",
+      },
+      "devDependencies": {
+        "@types/bun": "latest",
+      },
+      "peerDependencies": {
+        "typescript": "^5.9.2",
+      },
+    },
+  },
+  "packages": {
+    "@types/bun": ["@types/bun@1.3.8", "", { "dependencies": { "bun-types": "1.3.8" } }, "sha512-3LvWJ2q5GerAXYxO2mffLTqOzEu5qnhEAlh48Vnu8WQfnmSwbgagjGZV6BoHKJztENYEDn6QmVd949W4uESRJA=="],
+
+    "@types/node": ["@types/node@25.1.0", "", { "dependencies": { "undici-types": "~7.16.0" } }, "sha512-t7frlewr6+cbx+9Ohpl0NOTKXZNV9xHRmNOvql47BFJKcEG1CxtxlPEEe+gR9uhVWM4DwhnvTF110mIL4yP9RA=="],
+
+    "bun-types": ["bun-types@1.3.8", "", { "dependencies": { "@types/node": "*" } }, "sha512-fL99nxdOWvV4LqjmC+8Q9kW3M4QTtTR1eePs94v5ctGqU8OeceWrSUaRw3JYb7tU3FkMIAjkueehrHPPPGKi5Q=="],
+
+    "forge": ["@because/forge@git+https://git.nose.space/defunkt/forge#67180bb4f3f13b6eacba020e60592d4a76e2deda", { "peerDependencies": { "typescript": "^5" } }, "67180bb4f3f13b6eacba020e60592d4a76e2deda"],
+
+    "hono": ["hono@4.11.7", "", {}, "sha512-l7qMiNee7t82bH3SeyUCt9UF15EVmaBvsppY2zQtrbIhl/yzBTny+YUxsVjSjQ6gaqaeVtZmGocom8TzBlA4Yw=="],
+
+    "hype": ["@because/hype@git+https://git.nose.space/defunkt/hype#5ed8673274187958e3bee569aba0d33baf605bb1", { "dependencies": { "hono": "^4.10.4", "kleur": "^4.1.5" }, "peerDependencies": { "typescript": "^5" } }, "5ed8673274187958e3bee569aba0d33baf605bb1"],
+
+    "kleur": ["kleur@4.1.5", "", {}, "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ=="],
+
+    "typescript": ["typescript@5.9.3", "", { "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" } }, "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw=="],
+
+    "undici-types": ["undici-types@7.16.0", "", {}, "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw=="],
+  }
+}

apps/profile/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "toes-app",
+  "name": "profile",
   "module": "src/index.ts",
   "type": "module",
   "private": true,
@@ -18,7 +18,7 @@
     "typescript": "^5.9.2"
   },
   "dependencies": {
-    "forge": "git+https://git.nose.space/defunkt/forge",
-    "hype": "git+https://git.nose.space/defunkt/hype"
+    "@because/forge": "^0.0.1",
+    "@because/hype": "^0.0.1"
   }
-}
+}

apps/truisms/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "toes-app",
+  "name": "truisms",
   "module": "src/index.ts",
   "type": "module",
   "private": true,
@@ -17,7 +17,7 @@
     "typescript": "^5.9.2"
   },
   "dependencies": {
-    "hype": "git+https://git.nose.space/defunkt/hype",
-    "forge": "git+https://git.nose.space/defunkt/forge"
+    "@because/forge": "^0.0.1",
+    "@because/hype": "^0.0.1"
   }
-}
+}

bun.lock

@@ -5,8 +5,8 @@
     "": {
       "name": "toes",
       "dependencies": {
-        "@_because/forge": "*",
-        "@_because/hype": "*",
+        "@because/forge": "^0.0.1.",
+        "@because/hype": "^0.0.1",
         "commander": "^14.0.2",
         "kleur": "^4.1.5",
       },
@@ -19,9 +19,9 @@
     },
   },
   "packages": {
-    "@_because/forge": ["@_because/forge@0.1.0", "https://npm.nose.space/@_because/forge/-/forge-0.1.0.tgz", { "peerDependencies": { "typescript": "^5" } }, "sha512-kut50WMLDUb088SHnCPENJKI6rcXLzswSlGcKqsl3d8F40X8uRXTX/CdZDK5Q9Z1CDpFzGZHQ9nireqme3IvPQ=="],
+    "@because/forge": ["@because/forge@0.0.1", "https://npm.nose.space/@because/forge/-/forge-0.0.1.tgz", { "peerDependencies": { "typescript": "^5" } }, "sha512-QS5CK51gcWma91i4uECWe4HPJeNHcE+Af4SQHOcfEovyzOEa7VOTAjei+jIWr2i+abGWqQCEC9wIuFgPgyr2Bg=="],
 
-    "@_because/hype": ["@_because/hype@0.1.0", "https://npm.nose.space/@_because/hype/-/hype-0.1.0.tgz", { "dependencies": { "hono": "^4.10.4", "kleur": "^4.1.5" }, "peerDependencies": { "typescript": "^5" } }, "sha512-cw3Ms2jOIv1159VeNZFAEcH/fzVKOuqul9ggcemkZQHFAX1uGJD9wEvdJd2PNbbR5GG62J5rAPpqHHNmWrb8qA=="],
+    "@because/hype": ["@because/hype@0.0.1", "https://npm.nose.space/@because/hype/-/hype-0.0.1.tgz", { "dependencies": { "hono": "^4.10.4", "kleur": "^4.1.5" }, "peerDependencies": { "typescript": "^5" } }, "sha512-i92DNUXJOwt3J8dN1x8sh7i86blelcTCk8XDpwD839Ic8oe710lkDSVXJ7xYZb/i8YtzGhRg+L6eXDhaRiU2Pw=="],
 
     "@types/bun": ["@types/bun@1.3.8", "https://npm.nose.space/@types/bun/-/bun-1.3.8.tgz", { "dependencies": { "bun-types": "1.3.8" } }, "sha512-3LvWJ2q5GerAXYxO2mffLTqOzEu5qnhEAlh48Vnu8WQfnmSwbgagjGZV6BoHKJztENYEDn6QmVd949W4uESRJA=="],
 

package.json

@@ -12,7 +12,8 @@
     "test": "bun test",
     "cli:build": "bun run scripts/build.ts",
     "cli:build:all": "bun run scripts/build.ts --all",
-    "cli:install": "bun cli:build && sudo cp dist/toes /usr/local/bin"
+    "cli:install": "bun cli:build && sudo cp dist/toes /usr/local/bin",
+    "cli:uninstall": "sudo rm /usr/local/bin"
   },
   "devDependencies": {
     "@types/bun": "latest"
@@ -22,8 +23,8 @@
   },
   "dependencies": {
     "commander": "^14.0.2",
-    "@_because/forge": "*",
-    "@_because/hype": "*",
+    "@because/forge": "^0.0.1",
+    "@because/hype": "^0.0.1",
     "kleur": "^4.1.5"
   }
 }

src/cli/index.ts

@@ -5,7 +5,8 @@ import { program } from 'commander'
 import { createHash } from 'crypto'
 import { existsSync, mkdirSync, readFileSync, readdirSync, statSync, unlinkSync, writeFileSync } from 'fs'
 import color from 'kleur'
-import { dirname, join, relative } from 'path'
+import { basename, dirname, join, relative } from 'path'
+import * as readline from 'readline'
 
 const HOST = `http://localhost:${process.env.PORT ?? 3000}`
 
@@ -31,13 +32,33 @@ function makeUrl(path: string): string {
   return `${HOST}${path}`
 }
 
+function handleError(error: unknown): void {
+  if (error instanceof Error && 'code' in error && error.code === 'ConnectionRefused') {
+    console.error(`🐾 Can't connect to toes server at ${HOST}`)
+    return
+  }
+  console.error(error)
+}
+
 async function get<T>(url: string): Promise<T | undefined> {
   try {
     const res = await fetch(makeUrl(url))
     if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
     return await res.json()
   } catch (error) {
-    console.error(error)
+    handleError(error)
+  }
+}
+
+async function getManifest(appName: string): Promise<{ exists: boolean; manifest?: Manifest } | null> {
+  try {
+    const res = await fetch(makeUrl(`/api/sync/apps/${appName}/manifest`))
+    if (res.status === 404) return { exists: false }
+    if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
+    return { exists: true, manifest: await res.json() }
+  } catch (error) {
+    handleError(error)
+    return null
   }
 }
 
@@ -51,7 +72,7 @@ async function post<T, B = unknown>(url: string, body?: B): Promise<T | undefine
     if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
     return await res.json()
   } catch (error) {
-    console.error(error)
+    handleError(error)
   }
 }
 
@@ -64,7 +85,7 @@ async function put(url: string, body: Buffer | Uint8Array): Promise<boolean> {
     if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
     return true
   } catch (error) {
-    console.error(error)
+    handleError(error)
     return false
   }
 }
@@ -76,7 +97,7 @@ async function download(url: string): Promise<Buffer | undefined> {
     if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
     return Buffer.from(await res.arrayBuffer())
   } catch (error) {
-    console.error(error)
+    handleError(error)
   }
 }
 
@@ -88,7 +109,7 @@ async function del(url: string): Promise<boolean> {
     if (!res.ok) throw new Error(`${res.status} ${res.statusText}`)
     return true
   } catch (error) {
-    console.error(error)
+    handleError(error)
     return false
   }
 }
@@ -313,24 +334,29 @@ async function pushApp() {
     return
   }
 
-  console.log(`Pushing ${color.bold(appName)} to server...`)
-
   const localManifest = generateLocalManifest(process.cwd(), appName)
-  const remoteManifest: Manifest | undefined = await get(`/api/sync/apps/${appName}/manifest`)
+  const result = await getManifest(appName)
 
-  if (!remoteManifest) {
-    console.error('App not found on server')
+  if (result === null) {
+    // Connection error - already printed
     return
   }
 
+  if (!result.exists) {
+    const ok = await confirm(`App ${color.bold(appName)} doesn't exist on server. Create it?`)
+    if (!ok) return
+  }
+
+  console.log(`Pushing ${color.bold(appName)} to server...`)
+
   const localFiles = new Set(Object.keys(localManifest.files))
-  const remoteFiles = new Set(Object.keys(remoteManifest.files))
+  const remoteFiles = new Set(Object.keys(result.manifest?.files ?? {}))
 
   // Files to upload (new or changed)
   const toUpload: string[] = []
   for (const file of localFiles) {
     const local = localManifest.files[file]!
-    const remote = remoteManifest.files[file]
+    const remote = result.manifest?.files[file]
     if (!remote || local.hash !== remote.hash) {
       toUpload.push(file)
     }
@@ -377,6 +403,114 @@ async function pushApp() {
   console.log(color.green('✓ Push complete'))
 }
 
+async function confirm(message: string): Promise<boolean> {
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  })
+
+  return new Promise((resolve) => {
+    rl.question(`${message} [y/N] `, (answer) => {
+      rl.close()
+      resolve(answer.toLowerCase() === 'y')
+    })
+  })
+}
+
+async function newApp(name?: string) {
+  const appPath = name ? join(process.cwd(), name) : process.cwd()
+  const appName = name ?? basename(process.cwd())
+
+  if (name && existsSync(appPath)) {
+    console.error(`Directory already exists: ${name}`)
+    return
+  }
+
+  const filesToCheck = ['index.tsx', 'package.json', 'tsconfig.json']
+  const existing = filesToCheck.filter((f) => existsSync(join(appPath, f)))
+  if (existing.length > 0) {
+    console.error(`Files already exist: ${existing.join(', ')}`)
+    return
+  }
+
+  const ok = await confirm(`Create ${color.bold(appName)} in ${appPath}?`)
+  if (!ok) return
+
+  if (name) {
+    mkdirSync(appPath, { recursive: true })
+  }
+
+  const packageJson = `{
+  "name": "${appName}",
+  "module": "index.tsx",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "toes": "bun run --watch index.tsx",
+    "start": "bun toes",
+    "dev": "bun run --hot index.tsx"
+  },
+  "devDependencies": {
+    "@types/bun": "latest"
+  },
+  "peerDependencies": {
+    "typescript": "^5.9.2"
+  },
+  "dependencies": {
+    "hype": "git+https://git.nose.space/defunkt/hype",
+    "forge": "git+https://git.nose.space/defunkt/forge"
+  }
+}
+`
+
+  const indexTsx = `import { Hype } from 'hype'
+
+const app = new Hype()
+
+app.get('/', (c) => c.html(<h1>${appName}</h1>))
+
+export default app.defaults
+`
+
+  const tsconfig = `{
+  "compilerOptions": {
+    "lib": ["ESNext"],
+    "target": "ESNext",
+    "module": "Preserve",
+    "moduleDetection": "force",
+    "jsx": "react-jsx",
+    "jsxImportSource": "hono/jsx",
+    "allowJs": true,
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "noEmit": true,
+    "strict": true,
+    "skipLibCheck": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedIndexedAccess": true,
+    "noImplicitOverride": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
+    "noPropertyAccessFromIndexSignature": false
+  }
+}
+`
+
+  writeFileSync(join(appPath, 'package.json'), packageJson)
+  writeFileSync(join(appPath, 'index.tsx'), indexTsx)
+  writeFileSync(join(appPath, 'tsconfig.json'), tsconfig)
+
+  console.log(color.green(`✓ Created ${appName}`))
+  console.log()
+  console.log('Next steps:')
+  if (name) {
+    console.log(`  cd ${name}`)
+  }
+  console.log('  bun install')
+  console.log('  bun dev')
+}
+
 async function pullApp() {
   if (!isApp()) {
     console.error('Not a toes app. Use `toes get <app>` to grab one.')
@@ -516,6 +650,12 @@ program
   .argument('<name>', 'app name')
   .action(getApp)
 
+program
+  .command('new')
+  .description('Create a new toes app')
+  .argument('[name]', 'app name (uses current directory if omitted)')
+  .action(newApp)
+
 program
   .command('push')
   .description('Push local changes to server')

src/client/index.tsx

@@ -1,5 +1,5 @@
 import { render as renderApp } from 'hono/jsx/dom'
-import { define, Styles } from 'forge'
+import { define, Styles } from '@because/forge'
 import type { App, AppState } from '../shared/types'
 import { theme } from './themes'
 import { Modal, initModal } from './tags/modal'

src/client/tags/emoji-picker.tsx

@@ -1,4 +1,4 @@
-import { define } from 'forge'
+import { define } from '@because/forge'
 import { theme } from '../themes'
 import { openModal, closeModal } from './modal'
 import { update } from '../update'

src/client/tags/modal.tsx

@@ -1,5 +1,5 @@
 import type { Child } from 'hono/jsx'
-import { define } from 'forge'
+import { define } from '@because/forge'
 import { theme } from '../themes'
 
 let modalTitle: string | null = null

src/client/themes/index.ts

@@ -1,4 +1,4 @@
-import { createThemes } from 'forge'
+import { createThemes } from '@because/forge'
 import dark from './dark'
 import light from './light'
 

src/server/api/apps.ts

@@ -0,0 +1,121 @@
+import { allApps, onChange, startApp, stopApp, updateAppIcon } from '$apps'
+import type { App as BackendApp } from '$apps'
+import type { App as SharedApp } from '@types'
+import { Hype } from '@because/hype'
+
+const router = Hype.router()
+
+// BackendApp -> SharedApp
+function convert(app: BackendApp): SharedApp {
+  const clone = { ...app }
+  delete clone.proc
+  delete clone.logs
+  return clone
+}
+
+// SSE endpoint for real-time app state updates
+router.sse('/stream', (send) => {
+  const broadcast = () => {
+    const apps: SharedApp[] = allApps().map(({ name, state, icon, error, port, started, logs }) => ({
+      name,
+      state,
+      icon,
+      error,
+      port,
+      started,
+      logs,
+    }))
+    send(apps)
+  }
+
+  broadcast()
+  const unsub = onChange(broadcast)
+  return () => unsub()
+})
+
+router.get('/', c => c.json(allApps().map(convert)))
+
+router.get('/:app', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  const app = allApps().find(a => a.name === appName)
+  if (!app) return c.json({ error: 'App not found' }, 404)
+
+  return c.json(convert(app))
+})
+
+router.get('/:app/logs', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  const app = allApps().find(a => a.name === appName)
+  if (!app) return c.json({ error: 'App not found' }, 404)
+
+  return c.json(app.logs ?? [])
+})
+
+router.sse('/:app/logs/stream', (send, c) => {
+  const appName = c.req.param('app')
+  const targetApp = allApps().find(a => a.name === appName)
+  if (!targetApp) return
+
+  let lastLogCount = 0
+
+  const sendNewLogs = () => {
+    const currentApp = allApps().find(a => a.name === appName)
+    if (!currentApp) return
+
+    const logs = currentApp.logs ?? []
+    const newLogs = logs.slice(lastLogCount)
+    lastLogCount = logs.length
+
+    for (const line of newLogs) {
+      send(line)
+    }
+  }
+
+  sendNewLogs()
+  const unsub = onChange(sendNewLogs)
+  return () => unsub()
+})
+
+router.post('/:app/start', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  startApp(appName)
+  return c.json({ ok: true })
+})
+
+router.post('/:app/restart', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  stopApp(appName)
+  startApp(appName)
+  return c.json({ ok: true })
+})
+
+router.post('/:app/stop', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  stopApp(appName)
+  return c.json({ ok: true })
+})
+
+router.post('/:app/icon', c => {
+  const appName = c.req.param('app')
+  const icon = c.req.query('icon') ?? ''
+  if (!icon) return c.json({ error: 'No icon query param provided' })
+
+  try {
+    updateAppIcon(appName, icon)
+    return c.json({ ok: true })
+  } catch (error) {
+    return c.json({ error })
+  }
+})
+
+export default router

src/server/api/sync.ts

@@ -0,0 +1,68 @@
+import { APPS_DIR, allApps } from '$apps'
+import { generateManifest } from '../sync'
+import { existsSync, mkdirSync, readFileSync, unlinkSync, writeFileSync } from 'fs'
+import { dirname, join } from 'path'
+import { Hype } from '@because/hype'
+
+const router = Hype.router()
+
+router.get('/apps', c => c.json(allApps().map(a => a.name)))
+
+router.get('/apps/:app/manifest', c => {
+  const appName = c.req.param('app')
+  if (!appName) return c.json({ error: 'App not found' }, 404)
+
+  const appPath = join(APPS_DIR, appName)
+  if (!existsSync(appPath)) return c.json({ error: 'App not found' }, 404)
+
+  const manifest = generateManifest(appPath, appName)
+  return c.json(manifest)
+})
+
+router.get('/apps/:app/files/:path{.+}', c => {
+  const appName = c.req.param('app')
+  const filePath = c.req.param('path')
+
+  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
+
+  const fullPath = join(APPS_DIR, appName, filePath)
+  if (!existsSync(fullPath)) return c.json({ error: 'File not found' }, 404)
+
+  const content = readFileSync(fullPath)
+  return new Response(content)
+})
+
+router.put('/apps/:app/files/:path{.+}', async c => {
+  const appName = c.req.param('app')
+  const filePath = c.req.param('path')
+
+  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
+
+  const fullPath = join(APPS_DIR, appName, filePath)
+  const dir = dirname(fullPath)
+
+  // Ensure directory exists
+  if (!existsSync(dir)) {
+    mkdirSync(dir, { recursive: true })
+  }
+
+  const body = await c.req.arrayBuffer()
+  writeFileSync(fullPath, new Uint8Array(body))
+
+  return c.json({ ok: true })
+})
+
+router.delete('/apps/:app/files/:path{.+}', c => {
+  const appName = c.req.param('app')
+  const filePath = c.req.param('path')
+
+  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
+
+  const fullPath = join(APPS_DIR, appName, filePath)
+  if (!existsSync(fullPath)) return c.json({ error: 'File not found' }, 404)
+
+  unlinkSync(fullPath)
+  return c.json({ ok: true })
+})
+
+export default router

src/server/index.tsx

@@ -1,212 +1,12 @@
-import { APPS_DIR, allApps, initApps, onChange, startApp, stopApp, updateAppIcon } from '$apps'
-import type { App as SharedApp } from '@types'
-import type { App as BackendApp } from '$apps'
-import { generateManifest } from './sync'
-import { existsSync, mkdirSync, readFileSync, unlinkSync, writeFileSync } from 'fs'
-import { dirname, join } from 'path'
-import { Hype } from 'hype'
-
-// BackendApp -> SharedApp
-function convert(app: BackendApp): SharedApp {
-  const clone = { ...app }
-  delete clone.proc
-  delete clone.logs
-  return clone
-}
+import { initApps } from '$apps'
+import appsRouter from './api/apps'
+import syncRouter from './api/sync'
+import { Hype } from '@because/hype'
 
 const app = new Hype({ layout: false })
 
-// SSE endpoint for real-time app state updates
-app.get('/api/apps/stream', c => {
-  const encoder = new TextEncoder()
-
-  const stream = new ReadableStream({
-    start(controller) {
-      const send = () => {
-        // Strip proc field from apps before sending
-        const apps: SharedApp[] = allApps().map(({ name, state, icon, error, port, started, logs }) => ({
-          name,
-          state,
-          icon,
-          error,
-          port,
-          started,
-          logs,
-        }))
-        const data = JSON.stringify(apps)
-        controller.enqueue(encoder.encode(`data: ${data}\n\n`))
-      }
-
-      // Send initial state
-      send()
-
-      // Subscribe to changes
-      const unsub = onChange(send)
-
-      // Handle client disconnect via abort signal
-      c.req.raw.signal.addEventListener('abort', () => {
-        unsub()
-      })
-    },
-  })
-
-  return new Response(stream, {
-    headers: {
-      'Content-Type': 'text/event-stream',
-      'Cache-Control': 'no-cache',
-      Connection: 'keep-alive',
-    },
-  })
-})
-
-app.get('/api/apps', c =>
-  c.json(allApps().map(convert))
-)
-
-app.get('/api/apps/:app', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  const app = allApps().find(a => a.name === appName)
-  if (!app) return c.json({ error: 'App not found' }, 404)
-
-  return c.json(convert(app))
-})
-
-app.get('/api/apps/:app/logs', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  const app = allApps().find(a => a.name === appName)
-  if (!app) return c.json({ error: 'App not found' }, 404)
-
-  return c.json(app.logs ?? [])
-})
-
-app.sse('/api/apps/:app/logs/stream', (send, c) => {
-  const appName = c.req.param('app')
-  const targetApp = allApps().find(a => a.name === appName)
-  if (!targetApp) return
-
-  let lastLogCount = 0
-
-  const sendNewLogs = () => {
-    const currentApp = allApps().find(a => a.name === appName)
-    if (!currentApp) return
-
-    const logs = currentApp.logs ?? []
-    const newLogs = logs.slice(lastLogCount)
-    lastLogCount = logs.length
-
-    for (const line of newLogs) {
-      send(line)
-    }
-  }
-
-  sendNewLogs()
-  const unsub = onChange(sendNewLogs)
-  return () => unsub()
-})
-
-app.post('/api/apps/:app/start', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  startApp(appName)
-  return c.json({ ok: true })
-})
-
-app.post('/api/apps/:app/restart', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  stopApp(appName)
-  startApp(appName)
-  return c.json({ ok: true })
-})
-
-app.post('/api/apps/:app/stop', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  stopApp(appName)
-  return c.json({ ok: true })
-})
-
-app.post('/api/apps/:app/icon', c => {
-  const appName = c.req.param('app')
-  const icon = c.req.query('icon') ?? ''
-  if (!icon) return c.json({ error: 'No icon query param provided' })
-
-  try {
-    updateAppIcon(appName, icon)
-    return c.json({ ok: true })
-  } catch (error) {
-    return c.json({ error })
-  }
-})
-
-// Sync API
-app.get('/api/sync/apps', c =>
-  c.json(allApps().map(a => a.name))
-)
-
-app.get('/api/sync/apps/:app/manifest', c => {
-  const appName = c.req.param('app')
-  if (!appName) return c.json({ error: 'App not found' }, 404)
-
-  const appPath = join(APPS_DIR, appName)
-  if (!existsSync(appPath)) return c.json({ error: 'App not found' }, 404)
-
-  const manifest = generateManifest(appPath, appName)
-  return c.json(manifest)
-})
-
-app.get('/api/sync/apps/:app/files/:path{.+}', c => {
-  const appName = c.req.param('app')
-  const filePath = c.req.param('path')
-
-  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
-
-  const fullPath = join(APPS_DIR, appName, filePath)
-  if (!existsSync(fullPath)) return c.json({ error: 'File not found' }, 404)
-
-  const content = readFileSync(fullPath)
-  return new Response(content)
-})
-
-app.put('/api/sync/apps/:app/files/:path{.+}', async c => {
-  const appName = c.req.param('app')
-  const filePath = c.req.param('path')
-
-  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
-
-  const fullPath = join(APPS_DIR, appName, filePath)
-  const dir = dirname(fullPath)
-
-  // Ensure directory exists
-  if (!existsSync(dir)) {
-    mkdirSync(dir, { recursive: true })
-  }
-
-  const body = await c.req.arrayBuffer()
-  writeFileSync(fullPath, new Uint8Array(body))
-
-  return c.json({ ok: true })
-})
-
-app.delete('/api/sync/apps/:app/files/:path{.+}', c => {
-  const appName = c.req.param('app')
-  const filePath = c.req.param('path')
-
-  if (!appName || !filePath) return c.json({ error: 'Invalid path' }, 400)
-
-  const fullPath = join(APPS_DIR, appName, filePath)
-  if (!existsSync(fullPath)) return c.json({ error: 'File not found' }, 404)
-
-  unlinkSync(fullPath)
-  return c.json({ ok: true })
-})
+app.route('/api/apps', appsRouter)
+app.route('/api/sync', syncRouter)
 
 console.log('🐾 Toes!')
 initApps()