From 2f30643d30299ddb7da2116d6c972d10bb3b97e5 Mon Sep 17 00:00:00 2001 From: molinla <61045398+molinla@users.noreply.github.com> Date: Sat, 21 Sep 2024 10:39:36 +0800 Subject: [PATCH] fix: bugs again (#924) --- .../components/editor/code-editor/chat-bot.ts | 12 +-- .../components/editor/code-editor/compiler.ts | 2 + .../code-editor/coordinators/hoverProvider.ts | 27 ++--- .../editor/code-editor/coordinators/index.ts | 102 ++++++++++++------ .../editor/code-editor/tokens/spx.ts | 2 +- .../editor/code-editor/ui/EditorSidebar.vue | 27 ++--- .../editor/code-editor/ui/MarkdownPreview.vue | 9 +- .../CompletionMenuComponent.vue | 7 +- .../completion-menu/completion-menu.ts | 8 ++ .../hover-preview/DocumentPreview.vue | 1 + 10 files changed, 128 insertions(+), 69 deletions(-) diff --git a/spx-gui/src/components/editor/code-editor/chat-bot.ts b/spx-gui/src/components/editor/code-editor/chat-bot.ts index 58d097009..fa1a1ff61 100644 --- a/spx-gui/src/components/editor/code-editor/chat-bot.ts +++ b/spx-gui/src/components/editor/code-editor/chat-bot.ts @@ -76,14 +76,14 @@ export class ChatBot { private i18nInputWithAction(input: string, action: ChatAction): string { switch (action) { case ChatAction.explain: - return this.i18n.t({ en: 'Explain the code: ', zh: '解释一下这段代码: ' }) + '\n```gop \n' + input + '\n```' + return this.i18n.t({ en: 'Explain the code: ', zh: '解释一下这段代码: ' }) + input case ChatAction.comment: return ( - this.i18n.t({ en: 'I want to comment the code: ', zh: '我想给这段代码写注释: ' }) + '\n```gop \n' + input + '\n```' + this.i18n.t({ en: 'I want to comment the code: ', zh: '我想给这段代码写注释: ' }) + input ) case ChatAction.fixCode: return ( - this.i18n.t({ en: 'I want to fix the code: ', zh: '帮我修复这段代码的问题: ' }) + '\n```gop \n' + input + '\n```' + this.i18n.t({ en: 'I want to fix the code: ', zh: '帮我修复这段代码的问题: ' }) + input ) } return '' @@ -112,7 +112,7 @@ export class Chat { messages: [], length: 0, loading: true, - currentQuestion: "", + currentQuestion: '', responseError: false }) @@ -163,12 +163,12 @@ export class Chat { this.chatState.length++ this.chatState.loading = false this.chatState.currentQuestion = msg - if(res.respMessage == "") { + if (res.respMessage == '') { this.chatState.responseError = true return false } const content = res.respMessage - + const questions = res.respQuestions const assistantMessage: ChatMessage = { content: content, diff --git a/spx-gui/src/components/editor/code-editor/compiler.ts b/spx-gui/src/components/editor/code-editor/compiler.ts index 8df66a4cf..778ee1ddd 100644 --- a/spx-gui/src/components/editor/code-editor/compiler.ts +++ b/spx-gui/src/components/editor/code-editor/compiler.ts @@ -1,3 +1,5 @@ +// todo: refactor this into webWorker + import compilerWasmHtml from '@/assets/compiler/index.html?raw' import compilerWasm from '@/assets/compiler/main.wasm?url' import compilerWasmExec from '@/assets/wasm_exec.js?url' diff --git a/spx-gui/src/components/editor/code-editor/coordinators/hoverProvider.ts b/spx-gui/src/components/editor/code-editor/coordinators/hoverProvider.ts index b171720f6..a714d74c5 100644 --- a/spx-gui/src/components/editor/code-editor/coordinators/hoverProvider.ts +++ b/spx-gui/src/components/editor/code-editor/coordinators/hoverProvider.ts @@ -11,6 +11,7 @@ import type { Definition, TokenUsage } from '@/components/editor/code-editor/com import { type CoordinatorState, definitionStructName2Target, + transformInput2MarkdownCode, usageType2Icon } from '@/components/editor/code-editor/coordinators/index' import type { TokenWithDoc, UsageWithDoc } from '@/components/editor/code-editor/tokens/types' @@ -217,21 +218,15 @@ export class HoverProvider { }), activeLabel: this.ui.i18n.t({ zh: '在线答疑', en: 'Online Q&A' }), onActiveLabelClick: () => { - const usageId = usage.id - this.docAbility.getDetailDoc(doc.id).then((detailDoc) => { - const usageDetailDoc = detailDoc.usages.find( - (usage: UsageWithDoc) => usage.id === usageId - )?.doc - if (usageDetailDoc) { - const chat = this.chatBot.startExplainChat( - usage.declaration + '\n' + usageDetailDoc - ) - this.ui.invokeAIChatModal(chat) - } else { - const chat = this.chatBot.startExplainChat(usage.declaration) - this.ui.invokeAIChatModal(chat) - } - }) + if (usage.doc) { + const chat = this.chatBot.startExplainChat('\n' + usage.doc) + this.ui.invokeAIChatModal(chat) + } else { + const chat = this.chatBot.startExplainChat( + transformInput2MarkdownCode(usage.declaration) + ) + this.ui.invokeAIChatModal(chat) + } } }, moreActions: [...this.createDocDetailAction(doc, definition)] @@ -267,7 +262,7 @@ export class HoverProvider { icon: Icon.Document, label: this.ui.i18n.t({ zh: '查看文档', en: 'Document' }), onClick: () => { - const usageId = definition.usages.shift()?.usageID + const usageId: string | null = definition.usages[0].usageID if (!usageId) throw new Error( 'definition usage is empty when search for doc detail. tokenId: ' + diff --git a/spx-gui/src/components/editor/code-editor/coordinators/index.ts b/spx-gui/src/components/editor/code-editor/coordinators/index.ts index 2d5077273..c54366b18 100644 --- a/spx-gui/src/components/editor/code-editor/coordinators/index.ts +++ b/spx-gui/src/components/editor/code-editor/coordinators/index.ts @@ -191,7 +191,54 @@ export class Coordinator { header: { icon: usageEffect2Icon(completionItemDoc.effect), declaration: transferUsageDeclaration(completionItemDoc.declaration) - } + }, + recommendAction: { + label: this.ui.i18n.t({ + zh: '还有疑惑？场外求助', + en: 'Still in confusion? Ask for help' + }), + activeLabel: this.ui.i18n.t({ zh: '在线答疑', en: 'Online Q&A' }), + onActiveLabelClick: () => { + if (completionItemDoc.doc) { + const chat = this.chatBot.startExplainChat('\n\n' + completionItemDoc.doc) + this.ui.invokeAIChatModal(chat) + } else { + const chat = this.chatBot.startExplainChat( + transformInput2MarkdownCode(completionItemDoc.declaration) + ) + this.ui.invokeAIChatModal(chat) + } + } + }, + moreActions: [ + { + icon: Icon.Document, + label: this.ui.i18n.t({ zh: '查看文档', en: 'Document' }), + onClick: () => { + const usageId = completionItemDoc.id + this.docAbility + .getDetailDoc({ + name: completionItem.tokenName, + pkgPath: completionItem.tokenPkg + }) + .then((detailDoc) => { + const usageDetailDoc = detailDoc.usages.find( + (usage: UsageWithDoc) => usage.id === usageId + )?.doc + if (usageDetailDoc) return this.ui.invokeDocumentDetail(usageDetailDoc) + console.warn( + 'usageDetailDoc not found. tokenId: ' + + JSON.stringify({ + name: completionItem.tokenName, + pkgPath: completionItem.tokenPkg + }) + + ' usageId: ' + + usageId + ) + }) + } + } + ] } } } @@ -255,7 +302,7 @@ export class Coordinator { icon: Icon.AIAbility, label: this.ui.i18n.t({ zh: '对这段代码有疑惑', en: 'Suspect this code' }), action: () => { - const chat = this.chatBot.startExplainChat(ctx.selectContent) + const chat = this.chatBot.startExplainChat(transformInput2MarkdownCode(ctx.selectContent)) this.ui.invokeAIChatModal(chat) } }, @@ -263,7 +310,7 @@ export class Coordinator { icon: Icon.AIAbility, label: this.ui.i18n.t({ zh: '这段代码无法正常运行', en: 'This code cannot run properly' }), action: () => { - const chat = this.chatBot.startFixCodeChat(ctx.selectContent) + const chat = this.chatBot.startFixCodeChat(transformInput2MarkdownCode(ctx.selectContent)) this.ui.invokeAIChatModal(chat) } }, @@ -271,7 +318,7 @@ export class Coordinator { icon: Icon.AIAbility, label: this.ui.i18n.t({ zh: '给这段代码添加注释', en: 'Add explanation to this code' }), action: () => { - const chat = this.chatBot.startCommentChat(ctx.selectContent) + const chat = this.chatBot.startCommentChat(transformInput2MarkdownCode(ctx.selectContent)) this.ui.invokeAIChatModal(chat) } } @@ -291,9 +338,8 @@ export class Coordinator { if (ctx.signal.aborted) return [] this.coordinatorState.inlayHints = inlayHints return inlayHints.flatMap((inlayHint): InlayHintDecoration[] => { - // from compiler has two type of inlay hint, so here use if else to distinguish - if (inlayHint.type === 'play') return [] + // todo: this is temp way to show playlistIcon, need a better way to identify if (inlayHint.name === 'mediaName') { return [ { @@ -488,7 +534,6 @@ async function toolCategory2InputItemCategory( const docUsages: Array = tokenWithDoc.usages const docUsageIdxMap = new Map() - // current logic is only show document, not shown all wasm usages. // collect all usages from document and next get wasm usage to merge it. @@ -534,21 +579,15 @@ async function toolCategory2InputItemCategory( }), activeLabel: ui.i18n.t({ zh: '在线答疑', en: 'Online Q&A' }), onActiveLabelClick: () => { - const usageId = usage.id - docAbility.getDetailDoc(token.id).then((detailDoc) => { - const usageDetailDoc = detailDoc.usages.find( - (usage: UsageWithDoc) => usage.id === usageId - )?.doc - if (usageDetailDoc) { - const chat = chatBot.startExplainChat( - usage.declaration + '\n' + usageDetailDoc - ) - ui.invokeAIChatModal(chat) - } else { - const chat = chatBot.startExplainChat(usage.declaration) - ui.invokeAIChatModal(chat) - } - }) + if (usage.doc) { + const chat = chatBot.startExplainChat('\n\n' + usage.doc) + ui.invokeAIChatModal(chat) + } else { + const chat = chatBot.startExplainChat( + transformInput2MarkdownCode(usage.declaration) + ) + ui.invokeAIChatModal(chat) + } } }, moreActions: [ @@ -561,14 +600,13 @@ async function toolCategory2InputItemCategory( const usageDetailDoc = detailDoc.usages.find( (usage: UsageWithDoc) => usage.id === usageId )?.doc - if (!usageDetailDoc) - return console.warn( - 'usageDetailDoc not found. tokenId: ' + - JSON.stringify(token.id) + - ' usageId: ' + - usageId - ) - ui.invokeDocumentDetail(usageDetailDoc) + if (usageDetailDoc) return ui.invokeDocumentDetail(usageDetailDoc) + console.warn( + 'usageDetailDoc not found. tokenId: ' + + JSON.stringify(token.id) + + ' usageId: ' + + usageId + ) }) } } @@ -631,3 +669,7 @@ export function definitionStructName2Target(structName: string): 'All' | 'Sprite return 'All' } } + +export function transformInput2MarkdownCode(input: string) { + return '\n```gop \n' + input + '\n```' +} diff --git a/spx-gui/src/components/editor/code-editor/tokens/spx.ts b/spx-gui/src/components/editor/code-editor/tokens/spx.ts index 81c43fa62..1bff28c3a 100644 --- a/spx-gui/src/components/editor/code-editor/tokens/spx.ts +++ b/spx-gui/src/components/editor/code-editor/tokens/spx.ts @@ -467,7 +467,7 @@ export const xpos: Token = { effect: 'read', target: 'Sprite', declaration: 'func() float64', - sample: '', + sample: '5', insertText: 'xpos' } ] diff --git a/spx-gui/src/components/editor/code-editor/ui/EditorSidebar.vue b/spx-gui/src/components/editor/code-editor/ui/EditorSidebar.vue index dbe3f99de..0a10e51b8 100644 --- a/spx-gui/src/components/editor/code-editor/ui/EditorSidebar.vue +++ b/spx-gui/src/components/editor/code-editor/ui/EditorSidebar.vue @@ -1,5 +1,5 @@