Render images to take full width of chat message div

Remove unnecessary "Inferred Query" heading prefix to image generation prompt
used by Khoj. The inferred query in chat message has a heading of it's
own, so avoid two headings for the image prompt

src/interface/web/app/common/chatFunctions.ts

@@ -126,7 +126,7 @@ export function handleImageResponse(imageJson: any, liveStream: boolean): Respon
             rawResponse = `![](data:image/webp;base64,${imageJson.image})`;
         }
         if (inferredQuery && !liveStream) {
-            rawResponse += `\n\n**Inferred Query**:\n\n${inferredQuery}`;
+            rawResponse += `\n\n${inferredQuery}`;
         }
     }
 

src/interface/web/app/components/chatMessage/chatMessage.module.css

@@ -58,18 +58,20 @@ div.emptyChatMessage {
 }
 
 div.chatMessageContainer img {
-    width: 50%;
+    width: auto;
+    height: auto;
+    max-width: 100%;
+    max-height: 80vh;
+    object-fit: contain;
+    display: block;
+    margin-top: 0.25rem;
+    margin-right: auto;
 }
 
 div.chatMessageContainer h3 img {
     width: 24px;
 }
 
-div.you img {
-    height: 16rem;
-    width: auto;
-}
-
 div.you {
     color: hsla(var(--secondary-foreground));
 }

src/interface/web/app/components/chatMessage/chatMessage.tsx

@@ -347,7 +347,7 @@ const ChatMessage = forwardRef<HTMLDivElement, ChatMessageProps>((props, ref) =>
             props.chatMessage.intent.type.includes("text-to-image") &&
             props.chatMessage.intent["inferred-queries"]?.length > 0
         ) {
-            message += `\n\n**Inferred Query**\n\n${props.chatMessage.intent["inferred-queries"][0]}`;
+            message += `\n\n${props.chatMessage.intent["inferred-queries"][0]}`;
         }
 
         setTextRendered(message);