[Chat] Fix crash when inline image is deleted from another client (#4261)

Author: Leah-Xia-Microsoft

change/@azure-communication-react-32483e8f-0450-4198-898e-c34e3b62eedf.json

@@ -0,0 +1,9 @@
+{
+  "type": "none",
+  "area": "fix",
+  "workstream": "InlineImage",
+  "comment": "Fix crush when inline image is deleted from another client",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

packages/react-components/src/components/ImageOverlay.tsx

@@ -120,6 +120,7 @@ export const ImageOverlay = (props: ImageOverlayProps): JSX.Element => {
               aria-live={'polite'}
               /* @conditional-compile-remove(image-overlay) */
               aria-label={localeStrings.downloadButtonLabel}
+              disabled={imageSrc === ''}
             />
           )}
           {onDownloadButtonClicked && (
@@ -130,6 +131,7 @@ export const ImageOverlay = (props: ImageOverlayProps): JSX.Element => {
               /* @conditional-compile-remove(image-overlay) */
               aria-label={localeStrings.downloadButtonLabel}
               aria-live={'polite'}
+              disabled={imageSrc === ''}
             />
           )}
           <IconButton

packages/react-composites/src/composites/ChatComposite/ChatScreen.tsx

@@ -170,7 +170,10 @@ export const ChatScreen = (props: ChatScreenProps): JSX.Element => {
     if (overlayImageItem === undefined) {
       return;
     }
-    const message = adapter.getState().thread.chatMessages[overlayImageItem?.messageId];
+    const message = adapter.getState().thread.chatMessages[overlayImageItem.messageId];
+    if (message === undefined) {
+      return;
+    }
     const resourceCache = message.resourceCache;
     if (overlayImageItem.imageSrc === '' && resourceCache && resourceCache[overlayImageItem.imageUrl]) {
       const fullSizeImageSrc = getResourceSourceUrl(resourceCache[overlayImageItem.imageUrl]);