From 75173473aec28d6cfd3ad36a89f8004353d3a23a Mon Sep 17 00:00:00 2001
From: ManishMadan2882 <manishmadan321@gmail.com>
Date: Wed, 4 Dec 2024 02:47:57 +0530
Subject: [PATCH] (feat:bubble) replace emoji with user profile

---
 frontend/src/assets/user.png                     | Bin 0 -> 735 bytes
 frontend/src/components/Avatar.tsx               |   2 +-
 frontend/src/conversation/ConversationBubble.tsx |  13 ++++++++++---
 3 files changed, 11 insertions(+), 4 deletions(-)
 create mode 100644 frontend/src/assets/user.png

diff --git a/frontend/src/assets/user.png b/frontend/src/assets/user.png
new file mode 100644
index 0000000000000000000000000000000000000000..3cc5d2f117820df7cd946dad34624157301c6ca4
GIT binary patch
literal 735
zcmV<50wDc~P)<h;3K|Lk000e1NJLTq000yK000yS1^@s6jfou%00009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0(414K~#7FrBqF5
z6G0T7+1+Flt%<E^v4L0=DVky~f?7{fibW3=Dk9$W+GG5QCrMBKpqKgs9>fZwpk731
zuto5o2NeWGw4j(sYTG1sv&kmi-<feYP0~#=Nt8Z#?3?%IoA<r9^9F!65+#J0UM8OV
z@$6<o2yC~%<%S0zlSfji>{+Cv5QKnrIJqxwkNe8_;Lg~8A9#J{(<w1sc!)7#?0%MI
z6|c{8;oQicoBw>^)yHrA1p+?kn&GF#IgU%SZf@_y@dNV>F&aQn&>=#Q-|QJJ3=l#+
ztZodN=F|EZLj$Oq5;P10V1z6%Rb^EU(Xdp8fS?YHYP(@^t?@w6MT0gl9KZdf!!Xcc
z-DGH2qi&5cIccVWZ5gg)iUz}zMJMmv4O&PsFa0rTlC}(|qGuE-pPSNjomi|4eU)9s
z*2`ZhFI}W1qV}**P@X$o%2x;H7-$HZMJlqASkUKQ(y%Pe`Qv>|?F}AGIvm^>fRMu&
zgNmxECg-xk>DQAJ-)LCswXtO8&iNOjm<?CUEvqOBmt(iWO-GLdErjJA?+jfx%Ut`J
zJb*C>A!&wb%5ZY}JKx*aH&(jH#+q)~vF&Iy9(OgvRa09})3vvW{pnxHAxRMXHB}uF
z7SjQOYsoMy1H9e7dDq4buR6E-<~jpCvB<vdpDV0O2S)DBdY7c!vs@}OtjWsiR4_~_
zNNkzy(?SR?t$4Q!Z|d%v9q138h>Y%%N<I9!@cW*$EDQr18Df^&UI>tjD~zclYC(Qv
zR(TALhHnH^6(*4N?hzXmP-oYzt7h3?7&fnC5acpTvRRvQ$@F2cPC*)Q{ssGoVo4mR
RrW^nO002ovPDHLkV1f=vMCAYg

literal 0
HcmV?d00001

diff --git a/frontend/src/components/Avatar.tsx b/frontend/src/components/Avatar.tsx
index 202be207..7f8c5a93 100644
--- a/frontend/src/components/Avatar.tsx
+++ b/frontend/src/components/Avatar.tsx
@@ -5,7 +5,7 @@ export default function Avatar({
   size,
   className,
 }: {
-  avatar: string | ReactNode;
+  avatar: ReactNode;
   size?: 'SMALL' | 'MEDIUM' | 'LARGE';
   className: string;
 }) {
diff --git a/frontend/src/conversation/ConversationBubble.tsx b/frontend/src/conversation/ConversationBubble.tsx
index fc004404..62e943dd 100644
--- a/frontend/src/conversation/ConversationBubble.tsx
+++ b/frontend/src/conversation/ConversationBubble.tsx
@@ -16,6 +16,7 @@ import Like from '../assets/like.svg?react';
 import Link from '../assets/link.svg';
 import Sources from '../assets/sources.svg';
 import Edit from '../assets/edit.svg';
+import UserIcon from '../assets/user.png';
 import Avatar from '../components/Avatar';
 import CopyButton from '../components/CopyButton';
 import Sidebar from '../components/Sidebar';
@@ -90,9 +91,15 @@ const ConversationBubble = forwardRef<
       >
         <div
           ref={ref}
-          className={`flex flex-row-reverse self-end flex-wrap items-baseline ${className}`}
+          className={`flex flex-row-reverse self-end flex-wrap ${className}`}
         >
-          <Avatar className="mt-2 text-2xl" avatar="🧑‍💻"></Avatar>
+          <Avatar
+            size="SMALL"
+            className="mt-2 text-2xl"
+            avatar={
+              <img className="rounded-full mr-1" width={30} src={UserIcon} />
+            }
+          />
           {!isEditClicked && (
             <div
               style={{
@@ -137,7 +144,7 @@ const ConversationBubble = forwardRef<
               setIsEditClicked(true);
               setEditInputBox(message);
             }}
-            className={`p-2 cursor-pointer rounded-full hover:bg-[#35363B] flex items-center ${isQuestionHovered || isEditClicked ? 'visible' : 'invisible'}`}
+            className={`h-fit mt-3 p-2 cursor-pointer rounded-full hover:bg-[#35363B] flex items-center ${isQuestionHovered || isEditClicked ? 'visible' : 'invisible'}`}
           >
             <img src={Edit} alt="Edit" className="cursor-pointer" />
           </button>