fix: artifacts code not streaming

package.json

@@ -158,7 +158,7 @@
     "vue-i18n": "^11.1.11",
     "vue-router": "4",
     "vue-tsc": "^2.2.10",
-    "vue-use-monaco": "^0.0.6",
+    "vue-use-monaco": "^0.0.8",
     "vue-virtual-scroller": "^2.0.0-beta.8",
     "vuedraggable": "^4.1.0",
     "yaml": "^2.8.0",

src/main/index.ts

@@ -156,17 +156,18 @@ app.whenReady().then(async () => {
   // 注册 'deepcdn' 协议，用于加载应用内置资源 (模拟 CDN)
   protocol.handle('deepcdn', (request) => {
     try {
+      // console.log('deepcdn', request.url)
       const filePath = request.url.slice('deepcdn://'.length)
-      // 根据开发/生产环境确定资源路径
-      const resourcesPath = is.dev
-        ? path.join(app.getAppPath(), 'resources')
-        : process.resourcesPath
-      // 检查资源是否被解包 (app.asar.unpacked)，优先使用解包路径
-      const unpackedResourcesPath = path.join(resourcesPath, 'app.asar.unpacked', 'resources')
-
-      const baseResourcesDir = fs.existsSync(unpackedResourcesPath)
-        ? unpackedResourcesPath
-        : path.join(resourcesPath, 'resources') // 否则使用默认资源路径
+      // 根据开发/生产环境确定资源路径（按候选目录探测，避免错误拼接导致重复 resources）
+      const candidates = is.dev
+        ? [path.join(app.getAppPath(), 'resources')]
+        : [
+            path.join(process.resourcesPath, 'app.asar.unpacked', 'resources'),
+            path.join(process.resourcesPath, 'resources'),
+            process.resourcesPath
+          ]
+      const baseResourcesDir =
+        candidates.find((p) => fs.existsSync(path.join(p, 'cdn'))) || candidates[0]
 
       const fullPath = path.join(baseResourcesDir, 'cdn', filePath)
 

src/renderer/src/components/artifacts/ArtifactDialog.vue

@@ -162,7 +162,7 @@ const appVersion = ref('')
 const codeLanguage = ref(
   artifactStore.currentArtifact?.language || artifactStore.currentArtifact?.type || ''
 )
-const { createEditor, updateCode } = useMonaco()
+const { createEditor, updateCode } = useMonaco({ MAX_HEIGHT: '500px' })
 const codeEditor = ref<any>(null)
 
 // 创建节流版本的语言检测函数，1秒内最多执行一次
@@ -176,24 +176,29 @@ const throttledDetectLanguage = useThrottleFn(
 
 watch(
   () => artifactStore.currentArtifact,
-  () => {
-    // 如果当前 artifact 的语言已经被检测过了，就不再进行检测
-    codeLanguage.value =
-      artifactStore.currentArtifact?.language ||
-      getFileExtension(artifactStore.currentArtifact?.type || '')
+  (newArtifact) => {
+    if (!newArtifact) return
+
+    // Update language detection
+    codeLanguage.value = newArtifact.language || getFileExtension(newArtifact.type || '')
+
     if (codeLanguage.value === 'mermaid') {
       return
     }
-    const newCode = artifactStore.currentArtifact?.content || ''
+
+    const newCode = newArtifact.content || ''
 
     // Check if we need to detect language
     if (!codeLanguage.value || codeLanguage.value === '') {
       throttledDetectLanguage(newCode)
     }
-    updateCode(artifactStore.currentArtifact?.content || '', codeLanguage.value)
+
+    // Always update Monaco editor content
+    updateCode(newCode, codeLanguage.value)
   },
   {
-    immediate: true
+    immediate: true,
+    deep: true // Add deep watching to catch property changes
   }
 )
 
@@ -209,6 +214,19 @@ watch(
   }
 )
 
+// Add a specific watcher for content changes to ensure real-time updates
+watch(
+  () => artifactStore.currentArtifact?.content,
+  (newContent) => {
+    if (newContent !== undefined) {
+      updateCode(newContent, codeLanguage.value)
+    }
+  },
+  {
+    immediate: true
+  }
+)
+
 watch(
   () => codeEditor.value,
   () => {

src/renderer/src/components/message/MessageBlockContent.vue

@@ -71,10 +71,13 @@ watch(
         if (part.type === 'artifact' && part.artifact) {
           if (props.block.status === 'loading') {
             if (artifactStore.currentArtifact?.id === part.artifact.identifier) {
-              artifactStore.currentArtifact.content = part.content
-              artifactStore.currentArtifact.title = part.artifact.title
-              artifactStore.currentArtifact.type = part.artifact.type
-              artifactStore.currentArtifact.status = part.loading ? 'loading' : 'loaded'
+              // Use updateArtifactContent to trigger reactivity
+              artifactStore.updateArtifactContent({
+                content: part.content,
+                title: part.artifact.title,
+                type: part.artifact.type,
+                status: part.loading ? 'loading' : 'loaded'
+              })
             } else {
               artifactStore.showArtifact(
                 {
@@ -91,10 +94,13 @@ watch(
             }
           } else {
             if (artifactStore.currentArtifact?.id === part.artifact.identifier) {
-              artifactStore.currentArtifact.content = part.content
-              artifactStore.currentArtifact.title = part.artifact.title
-              artifactStore.currentArtifact.type = part.artifact.type
-              artifactStore.currentArtifact.status = 'loaded'
+              // Use updateArtifactContent to trigger reactivity
+              artifactStore.updateArtifactContent({
+                content: part.content,
+                title: part.artifact.title,
+                type: part.artifact.type,
+                status: 'loaded'
+              })
             }
           }
         }

src/renderer/src/stores/artifact.ts

@@ -34,13 +34,24 @@ export const useArtifactStore = defineStore('artifact', () => {
     return currentMessageId.value === messageId && currentThreadId.value === threadId
   }
 
+  const updateArtifactContent = (updates: Partial<ArtifactState>) => {
+    if (currentArtifact.value) {
+      // Create a new object to trigger reactivity
+      currentArtifact.value = {
+        ...currentArtifact.value,
+        ...updates
+      }
+    }
+  }
+
   return {
     currentArtifact,
     currentMessageId,
     currentThreadId,
     isOpen,
     showArtifact,
     hideArtifact,
-    validateContext
+    validateContext,
+    updateArtifactContent
   }
 })