clean up csv prompt + frontend (#3393)

* clean up csv prompt + frontend

* nit

* nit

* detect uploading

* upload

web/src/app/chat/ChatPage.tsx

@@ -1080,10 +1080,17 @@ export function ChatPage({
     updateCanContinue(false, frozenSessionId);
 
     if (currentChatState() != "input") {
-      setPopup({
-        message: "Please wait for the response to complete",
-        type: "error",
-      });
+      if (currentChatState() == "uploading") {
+        setPopup({
+          message: "Please wait for the content to upload",
+          type: "error",
+        });
+      } else {
+        setPopup({
+          message: "Please wait for the response to complete",
+          type: "error",
+        });
+      }
 
       return;
     }
@@ -1558,7 +1565,7 @@ export function ChatPage({
     }
   };
 
-  const handleImageUpload = (acceptedFiles: File[]) => {
+  const handleImageUpload = async (acceptedFiles: File[]) => {
     const [_, llmModel] = getFinalLLM(
       llmProviders,
       liveAssistant,
@@ -1598,8 +1605,9 @@ export function ChatPage({
         (file) => !tempFileDescriptors.some((newFile) => newFile.id === file.id)
       );
     };
+    updateChatState("uploading", currentSessionId());
 
-    uploadFilesForChat(acceptedFiles).then(([files, error]) => {
+    await uploadFilesForChat(acceptedFiles).then(([files, error]) => {
       if (error) {
         setCurrentMessageFiles((prev) => removeTempFiles(prev));
         setPopup({
@@ -1610,6 +1618,7 @@ export function ChatPage({
         setCurrentMessageFiles((prev) => [...removeTempFiles(prev), ...files]);
       }
     });
+    updateChatState("input", currentSessionId());
   };
   const [showHistorySidebar, setShowHistorySidebar] = useState(false); // State to track if sidebar is open
 

web/src/app/chat/types.ts

@@ -1,5 +1,10 @@
 export type FeedbackType = "like" | "dislike";
-export type ChatState = "input" | "loading" | "streaming" | "toolBuilding";
+export type ChatState =
+  | "input"
+  | "loading"
+  | "streaming"
+  | "toolBuilding"
+  | "uploading";
 export interface RegenerationState {
   regenerating: boolean;
   finalMessageIndex: number;

web/src/components/tools/CSVContent.tsx

@@ -91,9 +91,7 @@ const CsvContent: React.FC<ContentComponentProps> = ({
       }`}
     >
       <div
-        className={`overflow-y-hidden flex relative ${
-          expanded ? "max-h-2/3" : "max-h-[300px]"
-        }`}
+        className={`flex relative ${expanded ? "max-h-2/3" : "max-h-[300px]"}`}
       >
         <Table>
           <TableHeader className="sticky z-[1000] top-0">
@@ -108,7 +106,7 @@ const CsvContent: React.FC<ContentComponentProps> = ({
             </TableRow>
           </TableHeader>
 
-          <TableBody className="h-[300px] overflow-y-scroll">
+          <TableBody className="h-[300px] overflow-y-hidden ">
             {data.length > 0 ? (
               data.map((row, rowIndex) => (
                 <TableRow key={rowIndex}>

web/src/components/tools/ExpandableContentWrapper.tsx

@@ -102,9 +102,9 @@ const ExpandableContentWrapper: React.FC<ExpandableContentWrapperProps> = ({
         </div>
       </CardHeader>
       <Card
-        className={`!rounded-none w-full ${
-          expanded ? "max-h-[600px]" : "max-h-[300px] h"
-        } p-0 relative overflow-x-scroll overflow-y-scroll mx-auto`}
+        className={`!rounded-none p-0 relative mx-auto w-full ${
+          expanded ? "max-h-[600px]" : "max-h-[300px] h-full"
+        } `}
       >
         <CardContent className="p-0">
           <ContentComponent