cognova 0.1.0

package/app/composables/useChat.ts

@@ -0,0 +1,298 @@
+import type {
+  ChatConversation,
+  ChatMessage,
+  ChatContentBlock,
+  ChatServerMessage,
+  ChatSessionStatus,
+  ChatConnectionStatus
+} from '~~/shared/types'
+
+// crypto.randomUUID() requires secure context (HTTPS). Fallback for HTTP.
+function generateId(): string {
+  if (typeof crypto !== 'undefined' && crypto.randomUUID)
+    return crypto.randomUUID()
+  const bytes = new Uint8Array(16)
+  crypto.getRandomValues(bytes)
+  bytes[6] = (bytes[6]! & 0x0f) | 0x40
+  bytes[8] = (bytes[8]! & 0x3f) | 0x80
+  const hex = Array.from(bytes, b => b.toString(16).padStart(2, '0')).join('')
+  return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`
+}
+
+// Shared state across component instances
+const connectionStatus = ref<ChatConnectionStatus>('disconnected')
+const sessionStatus = ref<ChatSessionStatus>('idle')
+const activeConversationId = ref<string | null>(null)
+const messages = ref<ChatMessage[]>([])
+const conversations = ref<ChatConversation[]>([])
+const streamingText = ref('')
+const streamingToolCalls = ref<Record<string, { name: string, result?: string, isError?: boolean }>>({})
+const lastCostUsd = ref(0)
+const loading = ref(false)
+
+const ws = ref<WebSocket | null>(null)
+const reconnectAttempts = ref(0)
+const maxReconnectAttempts = 5
+let isInitialized = false
+let pingInterval: ReturnType<typeof setInterval> | null = null
+
+export function useChat() {
+  function getWebSocketUrl(): string {
+    if (import.meta.server) return ''
+    const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'
+    return `${protocol}//${window.location.host}/_ws/chat`
+  }
+
+  function handleServerMessage(msg: ChatServerMessage) {
+    switch (msg.type) {
+      case 'chat:session_created':
+        activeConversationId.value = msg.conversationId
+        loadConversations()
+        break
+
+      case 'chat:stream_start':
+        sessionStatus.value = 'streaming'
+        streamingText.value = ''
+        streamingToolCalls.value = {}
+        break
+
+      case 'chat:text_delta':
+        streamingText.value += msg.delta
+        break
+
+      case 'chat:tool_start':
+        streamingToolCalls.value = { ...streamingToolCalls.value, [msg.toolUseId]: { name: msg.toolName } }
+        break
+
+      case 'chat:tool_end': {
+        const tool = streamingToolCalls.value[msg.toolUseId]
+        if (tool) {
+          streamingToolCalls.value = {
+            ...streamingToolCalls.value,
+            [msg.toolUseId]: { ...tool, result: msg.result, isError: msg.isError }
+          }
+        }
+        break
+      }
+
+      case 'chat:stream_end': {
+        sessionStatus.value = 'idle'
+        lastCostUsd.value = msg.costUsd
+
+        // Finalize streaming into a proper message
+        const contentBlocks: ChatContentBlock[] = []
+        if (streamingText.value)
+          contentBlocks.push({ type: 'text', text: streamingText.value })
+
+        for (const [id, tool] of Object.entries(streamingToolCalls.value)) {
+          contentBlocks.push({ type: 'tool_use', id, name: tool.name, input: {} })
+          if (tool.result !== undefined)
+            contentBlocks.push({ type: 'tool_result', tool_use_id: id, content: tool.result, is_error: tool.isError })
+        }
+
+        if (contentBlocks.length > 0) {
+          messages.value.push({
+            id: generateId(),
+            conversationId: msg.conversationId,
+            role: 'assistant',
+            content: contentBlocks,
+            costUsd: msg.costUsd,
+            durationMs: msg.durationMs,
+            createdAt: new Date()
+          })
+        }
+
+        streamingText.value = ''
+        streamingToolCalls.value = {}
+
+        // Refresh conversations list
+        loadConversations()
+        break
+      }
+
+      case 'chat:error':
+        sessionStatus.value = 'error'
+        console.error('[chat] Server error:', msg.message)
+        break
+
+      case 'chat:interrupted':
+        sessionStatus.value = 'interrupted'
+        // Save any partial streaming text as a message
+        if (streamingText.value) {
+          messages.value.push({
+            id: generateId(),
+            conversationId: msg.conversationId,
+            role: 'assistant',
+            content: [{ type: 'text', text: streamingText.value }],
+            createdAt: new Date()
+          })
+          streamingText.value = ''
+          streamingToolCalls.value = {}
+        }
+        break
+    }
+  }
+
+  function connect() {
+    if (import.meta.server) return
+    if (ws.value?.readyState === WebSocket.OPEN) return
+    if (isInitialized && connectionStatus.value === 'connecting') return
+
+    isInitialized = true
+    connectionStatus.value = 'connecting'
+
+    const socket = new WebSocket(getWebSocketUrl())
+    ws.value = socket
+
+    socket.onopen = () => {
+      connectionStatus.value = 'connected'
+      reconnectAttempts.value = 0
+      startPingInterval()
+    }
+
+    socket.onmessage = (event) => {
+      try {
+        const data = JSON.parse(event.data) as Record<string, unknown>
+        if (data.type === 'chat:connected' || data.type === 'pong') return
+        handleServerMessage(data as unknown as ChatServerMessage)
+      } catch (e) {
+        console.error('[chat] Failed to parse message:', e)
+      }
+    }
+
+    socket.onclose = () => {
+      connectionStatus.value = 'disconnected'
+      stopPingInterval()
+
+      if (reconnectAttempts.value < maxReconnectAttempts) {
+        reconnectAttempts.value++
+        setTimeout(connect, 2000 * reconnectAttempts.value)
+      }
+    }
+
+    socket.onerror = () => {
+      connectionStatus.value = 'error'
+    }
+  }
+
+  function disconnect() {
+    stopPingInterval()
+    if (ws.value) {
+      ws.value.close()
+      ws.value = null
+    }
+    connectionStatus.value = 'disconnected'
+    isInitialized = false
+  }
+
+  function startPingInterval() {
+    if (pingInterval) clearInterval(pingInterval)
+    pingInterval = setInterval(() => {
+      if (ws.value?.readyState === WebSocket.OPEN)
+        ws.value.send(JSON.stringify({ type: 'ping' }))
+    }, 30000)
+  }
+
+  function stopPingInterval() {
+    if (pingInterval) {
+      clearInterval(pingInterval)
+      pingInterval = null
+    }
+  }
+
+  function sendMessage(message: string) {
+    if (!ws.value || ws.value.readyState !== WebSocket.OPEN) return
+
+    // Add user message locally
+    messages.value.push({
+      id: generateId(),
+      conversationId: activeConversationId.value || '',
+      role: 'user',
+      content: [{ type: 'text', text: message }],
+      createdAt: new Date()
+    })
+
+    ws.value.send(JSON.stringify({
+      type: 'chat:send',
+      message,
+      conversationId: activeConversationId.value
+    }))
+  }
+
+  function interrupt() {
+    if (!ws.value || !activeConversationId.value) return
+    ws.value.send(JSON.stringify({
+      type: 'chat:interrupt',
+      conversationId: activeConversationId.value
+    }))
+  }
+
+  function startNewConversation() {
+    activeConversationId.value = null
+    messages.value = []
+    sessionStatus.value = 'idle'
+    streamingText.value = ''
+    streamingToolCalls.value = {}
+  }
+
+  async function loadConversation(conversationId: string) {
+    loading.value = true
+    try {
+      const response = await $fetch<{ data: ChatConversation & { messages: ChatMessage[] } }>(`/api/conversations/${conversationId}`)
+      activeConversationId.value = conversationId
+      messages.value = (response.data.messages || []).map(m => ({
+        ...m,
+        createdAt: new Date(m.createdAt)
+      }))
+      sessionStatus.value = 'idle'
+    } catch (e) {
+      console.error('[chat] Failed to load conversation:', e)
+    } finally {
+      loading.value = false
+    }
+  }
+
+  async function loadConversations() {
+    try {
+      const response = await $fetch<{ data: ChatConversation[] }>('/api/conversations')
+      conversations.value = response.data
+    } catch (e) {
+      // Database may be unavailable — fail silently
+      console.error('[chat] Failed to load conversations:', e)
+    }
+  }
+
+  async function deleteConversation(conversationId: string) {
+    try {
+      await $fetch(`/api/conversations/${conversationId}`, { method: 'DELETE' })
+      conversations.value = conversations.value.filter(c => c.id !== conversationId)
+      if (activeConversationId.value === conversationId)
+        startNewConversation()
+    } catch (e) {
+      console.error('[chat] Failed to delete conversation:', e)
+    }
+  }
+
+  return {
+    // State
+    connectionStatus: readonly(connectionStatus),
+    sessionStatus: readonly(sessionStatus),
+    activeConversationId: readonly(activeConversationId),
+    messages,
+    conversations,
+    streamingText: readonly(streamingText),
+    streamingToolCalls: readonly(streamingToolCalls),
+    lastCostUsd: readonly(lastCostUsd),
+    loading: readonly(loading),
+
+    // Actions
+    connect,
+    disconnect,
+    sendMessage,
+    interrupt,
+    startNewConversation,
+    loadConversation,
+    loadConversations,
+    deleteConversation
+  }
+}

package/app/composables/useDocument.ts

@@ -0,0 +1,141 @@
+import { useDebounceFn } from '@vueuse/core'
+import type { Document, DocumentMetadata, DocumentWithContent, UpdateDocumentInput, SaveStatus } from '~~/shared/types'
+
+export function useDocument() {
+  const document = ref<Document | null>(null)
+  const metadata = ref<DocumentMetadata | null>(null)
+  const body = ref('')
+  const filePath = ref<string | null>(null)
+  const loading = ref(false)
+  const saveStatus = ref<SaveStatus>('idle')
+  const isDirty = ref(false)
+  const metadataDirty = ref(false)
+
+  const debouncedSaveBody = useDebounceFn(async () => {
+    if (!document.value || !isDirty.value) return
+    await saveDocument({ body: body.value })
+  }, 2000)
+
+  const debouncedSaveMetadata = useDebounceFn(async () => {
+    if (!document.value || !metadataDirty.value) return
+    await saveDocument()
+  }, 500)
+
+  async function loadDocument(path: string) {
+    loading.value = true
+    filePath.value = path
+    isDirty.value = false
+    metadataDirty.value = false
+    saveStatus.value = 'idle'
+
+    try {
+      const response = await $fetch<{ data: DocumentWithContent }>('/api/documents/by-path', {
+        method: 'POST',
+        body: { path }
+      })
+
+      document.value = response.data.document
+      metadata.value = response.data.metadata
+      body.value = response.data.body || ''
+    } catch (e) {
+      console.error('Failed to load document:', e)
+      document.value = null
+      metadata.value = null
+      body.value = ''
+    } finally {
+      loading.value = false
+    }
+  }
+
+  function updateBody(newBody: string) {
+    if (body.value !== newBody) {
+      body.value = newBody
+      isDirty.value = true
+      debouncedSaveBody()
+    }
+  }
+
+  function updateMetadata(updates: Partial<DocumentMetadata>) {
+    if (!metadata.value) return
+
+    metadata.value = { ...metadata.value, ...updates }
+    metadataDirty.value = true
+    debouncedSaveMetadata()
+  }
+
+  async function saveDocument(updates: UpdateDocumentInput = {}) {
+    if (!document.value) return
+
+    saveStatus.value = 'saving'
+
+    try {
+      const payload: UpdateDocumentInput = { ...updates }
+
+      // Include metadata if dirty
+      if (metadataDirty.value && metadata.value) {
+        payload.title = metadata.value.title
+        payload.tags = metadata.value.tags
+        payload.projectId = metadata.value.projectId
+        payload.shared = metadata.value.shared
+        payload.shareType = metadata.value.shareType
+      }
+
+      // Include body if dirty and not already in updates
+      if (isDirty.value && updates.body === undefined)
+        payload.body = body.value
+
+      const response = await $fetch<{ data: DocumentWithContent }>(`/api/documents/${document.value.id}`, {
+        method: 'PUT',
+        body: payload
+      })
+
+      document.value = response.data.document
+      metadata.value = response.data.metadata
+      body.value = response.data.body || ''
+
+      isDirty.value = false
+      metadataDirty.value = false
+      saveStatus.value = 'saved'
+
+      setTimeout(() => {
+        if (saveStatus.value === 'saved')
+          saveStatus.value = 'idle'
+      }, 2000)
+    } catch (e) {
+      console.error('Failed to save document:', e)
+      saveStatus.value = 'error'
+    }
+  }
+
+  async function saveNow() {
+    if (!isDirty.value && !metadataDirty.value) return
+    await saveDocument({ body: body.value })
+  }
+
+  function closeDocument() {
+    document.value = null
+    metadata.value = null
+    body.value = ''
+    filePath.value = null
+    isDirty.value = false
+    metadataDirty.value = false
+    saveStatus.value = 'idle'
+  }
+
+  return {
+    document,
+    metadata,
+    body,
+    filePath,
+    loading,
+    saveStatus,
+    isDirty,
+    metadataDirty,
+    loadDocument,
+    updateBody,
+    updateMetadata,
+    saveDocument,
+    saveNow,
+    closeDocument
+  }
+}

package/app/composables/useEditor.ts

@@ -0,0 +1,100 @@
+import { useDebounceFn } from '@vueuse/core'
+import type { SaveStatus } from '~~/shared/types'
+
+export function useEditor() {
+  const content = ref('')
+  const filePath = ref<string | null>(null)
+  const loading = ref(false)
+  const saveStatus = ref<SaveStatus>('idle')
+  const isDirty = ref(false)
+
+  const { writeFile } = useFileTree()
+
+  const debouncedSave = useDebounceFn(async () => {
+    if (!filePath.value || !isDirty.value) return
+
+    saveStatus.value = 'saving'
+    try {
+      await writeFile(filePath.value, content.value)
+      saveStatus.value = 'saved'
+      isDirty.value = false
+
+      // Reset to idle after showing saved status
+      setTimeout(() => {
+        if (saveStatus.value === 'saved') {
+          saveStatus.value = 'idle'
+        }
+      }, 2000)
+    } catch (e) {
+      console.error('Failed to save:', e)
+      saveStatus.value = 'error'
+    }
+  }, 2000)
+
+  async function loadFile(path: string) {
+    loading.value = true
+    filePath.value = path
+    isDirty.value = false
+    saveStatus.value = 'idle'
+
+    try {
+      const response = await $fetch<{ data: { content: string } }>('/api/fs/read', {
+        method: 'POST',
+        body: { path }
+      })
+      content.value = response.data.content
+    } catch (e) {
+      console.error('Failed to load file:', e)
+      content.value = ''
+    } finally {
+      loading.value = false
+    }
+  }
+
+  function updateContent(newContent: string) {
+    if (content.value !== newContent) {
+      content.value = newContent
+      isDirty.value = true
+      debouncedSave()
+    }
+  }
+
+  async function saveNow() {
+    if (!filePath.value || !isDirty.value) return
+
+    saveStatus.value = 'saving'
+    try {
+      await writeFile(filePath.value, content.value)
+      saveStatus.value = 'saved'
+      isDirty.value = false
+
+      setTimeout(() => {
+        if (saveStatus.value === 'saved') {
+          saveStatus.value = 'idle'
+        }
+      }, 2000)
+    } catch (e) {
+      console.error('Failed to save:', e)
+      saveStatus.value = 'error'
+    }
+  }
+
+  function closeFile() {
+    content.value = ''
+    filePath.value = null
+    isDirty.value = false
+    saveStatus.value = 'idle'
+  }
+
+  return {
+    content,
+    filePath,
+    loading,
+    saveStatus,
+    isDirty,
+    loadFile,
+    updateContent,
+    saveNow,
+    closeFile
+  }
+}