From 39dfe04236cb1e57ed07acd976e633b1e2251e8a Mon Sep 17 00:00:00 2001
From: StreetLamb <l.y.z.jerron@gmail.com>
Date: Sun, 25 Aug 2024 15:36:56 +0800
Subject: [PATCH] Fix threads table overflowing if query text is long

---
 frontend/src/components/Teams/ViewThreads.tsx | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/Teams/ViewThreads.tsx b/frontend/src/components/Teams/ViewThreads.tsx
index a1eefbb3..82ab0317 100644
--- a/frontend/src/components/Teams/ViewThreads.tsx
+++ b/frontend/src/components/Teams/ViewThreads.tsx
@@ -1,7 +1,6 @@
 import {
   Flex,
   Spinner,
-  Container,
   TableContainer,
   Table,
   Thead,
@@ -84,7 +83,6 @@ const ChatHistory = ({ teamId, updateTabIndex }: ChatHistoryProps) => {
         </Flex>
       ) : (
         threads && (
-          <Container maxW="full">
             <TableContainer>
               <Table size={{ base: "sm", md: "md" }}>
                 <Thead>
@@ -95,7 +93,7 @@ const ChatHistory = ({ teamId, updateTabIndex }: ChatHistoryProps) => {
                     <Th>Actions</Th>
                   </Tr>
                 </Thead>
-                <Tbody>
+                <Tbody width={"2rem"}>
                   {threads.data.map((thread) => (
                     <Tr
                       key={thread.id}
@@ -104,7 +102,7 @@ const ChatHistory = ({ teamId, updateTabIndex }: ChatHistoryProps) => {
                       cursor={"pointer"}
                     >
                       <Td>{new Date(thread.updated_at).toLocaleString()}</Td>
-                      <Td>{thread.query}</Td>
+                      <Td maxW="20rem" overflow="hidden" textOverflow="ellipsis">{thread.query}</Td>
                       <Td>{thread.id}</Td>
                       <Td>
                         <IconButton
@@ -119,7 +117,6 @@ const ChatHistory = ({ teamId, updateTabIndex }: ChatHistoryProps) => {
                 </Tbody>
               </Table>
             </TableContainer>
-          </Container>
         )
       )}
     </>