From ec36209cbca498208b87f41d0173bb8e32109a31 Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:08:43 -0500
Subject: [PATCH 1/6] feat: add feature to remove chat icons

---
 .../app/window/page.tsx                       |  1 +
 packages/ui/components/chat-message.tsx       | 64 +++++++++++--------
 packages/ui/components/chat.tsx               |  3 +
 packages/ui/src/chatbot.ts                    |  2 +
 4 files changed, 42 insertions(+), 28 deletions(-)

diff --git a/examples/website-chatbot-window/app/window/page.tsx b/examples/website-chatbot-window/app/window/page.tsx
index cc3acb1..e22f333 100644
--- a/examples/website-chatbot-window/app/window/page.tsx
+++ b/examples/website-chatbot-window/app/window/page.tsx
@@ -41,6 +41,7 @@ export default function ChatPage() {
     footerTextName: 'OpenAssistantGPT',
 
     messageSourceText: 'Chatbot source:',
+    withChatMessageIcon: false
   };
 
   return (
diff --git a/packages/ui/components/chat-message.tsx b/packages/ui/components/chat-message.tsx
index ce88e27..01109e7 100644
--- a/packages/ui/components/chat-message.tsx
+++ b/packages/ui/components/chat-message.tsx
@@ -31,6 +31,7 @@ export interface ChatMessageProps {
   isFirst?: boolean;
   fontSize: string; // Keep as string for pixel values
   references: Reference[];
+  withChatMessageIcon: boolean;
 }
 
 const getDirection = (isRTL: boolean) => (isRTL ? 'rtl' : 'ltr');
@@ -44,6 +45,7 @@ export function ChatMessage({
   attachments,
   references,
   fontSize = '16px', // Default font size in pixels
+  withChatMessageIcon = true,
   ...props
 }: ChatMessageProps) {
   return (
@@ -64,7 +66,7 @@ export function ChatMessage({
           >
             <svg
               fill={chatbot.userReplyBackgroundColor}
-              className="absolute bottom-[0px] right-11"
+              className={`absolute bottom-[0px] ${ chatbot.withChatMessageIcon ? 'right-11' : 'right-3'}`}
               height="14"
               width="13"
             >
@@ -72,39 +74,45 @@ export function ChatMessage({
             </svg>
             {message.content}
           </p>
-          <div
-            className={cn(
-              'flex size-8 shrink-0 select-none items-center justify-center rounded-md border shadow',
-              'bg-background',
-            )}
-          >
-            <Icons.user />
-          </div>
-        </div>
-      ) : (
-        <div
-          className={cn('pr-10 group relative mb-4 flex items-start ')}
-          {...props}
-        >
-          {chatbot.chatbotLogoURL ? (
-            <div className="size-8" style={{ width: '30px', height: '30px' }}>
-              <img
-                src={chatbot.chatbotLogoURL}
-                alt="chatbot logo"
-                width={50}
-                height={50}
-              />
-            </div>
-          ) : (
+
+          {withChatMessageIcon &&
             <div
               className={cn(
                 'flex size-8 shrink-0 select-none items-center justify-center rounded-md border shadow',
-                'bg-primary text-primary-foreground',
+                'bg-background',
               )}
             >
-              <Icons.bot />
+              <Icons.user />
             </div>
-          )}
+          }
+        </div>
+      ) : (
+        <div
+          className={cn('pr-10 group relative mb-4 flex items-start ')}
+          {...props}
+        >
+          {withChatMessageIcon &&
+            (chatbot.chatbotLogoURL ? (
+              <div className="size-8" style={{ width: '30px', height: '30px' }}>
+                <img
+                  src={chatbot.chatbotLogoURL}
+                  alt="chatbot logo"
+                  width={50}
+                  height={50}
+                />
+              </div>
+            ) : (
+              <div
+                className={cn(
+                  'flex size-8 shrink-0 select-none items-center justify-center rounded-md border shadow',
+                  'bg-primary text-primary-foreground',
+                )}
+              >
+                <Icons.bot />
+              </div>
+            )
+            )
+          }
           <div className="flex-1 px-1 ml-4">
             {message.content == 'loading' ? (
               <Icons.loading className="animate-spin" />
diff --git a/packages/ui/components/chat.tsx b/packages/ui/components/chat.tsx
index 202b045..8f3a091 100644
--- a/packages/ui/components/chat.tsx
+++ b/packages/ui/components/chat.tsx
@@ -256,6 +256,7 @@ export function OpenAssistantGPTChat({
             <ChatMessage
               isFirst={true}
               chatbot={chatbot}
+              withChatMessageIcon={chatbot.withChatMessageIcon}
               message={{
                 id: '0',
                 role: 'assistant',
@@ -276,6 +277,7 @@ export function OpenAssistantGPTChat({
                     key={index}
                     message={message}
                     fontSize={chatbot.fontSize}
+                    withChatMessageIcon={chatbot.withChatMessageIcon}
                     references={
                       annotationsArray
                         .map(a => {
@@ -306,6 +308,7 @@ export function OpenAssistantGPTChat({
               <div className="mt-4" id="waiting">
                 <ChatMessage
                   chatbot={chatbot}
+                  withChatMessageIcon={chatbot.withChatMessageIcon}
                   message={{
                     id: 'waiting',
                     role: 'assistant',
diff --git a/packages/ui/src/chatbot.ts b/packages/ui/src/chatbot.ts
index f11dd1d..21b4132 100644
--- a/packages/ui/src/chatbot.ts
+++ b/packages/ui/src/chatbot.ts
@@ -33,4 +33,6 @@ export type ChatbotConfig = {
   footerLink: string;
 
   messageSourceText: string;
+
+  withChatMessageIcon: boolean
 };

From 09e729e264664203471b2704988e89ae86346872 Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:33:50 -0500
Subject: [PATCH 2/6] feat: update feature to remove icons

---
 packages/ui/components/chat-message.tsx | 6 +++---
 packages/ui/components/chat.tsx         | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/ui/components/chat-message.tsx b/packages/ui/components/chat-message.tsx
index 01109e7..280484d 100644
--- a/packages/ui/components/chat-message.tsx
+++ b/packages/ui/components/chat-message.tsx
@@ -61,12 +61,12 @@ export function ChatMessage({
               background: chatbot.userReplyBackgroundColor,
               fontSize, // Apply font size in pixels here
             }}
-            className="p-2 rounded-lg mr-4 whitespace-pre-wrap"
+            className="p-2 rounded-lg mr-3 whitespace-pre-wrap"
             dir={getDirection(chatbot.rightToLeftLanguage)} // Set text direction
           >
             <svg
               fill={chatbot.userReplyBackgroundColor}
-              className={`absolute bottom-[0px] ${ chatbot.withChatMessageIcon ? 'right-11' : 'right-3'}`}
+              className={`absolute bottom-[0px] ${ chatbot.withChatMessageIcon ? 'right-14' : 'right-2'}`}
               height="14"
               width="13"
             >
@@ -78,7 +78,7 @@ export function ChatMessage({
           {withChatMessageIcon &&
             <div
               className={cn(
-                'flex size-8 shrink-0 select-none items-center justify-center rounded-md border shadow',
+                'flex size-8 shrink-0 mr-4 select-none items-center justify-center rounded-md border shadow',
                 'bg-background',
               )}
             >
diff --git a/packages/ui/components/chat.tsx b/packages/ui/components/chat.tsx
index 8f3a091..a4654ce 100644
--- a/packages/ui/components/chat.tsx
+++ b/packages/ui/components/chat.tsx
@@ -249,7 +249,7 @@ export function OpenAssistantGPTChat({
           <div
             ref={messagesContainerRef}
             className={cn(
-              'pb-[200px] overflow-auto max-h-max pl-6 sm:pl-20 pr-6 sm:pr-20 md:pb-[100px] pt-4 md:pt-10',
+              'pb-[200px] overflow-auto max-h-max pl-6 sm:pl-20 sm:pr-20 md:pb-[100px] pt-4 md:pt-10',
               className,
             )}
           >

From 91497dc110b7ada5e3e2f22fef3c326f384c0595 Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:37:23 -0500
Subject: [PATCH 3/6] feat: add changeset

---
 .changeset/angry-donkeys-share.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/angry-donkeys-share.md

diff --git a/.changeset/angry-donkeys-share.md b/.changeset/angry-donkeys-share.md
new file mode 100644
index 0000000..2e25bd9
--- /dev/null
+++ b/.changeset/angry-donkeys-share.md
@@ -0,0 +1,5 @@
+---
+'@openassistantgpt/ui': patch
+---
+
+Add feature to remove all icons from chat

From 0c518805d7910afc7b65a8102eb12b0fa9a3a208 Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:39:30 -0500
Subject: [PATCH 4/6] feat: run prettier

---
 examples/website-chatbot-window/app/window/page.tsx |  2 +-
 packages/ui/components/chat-message.tsx             | 12 ++++++------
 packages/ui/src/chatbot.ts                          |  2 +-
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/examples/website-chatbot-window/app/window/page.tsx b/examples/website-chatbot-window/app/window/page.tsx
index e22f333..618c5ce 100644
--- a/examples/website-chatbot-window/app/window/page.tsx
+++ b/examples/website-chatbot-window/app/window/page.tsx
@@ -41,7 +41,7 @@ export default function ChatPage() {
     footerTextName: 'OpenAssistantGPT',
 
     messageSourceText: 'Chatbot source:',
-    withChatMessageIcon: false
+    withChatMessageIcon: false,
   };
 
   return (
diff --git a/packages/ui/components/chat-message.tsx b/packages/ui/components/chat-message.tsx
index 280484d..3adce56 100644
--- a/packages/ui/components/chat-message.tsx
+++ b/packages/ui/components/chat-message.tsx
@@ -66,7 +66,9 @@ export function ChatMessage({
           >
             <svg
               fill={chatbot.userReplyBackgroundColor}
-              className={`absolute bottom-[0px] ${ chatbot.withChatMessageIcon ? 'right-14' : 'right-2'}`}
+              className={`absolute bottom-[0px] ${
+                chatbot.withChatMessageIcon ? 'right-14' : 'right-2'
+              }`}
               height="14"
               width="13"
             >
@@ -75,7 +77,7 @@ export function ChatMessage({
             {message.content}
           </p>
 
-          {withChatMessageIcon &&
+          {withChatMessageIcon && (
             <div
               className={cn(
                 'flex size-8 shrink-0 mr-4 select-none items-center justify-center rounded-md border shadow',
@@ -84,7 +86,7 @@ export function ChatMessage({
             >
               <Icons.user />
             </div>
-          }
+          )}
         </div>
       ) : (
         <div
@@ -110,9 +112,7 @@ export function ChatMessage({
               >
                 <Icons.bot />
               </div>
-            )
-            )
-          }
+            ))}
           <div className="flex-1 px-1 ml-4">
             {message.content == 'loading' ? (
               <Icons.loading className="animate-spin" />
diff --git a/packages/ui/src/chatbot.ts b/packages/ui/src/chatbot.ts
index 21b4132..1c4c032 100644
--- a/packages/ui/src/chatbot.ts
+++ b/packages/ui/src/chatbot.ts
@@ -34,5 +34,5 @@ export type ChatbotConfig = {
 
   messageSourceText: string;
 
-  withChatMessageIcon: boolean
+  withChatMessageIcon: boolean;
 };

From aa8938525ddf8fe0c3d22c8ff2fba43c00e2a04c Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:46:20 -0500
Subject: [PATCH 5/6] feat: add missing attributes

---
 README.md                                       | 3 +++
 examples/next-website/app/page.tsx              | 1 +
 examples/website-custom-api/app/window/page.tsx | 1 +
 3 files changed, 5 insertions(+)

diff --git a/README.md b/README.md
index 75db6be..ba23a82 100644
--- a/README.md
+++ b/README.md
@@ -115,6 +115,9 @@ export default function ChatPage() {
     displayFooterText: true,
     footerLink: 'https://www.openassistantgpt.io',
     footerTextName: 'OpenAssistantGPT',
+
+    messageSourceText: '',
+    withChatMessageIcon: true
   };
 
   return (
diff --git a/examples/next-website/app/page.tsx b/examples/next-website/app/page.tsx
index aebdd7f..650aa2a 100644
--- a/examples/next-website/app/page.tsx
+++ b/examples/next-website/app/page.tsx
@@ -45,6 +45,7 @@ export default function ChatPage() {
     fontSize: '14px',
 
     messageSourceText: '',
+    withChatMessageIcon: true
   };
 
   useEffect(() => {
diff --git a/examples/website-custom-api/app/window/page.tsx b/examples/website-custom-api/app/window/page.tsx
index d0abd5e..fb4b57f 100644
--- a/examples/website-custom-api/app/window/page.tsx
+++ b/examples/website-custom-api/app/window/page.tsx
@@ -39,6 +39,7 @@ export default function ChatPage() {
     fontSize: '15px',
 
     messageSourceText: '',
+    withChatMessageIcon: true
   };
 
   return (

From f747f56f46b1e414d4109405f1eabd6547dd2b07 Mon Sep 17 00:00:00 2001
From: marcolivierbouch <mo.bouchard1997@gmail.com>
Date: Wed, 27 Nov 2024 07:47:55 -0500
Subject: [PATCH 6/6] feat: run prettier

---
 README.md                                       | 2 +-
 examples/next-website/app/page.tsx              | 2 +-
 examples/website-custom-api/app/window/page.tsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index ba23a82..b185bde 100644
--- a/README.md
+++ b/README.md
@@ -117,7 +117,7 @@ export default function ChatPage() {
     footerTextName: 'OpenAssistantGPT',
 
     messageSourceText: '',
-    withChatMessageIcon: true
+    withChatMessageIcon: true,
   };
 
   return (
diff --git a/examples/next-website/app/page.tsx b/examples/next-website/app/page.tsx
index 650aa2a..46a4ba5 100644
--- a/examples/next-website/app/page.tsx
+++ b/examples/next-website/app/page.tsx
@@ -45,7 +45,7 @@ export default function ChatPage() {
     fontSize: '14px',
 
     messageSourceText: '',
-    withChatMessageIcon: true
+    withChatMessageIcon: true,
   };
 
   useEffect(() => {
diff --git a/examples/website-custom-api/app/window/page.tsx b/examples/website-custom-api/app/window/page.tsx
index fb4b57f..aa2657c 100644
--- a/examples/website-custom-api/app/window/page.tsx
+++ b/examples/website-custom-api/app/window/page.tsx
@@ -39,7 +39,7 @@ export default function ChatPage() {
     fontSize: '15px',
 
     messageSourceText: '',
-    withChatMessageIcon: true
+    withChatMessageIcon: true,
   };
 
   return (