[Chat] Fixing zoom on image in image gallery (#3515)

Azure · Aug 28, 2023 · 4079ed8 · 4079ed8
1 parent 3daf21d
commit 4079ed8
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 1 deletion.
diff --git a/change-beta/@azure-communication-react-646ceb27-0c16-41fe-a1dc-f20664ae90d6.json b/change-beta/@azure-communication-react-646ceb27-0c16-41fe-a1dc-f20664ae90d6.json
@@ -0,0 +1,9 @@
+{
+  "type": "none",
+  "area": "fix",
+  "workstream": "Image Gallery",
+  "comment": "Fix image gallery double click to use default behaviour",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}
diff --git a/change/@azure-communication-react-646ceb27-0c16-41fe-a1dc-f20664ae90d6.json b/change/@azure-communication-react-646ceb27-0c16-41fe-a1dc-f20664ae90d6.json
@@ -0,0 +1,9 @@
+{
+  "type": "none",
+  "area": "fix",
+  "workstream": "Image Gallery",
+  "comment": "Fix image gallery double click to use default behaviour",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}
diff --git a/packages/react-components/src/components/ImageGallery.tsx b/packages/react-components/src/components/ImageGallery.tsx
@@ -178,12 +178,15 @@ export const ImageGallery = (props: ImageGalleryProps): JSX.Element => {
             className={mergeStyles(imageStyle)}
             alt={image.altText || 'image'}
             aria-label={'image-gallery-main-image'}
+            aria-live={'polite'}
             onError={(event) => {
               setIsImageLoaded(false);
               onError && onError(event);
             }}
             onClick={(event) => event.stopPropagation()}
-            aria-live={'polite'}
+            onDoubleClick={(event) => {
+              event.persist();
+            }}
           />
         </FocusTrapZone>
       </Stack>