diff --git a/packages/frontend/core/src/blocksuite/ai/_common/config.ts b/packages/frontend/core/src/blocksuite/ai/_common/config.ts index 498e2cbebc..51f53c94e7 100644 --- a/packages/frontend/core/src/blocksuite/ai/_common/config.ts +++ b/packages/frontend/core/src/blocksuite/ai/_common/config.ts @@ -145,8 +145,8 @@ const imageBlockShowWhen = (chain: Chain) => { return matchModels(model, [ImageBlockModel]); }; -const EditAIGroup: AIItemGroupConfig = { - name: 'edit with ai', +const EditTextAIGroup: AIItemGroupConfig = { + name: 'edit text', items: [ { name: 'Translate to', @@ -193,8 +193,8 @@ const EditAIGroup: AIItemGroupConfig = { ], }; -const DraftAIGroup: AIItemGroupConfig = { - name: 'draft with ai', +const DraftFromTextAIGroup: AIItemGroupConfig = { + name: 'draft from text', items: [ { name: 'Write an article about this', @@ -234,8 +234,41 @@ const DraftAIGroup: AIItemGroupConfig = { ], }; -const ReviewWIthAIGroup: AIItemGroupConfig = { - name: 'review with ai', +const ReviewImageAIGroup: AIItemGroupConfig = { + name: 'review image', + items: [ + { + name: 'Explain this image', + testId: 'action-explain-image', + icon: PenIcon(), + showWhen: imageBlockShowWhen, + handler: actionToHandler('explainImage', AIStarIconWithAnimation), + }, + ], +}; + +const ReviewCodeAIGroup: AIItemGroupConfig = { + name: 'review code', + items: [ + { + name: 'Explain this code', + testId: 'action-explain-code', + icon: ExplainIcon(), + showWhen: codeBlockShowWhen, + handler: actionToHandler('explainCode', AIStarIconWithAnimation), + }, + { + name: 'Check code error', + testId: 'action-check-code-error', + icon: ExplainIcon(), + showWhen: codeBlockShowWhen, + handler: actionToHandler('checkCodeErrors', AIStarIconWithAnimation), + }, + ], +}; + +const ReviewTextAIGroup: AIItemGroupConfig = { + name: 'review text', items: [ { name: 'Fix spelling', @@ -251,27 +284,7 @@ const ReviewWIthAIGroup: AIItemGroupConfig = { showWhen: textBlockShowWhen, handler: actionToHandler('improveGrammar', AIStarIconWithAnimation), }, - { - name: 'Explain this image', - testId: 'action-explain-image', - icon: PenIcon(), - showWhen: imageBlockShowWhen, - handler: actionToHandler('explainImage', AIStarIconWithAnimation), - }, - { - name: 'Explain this code', - testId: 'action-explain-code', - icon: ExplainIcon(), - showWhen: codeBlockShowWhen, - handler: actionToHandler('explainCode', AIStarIconWithAnimation), - }, - { - name: 'Check code error', - testId: 'action-check-code-error', - icon: ExplainIcon(), - showWhen: codeBlockShowWhen, - handler: actionToHandler('checkCodeErrors', AIStarIconWithAnimation), - }, + { name: 'Explain selection', testId: 'action-explain-selection', @@ -282,8 +295,21 @@ const ReviewWIthAIGroup: AIItemGroupConfig = { ], }; -const GenerateWithAIGroup: AIItemGroupConfig = { - name: 'generate with ai', +const TouchUpImageAIGroup: AIItemGroupConfig = { + name: 'touch up image', + items: [ + { + name: 'Generate an image', + testId: 'action-generate-image', + icon: ImageIcon(), + showWhen: textBlockShowWhen, + handler: actionToHandler('createImage', AIImageIconWithAnimation), + }, + ], +}; + +const GenerateFromTextAIGroup: AIItemGroupConfig = { + name: 'generate from text', items: [ { name: 'Summarize', @@ -314,13 +340,6 @@ const GenerateWithAIGroup: AIItemGroupConfig = { ); }, }, - { - name: 'Generate an image', - testId: 'action-generate-image', - icon: ImageIcon(), - showWhen: textBlockShowWhen, - handler: actionToHandler('createImage', AIImageIconWithAnimation), - }, { name: 'Generate outline', testId: 'action-generate-outline', @@ -366,7 +385,7 @@ const OthersAIGroup: AIItemGroupConfig = { name: 'Others', items: [ { - name: 'Continue with AI', + name: 'Continue in AI Chat', testId: 'action-continue-with-ai', icon: CommentIcon(), handler: host => { @@ -382,17 +401,20 @@ const OthersAIGroup: AIItemGroupConfig = { }; export const pageAIGroups: AIItemGroupConfig[] = [ - ReviewWIthAIGroup, - EditAIGroup, - GenerateWithAIGroup, - DraftAIGroup, + ReviewTextAIGroup, + ReviewCodeAIGroup, + ReviewImageAIGroup, + EditTextAIGroup, + TouchUpImageAIGroup, + GenerateFromTextAIGroup, + DraftFromTextAIGroup, OthersAIGroup, ]; export function buildAIImageItemGroups(): AIItemGroupConfig[] { return [ { - name: 'edit with ai', + name: 'review image', items: [ { name: 'Explain this image', @@ -409,7 +431,7 @@ export function buildAIImageItemGroups(): AIItemGroupConfig[] { ], }, { - name: 'generate with ai', + name: 'touch up image', items: [ { name: 'Generate an image', @@ -463,7 +485,7 @@ export function buildAIImageItemGroups(): AIItemGroupConfig[] { export function buildAICodeItemGroups(): AIItemGroupConfig[] { return [ { - name: 'edit with ai', + name: 'review code', items: [ { name: 'Explain this code', diff --git a/packages/frontend/core/src/blocksuite/ai/entries/edgeless/actions-config.ts b/packages/frontend/core/src/blocksuite/ai/entries/edgeless/actions-config.ts index 6990c77aa9..d0bda2341b 100644 --- a/packages/frontend/core/src/blocksuite/ai/entries/edgeless/actions-config.ts +++ b/packages/frontend/core/src/blocksuite/ai/entries/edgeless/actions-config.ts @@ -108,7 +108,7 @@ const othersGroup: AIItemGroupConfig = { name: 'others', items: [ { - name: 'Continue with AI', + name: 'Continue in AI Chat', testId: 'action-continue-with-ai', icon: CommentIcon({ width: '20px', height: '20px' }), showWhen: () => true, @@ -125,8 +125,8 @@ const othersGroup: AIItemGroupConfig = { ], }; -const editGroup: AIItemGroupConfig = { - name: 'edit with ai', +const editTextGroup: AIItemGroupConfig = { + name: 'edit text', items: [ { name: 'Translate to', @@ -174,8 +174,8 @@ const editGroup: AIItemGroupConfig = { ], }; -const draftGroup: AIItemGroupConfig = { - name: 'draft with ai', +const draftFromTextGroup: AIItemGroupConfig = { + name: 'draft from text', items: [ { name: 'Write an article about this', @@ -215,8 +215,46 @@ const draftGroup: AIItemGroupConfig = { ], }; -const reviewGroup: AIItemGroupConfig = { - name: 'review with ai', +const reviewImageGroup: AIItemGroupConfig = { + name: 'review image', + items: [ + { + name: 'Explain this image', + icon: PenIcon(), + testId: 'action-explain-image', + showWhen: imageOnlyShowWhen, + handler: actionToHandler( + 'explainImage', + AIStarIconWithAnimation, + undefined, + imageCustomInput + ), + }, + ], +}; + +const reviewCodeGroup: AIItemGroupConfig = { + name: 'review code', + items: [ + { + name: 'Explain this code', + icon: ExplainIcon(), + testId: 'action-explain-code', + showWhen: noteWithCodeBlockShowWen, + handler: actionToHandler('explainCode', AIStarIconWithAnimation), + }, + { + name: 'Check code error', + icon: ExplainIcon(), + testId: 'action-check-code-error', + showWhen: noteWithCodeBlockShowWen, + handler: actionToHandler('checkCodeErrors', AIStarIconWithAnimation), + }, + ], +}; + +const reviewTextGroup: AIItemGroupConfig = { + name: 'review text', items: [ { name: 'Fix spelling', @@ -232,32 +270,7 @@ const reviewGroup: AIItemGroupConfig = { showWhen: noteBlockOrTextShowWhen, handler: actionToHandler('improveGrammar', AIStarIconWithAnimation), }, - { - name: 'Explain this image', - icon: PenIcon(), - testId: 'action-explain-image', - showWhen: imageOnlyShowWhen, - handler: actionToHandler( - 'explainImage', - AIStarIconWithAnimation, - undefined, - imageCustomInput - ), - }, - { - name: 'Explain this code', - icon: ExplainIcon(), - testId: 'action-explain-code', - showWhen: noteWithCodeBlockShowWen, - handler: actionToHandler('explainCode', AIStarIconWithAnimation), - }, - { - name: 'Check code error', - icon: ExplainIcon(), - testId: 'action-check-code-error', - showWhen: noteWithCodeBlockShowWen, - handler: actionToHandler('checkCodeErrors', AIStarIconWithAnimation), - }, + { name: 'Explain selection', icon: SelectionIcon({ width: '20px', height: '20px' }), @@ -268,24 +281,9 @@ const reviewGroup: AIItemGroupConfig = { ], }; -const generateGroup: AIItemGroupConfig = { - name: 'generate with ai', +const touchUpImageGroup: AIItemGroupConfig = { + name: 'touch up image', items: [ - { - name: 'Summarize', - icon: PenIcon(), - testId: 'action-summarize', - showWhen: noteBlockOrTextShowWhen, - handler: actionToHandler('summary', AIPenIconWithAnimation), - }, - { - name: 'Generate headings', - icon: PenIcon(), - testId: 'action-generate-headings', - showWhen: noteBlockOrTextShowWhen, - handler: actionToHandler('createHeadings', AIPenIconWithAnimation), - beta: true, - }, { name: 'Generate an image', icon: ImageIcon(), @@ -361,6 +359,28 @@ const generateGroup: AIItemGroupConfig = { } ), }, + ], +}; + +const generateFromTextGroup: AIItemGroupConfig = { + name: 'generate from text', + items: [ + { + name: 'Summarize', + icon: PenIcon(), + testId: 'action-summarize', + showWhen: noteBlockOrTextShowWhen, + handler: actionToHandler('summary', AIPenIconWithAnimation), + }, + { + name: 'Generate headings', + icon: PenIcon(), + testId: 'action-generate-headings', + showWhen: noteBlockOrTextShowWhen, + handler: actionToHandler('createHeadings', AIPenIconWithAnimation), + beta: true, + }, + { name: 'Generate outline', icon: PenIcon(), @@ -547,9 +567,12 @@ const generateGroup: AIItemGroupConfig = { }; export const edgelessAIGroups: AIItemGroupConfig[] = [ - reviewGroup, - editGroup, - generateGroup, - draftGroup, + reviewTextGroup, + reviewCodeGroup, + reviewImageGroup, + editTextGroup, + touchUpImageGroup, + generateFromTextGroup, + draftFromTextGroup, othersGroup, ]; diff --git a/packages/frontend/core/src/blocksuite/ai/provider/ai-provider.ts b/packages/frontend/core/src/blocksuite/ai/provider/ai-provider.ts index 7fbf899a3a..5b28e191eb 100644 --- a/packages/frontend/core/src/blocksuite/ai/provider/ai-provider.ts +++ b/packages/frontend/core/src/blocksuite/ai/provider/ai-provider.ts @@ -19,7 +19,7 @@ export interface AIUserInfo { export interface AIChatParams { host: EditorHost; mode?: 'page' | 'edgeless'; - // Auto select and append selection to input via `Continue with AI` action. + // Auto select and append selection to input via `Continue in AI Chat` action. autoSelect?: boolean; }