瀏覽代碼

Fix: Improve message input handling with Shift+Enter support (#5129)

### What problem does this PR solve?

just resolve issue: [Improve message input handling with Shift+Enter
support](https://github.com/infiniflow/ragflow/issues/5116)
### Type of change

- [x] New Feature (non-breaking change which adds functionality)

---------

Co-authored-by: wenju.li <wenju.li@deepctr.cn>
tags/v0.17.0
liwenju0 8 月之前
父節點
當前提交
a4f9aa2172
No account linked to committer's email address
共有 1 個文件被更改,包括 47 次插入38 次删除
  1. 47
    38
      web/src/components/message-input/index.tsx

+ 47
- 38
web/src/components/message-input/index.tsx 查看文件

@@ -35,6 +35,7 @@ import {
useEffect,
useRef,
useState,
KeyboardEventHandler,
} from 'react';
import FileIcon from '../file-icon';
import styles from './index.less';
@@ -155,6 +156,13 @@ const MessageInput = ({
setFileList([]);
}, [fileList, onPressEnter, isUploadingFile]);

const handleInputKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = (e) => {
if (e.key === 'Enter' && !e.nativeEvent.shiftKey) {
e.preventDefault();
handlePressEnter();
}
};

const handleRemove = useCallback(
async (file: UploadFile) => {
const ids = get(file, 'response.data', []);
@@ -202,45 +210,46 @@ const MessageInput = ({

return (
<Flex gap={20} vertical className={styles.messageInputWrapper}>
<Input
size="large"
placeholder={t('sendPlaceholder')}
value={value}
disabled={disabled}
className={classNames({ [styles.inputWrapper]: fileList.length === 0 })}
suffix={
<Space>
{showUploadIcon && (
<Upload
onPreview={handlePreview}
onChange={handleChange}
multiple={false}
onRemove={handleRemove}
showUploadList={false}
beforeUpload={() => {
return false;
}}
>
<Button
type={'text'}
disabled={disabled}
icon={<Paperclip></Paperclip>}
></Button>
</Upload>
)}
<Button
type="primary"
onClick={handlePressEnter}
loading={sendLoading}
disabled={sendDisabled || isUploadingFile}
<Flex align="center" gap={8}>
<Input.TextArea
size="large"
placeholder={t('sendPlaceholder')}
value={value}
disabled={disabled}
className={classNames({ [styles.inputWrapper]: fileList.length === 0 })}
onKeyDown={handleInputKeyDown}
onChange={onInputChange}
autoSize={{ minRows: 1, maxRows: 6 }}
/>
<Space>
{showUploadIcon && (
<Upload
onPreview={handlePreview}
onChange={handleChange}
multiple={false}
onRemove={handleRemove}
showUploadList={false}
beforeUpload={() => {
return false;
}}
>
{t('send')}
</Button>
</Space>
}
onPressEnter={handlePressEnter}
onChange={onInputChange}
/>
<Button
type={'text'}
disabled={disabled}
icon={<Paperclip />}
></Button>
</Upload>
)}
<Button
type="primary"
onClick={handlePressEnter}
loading={sendLoading}
disabled={sendDisabled || isUploadingFile}
>
{t('send')}
</Button>
</Space>
</Flex>

{fileList.length > 0 && (
<List

Loading…
取消
儲存