From c29604a65570e0c32a656f9d31f47b79d3d4d2f1 Mon Sep 17 00:00:00 2001
From: AyushKumar123456789 <ayushjitendra28@gmail.com>
Date: Sun, 12 Jan 2025 17:58:46 +0000
Subject: [PATCH] Added Divider in cahtinputformatingToolbar

---
 packages/react/src/views/ChatInput/ChatInput.styles.js |  5 +++++
 .../src/views/ChatInput/ChatInputFormattingToolbar.js  | 10 +++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/views/ChatInput/ChatInput.styles.js b/packages/react/src/views/ChatInput/ChatInput.styles.js
index 21e7a24736..db1d174e0b 100644
--- a/packages/react/src/views/ChatInput/ChatInput.styles.js
+++ b/packages/react/src/views/ChatInput/ChatInput.styles.js
@@ -85,6 +85,11 @@ export const getChatInputFormattingToolbarStyles = ({ theme, mode }) => {
         grid-template-columns: repeat(5, 0.2fr);
       }
     `,
+    dividerStyle: css`
+      width: 1px;
+      height: 1.5rem;
+      background: ${theme.colors.border};
+    `,
   };
   return styles;
 };
diff --git a/packages/react/src/views/ChatInput/ChatInputFormattingToolbar.js b/packages/react/src/views/ChatInput/ChatInputFormattingToolbar.js
index 0097471058..d2975400ef 100644
--- a/packages/react/src/views/ChatInput/ChatInputFormattingToolbar.js
+++ b/packages/react/src/views/ChatInput/ChatInputFormattingToolbar.js
@@ -156,7 +156,15 @@ const ChatInputFormattingToolbar = ({
       className={`ec-chat-input-formatting-toolbar ${classNames}`}
       style={styleOverrides}
     >
-      {surfaceItems.map((key) => chatToolMap[key])}
+      {surfaceItems.map((key, index) => (
+        <React.Fragment key={key}>
+          {chatToolMap[key]}
+          {((key === 'emoji' && index < surfaceItems.length - 1) ||
+            (key === 'link' && surfaceItems[index + 1] === 'audio')) && (
+            <Box css={styles.dividerStyle} />
+          )}
+        </React.Fragment>
+      ))}
 
       {isEmojiOpen && (
         <EmojiPicker