fix(core): generate the image cannot enter text prompt (#12717)

Close [AI-167](https://linear.app/affine-design/issue/AI-167)

![截屏2025-06-05 12.15.49.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/sJGviKxfE3Ap685cl5bj/c1afff0e-1197-46dc-ae43-ff7257039509.png)

![截屏2025-06-05 12.14.07.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/sJGviKxfE3Ap685cl5bj/1439b0a7-1cca-4848-aea2-84bc73c536c5.png)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **New Features**
  - Improved AI panel behavior with explicit modes for input and answer generation, providing a more intuitive user experience when interacting with AI features.

- **Refactor**
  - Streamlined AI panel toggling logic for more consistent and predictable panel states during different actions.

- **Tests**
  - Enhanced AI image generation test to simulate user input and send actions for more accurate end-to-end validation.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
akumatus
2025-06-05 09:17:28 +00:00
parent 71be1d424a
commit 512a908fd4
4 changed files with 25 additions and 18 deletions

View File

@@ -208,7 +208,18 @@ export function actionToHandler<T extends keyof BlockSuitePresets.AIActions>(
if (!blocks || blocks.length === 0) return;
const block = blocks.at(-1);
if (!block) return;
aiPanel.toggle(block, '');
if (
blocks.length === 1 &&
block.model.flavour === 'affine:image' &&
id === 'createImage'
) {
// if only one image block is selected, and the action is createImage
// toggle panel to allow user to enter text prompt
aiPanel.toggle(block, 'input');
} else {
// generate the answer
aiPanel.toggle(block, 'generate');
}
};
}
@@ -232,7 +243,7 @@ export function handleInlineAskAIAction(
});
if (!actionGroups) {
panel.toggle(block);
panel.toggle(block, 'input');
return;
}
@@ -252,7 +263,7 @@ export function handleInlineAskAIAction(
clear();
};
panel.toggle(block);
panel.toggle(block, 'input');
setTimeout(() => {
abortController = new AbortController();

View File

@@ -457,7 +457,7 @@ export function actionToHandler<T extends keyof BlockSuitePresets.AIActions>(
togglePanel()
.then(isEmpty => {
aiPanel.toggle(referenceElement, isEmpty ? undefined : '', false);
aiPanel.toggle(referenceElement, isEmpty ? 'input' : 'generate');
})
.catch(console.error);
};

View File

@@ -333,20 +333,14 @@ export class AffineAIPanelWidget extends WidgetComponent {
}
};
toggle = (
reference: Element,
input?: string,
shouldTriggerCallback?: boolean
) => {
if (typeof input === 'string') {
this._inputText = input;
toggle = (reference: Element, type: 'input' | 'generate') => {
if (type === 'generate') {
this._inputText = '';
this.generate();
} else {
// reset state
this.hide(shouldTriggerCallback);
} else if (type === 'input') {
this.hide();
this.state = 'input';
}
this._autoUpdatePosition(reference);
};