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>