nastechai-desktop 18.1.0

package/src/lib/tool-result-summary.ts

@@ -0,0 +1,467 @@
+// Heuristic JSON → human summary for tool results. Default view; technical
+// mode still gets the raw JSON section.
+
+const WRAPPER_KEYS = ['data', 'result', 'output', 'response', 'payload'] as const
+
+const PRIORITY_KEYS = [
+  'title',
+  'name',
+  'path',
+  'file',
+  'filepath',
+  'url',
+  'href',
+  'link',
+  'status',
+  'id',
+  'message',
+  'summary',
+  'description'
+] as const
+
+const ERROR_KEYS = ['error', 'errors', 'failure', 'exception'] as const
+// 'stderr' deliberately excluded: many CLIs emit informational lines on
+// stderr (npm progress, git's hint:, gcc's `In file included from`) that
+// aren't errors. Treating those as error signal flipped tool cards into
+// destructive styling for healthy commands.
+const ERROR_MSG_KEYS = ['message', 'reason', 'detail'] as const
+const NON_ERROR_TEXT = new Set(['', '0', 'false', 'none', 'null', 'nil', 'ok', 'success', 'n/a', 'na'])
+
+type Json = Record<string, unknown>
+
+const isRecord = (v: unknown): v is Json => Boolean(v && typeof v === 'object' && !Array.isArray(v))
+
+function tryJson(value: string): unknown {
+  const t = value.trim()
+
+  if (!t) {
+    return ''
+  }
+
+  if (!/^[{[]|^"/.test(t)) {
+    return value
+  }
+
+  try {
+    return JSON.parse(t)
+  } catch {
+    return value
+  }
+}
+
+const norm = (v: unknown): unknown => (typeof v === 'string' ? tryJson(v) : v)
+
+const titleCase = (k: string) =>
+  k
+    .split(/[_\-.]+/)
+    .filter(Boolean)
+    .map(p => `${p[0]?.toUpperCase() ?? ''}${p.slice(1)}`)
+    .join(' ')
+
+const pluralize = (n: number, noun: string) => `${n} ${noun}${n === 1 ? '' : 's'}`
+
+function clipInline(value: string, max = 180): string {
+  const c = value.replace(/\s+/g, ' ').trim()
+
+  return c.length > max ? `${c.slice(0, max - 1)}…` : c
+}
+
+function clipBlock(value: string, maxChars = 1800, maxLines = 18): string {
+  const t = value.trim()
+
+  if (!t) {
+    return ''
+  }
+
+  const lines = t.split('\n')
+  let text = lines.slice(0, maxLines).join('\n')
+  const clipped = lines.length > maxLines || text.length > maxChars
+
+  if (text.length > maxChars) {
+    text = text.slice(0, maxChars - 1).trimEnd()
+  }
+
+  return clipped && !text.endsWith('…') ? `${text}…` : text
+}
+
+function firstString(record: Json, keys: readonly string[]): string {
+  for (const k of keys) {
+    const v = record[k]
+
+    if (typeof v === 'string' && v.trim()) {
+      return v.trim()
+    }
+  }
+
+  return ''
+}
+
+function orderedKeys(keys: string[]): string[] {
+  const priority = PRIORITY_KEYS.filter(k => keys.includes(k))
+  const rest = keys.filter(k => !priority.includes(k as never))
+
+  return [...priority, ...rest]
+}
+
+const isWrapperKey = (k: string) => (WRAPPER_KEYS as readonly string[]).includes(k)
+const skipField = (k: string, v: unknown) => isWrapperKey(k) || ((k === 'success' || k === 'ok') && v === true)
+
+function summarizeScalar(v: unknown): string {
+  if (typeof v === 'string') {
+    return clipInline(v)
+  }
+
+  if (typeof v === 'number' || typeof v === 'boolean') {
+    return String(v)
+  }
+
+  return ''
+}
+
+function summarizeRecordInline(record: Json, depth: number): string {
+  if (depth > 3) {
+    return pluralize(Object.keys(record).length, 'field')
+  }
+
+  const title = firstString(record, ['title', 'name', 'path', 'file', 'filepath', 'url', 'href', 'link', 'id'])
+  const status = firstString(record, ['status', 'category', 'type'])
+  const message = firstString(record, ['snippet', 'summary', 'description', 'message'])
+
+  if (title && status) {
+    return `${clipInline(title, 110)} (${clipInline(status, 54)})`
+  }
+
+  if (title && message && title !== message) {
+    return `${clipInline(title, 90)} - ${clipInline(message, 84)}`
+  }
+
+  if (title) {
+    return clipInline(title, 150)
+  }
+
+  const pairs = orderedKeys(Object.keys(record))
+    .filter(k => !skipField(k, record[k]))
+    .map(k => {
+      const s = summarizeScalar(record[k])
+
+      return s ? `${titleCase(k)}: ${s}` : ''
+    })
+    .filter(Boolean)
+    .slice(0, 2)
+
+  return pairs.length ? pairs.join(' · ') : pluralize(Object.keys(record).length, 'field')
+}
+
+function summarizeListItem(item: unknown, depth: number): string {
+  const v = norm(item)
+
+  if (typeof v === 'string') {
+    return clipInline(v)
+  }
+
+  if (typeof v === 'number' || typeof v === 'boolean') {
+    return String(v)
+  }
+
+  if (v == null) {
+    return ''
+  }
+
+  if (Array.isArray(v)) {
+    return pluralize(v.length, 'item')
+  }
+
+  if (isRecord(v)) {
+    return summarizeRecordInline(v, depth + 1)
+  }
+
+  return clipInline(String(v))
+}
+
+function formatFieldValue(value: unknown, depth: number): string {
+  const v = norm(value)
+  const scalar = summarizeScalar(v)
+
+  if (scalar) {
+    return scalar
+  }
+
+  if (v == null) {
+    return ''
+  }
+
+  if (Array.isArray(v)) {
+    if (!v.length) {
+      return ''
+    }
+
+    const scalars = v.map(summarizeScalar).filter(Boolean)
+
+    if (scalars.length === v.length && v.length <= 4) {
+      return clipInline(scalars.join(', '))
+    }
+
+    const first = summarizeListItem(v[0], depth + 1)
+
+    return first ? `${pluralize(v.length, 'item')} (${first})` : pluralize(v.length, 'item')
+  }
+
+  if (isRecord(v)) {
+    return summarizeRecordInline(v, depth + 1)
+  }
+
+  return clipInline(String(v))
+}
+
+// "Returned N items" / "0 items" / "Returned an empty object" are all
+// noise — better to render nothing and let the title carry the signal.
+function formatArraySummary(value: unknown[], depth: number): string {
+  if (!value.length) {
+    return ''
+  }
+
+  const max = 6
+
+  const lines = value
+    .slice(0, max)
+    .map(item => summarizeListItem(item, depth + 1))
+    .filter(Boolean)
+    .map(l => `- ${l}`)
+
+  if (!lines.length) {
+    return ''
+  }
+
+  if (value.length > max) {
+    const remaining = value.length - max
+    lines.push(`- … ${remaining} more ${remaining === 1 ? 'item' : 'items'}`)
+  }
+
+  return lines.join('\n')
+}
+
+function formatRecordSummary(record: Json, depth: number): string {
+  const keys = Object.keys(record)
+
+  if (!keys.length) {
+    return ''
+  }
+
+  if (depth <= 2) {
+    const direct = firstString(record, ['message', 'summary', 'description', 'preview', 'text', 'content'])
+    const meaningful = keys.filter(k => !skipField(k, record[k]) && !isWrapperKey(k))
+
+    if (direct && meaningful.length <= 1) {
+      return clipBlock(direct)
+    }
+  }
+
+  const candidates = orderedKeys(keys).filter(k => !skipField(k, record[k]))
+  const max = 8
+  const lines: string[] = []
+
+  for (const k of candidates) {
+    const v = formatFieldValue(record[k], depth + 1)
+
+    if (!v) {
+      continue
+    }
+
+    lines.push(`- ${titleCase(k)}: ${v}`)
+
+    if (lines.length >= max) {
+      break
+    }
+  }
+
+  if (!lines.length) {
+    return ''
+  }
+
+  if (candidates.length > lines.length) {
+    const remaining = candidates.length - lines.length
+    lines.push(`- … ${remaining} more ${remaining === 1 ? 'field' : 'fields'}`)
+  }
+
+  return lines.join('\n')
+}
+
+function formatSummaryValue(value: unknown, depth: number): string {
+  if (depth > 4) {
+    return ''
+  }
+
+  const v = norm(value)
+
+  if (typeof v === 'string') {
+    return clipBlock(v)
+  }
+
+  if (typeof v === 'number' || typeof v === 'boolean') {
+    return String(v)
+  }
+
+  if (v == null) {
+    return ''
+  }
+
+  if (Array.isArray(v)) {
+    return formatArraySummary(v, depth + 1)
+  }
+
+  if (isRecord(v)) {
+    return formatRecordSummary(v, depth + 1)
+  }
+
+  return clipInline(String(v))
+}
+
+function unwrapPayload(value: unknown): unknown {
+  let cur: unknown = norm(value)
+
+  for (let i = 0; i < 4; i += 1) {
+    if (!isRecord(cur)) {
+      return cur
+    }
+
+    const record = cur
+    const key = WRAPPER_KEYS.find(k => record[k] != null)
+
+    if (!key) {
+      return record
+    }
+
+    cur = norm(record[key])
+  }
+
+  return cur
+}
+
+function hasMeaningfulErrorValue(value: unknown): boolean {
+  const v = norm(value)
+
+  if (v == null) {
+    return false
+  }
+
+  if (typeof v === 'string') {
+    return !NON_ERROR_TEXT.has(v.trim().toLowerCase())
+  }
+
+  if (typeof v === 'boolean') {
+    return v
+  }
+
+  if (typeof v === 'number') {
+    return v !== 0
+  }
+
+  if (Array.isArray(v)) {
+    return v.some(hasMeaningfulErrorValue)
+  }
+
+  if (isRecord(v)) {
+    return Object.keys(v).length > 0
+  }
+
+  return true
+}
+
+function hasErrorSignal(record: Json): boolean {
+  const status = typeof record.status === 'string' ? record.status : ''
+
+  return (
+    record.success === false ||
+    record.ok === false ||
+    /\b(error|failed|failure|fatal|exception)\b/i.test(status) ||
+    ERROR_KEYS.some(k => hasMeaningfulErrorValue(record[k]))
+  )
+}
+
+function valueErrorText(value: unknown): string {
+  const v = norm(value)
+
+  if (typeof v === 'string') {
+    return hasMeaningfulErrorValue(v) ? clipBlock(v, 700, 12) : ''
+  }
+
+  if (Array.isArray(v)) {
+    return clipBlock(v.map(valueErrorText).filter(Boolean).slice(0, 3).join('; '), 700, 12)
+  }
+
+  if (isRecord(v)) {
+    const direct = firstString(v, ERROR_MSG_KEYS)
+
+    if (direct) {
+      return clipBlock(direct, 700, 12)
+    }
+  }
+
+  return ''
+}
+
+function findNestedError(value: unknown, depth: number, seen: Set<unknown>): string {
+  if (depth > 5) {
+    return ''
+  }
+
+  const v = norm(value)
+
+  if (!v || typeof v !== 'object' || seen.has(v)) {
+    return ''
+  }
+
+  seen.add(v)
+
+  if (Array.isArray(v)) {
+    for (const item of v) {
+      const nested = findNestedError(item, depth + 1, seen)
+
+      if (nested) {
+        return nested
+      }
+    }
+
+    return ''
+  }
+
+  const record = v as Json
+
+  for (const k of ERROR_KEYS) {
+    if (!hasMeaningfulErrorValue(record[k])) {
+      continue
+    }
+
+    const text = valueErrorText(record[k])
+
+    if (text) {
+      return text
+    }
+  }
+
+  if (hasErrorSignal(record)) {
+    const direct = firstString(record, ERROR_MSG_KEYS)
+
+    if (direct) {
+      return clipBlock(direct, 700, 12)
+    }
+  }
+
+  for (const k of [...ERROR_KEYS, ...WRAPPER_KEYS, 'details', 'meta']) {
+    const nested = findNestedError(record[k], depth + 1, seen)
+
+    if (nested) {
+      return nested
+    }
+  }
+
+  return ''
+}
+
+export function formatToolResultSummary(value: unknown): string {
+  return formatSummaryValue(unwrapPayload(value), 0) || formatSummaryValue(value, 0)
+}
+
+export function extractToolErrorMessage(value: unknown): string {
+  return findNestedError(value, 0, new Set())
+}

package/src/lib/update-copy.test.ts

@@ -0,0 +1,38 @@
+import { describe, expect, it } from 'vitest'
+
+import { resolveUpdateCopy } from './update-copy'
+
+const copy = {
+  availableTitle: 'New update available',
+  availableBody: 'A new version of NasTech is ready to install.',
+  availableTitleBackend: 'Backend update available',
+  availableBodyBackend: 'A newer version of the connected NasTech backend is ready to install.',
+  availableBodyNoChangelog: 'A newer version is ready. Release notes aren’t available for this install type.'
+}
+
+describe('resolveUpdateCopy', () => {
+  it('client target with commits: client title + client body', () => {
+    const r = resolveUpdateCopy({ target: 'client', shownItems: 5, copy })
+    expect(r.title).toBe('New update available')
+    expect(r.body).toBe('A new version of NasTech is ready to install.')
+  })
+
+  it('backend target with commits: names the backend in title and body', () => {
+    const r = resolveUpdateCopy({ target: 'backend', shownItems: 5, copy })
+    expect(r.title).toBe('Backend update available')
+    expect(r.body).toContain('backend')
+  })
+
+  it('no changelog (pip/non-git backend): degrades honestly, still names backend target in title', () => {
+    const r = resolveUpdateCopy({ target: 'backend', shownItems: 0, copy })
+    expect(r.title).toBe('Backend update available')
+    // Body must NOT pretend there are notes — it states they're unavailable.
+    expect(r.body).toBe(copy.availableBodyNoChangelog)
+  })
+
+  it('no changelog on client: same honest degrade', () => {
+    const r = resolveUpdateCopy({ target: 'client', shownItems: 0, copy })
+    expect(r.title).toBe('New update available')
+    expect(r.body).toBe(copy.availableBodyNoChangelog)
+  })
+})

package/src/lib/update-copy.ts

@@ -0,0 +1,44 @@
+/**
+ * Pure copy-selection for the updates overlay's "available" state.
+ *
+ * Names the update target (client vs the connected backend in remote mode) and
+ * degrades honestly when there's no commit changelog to show (e.g. a pip /
+ * non-git backend where `git log` yields nothing) instead of generic filler.
+ *
+ * Extracted from updates-overlay.tsx so the wording logic is unit-testable.
+ */
+
+export type UpdateTarget = 'client' | 'backend'
+
+export interface UpdateCopyStrings {
+  availableTitle: string
+  availableBody: string
+  availableTitleBackend: string
+  availableBodyBackend: string
+  availableBodyNoChangelog: string
+}
+
+export interface ResolveUpdateCopyInput {
+  target: UpdateTarget
+  /** Number of commit rows actually shown in the changelog. 0 → no notes. */
+  shownItems: number
+  copy: UpdateCopyStrings
+}
+
+export interface UpdateCopyResult {
+  title: string
+  body: string
+}
+
+export function resolveUpdateCopy({ target, shownItems, copy }: ResolveUpdateCopyInput): UpdateCopyResult {
+  const title = target === 'backend' ? copy.availableTitleBackend : copy.availableTitle
+
+  const body =
+    shownItems === 0
+      ? copy.availableBodyNoChangelog
+      : target === 'backend'
+        ? copy.availableBodyBackend
+        : copy.availableBody
+
+  return { title, body }
+}

package/src/lib/use-enter-animation.ts

@@ -0,0 +1,100 @@
+import { useCallback, useRef } from 'react'
+
+/**
+ * One-shot enter animation via the Web Animations API.
+ *
+ * Returns a callback ref. The animation fires exactly once when the element
+ * first attaches to the DOM and never replays for an already-mounted node —
+ * this is deliberate. CSS-transition + `@starting-style` is fragile here
+ * because:
+ *   - Streaming deltas constantly invalidate ancestor state, which can
+ *     re-trigger transitions on unrelated descendants.
+ *   - `@starting-style` only covers DOM insertion / first-match, but any
+ *     style restart during the message lifecycle replays the transition.
+ *   - Some Chromium versions reset transitions when an attribute on an
+ *     ancestor toggles, even if the descendant's properties never change.
+ *
+ * `el.animate(...)` runs against the element directly and is independent of
+ * CSS rule churn — it plays once, finishes, and is done. If the element
+ * unmounts and re-mounts, the callback ref runs again and replays it
+ * (correct behaviour).
+ *
+ * `enabled` is captured at mount-time only — flipping it later doesn't
+ * suddenly play the animation on existing nodes.
+ */
+const playedAnimationKeys = new Set<string>()
+const playedAnimationOrder: string[] = []
+const MAX_TRACKED_KEYS = 2048
+
+function hasPlayedAnimation(key: string): boolean {
+  return playedAnimationKeys.has(key)
+}
+
+function rememberPlayedAnimation(key: string): void {
+  if (playedAnimationKeys.has(key)) {
+    return
+  }
+
+  playedAnimationKeys.add(key)
+  playedAnimationOrder.push(key)
+
+  if (playedAnimationOrder.length > MAX_TRACKED_KEYS) {
+    const evicted = playedAnimationOrder.shift()
+
+    if (evicted) {
+      playedAnimationKeys.delete(evicted)
+    }
+  }
+}
+
+function scheduleMicrotask(cb: () => void): void {
+  if (typeof queueMicrotask === 'function') {
+    queueMicrotask(cb)
+
+    return
+  }
+
+  void Promise.resolve().then(cb)
+}
+
+export function useEnterAnimation(enabled: boolean, animationKey?: string): (el: HTMLElement | null) => void {
+  const enabledRef = useRef(enabled)
+  const keyRef = useRef(animationKey)
+
+  enabledRef.current = enabled
+  keyRef.current = animationKey
+
+  return useCallback((el: HTMLElement | null) => {
+    if (!el || !enabledRef.current || typeof window === 'undefined') {
+      return
+    }
+
+    if (window.matchMedia?.('(prefers-reduced-motion: reduce)').matches) {
+      return
+    }
+
+    const key = keyRef.current
+
+    if (key && hasPlayedAnimation(key)) {
+      return
+    }
+
+    el.animate(
+      [
+        { opacity: 0, transform: 'translateY(0.375rem)' },
+        { opacity: 1, transform: 'translateY(0)' }
+      ],
+      { duration: 180, easing: 'cubic-bezier(0.16, 1, 0.3, 1)', fill: 'both' }
+    )
+
+    if (key) {
+      // In React StrictMode the first mount can be immediately torn down.
+      // Only persist "played" once the element survives to the microtask tick.
+      scheduleMicrotask(() => {
+        if (el.isConnected) {
+          rememberPlayedAnimation(key)
+        }
+      })
+    }
+  }, [])
+}

package/src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from 'clsx'
+import { twMerge } from 'tailwind-merge'
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}