From ccb5de6e95cc5c2cb07fd78d0deeea7dce0229fc Mon Sep 17 00:00:00 2001
From: MartinBraquet <martin.braquet@gmail.com>
Date: Mon, 18 May 2026 16:36:29 +0200
Subject: [PATCH] Allow dynamic editor max height to prevent UI overflow issues

---
 web/components/comments/comment-input.tsx        | 4 +++-
 web/components/messaging/send-message-button.tsx | 1 +
 web/components/widgets/editor.tsx                | 5 +++--
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/web/components/comments/comment-input.tsx b/web/components/comments/comment-input.tsx
index f8715145..da96e13f 100644
--- a/web/components/comments/comment-input.tsx
+++ b/web/components/comments/comment-input.tsx
@@ -134,6 +134,7 @@ export function CommentInputTextArea(props: {
   isDisabled?: boolean
   isEditing?: boolean
   commentTypes?: CommentType[]
+  maxHeight?: string
 }) {
   const {
     user,
@@ -146,6 +147,7 @@ export function CommentInputTextArea(props: {
     commentTypes = ['comment'],
     cancelEditing,
     isDisabled,
+    maxHeight,
   } = props
   const t = useT()
 
@@ -198,7 +200,7 @@ export function CommentInputTextArea(props: {
   }, [replyTo, editor])
 
   return (
-    <TextEditor editor={editor} simple hideEmbed>
+    <TextEditor editor={editor} maxHeight={maxHeight} simple hideEmbed>
       <Row className={''}>
         {user && !isSubmitting && submit && commentTypes.includes('repost') && (
           <Tooltip text={'Post question & comment to your followers'} className={'mt-2'}>
diff --git a/web/components/messaging/send-message-button.tsx b/web/components/messaging/send-message-button.tsx
index d3225fb2..1748043a 100644
--- a/web/components/messaging/send-message-button.tsx
+++ b/web/components/messaging/send-message-button.tsx
@@ -273,6 +273,7 @@ export const SendMessageButton = (props: {
                 isSubmitting={!editor || submitting}
                 isDisabled={charCount < MIN_CHARS}
                 submitOnEnter={false}
+                maxHeight={'25vh'} // otherwise send button gets hidden (need better fix)
               />
 
               <p className="text-ink-500 text-xs text-center leading-relaxed">
diff --git a/web/components/widgets/editor.tsx b/web/components/widgets/editor.tsx
index 34c53604..fead3031 100644
--- a/web/components/widgets/editor.tsx
+++ b/web/components/widgets/editor.tsx
@@ -221,8 +221,9 @@ export function TextEditor(props: {
   className?: string
   onBlur?: () => void
   onChange?: () => void
+  maxHeight?: string
 }) {
-  const {editor, simple, hideEmbed, children, className, onBlur, onChange} = props
+  const {editor, simple, hideEmbed, children, className, onBlur, onChange, maxHeight} = props
 
   return (
     // matches input styling
@@ -233,7 +234,7 @@ export function TextEditor(props: {
       )}
     >
       <FloatingFormatMenu editor={editor} advanced={!simple} />
-      <div className={clsx('max-h-[69vh] overflow-auto')}>
+      <div className={clsx(`overflow-auto`, maxHeight ? `max-h-[${maxHeight}]` : 'max-h-[69vh]')}>
         <EditorContent editor={editor} onBlur={onBlur} onChange={onChange} />
       </div>