fix: add borderRadius theme property for Gallery image (#2580)

Author: khushal87

package/src/components/Attachment/Gallery.tsx

@@ -289,7 +289,7 @@ const GalleryThumbnail = <
     theme: {
       colors: { overlay },
       messageSimple: {
-        gallery: { image, imageContainer, moreImagesContainer, moreImagesText },
+        gallery: { image, imageBorderRadius, imageContainer, moreImagesContainer, moreImagesText },
       },
     },
   } = useTheme();
@@ -366,7 +366,7 @@ const GalleryThumbnail = <
       {thumbnail.type === 'video' ? (
         <VideoThumbnail
           style={[
-            borderRadius,
+            imageBorderRadius ?? borderRadius,
             {
               height: thumbnail.height - 1,
               width: thumbnail.width - 1,
@@ -378,7 +378,7 @@ const GalleryThumbnail = <
       ) : (
         <View style={styles.imageContainerStyle}>
           <GalleryImageThumbnail
-            borderRadius={borderRadius}
+            borderRadius={imageBorderRadius ?? borderRadius}
             ImageLoadingFailedIndicator={ImageLoadingFailedIndicator}
             ImageLoadingIndicator={ImageLoadingIndicator}
             thumbnail={thumbnail}

package/src/contexts/themeContext/utils/theme.ts

@@ -499,6 +499,12 @@ export type Theme = {
       moreImagesContainer: ViewStyle;
       moreImagesText: TextStyle;
       thumbnail: ViewStyle;
+      imageBorderRadius?: {
+        borderBottomLeftRadius: number;
+        borderBottomRightRadius: number;
+        borderTopLeftRadius: number;
+        borderTopRightRadius: number;
+      };
     };
     giphy: {
       buttonContainer: ViewStyle;
@@ -1079,6 +1085,7 @@ export const defaultTheme: Theme = {
       gridHeight: 195,
       gridWidth: 256,
       image: {},
+      imageBorderRadius: undefined,
       imageContainer: {},
       maxHeight: 300,
       maxWidth: 256,