diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
index 5326f3826..b1ff9d143 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-drag-and-drop.tsx
@@ -62,8 +62,8 @@ const handleFiles = (files, setFiles, currentFlowId, setErrorData) => {
       });
       return;
     }
-    const uid = new ShortUniqueId({ length: 3 });
-    const id = uid();
+    const uid = new ShortUniqueId();
+    const id = uid.randomUUID(3);
     const type = files[0].type.split("/")[0];
     const blob = files[0];
 
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
index 28581cfb6..748187133 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-handle-file-change.tsx
@@ -28,8 +28,9 @@ export const useHandleFileChange = (setFiles, currentFlowId) => {
         return;
       }
 
-      const uid = new ShortUniqueId({ length: 10 }); // Increase the length to ensure uniqueness
-      const id = uid();
+      const uid = new ShortUniqueId();
+      const id = uid.randomUUID(10);
+
       const type = file.type.split("/")[0];
       const blob = file;
 
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-upload.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-upload.tsx
index 6d3eac14e..5a9e85195 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-upload.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatInput/hooks/use-upload.tsx
@@ -19,7 +19,7 @@ const useUpload = (uploadFile, currentFlowId, setFiles, lockChat) => {
       if (items) {
         for (let i = 0; i < items.length; i++) {
           const type = items[0].type.split("/")[0];
-          const uid = new ShortUniqueId({ length: 3 });
+          const uid = new ShortUniqueId();
           const blob = items[i].getAsFile();
           if (blob) {
             const fileExtension = blob.name.split(".").pop()?.toLowerCase();
@@ -34,7 +34,7 @@ const useUpload = (uploadFile, currentFlowId, setFiles, lockChat) => {
               });
               return;
             }
-            const id = uid();
+            const id = uid.randomUUID(3);
             setFiles((prevFiles) => [
               ...prevFiles,
               { file: blob, loading: true, error: false, id, type },
diff --git a/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
index 238cecec6..4aeaf12b0 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/chatMessage/index.tsx
@@ -200,8 +200,8 @@ export default function ChatMessage({
                                 children,
                                 ...props
                               }) => {
-                                if (children.length) {
-                                  if (children[0] === "▍") {
+                                if (children?.length) {
+                                  if (children![0] === "▍") {
                                     return (
                                       <span className="form-modal-markdown-span">
                                         ▍
@@ -209,10 +209,9 @@ export default function ChatMessage({
                                     );
                                   }
 
-                                  children[0] = (children[0] as string).replace(
-                                    "`▍`",
-                                    "▍",
-                                  );
+                                  children![0] = (
+                                    children![0] as string
+                                  ).replace("`▍`", "▍");
                                 }
 
                                 const match = /language-(\w+)/.exec(
diff --git a/src/frontend/src/modals/IOModal/components/chatView/index.tsx b/src/frontend/src/modals/IOModal/components/chatView/index.tsx
index b7d519daa..0a0fbd62f 100644
--- a/src/frontend/src/modals/IOModal/components/chatView/index.tsx
+++ b/src/frontend/src/modals/IOModal/components/chatView/index.tsx
@@ -77,10 +77,13 @@ export default function ChatView({
 
           const is_ai =
             sender === "Machine" || sender === null || sender === undefined;
+
           return {
             isSend: !is_ai,
             message:
-              ((message === "" || !message) && !stream_url) ? EMPTY_INPUT_SEND_MESSAGE : message,
+              (message === "" || !message) && !stream_url && files?.length === 0
+                ? EMPTY_INPUT_SEND_MESSAGE
+                : message,
             sender_name,
             componentId: output.id,
             stream_url: stream_url,