@@ -35,52 +35,6 @@ import { isVideoPackageAvailable } from '../../native';
3535import type { DefaultStreamChatGenerics } from '../../types/types' ;
3636import { getUrlWithoutParams } from '../../utils/utils' ;
3737
38- const styles = StyleSheet . create ( {
39- errorTextSize : { fontSize : 10 } ,
40- galleryContainer : {
41- borderTopLeftRadius : 13 ,
42- borderTopRightRadius : 13 ,
43- flexDirection : 'row' ,
44- flexWrap : 'wrap' ,
45- overflow : 'hidden' ,
46- } ,
47- imageContainer : {
48- alignItems : 'center' ,
49- display : 'flex' ,
50- flexDirection : 'row' ,
51- justifyContent : 'center' ,
52- padding : 1 ,
53- } ,
54- imageContainerStyle : { alignItems : 'center' , flex : 1 , justifyContent : 'center' } ,
55- imageLoadingErrorIndicatorStyle : {
56- bottom : 4 ,
57- left : 4 ,
58- position : 'absolute' ,
59- } ,
60- imageLoadingIndicatorContainer : {
61- height : '100%' ,
62- justifyContent : 'center' ,
63- position : 'absolute' ,
64- width : '100%' ,
65- } ,
66- imageLoadingIndicatorStyle : {
67- alignItems : 'center' ,
68- justifyContent : 'center' ,
69- position : 'absolute' ,
70- } ,
71- imageReloadContainerStyle : {
72- ...StyleSheet . absoluteFillObject ,
73- alignItems : 'center' ,
74- justifyContent : 'center' ,
75- } ,
76- moreImagesContainer : {
77- alignItems : 'center' ,
78- justifyContent : 'center' ,
79- margin : 1 ,
80- } ,
81- moreImagesText : { color : '#FFFFFF' , fontSize : 26 , fontWeight : '700' } ,
82- } ) ;
83-
8438export type GalleryPropsWithContext <
8539 StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics ,
8640> = Pick < ImageGalleryContextValue < StreamChatGenerics > , 'setSelectedMessage' | 'setMessages' > &
@@ -468,18 +422,19 @@ const GalleryImageThumbnail = <
468422
469423 const {
470424 theme : {
471- messageSimple : {
472- gallery : { image } ,
473- } ,
425+ messageSimple : { gallery } ,
474426 } ,
475427 } = useTheme ( ) ;
476428
477429 return (
478430 < View
479- style = { {
480- height : thumbnail . height - 1 ,
481- width : thumbnail . width - 1 ,
482- } }
431+ style = { [
432+ {
433+ height : thumbnail . height - 1 ,
434+ width : thumbnail . width - 1 ,
435+ } ,
436+ gallery . thumbnail ,
437+ ] }
483438 >
484439 { isLoadingImageError ? (
485440 < >
@@ -502,7 +457,7 @@ const GalleryImageThumbnail = <
502457 resizeMode = { thumbnail . resizeMode }
503458 style = { [
504459 borderRadius ,
505- image ,
460+ gallery . image ,
506461 {
507462 height : thumbnail . height - 1 ,
508463 width : thumbnail . width - 1 ,
@@ -680,4 +635,50 @@ export const Gallery = <
680635 ) ;
681636} ;
682637
638+ const styles = StyleSheet . create ( {
639+ errorTextSize : { fontSize : 10 } ,
640+ galleryContainer : {
641+ borderTopLeftRadius : 13 ,
642+ borderTopRightRadius : 13 ,
643+ flexDirection : 'row' ,
644+ flexWrap : 'wrap' ,
645+ overflow : 'hidden' ,
646+ } ,
647+ imageContainer : {
648+ alignItems : 'center' ,
649+ display : 'flex' ,
650+ flexDirection : 'row' ,
651+ justifyContent : 'center' ,
652+ padding : 1 ,
653+ } ,
654+ imageContainerStyle : { alignItems : 'center' , flex : 1 , justifyContent : 'center' } ,
655+ imageLoadingErrorIndicatorStyle : {
656+ bottom : 4 ,
657+ left : 4 ,
658+ position : 'absolute' ,
659+ } ,
660+ imageLoadingIndicatorContainer : {
661+ height : '100%' ,
662+ justifyContent : 'center' ,
663+ position : 'absolute' ,
664+ width : '100%' ,
665+ } ,
666+ imageLoadingIndicatorStyle : {
667+ alignItems : 'center' ,
668+ justifyContent : 'center' ,
669+ position : 'absolute' ,
670+ } ,
671+ imageReloadContainerStyle : {
672+ ...StyleSheet . absoluteFillObject ,
673+ alignItems : 'center' ,
674+ justifyContent : 'center' ,
675+ } ,
676+ moreImagesContainer : {
677+ alignItems : 'center' ,
678+ justifyContent : 'center' ,
679+ margin : 1 ,
680+ } ,
681+ moreImagesText : { color : '#FFFFFF' , fontSize : 26 , fontWeight : '700' } ,
682+ } ) ;
683+
683684Gallery . displayName = 'Gallery{messageSimple{gallery}}' ;
0 commit comments