honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Changed KeyDownHandler 

Removed global keydown listener and attached directly to TextBox event
Changed from Ctrl-Enter to send to Enter to send with option to use Shift-Enter for newlines
This commit is contained in:
Chris Kent 2024-01-28 00:55:11 -05:00
parent 9142f3e3a7
commit 4ffa2cecad
1 changed files with 7 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
samples/react-azure-openai-api-stream/src/webparts/chatStreaming/components/UserMessage.tsx
View File

@ -20,20 +20,15 @@ export default class UserMessage extends React.Component<IUserMessageProps, {}>
await this.props.sendQuery();
};
private _keyDownHandler = async (e: KeyboardEvent): Promise<void> => {
if (e.ctrlKey && e.code === "Enter") {
await this._handleClick();
private _keyDownHandler = async (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>): Promise<void> => {
if(!event.shiftKey && event.key === "Enter") {
//Submits message when a user hits return (but still allows newlines for shift+enter)
event.preventDefault();
return this._handleClick();
}
};
public componentDidMount(): void {
window.addEventListener("keydown", this._keyDownHandler);
}
public componentWillUnmount(): void {
window.removeEventListener("keydown", this._keyDownHandler);
}
public render(): React.ReactElement<IUserMessageProps> {
return (
<Stack horizontal tokens={{ childrenGap: 5 }}>
@ -43,6 +38,7 @@ export default class UserMessage extends React.Component<IUserMessageProps, {}>
autoAdjustHeight
value={this.props.textFieldValue}
onChange={this._onChange}
onKeyDown={this._keyDownHandler}
label="User message"
placeholder="Type user query here."
/>