aipeek 0.2.3 → 0.2.4

package/src/core/emit.ts

@@ -0,0 +1,186 @@
+import type { CheckResult, CompactState, DiffResult, RawState } from './types'
+import pc from 'picocolors'
+import { nameOf } from './compact'
+import { compactUrl, truncate } from './util'
+
+// --- Full emit (for ?full) ---
+
+const SECTIONS = ['ui', 'console', 'network', 'errors', 'state'] as const
+const COUNTED_SECTIONS: Record<string, keyof CompactState['counts']> = {
+    console: 'console',
+    network: 'network',
+    errors: 'errors',
+    state: 'state',
+}
+
+export function emit(state: CompactState): string {
+    const sections: string[] = []
+
+    for (const key of SECTIONS) {
+        if (state[key]) {
+            const countKey = COUNTED_SECTIONS[key]
+            const count = countKey ? state.counts?.[countKey] ?? 0 : 0
+            const attr = count ? ` count="${count}"` : ''
+            sections.push(`<${key}${attr}>\n${state[key]}\n</${key}>`)
+        }
+    }
+
+    if (!sections.length) {
+        sections.push('<empty/>')
+    }
+
+    return `<aipeek url="${state.url}">\n\n${sections.join('\n\n')}\n\n</aipeek>\n\ndetail: GET /__aipeek/{section}/{index}?full`
+}
+
+// --- Summary emit (default, high-density) ---
+
+export function emitSummary(raw: RawState): string {
+    const consoleErrors = raw.console.filter(l => l.level === 'error')
+    const consoleWarns = raw.console.filter(l => l.level === 'warn')
+    const failedReqs = raw.network.filter(r => r.status >= 400 || r.failed)
+    const hasIssues = consoleErrors.length > 0 || raw.errors.length > 0 || failedReqs.length > 0
+
+    const lines: string[] = []
+
+    // ui — always 1-line summary
+    if (raw.ui.trim()) {
+        lines.push(`ui: ${summarizeUI(raw.ui)}`)
+    }
+
+    // console — 1-line if clean, expand errors/warns if dirty
+    if (raw.console.length) {
+        if (consoleErrors.length || consoleWarns.length) {
+            const parts: string[] = []
+            for (const e of consoleErrors) parts.push(`  [error] ${truncate(e.text, 150)}`)
+            for (const w of consoleWarns) parts.push(`  [warn] ${truncate(w.text, 150)}`)
+            const rest = raw.console.length - consoleErrors.length - consoleWarns.length
+            if (rest > 0)
+                parts.push(`  … ${rest} more`)
+            lines.push(`console (${raw.console.length}):`)
+            lines.push(...parts)
+        }
+        else {
+            lines.push(`console: ${raw.console.length} logs`)
+        }
+    }
+
+    // network — 1-line if clean, expand failures if dirty
+    if (raw.network.length) {
+        if (failedReqs.length) {
+            lines.push(`network (${raw.network.length}):`)
+            for (const r of failedReqs) {
+                const body = r.responseBody ? ` "${truncate(r.responseBody, 80)}"` : ''
+                lines.push(`  ${r.method} ${compactUrl(r.url)} ${r.status}${body}`)
+            }
+            const ok = raw.network.length - failedReqs.length
+            if (ok > 0)
+                lines.push(`  … ${ok} ok`)
+        }
+        else {
+            lines.push(`network: ${raw.network.length} ok`)
+        }
+    }
+
+    // errors — always expand (these are uncaught exceptions)
+    if (raw.errors.length) {
+        lines.push(`errors (${raw.errors.length}):`)
+        for (const e of raw.errors) lines.push(`  ${truncate(e.message, 150)}`)
+    }
+
+    // state — 1-line: store names + key counts
+    const storeNames = Object.keys(raw.state)
+    if (storeNames.length) {
+        const parts = storeNames.map((n) => {
+            const v = raw.state[n]
+            const keys = typeof v === 'object' && v !== null ? Object.keys(v).length : 0
+            return keys > 0 ? `${n}(${keys})` : n
+        })
+        lines.push(`state: ${parts.join(', ')}`)
+    }
+
+    if (!lines.length)
+        return '<aipeek>empty</aipeek>'
+
+    const status = hasIssues
+        ? `${consoleErrors.length + raw.errors.length + failedReqs.length} issues`
+        : 'ok'
+
+    return `<aipeek url="${raw.url}" status="${status}">\n${lines.join('\n')}\n</aipeek>${hasIssues ? '\n\ndetail: GET /__aipeek/{section}/{index}' : ''}`
+}
+
+function summarizeUI(tree: string): string {
+    // extract top-level component names (depth 0-1)
+    const components: string[] = []
+    const counts = new Map<string, number>()
+
+    for (const line of tree.split('\n')) {
+        const trimmed = line.trimStart()
+        if (!trimmed)
+            continue
+        const indent = line.length - trimmed.length
+        if (indent > 2)
+            continue // only depth 0-1
+
+        const name = nameOf(trimmed)
+        if (!name)
+            continue
+
+        // extract state markers
+        const focused = trimmed.includes('[focused]')
+        const generating = trimmed.includes('[generating]')
+        const loading = trimmed.includes('[loading]')
+
+        const existing = counts.get(name) || 0
+        if (existing > 0) {
+            counts.set(name, existing + 1)
+            continue
+        }
+        counts.set(name, 1)
+
+        let label = name
+        if (focused)
+            label += '[focused]'
+        if (generating)
+            label += '[generating]'
+        if (loading)
+            label += '[loading]'
+        components.push(label)
+    }
+
+    // apply counts
+    const result = components.map((c) => {
+        const name = c.split('[')[0]
+        const count = counts.get(name) || 1
+        return count > 1 ? `${c}(×${count})` : c
+    })
+
+    return result.join(', ') || 'empty'
+}
+
+// --- Check emit ---
+
+export function emitCheck(result: CheckResult): string {
+    const lines = result.assertions.map(a =>
+        a.pass
+            ? `✓ ${a.name}`
+            : `✗ ${a.name}${a.detail ? `: ${a.detail}` : ''}`,
+    )
+    return `<aipeek-check pass="${result.pass}">\n${lines.join('\n')}\n</aipeek-check>`
+}
+
+// --- Diff emit (terminal, colored) ---
+
+export function emitDiff(diff: DiffResult): string {
+    const issues: string[] = []
+    for (const e of diff.newErrors) issues.push(pc.red(`  [error] ${e.text}`))
+    for (const e of diff.newExceptions) issues.push(pc.red(`  [exception] ${e.message}`))
+    for (const r of diff.newFailedRequests) issues.push(pc.yellow(`  [network] ${r.method} ${r.url} ${r.status}`))
+    if (diff.uiGone)
+        issues.push(pc.magenta('  [ui] component tree disappeared'))
+
+    if (!issues.length)
+        return ''
+
+    const count = issues.length
+    return `${pc.bold('[aipeek]')} ${pc.red(`✗ ${count} issue${count > 1 ? 's' : ''} after HMR`)}\n${issues.join('\n')}`
+}

package/src/core/util.ts

@@ -0,0 +1,16 @@
+export function truncate(s: string, max: number): string {
+    return s.length > max ? `${s.slice(0, max)}…` : s
+}
+
+// pathname only; pass `search` to append a truncated query string
+export function compactUrl(url: string, search?: number): string {
+    try {
+        const u = new URL(url)
+        if (search && u.search)
+            return `${u.pathname}?${truncate(u.search.slice(1), search)}`
+        return u.pathname
+    }
+    catch {
+        return truncate(url, 80)
+    }
+}

package/src/index.ts

@@ -0,0 +1,5 @@
+export { check } from './core/check'
+export { diffState } from './core/diff'
+export { emitCheck, emitDiff, emitSummary } from './core/emit'
+export type { CheckResult, CompactState, DiffResult, RawState } from './core/types'
+export { aipeekPlugin } from './server/plugin'

package/src/server/cli.ts

@@ -0,0 +1,70 @@
+/* eslint-disable no-console -- this is a CLI; stdout is its output channel */
+import process from 'node:process'
+import pc from 'picocolors'
+
+const args = process.argv.slice(2)
+const flags = Object.fromEntries(
+    args.filter(a => a.startsWith('--')).map((a) => {
+        const [k, v] = a.slice(2).split('=')
+        return [k, v ?? 'true']
+    }),
+)
+const positional = args.filter(a => !a.startsWith('--'))
+
+async function main() {
+    if (flags.help) {
+        console.log(`
+${pc.bold('aipeek')} — runtime snapshot from Vite dev server
+
+${pc.dim('Usage:')}
+  aipeek                    Full summary
+  aipeek check              Health check (pass/fail)
+  aipeek console            Console logs
+  aipeek network/0          Network request detail
+  aipeek errors/1?full      Error detail (untruncated)
+
+${pc.dim('Options:')}
+  --port=<port>    Dev server port (default: 5173)
+  --full           Untruncated output
+  --help           Show this help
+
+${pc.dim('Setup:')}
+  Add aipeekPlugin() to your vite.config.ts plugins array.
+`)
+        process.exit(0)
+    }
+
+    const port = flags.port || '5173'
+    const sub = positional[0] || ''
+    const full = flags.full ? '?full' : ''
+    const path = sub ? `/${sub}` : ''
+    const endpoint = `http://localhost:${port}/__aipeek${path}${full}`
+
+    const resp = await fetch(endpoint)
+    if (!resp.ok && resp.status !== 417) {
+        const text = await resp.text()
+        console.error(pc.red(`Error ${resp.status}: ${text}`))
+        process.exit(1)
+    }
+
+    const text = await resp.text()
+    // color check results — assertions are one per line: "✓ name" / "✗ name: detail"
+    if (sub === 'check') {
+        const colored = text.split('\n').map((line) => {
+            if (line.startsWith('✓'))
+                return pc.green(line)
+            if (line.startsWith('✗'))
+                return pc.red(line)
+            return line
+        }).join('\n')
+        console.log(colored)
+        process.exit(resp.status === 417 ? 1 : 0)
+    }
+
+    console.log(text)
+}
+
+main().catch((err) => {
+    console.error(pc.red(`Error: ${err.message}`))
+    process.exit(1)
+})