diff --git a/apps/web/src/app/components/ChatPanel.tsx b/apps/web/src/app/components/ChatPanel.tsx
index 9194bcb..a99647b 100644
--- a/apps/web/src/app/components/ChatPanel.tsx
+++ b/apps/web/src/app/components/ChatPanel.tsx
@@ -135,6 +135,7 @@ function ChatPanel({
}: ChatPanelProps) {
const messagesEndRef = useRef(null);
const scrollContainerRef = useRef(null);
+ const inputRef = useRef(null);
const shouldAutoScrollRef = useRef(true);
const sendAnimationTimeoutRef = useRef(null);
const prevMessageIdsRef = useRef>(new Set());
@@ -211,6 +212,16 @@ function ChatPanel({
setActiveMentionIndex(0);
}, [chatInput]);
+ useEffect(() => {
+ const input = inputRef.current;
+ if (!input) return;
+
+ input.style.height = "auto";
+ input.style.height = `${input.scrollHeight}px`;
+ input.style.overflowY =
+ input.scrollHeight > input.clientHeight ? "auto" : "hidden";
+ }, [chatInput]);
+
useEffect(() => {
const previousCount = previousMessageCountRef.current;
const addedMessages = messages.length - previousCount;
@@ -312,7 +323,7 @@ function ChatPanel({
);
return;
}
- if (e.key === "Tab" || e.key === "Enter") {
+ if (e.key === "Tab" || (e.key === "Enter" && !e.shiftKey)) {
e.preventDefault();
applyMentionSuggestion(activeMentionIndex);
return;
@@ -334,12 +345,17 @@ function ChatPanel({
);
return;
}
- if (isPickingCommand && (e.key === "Tab" || e.key === "Enter")) {
+ if (
+ isPickingCommand &&
+ (e.key === "Tab" || (e.key === "Enter" && !e.shiftKey))
+ ) {
const command = commandSuggestions[activeCommandIndex];
const isExactMatch =
command &&
chatInput.trim().toLowerCase() === `/${command.label}`;
if (e.key === "Enter" && isExactMatch) {
+ e.preventDefault();
+ handleSubmit(e);
return;
}
e.preventDefault();
@@ -514,7 +530,7 @@ function ChatPanel({
{directMessageLabel}
) : null}
-
+
{renderMessageContent(msg.content)}
@@ -604,9 +620,10 @@ function ChatPanel({
})}
)}
-