From eb4ebc4b3de9e729311fcbeedd26c5faebed406d Mon Sep 17 00:00:00 2001
From: anovazzi1 <otavio2204@gmail.com>
Date: Tue, 9 May 2023 22:29:31 -0300
Subject: [PATCH] first version image

---
 .../modals/chatModal/fileComponent/index.tsx  | 42 +++++++++++--------
 src/frontend/src/modals/chatModal/index.tsx   |  1 +
 2 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/src/frontend/src/modals/chatModal/fileComponent/index.tsx b/src/frontend/src/modals/chatModal/fileComponent/index.tsx
index a7b492c95..05a7859eb 100644
--- a/src/frontend/src/modals/chatModal/fileComponent/index.tsx
+++ b/src/frontend/src/modals/chatModal/fileComponent/index.tsx
@@ -1,19 +1,20 @@
-import {  CloudArrowDownIcon, DocumentIcon } from "@heroicons/react/24/outline";
-import * as base64js from 'base64-js';
+import { CloudArrowDownIcon, DocumentIcon } from "@heroicons/react/24/outline";
+import * as base64js from "base64-js";
+import Tooltip from "../../../components/TooltipComponent";
 
 export default function FileCard({ fileName, content, fileType }) {
-    const handleDownload = () => {
-        const byteArray = new Uint8Array(base64js.toByteArray(content));
-        const blob = new Blob([byteArray], { type: 'application/octet-stream' });
-        const url = URL.createObjectURL(blob);
-        const link = document.createElement('a');
-        link.href = url;
-        link.download = fileName+".png";
-        document.body.appendChild(link);
-        link.click();
-        document.body.removeChild(link);
-        URL.revokeObjectURL(url);
-      };
+	const handleDownload = () => {
+		const byteArray = new Uint8Array(base64js.toByteArray(content));
+		const blob = new Blob([byteArray], { type: "application/octet-stream" });
+		const url = URL.createObjectURL(blob);
+		const link = document.createElement("a");
+		link.href = url;
+		link.download = fileName + ".png";
+		document.body.appendChild(link);
+		link.click();
+		document.body.removeChild(link);
+		URL.revokeObjectURL(url);
+	};
 
 	return (
 		<button
@@ -22,12 +23,19 @@ export default function FileCard({ fileName, content, fileType }) {
 		>
 			<div className="flex gap-2 text-current items-center w-full mr-2">
 				{" "}
-				<DocumentIcon className="w-8 h-8" />
+				{fileType === "image" ? (
+					<img
+						src={`data:image/png;base64,${content}`}
+						alt=""
+						className="w-8 h-8"
+					/>
+				) : (
+					<DocumentIcon className="w-8 h-8" />
+				)}
 				<div className="flex flex-col items-start">
 					{" "}
 					<div className="truncate text-sm text-current">{fileName}</div>
-                    <div className="truncate text-xs  text-gray-500">{fileType}</div>
-
+					<div className="truncate text-xs  text-gray-500">{fileType}</div>
 				</div>
 				<CloudArrowDownIcon className="w-6 h-6 text-current ml-auto" />
 			</div>
diff --git a/src/frontend/src/modals/chatModal/index.tsx b/src/frontend/src/modals/chatModal/index.tsx
index 3d24b1cc0..bd8b931e6 100644
--- a/src/frontend/src/modals/chatModal/index.tsx
+++ b/src/frontend/src/modals/chatModal/index.tsx
@@ -91,6 +91,7 @@ export default function ChatModal({
 
 	function handleOnClose(event: CloseEvent) {
 		if (isOpen.current) {
+			console.log(event)
 			setLockChat(false);
 			setTimeout(() => {
 				connectWS();