diff --git a/src/lib/components/chat/Messages/CodeBlock.svelte b/src/lib/components/chat/Messages/CodeBlock.svelte index 8fe8e4e29f..e2ab5d360a 100644 --- a/src/lib/components/chat/Messages/CodeBlock.svelte +++ b/src/lib/components/chat/Messages/CodeBlock.svelte @@ -379,7 +379,7 @@ (token?.raw ?? '').slice(-4).includes('```') ) { try { - renderHTML = await renderVegaVisualization(code); + renderHTML = await renderVegaVisualization(code, lang); } catch (error) { console.error('Failed to render Vega visualization:', error); const errorMsg = error instanceof Error ? error.message : String(error); diff --git a/src/lib/utils/index.ts b/src/lib/utils/index.ts index 27d80f5c27..163acbc576 100644 --- a/src/lib/utils/index.ts +++ b/src/lib/utils/index.ts @@ -2000,11 +2000,23 @@ export const renderMermaidDiagram = async ( } }; -export const renderVegaVisualization = async (spec: string, i18n?: any) => { +export const renderVegaVisualization = async (spec: string, lang: string = '', i18n?: any) => { const vega = await import('vega'); const parsedSpec = JSON.parse(spec); + const hasVegaLiteKeys = + 'mark' in parsedSpec || + 'encoding' in parsedSpec || + 'layer' in parsedSpec || + 'hconcat' in parsedSpec || + 'vconcat' in parsedSpec || + 'repeat' in parsedSpec || + 'facet' in parsedSpec; + const isVegaLite = + lang === 'vega-lite' || + (parsedSpec.$schema && parsedSpec.$schema.includes('vega-lite')) || + hasVegaLiteKeys; let vegaSpec = parsedSpec; - if (parsedSpec.$schema && parsedSpec.$schema.includes('vega-lite')) { + if (isVegaLite) { const vegaLite = await import('vega-lite'); vegaSpec = vegaLite.compile(parsedSpec).spec; }