Add enabled & linkEnabled props to messages

website/src/components/Messages/MessageTable.tsx

@@ -4,13 +4,14 @@ import { Message } from "src/types/Conversation";
 
 interface MessageTableProps {
   messages: Message[];
+  enableLink?: boolean;
 }
 
-export function MessageTable({ messages }: MessageTableProps) {
+export function MessageTable({ messages, enableLink }: MessageTableProps) {
   return (
     <Stack divider={<StackDivider />} spacing="4">
       {messages.map((item) => (
-        <MessageTableEntry item={item} key={item.id || item.frontend_message_id} />
+        <MessageTableEntry enabled={enableLink} item={item} key={item.id || item.frontend_message_id} />
       ))}
     </Stack>
   );

website/src/components/Messages/MessageTableEntry.tsx

@@ -1,4 +1,4 @@
-import { Avatar, HStack, LinkBox, useColorModeValue } from "@chakra-ui/react";
+import { Avatar, Box, HStack, LinkBox, useColorModeValue } from "@chakra-ui/react";
 import { boolean } from "boolean";
 import Link from "next/link";
 import { FlaggableElement } from "src/components/FlaggableElement";
@@ -6,6 +6,7 @@ import { Message } from "src/types/Conversation";
 
 interface MessageTableEntryProps {
   item: Message;
+  enabled?: boolean;
 }
 
 export function MessageTableEntry(props: MessageTableEntryProps) {
@@ -22,11 +23,17 @@ export function MessageTableEntry(props: MessageTableEntryProps) {
             src={`${boolean(item.is_assistant) ? "/images/logos/logo.png" : "/images/temp-avatars/av1.jpg"}`}
           />
 
-          <Link href={`/messages/${item.id}`}>
-            <LinkBox bg={backgroundColor} className={`p-4 rounded-md whitespace-pre-wrap w-full`}>
+          {props.enabled ? (
+            <Link href={`/messages/${item.id}`}>
+              <LinkBox bg={backgroundColor} className={`p-4 rounded-md whitespace-pre-wrap w-full`}>
+                {item.text}
+              </LinkBox>
+            </Link>
+          ) : (
+            <Box bg={backgroundColor} className={`p-4 rounded-md whitespace-pre-wrap w-full`}>
               {item.text}
-            </LinkBox>
-          </Link>
+            </Box>
+          )}
         </HStack>
       </FlaggableElement>
     </div>

website/src/components/Messages/MessageWithChildren.tsx

@@ -68,7 +68,7 @@ export function MessageWithChildren(props: MessageWithChildrenProps) {
               {isFirst ? "Message" : depth === 1 ? "Children" : "Ancestor"}
             </Text>
             <Box width="fit-content" bg={backgroundColor} padding="4" borderRadius="xl" boxShadow="base">
-              <MessageTableEntry item={message} />
+              <MessageTableEntry enabled item={message} />
             </Box>
           </Box>
         </>
@@ -95,7 +95,7 @@ export function MessageWithChildren(props: MessageWithChildrenProps) {
             <Stack {...MessageStackProps}>
               {children.map((item, idx) => (
                 <Box flex="1" key={`recursiveMessageWChildren_${idx}`}>
-                  <MessageTableEntry item={item} />
+                  <MessageTableEntry enabled item={item} />
                 </Box>
               ))}
             </Stack>

website/src/pages/messages/[id]/index.tsx

@@ -43,7 +43,7 @@ const MessageDetail = ({ id }) => {
                 </Text>
                 <Box bg={backgroundColor} padding="4" borderRadius="xl" boxShadow="base" width="fit-content">
                   {" "}
-                  <MessageTableEntry item={parent} />
+                  <MessageTableEntry enabled item={parent} />
                 </Box>
               </Box>
             </>

website/src/pages/messages/index.tsx

@@ -52,7 +52,7 @@ const MessagesDashboard = () => {
             borderRadius="xl"
             className="p-6 shadow-sm"
           >
-            {receivedMessages ? <MessageTable messages={messages} /> : <CircularProgress isIndeterminate />}
+            {receivedMessages ? <MessageTable enableLink messages={messages} /> : <CircularProgress isIndeterminate />}
           </Box>
         </Box>
         <Box>
@@ -66,7 +66,11 @@ const MessagesDashboard = () => {
             borderRadius="xl"
             className="p-6 shadow-sm"
           >
-            {receivedUserMessages ? <MessageTable messages={userMessages} /> : <CircularProgress isIndeterminate />}
+            {receivedUserMessages ? (
+              <MessageTable enableLink messages={userMessages} />
+            ) : (
+              <CircularProgress isIndeterminate />
+            )}
           </Box>
         </Box>
       </SimpleGrid>