From 362d9b2b2ca6a41ed47377ca826aeb026092e133 Mon Sep 17 00:00:00 2001
From: Matt Rubens <mrubens@users.noreply.github.com>
Date: Mon, 30 Jun 2025 15:46:29 -0400
Subject: [PATCH] Unlimited height on the share page (#160)

---
 apps/web/src/app/(authenticated)/usage/Messages.tsx     | 5 +++--
 apps/web/src/components/task-sharing/SharedTaskView.tsx | 1 +
 apps/web/src/components/task-sharing/TaskDetails.tsx    | 7 ++++++-
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/app/(authenticated)/usage/Messages.tsx b/apps/web/src/app/(authenticated)/usage/Messages.tsx
index a9176f0d3e..4c3e8e70c1 100644
--- a/apps/web/src/app/(authenticated)/usage/Messages.tsx
+++ b/apps/web/src/app/(authenticated)/usage/Messages.tsx
@@ -8,6 +8,7 @@ import { useAutoScroll } from '@/hooks/useAutoScroll';
 
 type MessagesProps = {
   messages: Message[];
+  maxHeight?: string;
 };
 
 type SuggestionItem = string | { answer: string };
@@ -34,7 +35,7 @@ const parseQuestionData = (text: string): QuestionData | null => {
   return null;
 };
 
-export const Messages = ({ messages }: MessagesProps) => {
+export const Messages = ({ messages, maxHeight }: MessagesProps) => {
   const { containerRef, scrollToBottom, autoScrollToBottom, userHasScrolled } =
     useAutoScroll<HTMLDivElement>({
       enabled: true,
@@ -73,7 +74,7 @@ export const Messages = ({ messages }: MessagesProps) => {
       {/* Scrollable messages container */}
       <div
         ref={containerRef}
-        className="max-h-[600px] overflow-y-auto space-y-6 pr-2"
+        className={`space-y-6 pr-2 overflow-y-auto ${maxHeight || ''}`}
         style={{
           scrollbarWidth: 'thin',
           scrollbarColor: 'hsl(var(--border)) transparent',
diff --git a/apps/web/src/components/task-sharing/SharedTaskView.tsx b/apps/web/src/components/task-sharing/SharedTaskView.tsx
index 3f2db5ae98..bdc4fd01a8 100644
--- a/apps/web/src/components/task-sharing/SharedTaskView.tsx
+++ b/apps/web/src/components/task-sharing/SharedTaskView.tsx
@@ -51,6 +51,7 @@ export const SharedTaskView = ({
       sharedBy={sharedBy}
       sharedAt={sharedAt}
       showSharedInfo={true}
+      limitMessagesHeight={false}
     />
   );
 };
diff --git a/apps/web/src/components/task-sharing/TaskDetails.tsx b/apps/web/src/components/task-sharing/TaskDetails.tsx
index 6fd18db740..4e1f6dddf6 100644
--- a/apps/web/src/components/task-sharing/TaskDetails.tsx
+++ b/apps/web/src/components/task-sharing/TaskDetails.tsx
@@ -22,6 +22,7 @@ type TaskDetailsProps = {
   sharedAt?: Date;
   showSharedInfo?: boolean;
   headerActions?: React.ReactNode;
+  limitMessagesHeight?: boolean;
 };
 
 export const TaskDetails = ({
@@ -31,6 +32,7 @@ export const TaskDetails = ({
   sharedAt,
   showSharedInfo = false,
   headerActions,
+  limitMessagesHeight = true,
 }: TaskDetailsProps) => {
   const taskTitle = task.title || generateFallbackTitle(task);
 
@@ -152,7 +154,10 @@ export const TaskDetails = ({
             <CardTitle>Conversation</CardTitle>
           </CardHeader>
           <CardContent>
-            <Messages messages={messages} />
+            <Messages
+              messages={messages}
+              maxHeight={limitMessagesHeight ? 'max-h-[600px]' : undefined}
+            />
           </CardContent>
         </Card>
       ) : (