npm - kanna-code - Versions diffs - 0.30.0 → 0.32.0 - Mend

kanna-code 0.30.0 → 0.32.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (29) hide show

package/README.md +13 -0
package/dist/client/assets/index-BxEBJJ_f.css +32 -0
package/dist/client/assets/index-CoeDwJZ0.js +2593 -0
package/dist/client/index.html +2 -2
package/package.json +2 -1
package/src/server/auth.test.ts +207 -0
package/src/server/auth.ts +304 -0
package/src/server/cli-runtime.test.ts +28 -0
package/src/server/cli-runtime.ts +11 -0
package/src/server/event-store.test.ts +18 -0
package/src/server/event-store.ts +32 -0
package/src/server/events.ts +8 -0
package/src/server/generate-commit-message.test.ts +20 -0
package/src/server/generate-commit-message.ts +1 -1
package/src/server/generate-title.ts +1 -1
package/src/server/llm-provider.test.ts +134 -0
package/src/server/llm-provider.ts +149 -0
package/src/server/quick-response.test.ts +202 -0
package/src/server/quick-response.ts +56 -2
package/src/server/read-models.test.ts +78 -1
package/src/server/read-models.ts +54 -4
package/src/server/server.ts +47 -0
package/src/server/ws-router.test.ts +274 -10
package/src/server/ws-router.ts +111 -21
package/src/shared/branding.ts +8 -0
package/src/shared/protocol.ts +11 -0
package/src/shared/types.ts +24 -0
package/dist/client/assets/index-Bnur1EEv.css +0 -32
package/dist/client/assets/index-DNENqajG.js +0 -2593

package/dist/client/index.html CHANGED Viewed

@@ -30,8 +30,8 @@
       })()
     </script>
     <title>Kanna</title>
-    <script type="module" crossorigin src="/assets/index-DNENqajG.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-Bnur1EEv.css">
+    <script type="module" crossorigin src="/assets/index-CoeDwJZ0.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-BxEBJJ_f.css">
   </head>
   <body>
     <div id="root"></div>

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "kanna-code",
   "type": "module",
-  "version": "0.30.0",
+  "version": "0.32.0",
   "description": "A beautiful web UI for Claude Code",
   "license": "MIT",
   "keywords": [
@@ -57,6 +57,7 @@
     "cloudflared": "^0.7.1",
     "default-shell": "^2.2.0",
     "file-type": "^22.0.0",
+    "openai": "^6.34.0",
     "react-resizable-panels": "^4.7.3",
     "uqr": "^0.1.3"
   },

package/src/server/auth.test.ts ADDED Viewed

@@ -0,0 +1,207 @@
+import { afterEach, describe, expect, test } from "bun:test"
+import { mkdtemp, rm } from "node:fs/promises"
+import { tmpdir } from "node:os"
+import path from "node:path"
+import { persistProjectUpload } from "./uploads"
+import { startKannaServer } from "./server"
+const tempDirs: string[] = []
+afterEach(async () => {
+  await Promise.all(tempDirs.splice(0).map((dir) => rm(dir, { recursive: true, force: true })))
+})
+async function startPasswordServer() {
+  const projectDir = await mkdtemp(path.join(tmpdir(), "kanna-auth-test-"))
+  tempDirs.push(projectDir)
+  const server = await startKannaServer({ port: 4320, strictPort: true, password: "secret" })
+  const project = await server.store.openProject(projectDir, "Project")
+  return { server, projectDir, project }
+}
+function extractCookie(response: Response) {
+  const header = response.headers.get("set-cookie")
+  expect(header).toBeTruthy()
+  return header!.split(";", 1)[0]
+}
+describe("password auth", () => {
+  test("redirects unauthenticated html requests to the login page", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const response = await fetch(`http://localhost:${server.port}/`, { redirect: "manual", headers: { Accept: "text/html" } })
+      expect(response.status).toBe(302)
+      expect(response.headers.get("location")).toBe(`http://localhost:${server.port}/auth/login?next=%2F`)
+    } finally {
+      await server.stop()
+    }
+  })
+  test("blocks unauthenticated api requests", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const response = await fetch(`http://localhost:${server.port}/health`, { redirect: "manual" })
+      expect(response.status).toBe(401)
+    } finally {
+      await server.stop()
+    }
+  })
+  test("serves the login page without authentication", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const response = await fetch(`http://localhost:${server.port}/auth/login`)
+      expect(response.status).toBe(200)
+      expect(response.headers.get("content-type")).toContain("text/html")
+      expect(await response.text()).toContain("This server is password protected")
+    } finally {
+      await server.stop()
+    }
+  })
+  test("sets a session cookie after a successful login", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const formData = new FormData()
+      formData.append("password", "secret")
+      formData.append("next", "/")
+      const response = await fetch(`http://localhost:${server.port}/auth/login`, {
+        method: "POST",
+        body: formData,
+        redirect: "manual",
+        headers: {
+          Origin: `http://localhost:${server.port}`,
+        },
+      })
+      expect(response.status).toBe(302)
+      expect(response.headers.get("location")).toBe(`http://localhost:${server.port}/`)
+      expect(extractCookie(response)).toContain("kanna_session=")
+    } finally {
+      await server.stop()
+    }
+  })
+  test("rejects an invalid password", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const formData = new FormData()
+      formData.append("password", "wrong")
+      const response = await fetch(`http://localhost:${server.port}/auth/login`, {
+        method: "POST",
+        body: formData,
+        redirect: "manual",
+        headers: {
+          Origin: `http://localhost:${server.port}`,
+        },
+      })
+      expect(response.status).toBe(302)
+      expect(response.headers.get("location")).toContain("/auth/login?error=1")
+      expect(response.headers.get("set-cookie")).toBeNull()
+    } finally {
+      await server.stop()
+    }
+  })
+  test("rejects cross-origin login attempts", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const response = await fetch(`http://localhost:${server.port}/auth/login`, {
+        method: "POST",
+        body: JSON.stringify({ password: "secret" }),
+        headers: {
+          "Content-Type": "application/json",
+          Origin: "http://evil.test",
+        },
+      })
+      expect(response.status).toBe(403)
+    } finally {
+      await server.stop()
+    }
+  })
+  test("allows authenticated access to protected routes", async () => {
+    const { server, project, projectDir } = await startPasswordServer()
+    try {
+      const attachment = await persistProjectUpload({
+        projectId: project.id,
+        localPath: projectDir,
+        fileName: "hello.txt",
+        bytes: new TextEncoder().encode("hello from upload"),
+        fallbackMimeType: "text/plain",
+      })
+      const loginResponse = await fetch(`http://localhost:${server.port}/auth/login`, {
+        method: "POST",
+        body: JSON.stringify({ password: "secret", next: "/" }),
+        headers: {
+          "Content-Type": "application/json",
+          Origin: `http://localhost:${server.port}`,
+        },
+      })
+      const cookie = extractCookie(loginResponse)
+      const healthResponse = await fetch(`http://localhost:${server.port}/health`, {
+        headers: {
+          Cookie: cookie,
+        },
+      })
+      expect(healthResponse.status).toBe(200)
+      const contentResponse = await fetch(`http://localhost:${server.port}${attachment.contentUrl}`, {
+        headers: {
+          Cookie: cookie,
+        },
+      })
+      expect(contentResponse.status).toBe(200)
+      expect(await contentResponse.text()).toBe("hello from upload")
+    } finally {
+      await server.stop()
+    }
+  })
+  test("clears the session cookie on logout", async () => {
+    const { server } = await startPasswordServer()
+    try {
+      const loginResponse = await fetch(`http://localhost:${server.port}/auth/login`, {
+        method: "POST",
+        body: JSON.stringify({ password: "secret", next: "/" }),
+        headers: {
+          "Content-Type": "application/json",
+          Origin: `http://localhost:${server.port}`,
+        },
+      })
+      const cookie = extractCookie(loginResponse)
+      const logoutResponse = await fetch(`http://localhost:${server.port}/auth/logout`, {
+        method: "POST",
+        headers: {
+          Cookie: cookie,
+          Origin: `http://localhost:${server.port}`,
+        },
+      })
+      expect(logoutResponse.status).toBe(200)
+      expect(logoutResponse.headers.get("set-cookie")).toContain("Max-Age=0")
+      const healthResponse = await fetch(`http://localhost:${server.port}/health`, {
+        headers: {
+          Cookie: cookie,
+        },
+      })
+      expect(healthResponse.status).toBe(401)
+    } finally {
+      await server.stop()
+    }
+  })
+})

package/src/server/auth.ts ADDED Viewed

@@ -0,0 +1,304 @@
+import { randomBytes, timingSafeEqual } from "node:crypto"
+import { APP_NAME } from "../shared/branding"
+const SESSION_COOKIE_NAME = "kanna_session"
+export interface AuthStatusPayload {
+  enabled: boolean
+  authenticated: boolean
+}
+export interface AuthManager {
+  readonly enabled: true
+  isAuthenticated(req: Request): boolean
+  validateOrigin(req: Request): boolean
+  createSessionCookie(req: Request): string
+  clearSessionCookie(req: Request): string
+  verifyPassword(candidate: string): boolean
+  handleLogin(req: Request, nextPath: string): Promise<Response>
+  handleLogout(req: Request): Response
+  handleStatus(req: Request): Response
+  renderLoginPage(req: Request): Response
+  unauthorizedResponse(req: Request): Response
+}
+function parseCookies(header: string | null) {
+  const cookies = new Map<string, string>()
+  if (!header) return cookies
+  for (const segment of header.split(";")) {
+    const trimmed = segment.trim()
+    if (!trimmed) continue
+    const separator = trimmed.indexOf("=")
+    if (separator <= 0) continue
+    const key = trimmed.slice(0, separator).trim()
+    const value = trimmed.slice(separator + 1).trim()
+    cookies.set(key, decodeURIComponent(value))
+  }
+  return cookies
+}
+function sanitizeNextPath(nextPath: string | null | undefined) {
+  if (!nextPath || typeof nextPath !== "string") return "/"
+  if (!nextPath.startsWith("/")) return "/"
+  if (nextPath.startsWith("//")) return "/"
+  if (nextPath.startsWith("/auth/login")) return "/"
+  return nextPath
+}
+function shouldUseSecureCookie(req: Request) {
+  return new URL(req.url).protocol === "https:"
+}
+function buildCookie(name: string, value: string, req: Request, extras: string[] = []) {
+  const parts = [
+    `${name}=${encodeURIComponent(value)}`,
+    "Path=/",
+    "HttpOnly",
+    "SameSite=Strict",
+  ]
+  if (shouldUseSecureCookie(req)) {
+    parts.push("Secure")
+  }
+  parts.push(...extras)
+  return parts.join("; ")
+}
+async function readLoginForm(req: Request) {
+  const contentType = req.headers.get("content-type") ?? ""
+  if (contentType.includes("application/json")) {
+    const payload = await req.json() as { password?: unknown; next?: unknown }
+    return {
+      password: typeof payload.password === "string" ? payload.password : "",
+      nextPath: sanitizeNextPath(typeof payload.next === "string" ? payload.next : "/"),
+      wantsJson: true,
+    }
+  }
+  const formData = await req.formData()
+  return {
+    password: String(formData.get("password") ?? ""),
+    nextPath: sanitizeNextPath(String(formData.get("next") ?? "/")),
+    wantsJson: false,
+  }
+}
+function requestWantsHtml(req: Request) {
+  const accept = req.headers.get("accept") ?? ""
+  return accept.includes("text/html")
+}
+function escapeHtml(value: string) {
+  return value
+    .replaceAll("&", "&amp;")
+    .replaceAll("<", "&lt;")
+    .replaceAll(">", "&gt;")
+    .replaceAll("\"", "&quot;")
+    .replaceAll("'", "&#39;")
+}
+export function createAuthManager(password: string): AuthManager {
+  const sessions = new Set<string>()
+  const expectedPassword = Buffer.from(password)
+  function getSessionToken(req: Request) {
+    return parseCookies(req.headers.get("cookie")).get(SESSION_COOKIE_NAME) ?? null
+  }
+  function isAuthenticated(req: Request) {
+    const sessionToken = getSessionToken(req)
+    return Boolean(sessionToken && sessions.has(sessionToken))
+  }
+  function validateOrigin(req: Request) {
+    const origin = req.headers.get("origin")
+    if (!origin) return true
+    return origin === new URL(req.url).origin
+  }
+  function createSessionCookie(req: Request) {
+    const sessionToken = randomBytes(32).toString("base64url")
+    sessions.add(sessionToken)
+    return buildCookie(SESSION_COOKIE_NAME, sessionToken, req)
+  }
+  function clearSessionCookie(req: Request) {
+    const sessionToken = getSessionToken(req)
+    if (sessionToken) {
+      sessions.delete(sessionToken)
+    }
+    return buildCookie(SESSION_COOKIE_NAME, "", req, ["Max-Age=0"])
+  }
+  function verifyPassword(candidate: string) {
+    const actual = Buffer.from(candidate)
+    if (actual.length !== expectedPassword.length) {
+      return false
+    }
+    return timingSafeEqual(actual, expectedPassword)
+  }
+  function handleStatus(req: Request) {
+    return Response.json({
+      enabled: true,
+      authenticated: isAuthenticated(req),
+    } satisfies AuthStatusPayload)
+  }
+  function unauthorizedResponse(req: Request) {
+    if (req.method === "GET" && requestWantsHtml(req)) {
+      const url = new URL(req.url)
+      const loginUrl = new URL("/auth/login", req.url)
+      loginUrl.searchParams.set("next", sanitizeNextPath(`${url.pathname}${url.search}`))
+      return Response.redirect(loginUrl, 302)
+    }
+    return Response.json({ error: "Unauthorized" }, { status: 401 })
+  }
+  function renderLoginPage(req: Request) {
+    if (isAuthenticated(req)) {
+      const currentUrl = new URL(req.url)
+      return Response.redirect(new URL(sanitizeNextPath(currentUrl.searchParams.get("next")), req.url), 302)
+    }
+    const currentUrl = new URL(req.url)
+    const nextPath = sanitizeNextPath(currentUrl.searchParams.get("next"))
+    const showError = currentUrl.searchParams.get("error") === "1"
+    const html = `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>${escapeHtml(APP_NAME)} Login</title>
+    <style>
+      :root { color-scheme: dark; }
+      * { box-sizing: border-box; }
+      body {
+        margin: 0;
+        min-height: 100vh;
+        font-family: ui-sans-serif, system-ui, sans-serif;
+        background:
+          radial-gradient(circle at top, rgba(255,255,255,0.10), transparent 28%),
+          linear-gradient(160deg, #16181d 0%, #0b0d10 55%, #050608 100%);
+        color: #f4f7fb;
+        display: grid;
+        place-items: center;
+        padding: 24px;
+      }
+      .card {
+        width: min(420px, 100%);
+        border: 1px solid rgba(255,255,255,0.12);
+        background: rgba(12, 15, 20, 0.88);
+        backdrop-filter: blur(10px);
+        border-radius: 24px;
+        padding: 28px;
+        box-shadow: 0 24px 70px rgba(0,0,0,0.35);
+      }
+      h1 { margin: 0 0 8px; font-size: 28px; }
+      p { margin: 0 0 20px; color: #a6b0bd; line-height: 1.5; }
+      label { display: block; font-size: 13px; margin-bottom: 8px; color: #d7dce4; }
+      input {
+        width: 100%;
+        border-radius: 14px;
+        border: 1px solid rgba(255,255,255,0.16);
+        background: rgba(255,255,255,0.04);
+        color: inherit;
+        padding: 14px 16px;
+        font-size: 15px;
+        margin-bottom: 16px;
+      }
+      button {
+        width: 100%;
+        border: 0;
+        border-radius: 14px;
+        padding: 14px 16px;
+        background: linear-gradient(135deg, #f4ede0 0%, #d9c4a1 100%);
+        color: #16181d;
+        font-size: 15px;
+        font-weight: 700;
+        cursor: pointer;
+      }
+      .error {
+        margin-bottom: 16px;
+        border-radius: 14px;
+        background: rgba(255, 106, 106, 0.12);
+        border: 1px solid rgba(255, 106, 106, 0.24);
+        color: #ffb8b8;
+        padding: 12px 14px;
+        font-size: 14px;
+      }
+    </style>
+  </head>
+  <body>
+    <form class="card" method="post" action="/auth/login">
+      <h1>${escapeHtml(APP_NAME)}</h1>
+      <p>This server is password protected. Enter the launch password to continue.</p>
+      ${showError ? '<div class="error">Incorrect password. Try again.</div>' : ""}
+      <input type="hidden" name="next" value="${escapeHtml(nextPath)}" />
+      <label for="password">Password</label>
+      <input id="password" name="password" type="password" autocomplete="current-password" autofocus required />
+      <button type="submit">Unlock</button>
+    </form>
+  </body>
+</html>`
+    return new Response(html, {
+      headers: {
+        "Content-Type": "text/html; charset=utf-8",
+      },
+    })
+  }
+  async function handleLogin(req: Request, fallbackNextPath: string) {
+    if (!validateOrigin(req)) {
+      return Response.json({ error: "Forbidden" }, { status: 403 })
+    }
+    const { password: candidate, nextPath, wantsJson } = await readLoginForm(req)
+    if (!verifyPassword(candidate)) {
+      if (wantsJson) {
+        return Response.json({ error: "Invalid password" }, { status: 401 })
+      }
+      const redirectUrl = new URL("/auth/login", req.url)
+      redirectUrl.searchParams.set("error", "1")
+      redirectUrl.searchParams.set("next", sanitizeNextPath(nextPath || fallbackNextPath))
+      return Response.redirect(redirectUrl, 302)
+    }
+    const response = wantsJson
+      ? Response.json({ ok: true, nextPath: sanitizeNextPath(nextPath || fallbackNextPath) })
+      : Response.redirect(new URL(sanitizeNextPath(nextPath || fallbackNextPath), req.url), 302)
+    response.headers.set("Set-Cookie", createSessionCookie(req))
+    return response
+  }
+  function handleLogout(req: Request) {
+    if (!validateOrigin(req)) {
+      return Response.json({ error: "Forbidden" }, { status: 403 })
+    }
+    const response = Response.json({ ok: true })
+    response.headers.set("Set-Cookie", clearSessionCookie(req))
+    return response
+  }
+  return {
+    enabled: true,
+    isAuthenticated,
+    validateOrigin,
+    createSessionCookie,
+    clearSessionCookie,
+    verifyPassword,
+    handleLogin,
+    handleLogout,
+    handleStatus,
+    renderLoginPage,
+    unauthorizedResponse,
+  }
+}

package/src/server/cli-runtime.test.ts CHANGED Viewed

@@ -25,6 +25,7 @@ function createDeps(overrides: Partial<Parameters<typeof runCli>[1]> = {}) {
       host: string
       openBrowser: boolean
       share: false | "quick" | { kind: "token"; token: string }
+      password: string | null
       strictPort: boolean
       update: {
         version: string
@@ -102,6 +103,7 @@ describe("parseArgs", () => {
         host: "127.0.0.1",
         openBrowser: false,
         share: false,
+        password: null,
         strictPort: false,
       },
     })
@@ -115,6 +117,7 @@ describe("parseArgs", () => {
         host: "127.0.0.1",
         openBrowser: true,
         share: false,
+        password: null,
         strictPort: true,
       },
     })
@@ -128,6 +131,7 @@ describe("parseArgs", () => {
         host: "0.0.0.0",
         openBrowser: true,
         share: false,
+        password: null,
         strictPort: false,
       },
     })
@@ -141,6 +145,7 @@ describe("parseArgs", () => {
         host: "127.0.0.1",
         openBrowser: true,
         share: "quick",
+        password: null,
         strictPort: false,
       },
     })
@@ -154,11 +159,31 @@ describe("parseArgs", () => {
         host: "127.0.0.1",
         openBrowser: true,
         share: { kind: "token", token: "secret-token" },
+        password: null,
         strictPort: false,
       },
     })
   })
+  test("--password accepts a secret", () => {
+    expect(parseArgs(["--password", "secret"])).toEqual({
+      kind: "run",
+      options: {
+        port: 3210,
+        host: "127.0.0.1",
+        openBrowser: true,
+        share: false,
+        password: "secret",
+        strictPort: false,
+      },
+    })
+  })
+  test("--password without a value throws", () => {
+    expect(() => parseArgs(["--password"])).toThrow("Missing value for --password")
+    expect(() => parseArgs(["--password", "--no-open"])).toThrow("Missing value for --password")
+  })
   test("--cloudflared without a token throws", () => {
     expect(() => parseArgs(["--cloudflared"])).toThrow("Missing value for --cloudflared")
     expect(() => parseArgs(["--cloudflared", "--no-open"])).toThrow("Missing value for --cloudflared")
@@ -172,6 +197,7 @@ describe("parseArgs", () => {
         host: "100.64.0.1",
         openBrowser: true,
         share: false,
+        password: null,
         strictPort: false,
       },
     })
@@ -185,6 +211,7 @@ describe("parseArgs", () => {
         host: "dev-box",
         openBrowser: true,
         share: false,
+        password: null,
         strictPort: false,
       },
     })
@@ -261,6 +288,7 @@ describe("runCli", () => {
       host: "127.0.0.1",
       openBrowser: false,
       share: false,
+      password: null,
       strictPort: false,
       update: {
         version: "0.3.0",

package/src/server/cli-runtime.ts CHANGED Viewed

@@ -14,6 +14,7 @@ export interface CliOptions {
   host: string
   openBrowser: boolean
   share: ShareMode
+  password: string | null
   strictPort: boolean
 }
@@ -85,6 +86,7 @@ Options:
   --share              Create a public Cloudflare quick tunnel with terminal QR
   --cloudflared <token>
                        Run a named Cloudflare tunnel from a token
+  --password <secret>  Require a password before loading the app
   --strict-port        Fail instead of trying another port
   --no-open            Don't open browser automatically
   --version            Print version and exit
@@ -96,6 +98,7 @@ export function parseArgs(argv: string[]): ParsedArgs {
   let host = "127.0.0.1"
   let openBrowser = true
   let share: ShareMode = false
+  let password: string | null = null
   let sawHost = false
   let sawRemote = false
   let strictPort = false
@@ -153,6 +156,13 @@ export function parseArgs(argv: string[]): ParsedArgs {
       openBrowser = false
       continue
     }
+    if (arg === "--password") {
+      const next = argv[index + 1]
+      if (!next || next.startsWith("-")) throw new Error("Missing value for --password")
+      password = next
+      index += 1
+      continue
+    }
     if (arg === "--strict-port") {
       strictPort = true
       continue
@@ -167,6 +177,7 @@ export function parseArgs(argv: string[]): ParsedArgs {
       host,
       openBrowser,
       share,
+      password,
       strictPort,
     },
   }

package/src/server/event-store.test.ts CHANGED Viewed

@@ -345,6 +345,24 @@ describe("EventStore", () => {
     expect(store.getChat("chat-1")?.unread).toBe(false)
   })
+  test("persists sidebar project order across restart and compaction", async () => {
+    const dataDir = await createTempDataDir()
+    const store = new EventStore(dataDir)
+    await store.initialize()
+    const first = await store.openProject("/tmp/project-a")
+    const second = await store.openProject("/tmp/project-b")
+    await store.setSidebarProjectOrder([second.id, first.id])
+    expect(store.state.sidebarProjectOrder).toEqual([second.id, first.id])
+    await store.compact()
+    const reloaded = new EventStore(dataDir)
+    await reloaded.initialize()
+    expect(reloaded.state.sidebarProjectOrder).toEqual([second.id, first.id])
+  })
   test("prunes stale empty chats after thirty minutes", async () => {
     const dataDir = await createTempDataDir()
     const store = new EventStore(dataDir)