mirror of
https://github.com/BerriAI/litellm.git
synced 2025-04-25 02:34:29 +00:00
chat ui allow pasting in content
This commit is contained in:
parent
1a15e09da3
commit
f3237c615e
1 changed files with 11 additions and 6 deletions
|
@ -23,7 +23,7 @@ import {
|
||||||
Divider,
|
Divider,
|
||||||
} from "@tremor/react";
|
} from "@tremor/react";
|
||||||
|
|
||||||
import { message, Select, Spin, Typography, Tooltip } from "antd";
|
import { message, Select, Spin, Typography, Tooltip, Input } from "antd";
|
||||||
import { makeOpenAIChatCompletionRequest } from "./chat_ui/llm_calls/chat_completion";
|
import { makeOpenAIChatCompletionRequest } from "./chat_ui/llm_calls/chat_completion";
|
||||||
import { makeOpenAIImageGenerationRequest } from "./chat_ui/llm_calls/image_generation";
|
import { makeOpenAIImageGenerationRequest } from "./chat_ui/llm_calls/image_generation";
|
||||||
import { fetchAvailableModels, ModelGroup } from "./chat_ui/llm_calls/fetch_models";
|
import { fetchAvailableModels, ModelGroup } from "./chat_ui/llm_calls/fetch_models";
|
||||||
|
@ -47,6 +47,8 @@ import {
|
||||||
TagsOutlined
|
TagsOutlined
|
||||||
} from "@ant-design/icons";
|
} from "@ant-design/icons";
|
||||||
|
|
||||||
|
const { TextArea } = Input;
|
||||||
|
|
||||||
interface ChatUIProps {
|
interface ChatUIProps {
|
||||||
accessToken: string | null;
|
accessToken: string | null;
|
||||||
token: string | null;
|
token: string | null;
|
||||||
|
@ -190,10 +192,12 @@ const ChatUI: React.FC<ChatUIProps> = ({
|
||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
|
const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {
|
||||||
if (event.key === 'Enter') {
|
if (event.key === 'Enter' && !event.shiftKey) {
|
||||||
|
event.preventDefault(); // Prevent default to avoid newline
|
||||||
handleSendMessage();
|
handleSendMessage();
|
||||||
}
|
}
|
||||||
|
// If Shift+Enter is pressed, the default behavior (inserting a newline) will occur
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleCancelRequest = () => {
|
const handleCancelRequest = () => {
|
||||||
|
@ -502,18 +506,19 @@ const ChatUI: React.FC<ChatUIProps> = ({
|
||||||
|
|
||||||
<div className="p-4 border-t border-gray-200 bg-white">
|
<div className="p-4 border-t border-gray-200 bg-white">
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<TextInput
|
<TextArea
|
||||||
type="text"
|
|
||||||
value={inputMessage}
|
value={inputMessage}
|
||||||
onChange={(e) => setInputMessage(e.target.value)}
|
onChange={(e) => setInputMessage(e.target.value)}
|
||||||
onKeyDown={handleKeyDown}
|
onKeyDown={handleKeyDown}
|
||||||
placeholder={
|
placeholder={
|
||||||
endpointType === EndpointType.CHAT
|
endpointType === EndpointType.CHAT
|
||||||
? "Type your message..."
|
? "Type your message... (Shift+Enter for new line)"
|
||||||
: "Describe the image you want to generate..."
|
: "Describe the image you want to generate..."
|
||||||
}
|
}
|
||||||
disabled={isLoading}
|
disabled={isLoading}
|
||||||
className="flex-1"
|
className="flex-1"
|
||||||
|
autoSize={{ minRows: 1, maxRows: 6 }}
|
||||||
|
style={{ resize: 'none', paddingRight: '10px', paddingLeft: '10px' }}
|
||||||
/>
|
/>
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<Button
|
<Button
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue