Merge pull request #280884 from vhuseinova-msft/vhuseinova/chat-sdk-attachment-code-sample-update

Updated `renderReceivedMessage` func in ChatSDK image attachments tutorial

Author: prmerger-automator[bot]

articles/communication-services/tutorials/chat-interop/includes/meeting-interop-features-file-attachment-javascript.md

@@ -233,27 +233,29 @@ First, inject an `image` tag into message content whenever there's an image atta
 
 ```js
 async function renderReceivedMessage(event) {
-    messages += '<div class="container lighter">' + event.message + '</div>';
+    messages += `<div class="container lighter"> ${event.message} </div>`;
     messagesContainer.innerHTML = messages;
-
+    console.log(event);
+    // Filter out inline images from attachments
+    const imageAttachments = event.attachments?.filter(
+        (attachment) =>
+        attachment.attachmentType === "image" && !messages.includes(attachment.id)
+    );
     // Inject image tag for all image attachments
-    var imageAttachmentHtml = event.attachments
-        .filter(attachment => attachment.attachmentType === "image" && !messages.includes(attachment.id))
-        .map(attachment => renderImageAttachments(attachment))
-        .join('');
+    var imageAttachmentHtml =
+        imageAttachments
+        .map((attachment) => renderImageAttachments(attachment))
+        .join("") ?? "";
     messagesContainer.innerHTML += imageAttachmentHtml;
 
-    // Get a list of attachments and calls renderFileAttachments to construct a file attachment card
-    var attachmentHtml = event.attachments
-        .filter(attachment => attachment.attachmentType === "file")
-        .map(attachment => renderFileAttachments(attachment))
-        .join('');
+    // Get list of attachments and calls renderFileAttachments to construct a file attachment card
+    var attachmentHtml =
+        event.attachments
+        ?.filter((attachment) => attachment.attachmentType === "file")
+        .map((attachment) => renderFileAttachments(attachment))
+        .join("") ?? "";
     messagesContainer.innerHTML += attachmentHtml;
 
-    // Filter out inline images from attachments
-    const imageAttachments = event.attachments.filter((attachment) =>
-        attachment.attachmentType === "image" && messages.includes(attachment.id));
-
     // Fetch and render preview images
     fetchPreviewImages(imageAttachments);
 }