stream-chat-react-native-core 4.11.1-beta.4 → 4.12.0-beta.1

package/lib/module/components/ImageGallery/components/AnimatedGalleryVideo.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AnimatedGalleryVideo.tsx"],"names":["screenWidth","halfScreenWidth","oneEighth","styles","StyleSheet","create","activityIndicator","alignSelf","videoPlayer","height","width","AnimatedGalleryVideo","React","memo","props","opacity","setOpacity","handleEnd","handleLoad","handleProgress","index","offsetScale","paused","previous","scale","screenHeight","selected","shouldRender","source","style","translateX","translateY","videoRef","onLoadStart","onLoad","payload","onEnd","onProgress","data","onBuffer","isBuffering","onPlayBackStatusUpdate","playbackStatus","isLoaded","error","console","duration","durationMillis","isPlaying","currentTime","positionMillis","seekableDuration","didJustFinish","isLooping","animatedViewStyles","xScaleOffset","yScaleOffset","transform","value","scaleX","uri","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { StyleSheet, View, ViewStyle } from 'react-native';\nimport type { StyleProp } from 'react-native';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\nimport {\n  isVideoPackageAvailable,\n  PlaybackStatus,\n  Video,\n  VideoPayloadData,\n  VideoProgressData,\n  VideoType,\n} from '../../../native';\n\nimport { vw } from '../../../utils/utils';\nimport { Spinner } from '../../Spinner/Spinner';\n\nconst screenWidth = vw(100);\nconst halfScreenWidth = vw(50);\nconst oneEighth = 1 / 8;\n\ntype Props = {\n  handleEnd: () => void;\n  handleLoad: (payload: VideoPayloadData) => void;\n  handleProgress: (data: VideoProgressData) => void;\n  index: number;\n  offsetScale: Animated.SharedValue<number>;\n  paused: boolean;\n  previous: boolean;\n  scale: Animated.SharedValue<number>;\n  screenHeight: number;\n  selected: boolean;\n  shouldRender: boolean;\n  source: { uri: string };\n  translateX: Animated.SharedValue<number>;\n  translateY: Animated.SharedValue<number>;\n  videoRef: React.RefObject<VideoType>;\n  style?: StyleProp<ViewStyle>;\n};\n\nconst styles = StyleSheet.create({\n  activityIndicator: {\n    alignSelf: 'center',\n  },\n  videoPlayer: {\n    height: '100%',\n    width: '100%',\n  },\n});\n\nexport const AnimatedGalleryVideo: React.FC<Props> = React.memo(\n  (props) => {\n    const [opacity, setOpacity] = useState<number>(1);\n    const {\n      handleEnd,\n      handleLoad,\n      handleProgress,\n      index,\n      offsetScale,\n      paused,\n      previous,\n      scale,\n      screenHeight,\n      selected,\n      shouldRender,\n      source,\n      style,\n      translateX,\n      translateY,\n      videoRef,\n    } = props;\n\n    const onLoadStart = () => {\n      setOpacity(1);\n    };\n\n    const onLoad = (payload: VideoPayloadData) => {\n      setOpacity(0);\n      handleLoad(payload);\n    };\n\n    const onEnd = () => {\n      handleEnd();\n    };\n\n    const onProgress = (data: VideoProgressData) => {\n      handleProgress(data);\n    };\n\n    const onBuffer = ({ isBuffering }: { isBuffering: boolean }) => {\n      if (isBuffering) setOpacity(1);\n      else setOpacity(0);\n    };\n\n    const onPlayBackStatusUpdate = (playbackStatus: PlaybackStatus) => {\n      if (!playbackStatus.isLoaded) {\n        // Update your UI for the unloaded state\n        setOpacity(1);\n        if (playbackStatus.error) {\n          console.error(`Encountered a fatal error during playback: ${playbackStatus.error}`);\n        }\n      } else {\n        // Update your UI for the loaded state\n        setOpacity(0);\n        handleLoad({ duration: playbackStatus.durationMillis / 1000 });\n        if (playbackStatus.isPlaying) {\n          // Update your UI for the playing state\n          handleProgress({\n            currentTime: playbackStatus.positionMillis / 1000,\n            seekableDuration: playbackStatus.durationMillis / 1000,\n          });\n        }\n\n        if (playbackStatus.isBuffering) {\n          // Update your UI for the buffering state\n          setOpacity(1);\n        }\n\n        if (playbackStatus.didJustFinish && !playbackStatus.isLooping) {\n          // The player has just finished playing and will stop. Maybe you want to play something else?\n          handleEnd();\n        }\n      }\n    };\n\n    const animatedViewStyles = useAnimatedStyle<ViewStyle>(() => {\n      const xScaleOffset = -7 * screenWidth * (0.5 + index);\n      const yScaleOffset = -screenHeight * 3.5;\n      return {\n        transform: [\n          {\n            translateX: selected\n              ? translateX.value + xScaleOffset\n              : scale.value < 1 || scale.value !== offsetScale.value\n              ? xScaleOffset\n              : previous\n              ? translateX.value - halfScreenWidth * (scale.value - 1) + xScaleOffset\n              : translateX.value + halfScreenWidth * (scale.value - 1) + xScaleOffset,\n          },\n          {\n            translateY: selected ? translateY.value + yScaleOffset : yScaleOffset,\n          },\n          {\n            scale: selected ? scale.value / 8 : oneEighth,\n          },\n          { scaleX: -1 },\n        ],\n      };\n    }, [previous, selected]);\n\n    /**\n     * An empty view is rendered for images not close to the currently\n     * selected in order to maintain spacing while reducing the image\n     * load on memory.\n     */\n    if (!shouldRender) {\n      return <View style={[style, { transform: [{ scale: oneEighth }] }]} />;\n    }\n\n    return (\n      <Animated.View\n        style={[\n          style,\n          animatedViewStyles,\n          {\n            transform: [\n              { scaleX: -1 },\n              { translateY: -screenHeight * 3.5 },\n              {\n                translateX: -translateX.value + 7 * screenWidth * (0.5 + index),\n              },\n              { scale: oneEighth },\n            ],\n          },\n        ]}\n      >\n        {isVideoPackageAvailable() && (\n          <Video\n            onBuffer={onBuffer}\n            onEnd={onEnd}\n            onLoad={onLoad}\n            onLoadStart={onLoadStart}\n            onPlaybackStatusUpdate={onPlayBackStatusUpdate}\n            onProgress={onProgress}\n            paused={paused}\n            resizeMode='contain'\n            style={style}\n            uri={source.uri}\n            videoRef={videoRef}\n          />\n        )}\n        <Animated.View\n          style={[\n            styles.activityIndicator,\n            {\n              opacity,\n              transform: [\n                { scaleX: -1 },\n                { translateY: -screenHeight * 4 },\n                { scale: 1 / oneEighth },\n              ],\n            },\n          ]}\n        >\n          <Spinner height={40} width={40} />\n        </Animated.View>\n      </Animated.View>\n    );\n  },\n\n  (prevProps, nextProps) => {\n    if (\n      prevProps.paused === nextProps.paused &&\n      prevProps.shouldRender === nextProps.shouldRender &&\n      prevProps.source.uri === nextProps.source.uri &&\n      prevProps.screenHeight === nextProps.screenHeight &&\n      prevProps.selected === nextProps.selected &&\n      prevProps.previous === nextProps.previous &&\n      prevProps.index === nextProps.index\n    ) {\n      return true;\n    }\n    return false;\n  },\n);\n\nAnimatedGalleryVideo.displayName = 'AnimatedGalleryVideo';\n"]}
+{"version":3,"sources":["AnimatedGalleryVideo.tsx"],"names":["screenWidth","halfScreenWidth","oneEighth","styles","StyleSheet","create","activityIndicator","alignSelf","videoPlayer","height","width","AnimatedGalleryVideo","React","memo","props","opacity","setOpacity","handleEnd","handleLoad","handleProgress","index","offsetScale","paused","previous","scale","screenHeight","selected","shouldRender","source","style","translateX","translateY","videoRef","onLoadStart","onLoad","payload","onEnd","onProgress","data","onBuffer","isBuffering","onPlayBackStatusUpdate","playbackStatus","isLoaded","error","console","duration","durationMillis","isPlaying","currentTime","positionMillis","seekableDuration","didJustFinish","isLooping","animatedViewStyles","xScaleOffset","yScaleOffset","transform","value","scaleX","uri","prevProps","nextProps","displayName"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AASA;;AACA;;;;;;;;;AAEA,IAAMA,WAAW,GAAG,eAAG,GAAH,CAApB;AACA,IAAMC,eAAe,GAAG,eAAG,EAAH,CAAxB;AACA,IAAMC,SAAS,GAAG,IAAI,CAAtB;;AAqBA,IAAMC,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,iBAAiB,EAAE;AACjBC,IAAAA,SAAS,EAAE;AADM,GADY;AAI/BC,EAAAA,WAAW,EAAE;AACXC,IAAAA,MAAM,EAAE,MADG;AAEXC,IAAAA,KAAK,EAAE;AAFI;AAJkB,CAAlB,CAAf;;AAUO,IAAMC,oBAAwD,GAAGC,kBAAMC,IAAN,CACtE,UAACC,KAAD,EAAW;AACT,kBAA8B,qBAAiB,CAAjB,CAA9B;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBC,UAAhB;;AACA,MACEC,SADF,GAiBIH,KAjBJ,CACEG,SADF;AAAA,MAEEC,UAFF,GAiBIJ,KAjBJ,CAEEI,UAFF;AAAA,MAGEC,cAHF,GAiBIL,KAjBJ,CAGEK,cAHF;AAAA,MAIEC,KAJF,GAiBIN,KAjBJ,CAIEM,KAJF;AAAA,MAKEC,WALF,GAiBIP,KAjBJ,CAKEO,WALF;AAAA,MAMEC,MANF,GAiBIR,KAjBJ,CAMEQ,MANF;AAAA,MAOEC,QAPF,GAiBIT,KAjBJ,CAOES,QAPF;AAAA,MAQEC,KARF,GAiBIV,KAjBJ,CAQEU,KARF;AAAA,MASEC,YATF,GAiBIX,KAjBJ,CASEW,YATF;AAAA,MAUEC,QAVF,GAiBIZ,KAjBJ,CAUEY,QAVF;AAAA,MAWEC,YAXF,GAiBIb,KAjBJ,CAWEa,YAXF;AAAA,MAYEC,MAZF,GAiBId,KAjBJ,CAYEc,MAZF;AAAA,MAaEC,KAbF,GAiBIf,KAjBJ,CAaEe,KAbF;AAAA,MAcEC,UAdF,GAiBIhB,KAjBJ,CAcEgB,UAdF;AAAA,MAeEC,UAfF,GAiBIjB,KAjBJ,CAeEiB,UAfF;AAAA,MAgBEC,QAhBF,GAiBIlB,KAjBJ,CAgBEkB,QAhBF;;AAmBA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBjB,IAAAA,UAAU,CAAC,CAAD,CAAV;AACD,GAFD;;AAIA,MAAMkB,MAAM,GAAG,SAATA,MAAS,CAACC,OAAD,EAA+B;AAC5CnB,IAAAA,UAAU,CAAC,CAAD,CAAV;AACAE,IAAAA,UAAU,CAACiB,OAAD,CAAV;AACD,GAHD;;AAKA,MAAMC,KAAK,GAAG,SAARA,KAAQ,GAAM;AAClBnB,IAAAA,SAAS;AACV,GAFD;;AAIA,MAAMoB,UAAU,GAAG,SAAbA,UAAa,CAACC,IAAD,EAA6B;AAC9CnB,IAAAA,cAAc,CAACmB,IAAD,CAAd;AACD,GAFD;;AAIA,MAAMC,QAAQ,GAAG,SAAXA,QAAW,OAA+C;AAAA,QAA5CC,WAA4C,QAA5CA,WAA4C;AAC9D,QAAIA,WAAJ,EAAiBxB,UAAU,CAAC,CAAD,CAAV,CAAjB,KACKA,UAAU,CAAC,CAAD,CAAV;AACN,GAHD;;AAKA,MAAMyB,sBAAsB,GAAG,SAAzBA,sBAAyB,CAACC,cAAD,EAAoC;AACjE,QAAI,CAACA,cAAc,CAACC,QAApB,EAA8B;AAE5B3B,MAAAA,UAAU,CAAC,CAAD,CAAV;;AACA,UAAI0B,cAAc,CAACE,KAAnB,EAA0B;AACxBC,QAAAA,OAAO,CAACD,KAAR,iDAA4DF,cAAc,CAACE,KAA3E;AACD;AACF,KAND,MAMO;AAEL5B,MAAAA,UAAU,CAAC,CAAD,CAAV;AACAE,MAAAA,UAAU,CAAC;AAAE4B,QAAAA,QAAQ,EAAEJ,cAAc,CAACK,cAAf,GAAgC;AAA5C,OAAD,CAAV;;AACA,UAAIL,cAAc,CAACM,SAAnB,EAA8B;AAE5B7B,QAAAA,cAAc,CAAC;AACb8B,UAAAA,WAAW,EAAEP,cAAc,CAACQ,cAAf,GAAgC,IADhC;AAEbC,UAAAA,gBAAgB,EAAET,cAAc,CAACK,cAAf,GAAgC;AAFrC,SAAD,CAAd;AAID;;AAED,UAAIL,cAAc,CAACF,WAAnB,EAAgC;AAE9BxB,QAAAA,UAAU,CAAC,CAAD,CAAV;AACD;;AAED,UAAI0B,cAAc,CAACU,aAAf,IAAgC,CAACV,cAAc,CAACW,SAApD,EAA+D;AAE7DpC,QAAAA,SAAS;AACV;AACF;AACF,GA7BD;;AA+BA,MAAMqC,kBAAkB,GAAG,6CAA4B,YAAM;AAC3D,QAAMC,YAAY,GAAG,CAAC,CAAD,GAAKvD,WAAL,IAAoB,MAAMoB,KAA1B,CAArB;AACA,QAAMoC,YAAY,GAAG,CAAC/B,YAAD,GAAgB,GAArC;AACA,WAAO;AACLgC,MAAAA,SAAS,EAAE,CACT;AACE3B,QAAAA,UAAU,EAAEJ,QAAQ,GAChBI,UAAU,CAAC4B,KAAX,GAAmBH,YADH,GAEhB/B,KAAK,CAACkC,KAAN,GAAc,CAAd,IAAmBlC,KAAK,CAACkC,KAAN,KAAgBrC,WAAW,CAACqC,KAA/C,GACAH,YADA,GAEAhC,QAAQ,GACRO,UAAU,CAAC4B,KAAX,GAAmBzD,eAAe,IAAIuB,KAAK,CAACkC,KAAN,GAAc,CAAlB,CAAlC,GAAyDH,YADjD,GAERzB,UAAU,CAAC4B,KAAX,GAAmBzD,eAAe,IAAIuB,KAAK,CAACkC,KAAN,GAAc,CAAlB,CAAlC,GAAyDH;AAP/D,OADS,EAUT;AACExB,QAAAA,UAAU,EAAEL,QAAQ,GAAGK,UAAU,CAAC2B,KAAX,GAAmBF,YAAtB,GAAqCA;AAD3D,OAVS,EAaT;AACEhC,QAAAA,KAAK,EAAEE,QAAQ,GAAGF,KAAK,CAACkC,KAAN,GAAc,CAAjB,GAAqBxD;AADtC,OAbS,EAgBT;AAAEyD,QAAAA,MAAM,EAAE,CAAC;AAAX,OAhBS;AADN,KAAP;AAoBD,GAvB0B,EAuBxB,CAACpC,QAAD,EAAWG,QAAX,CAvBwB,CAA3B;;AA8BA,MAAI,CAACC,YAAL,EAAmB;AACjB,WACE,gCAAC,iBAAD;AACE,MAAA,kBAAkB,EAAC,0BADrB;AAEE,MAAA,KAAK,EAAE,CAACE,KAAD,EAAQ;AAAE4B,QAAAA,SAAS,EAAE,CAAC;AAAEjC,UAAAA,KAAK,EAAEtB;AAAT,SAAD;AAAb,OAAR,CAFT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MADF;AAMD;;AAED,SACE,gCAAC,iCAAD,CAAU,IAAV;AACE,IAAA,kBAAkB,EAAC,qBADrB;AAEE,IAAA,KAAK,EAAE,CACL2B,KADK,EAELyB,kBAFK,EAGL;AACEG,MAAAA,SAAS,EAAE,CACT;AAAEE,QAAAA,MAAM,EAAE,CAAC;AAAX,OADS,EAET;AAAE5B,QAAAA,UAAU,EAAE,CAACN,YAAD,GAAgB;AAA9B,OAFS,EAGT;AACEK,QAAAA,UAAU,EAAE,CAACA,UAAU,CAAC4B,KAAZ,GAAoB,IAAI1D,WAAJ,IAAmB,MAAMoB,KAAzB;AADlC,OAHS,EAMT;AAAEI,QAAAA,KAAK,EAAEtB;AAAT,OANS;AADb,KAHK,CAFT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAiBG,0CACC,gCAAC,aAAD;AACE,IAAA,QAAQ,EAAEqC,QADZ;AAEE,IAAA,KAAK,EAAEH,KAFT;AAGE,IAAA,MAAM,EAAEF,MAHV;AAIE,IAAA,WAAW,EAAED,WAJf;AAKE,IAAA,sBAAsB,EAAEQ,sBAL1B;AAME,IAAA,UAAU,EAAEJ,UANd;AAOE,IAAA,MAAM,EAAEf,MAPV;AAQE,IAAA,UAAU,EAAC,SARb;AASE,IAAA,KAAK,EAAEO,KATT;AAUE,IAAA,MAAM,EAAC,cAVT;AAWE,IAAA,GAAG,EAAED,MAAM,CAACgC,GAXd;AAYE,IAAA,QAAQ,EAAE5B,QAZZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAlBJ,EAiCE,gCAAC,iCAAD,CAAU,IAAV;AACE,IAAA,kBAAkB,EAAC,SADrB;AAEE,IAAA,KAAK,EAAE,CACL7B,MAAM,CAACG,iBADF,EAEL;AACES,MAAAA,OAAO,EAAPA,OADF;AAEE0C,MAAAA,SAAS,EAAE,CACT;AAAEE,QAAAA,MAAM,EAAE,CAAC;AAAX,OADS,EAET;AAAE5B,QAAAA,UAAU,EAAE,CAACN,YAAD,GAAgB;AAA9B,OAFS,EAGT;AAAED,QAAAA,KAAK,EAAE,IAAItB;AAAb,OAHS;AAFb,KAFK,CAFT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAcE,gCAAC,gBAAD;AAAS,IAAA,MAAM,EAAE,EAAjB;AAAqB,IAAA,KAAK,EAAE,EAA5B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAdF,CAjCF,CADF;AAoDD,CAtKqE,EAwKtE,UAAC2D,SAAD,EAAYC,SAAZ,EAA0B;AACxB,MACED,SAAS,CAACvC,MAAV,KAAqBwC,SAAS,CAACxC,MAA/B,IACAuC,SAAS,CAAClC,YAAV,KAA2BmC,SAAS,CAACnC,YADrC,IAEAkC,SAAS,CAACjC,MAAV,CAAiBgC,GAAjB,KAAyBE,SAAS,CAAClC,MAAV,CAAiBgC,GAF1C,IAGAC,SAAS,CAACpC,YAAV,KAA2BqC,SAAS,CAACrC,YAHrC,IAIAoC,SAAS,CAACnC,QAAV,KAAuBoC,SAAS,CAACpC,QAJjC,IAKAmC,SAAS,CAACtC,QAAV,KAAuBuC,SAAS,CAACvC,QALjC,IAMAsC,SAAS,CAACzC,KAAV,KAAoB0C,SAAS,CAAC1C,KAPhC,EAQE;AACA,WAAO,IAAP;AACD;;AACD,SAAO,KAAP;AACD,CArLqE,CAAjE;;;AAwLPT,oBAAoB,CAACoD,WAArB,GAAmC,sBAAnC","sourcesContent":["import React, { useState } from 'react';\nimport { StyleSheet, View, ViewStyle } from 'react-native';\nimport type { StyleProp } from 'react-native';\nimport Animated, { useAnimatedStyle } from 'react-native-reanimated';\n\nimport {\n  isVideoPackageAvailable,\n  PlaybackStatus,\n  Video,\n  VideoPayloadData,\n  VideoProgressData,\n  VideoType,\n} from '../../../native';\n\nimport { vw } from '../../../utils/utils';\nimport { Spinner } from '../../Spinner/Spinner';\n\nconst screenWidth = vw(100);\nconst halfScreenWidth = vw(50);\nconst oneEighth = 1 / 8;\n\nexport type AnimatedGalleryVideoType = {\n  handleEnd: () => void;\n  handleLoad: (payload: VideoPayloadData) => void;\n  handleProgress: (data: VideoProgressData) => void;\n  index: number;\n  offsetScale: Animated.SharedValue<number>;\n  paused: boolean;\n  previous: boolean;\n  scale: Animated.SharedValue<number>;\n  screenHeight: number;\n  selected: boolean;\n  shouldRender: boolean;\n  source: { uri: string };\n  translateX: Animated.SharedValue<number>;\n  translateY: Animated.SharedValue<number>;\n  videoRef: React.RefObject<VideoType>;\n  style?: StyleProp<ViewStyle>;\n};\n\nconst styles = StyleSheet.create({\n  activityIndicator: {\n    alignSelf: 'center',\n  },\n  videoPlayer: {\n    height: '100%',\n    width: '100%',\n  },\n});\n\nexport const AnimatedGalleryVideo: React.FC<AnimatedGalleryVideoType> = React.memo(\n  (props) => {\n    const [opacity, setOpacity] = useState<number>(1);\n    const {\n      handleEnd,\n      handleLoad,\n      handleProgress,\n      index,\n      offsetScale,\n      paused,\n      previous,\n      scale,\n      screenHeight,\n      selected,\n      shouldRender,\n      source,\n      style,\n      translateX,\n      translateY,\n      videoRef,\n    } = props;\n\n    const onLoadStart = () => {\n      setOpacity(1);\n    };\n\n    const onLoad = (payload: VideoPayloadData) => {\n      setOpacity(0);\n      handleLoad(payload);\n    };\n\n    const onEnd = () => {\n      handleEnd();\n    };\n\n    const onProgress = (data: VideoProgressData) => {\n      handleProgress(data);\n    };\n\n    const onBuffer = ({ isBuffering }: { isBuffering: boolean }) => {\n      if (isBuffering) setOpacity(1);\n      else setOpacity(0);\n    };\n\n    const onPlayBackStatusUpdate = (playbackStatus: PlaybackStatus) => {\n      if (!playbackStatus.isLoaded) {\n        // Update your UI for the unloaded state\n        setOpacity(1);\n        if (playbackStatus.error) {\n          console.error(`Encountered a fatal error during playback: ${playbackStatus.error}`);\n        }\n      } else {\n        // Update your UI for the loaded state\n        setOpacity(0);\n        handleLoad({ duration: playbackStatus.durationMillis / 1000 });\n        if (playbackStatus.isPlaying) {\n          // Update your UI for the playing state\n          handleProgress({\n            currentTime: playbackStatus.positionMillis / 1000,\n            seekableDuration: playbackStatus.durationMillis / 1000,\n          });\n        }\n\n        if (playbackStatus.isBuffering) {\n          // Update your UI for the buffering state\n          setOpacity(1);\n        }\n\n        if (playbackStatus.didJustFinish && !playbackStatus.isLooping) {\n          // The player has just finished playing and will stop. Maybe you want to play something else?\n          handleEnd();\n        }\n      }\n    };\n\n    const animatedViewStyles = useAnimatedStyle<ViewStyle>(() => {\n      const xScaleOffset = -7 * screenWidth * (0.5 + index);\n      const yScaleOffset = -screenHeight * 3.5;\n      return {\n        transform: [\n          {\n            translateX: selected\n              ? translateX.value + xScaleOffset\n              : scale.value < 1 || scale.value !== offsetScale.value\n              ? xScaleOffset\n              : previous\n              ? translateX.value - halfScreenWidth * (scale.value - 1) + xScaleOffset\n              : translateX.value + halfScreenWidth * (scale.value - 1) + xScaleOffset,\n          },\n          {\n            translateY: selected ? translateY.value + yScaleOffset : yScaleOffset,\n          },\n          {\n            scale: selected ? scale.value / 8 : oneEighth,\n          },\n          { scaleX: -1 },\n        ],\n      };\n    }, [previous, selected]);\n\n    /**\n     * An empty view is rendered for images not close to the currently\n     * selected in order to maintain spacing while reducing the image\n     * load on memory.\n     */\n    if (!shouldRender) {\n      return (\n        <View\n          accessibilityLabel='Empty View Image Gallery'\n          style={[style, { transform: [{ scale: oneEighth }] }]}\n        />\n      );\n    }\n\n    return (\n      <Animated.View\n        accessibilityLabel='Image Gallery Video'\n        style={[\n          style,\n          animatedViewStyles,\n          {\n            transform: [\n              { scaleX: -1 },\n              { translateY: -screenHeight * 3.5 },\n              {\n                translateX: -translateX.value + 7 * screenWidth * (0.5 + index),\n              },\n              { scale: oneEighth },\n            ],\n          },\n        ]}\n      >\n        {isVideoPackageAvailable() && (\n          <Video\n            onBuffer={onBuffer}\n            onEnd={onEnd}\n            onLoad={onLoad}\n            onLoadStart={onLoadStart}\n            onPlaybackStatusUpdate={onPlayBackStatusUpdate}\n            onProgress={onProgress}\n            paused={paused}\n            resizeMode='contain'\n            style={style}\n            testID='video-player'\n            uri={source.uri}\n            videoRef={videoRef}\n          />\n        )}\n        <Animated.View\n          accessibilityLabel='Spinner'\n          style={[\n            styles.activityIndicator,\n            {\n              opacity,\n              transform: [\n                { scaleX: -1 },\n                { translateY: -screenHeight * 4 },\n                { scale: 1 / oneEighth },\n              ],\n            },\n          ]}\n        >\n          <Spinner height={40} width={40} />\n        </Animated.View>\n      </Animated.View>\n    );\n  },\n\n  (prevProps, nextProps) => {\n    if (\n      prevProps.paused === nextProps.paused &&\n      prevProps.shouldRender === nextProps.shouldRender &&\n      prevProps.source.uri === nextProps.source.uri &&\n      prevProps.screenHeight === nextProps.screenHeight &&\n      prevProps.selected === nextProps.selected &&\n      prevProps.previous === nextProps.previous &&\n      prevProps.index === nextProps.index\n    ) {\n      return true;\n    }\n    return false;\n  },\n);\n\nAnimatedGalleryVideo.displayName = 'AnimatedGalleryVideo';\n"]}

package/lib/module/components/ImageGallery/components/ImageGalleryFooter.js

@@ -73,7 +73,8 @@ var styles = _reactNative.StyleSheet.create({
 });
 
 var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props) {
-  var centerElement = props.centerElement,
+  var accessibilityLabel = props.accessibilityLabel,
+      centerElement = props.centerElement,
       duration = props.duration,
       GridIcon = props.GridIcon,
       leftElement = props.leftElement,
@@ -183,6 +184,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
   }();
 
   return _react["default"].createElement(_reactNativeReanimated["default"].View, {
+    accessibilityLabel: accessibilityLabel,
     onLayout: function onLayout(event) {
       return setHeight(event.nativeEvent.layout.height);
     },
@@ -191,7 +193,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 184,
+      lineNumber: 186,
       columnNumber: 5
     }
   }, _react["default"].createElement(ReanimatedSafeAreaView, {
@@ -201,7 +203,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 189,
+      lineNumber: 192,
       columnNumber: 7
     }
   }, photo.type === 'video' ? videoControlElement ? videoControlElement({
@@ -219,7 +221,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 194,
+      lineNumber: 197,
       columnNumber: 13
     }
   }) : null, _react["default"].createElement(_reactNative.View, {
@@ -229,7 +231,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 203,
+      lineNumber: 206,
       columnNumber: 9
     }
   }, leftElement ? leftElement({
@@ -238,12 +240,13 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     share: share,
     shareMenuOpen: shareMenuOpen
   }) : _react["default"].createElement(_reactNative.TouchableOpacity, {
+    accessibilityLabel: "Share Button",
     disabled: shareMenuOpen,
     onPress: share,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 207,
+      lineNumber: 210,
       columnNumber: 13
     }
   }, _react["default"].createElement(_reactNative.View, {
@@ -251,7 +254,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 208,
+      lineNumber: 215,
       columnNumber: 15
     }
   }, ShareIcon ? ShareIcon : _react["default"].createElement(_icons.Share, {
@@ -259,7 +262,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 209,
+      lineNumber: 216,
       columnNumber: 42
     }
   }))), centerElement ? centerElement({
@@ -272,7 +275,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 216,
+      lineNumber: 223,
       columnNumber: 13
     }
   }, _react["default"].createElement(_reactNative.Text, {
@@ -282,7 +285,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 217,
+      lineNumber: 224,
       columnNumber: 15
     }
   }, t('{{ index }} of {{ photoLength }}', {
@@ -298,7 +301,7 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 228,
+      lineNumber: 235,
       columnNumber: 13
     }
   }, _react["default"].createElement(_reactNative.View, {
@@ -306,14 +309,14 @@ var ImageGalleryFooterWithContext = function ImageGalleryFooterWithContext(props
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 229,
+      lineNumber: 236,
       columnNumber: 15
     }
   }, GridIcon ? GridIcon : _react["default"].createElement(_icons.Grid, {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 230,
+      lineNumber: 237,
       columnNumber: 40
     }
   }))))));
@@ -348,7 +351,7 @@ var ImageGalleryFooter = function ImageGalleryFooter(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 285,
+      lineNumber: 292,
       columnNumber: 6
     }
   }));

package/lib/module/components/ImageGallery/components/ImageGalleryFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryFooter.tsx"],"names":["ReanimatedSafeAreaView","Animated","createAnimatedComponent","SafeAreaView","styles","StyleSheet","create","centerContainer","alignItems","flex","justifyContent","imageCountText","fontSize","fontWeight","innerContainer","flexDirection","height","leftContainer","marginLeft","rightContainer","marginRight","wrapper","bottom","left","position","right","ImageGalleryFooterWithContext","props","centerElement","duration","GridIcon","leftElement","onPlayPause","onProgressDrag","opacity","openGridView","paused","photo","photoLength","progress","rightElement","selectedIndex","ShareIcon","videoControlElement","visible","setHeight","shareMenuOpen","setShareMenuOpen","theme","colors","black","white","imageGallery","footer","container","t","footerStyle","value","transform","translateY","Extrapolate","CLAMP","share","extension","mime_type","split","fileName","user","id","messageId","fromUrl","uri","localFile","type","url","console","log","event","nativeEvent","layout","backgroundColor","color","index","areEqual","prevProps","nextProps","prevDuration","prevPaused","prevProgress","prevSelectedIndex","nextDuration","nextPaused","nextProgress","nextSelectedIndex","isDurationEqual","isPausedEqual","isProgressEqual","isSelectedIndexEqual","MemoizedImageGalleryFooter","React","memo","ImageGalleryFooter","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { SafeAreaView, StyleSheet, Text, TouchableOpacity, View, ViewStyle } from 'react-native';\nimport Animated, { Extrapolate, interpolate, useAnimatedStyle } from 'react-native-reanimated';\n\nimport { ImageGalleryVideoControl } from './ImageGalleryVideoControl';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';\nimport { Grid as GridIconDefault, Share as ShareIconDefault } from '../../../icons';\nimport { deleteFile, saveFile, shareImage } from '../../../native';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport type { Photo } from '../ImageGallery';\n\nconst ReanimatedSafeAreaView = Animated.createAnimatedComponent\n  ? Animated.createAnimatedComponent(SafeAreaView)\n  : SafeAreaView;\n\nconst styles = StyleSheet.create({\n  centerContainer: {\n    alignItems: 'center',\n    flex: 1,\n    justifyContent: 'center',\n  },\n  imageCountText: {\n    fontSize: 16,\n    fontWeight: '600',\n  },\n  innerContainer: {\n    flexDirection: 'row',\n    height: 56,\n  },\n  leftContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginLeft: 8,\n  },\n  rightContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginRight: 8,\n  },\n  wrapper: {\n    bottom: 0,\n    left: 0,\n    position: 'absolute',\n    right: 0,\n  },\n});\n\nexport type ImageGalleryFooterCustomComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  openGridView,\n  photo,\n  share,\n  shareMenuOpen,\n}: {\n  openGridView: () => void;\n  share: () => Promise<void>;\n  shareMenuOpen: boolean;\n  photo?: Photo<StreamChatGenerics>;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryFooterVideoControlProps = {\n  duration: number;\n  onPlayPause: () => void;\n  onProgressDrag: (progress: number) => void;\n  paused: boolean;\n  progress: number;\n};\n\nexport type ImageGalleryFooterVideoControlComponent = ({\n  duration,\n  onPlayPause,\n  onProgressDrag,\n  paused,\n  progress,\n}: ImageGalleryFooterVideoControlProps) => React.ReactElement | null;\n\nexport type ImageGalleryFooterCustomComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  centerElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  GridIcon?: React.ReactElement;\n  leftElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  rightElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  ShareIcon?: React.ReactElement;\n  videoControlElement?: ImageGalleryFooterVideoControlComponent;\n};\n\ntype ImageGalleryFooterPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryFooterCustomComponentProps<StreamChatGenerics> & {\n  duration: number;\n  onPlayPause: () => void;\n  onProgressDrag: (progress: number) => void;\n  opacity: Animated.SharedValue<number>;\n  openGridView: () => void;\n  paused: boolean;\n  photo: Photo<StreamChatGenerics>;\n  photoLength: number;\n  progress: number;\n  selectedIndex: number;\n  visible: Animated.SharedValue<number>;\n};\n\nexport const ImageGalleryFooterWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    centerElement,\n    duration,\n    GridIcon,\n    leftElement,\n    onPlayPause,\n    onProgressDrag,\n    opacity,\n    openGridView,\n    paused,\n    photo,\n    photoLength,\n    progress,\n    rightElement,\n    selectedIndex,\n    ShareIcon,\n    videoControlElement,\n    visible,\n  } = props;\n\n  const [height, setHeight] = useState(200);\n  const [shareMenuOpen, setShareMenuOpen] = useState(false);\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        footer: {\n          centerContainer,\n          container,\n          imageCountText,\n          innerContainer,\n          leftContainer,\n          rightContainer,\n        },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  const footerStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: opacity.value,\n      transform: [\n        {\n          translateY: interpolate(visible.value, [0, 1], [height, 0], Extrapolate.CLAMP),\n        },\n      ],\n    }),\n    [height],\n  );\n\n  const share = async () => {\n    setShareMenuOpen(true);\n    try {\n      const extension = photo.mime_type?.split('/')[1] || 'jpg';\n      const localFile = await saveFile({\n        fileName: `${photo.user?.id || 'ChatPhoto'}-${\n          photo.messageId\n        }-${selectedIndex}.${extension}`,\n        fromUrl: photo.uri,\n      });\n      // `image/jpeg` is added for the case where the mime_type isn't available for a file/image\n      await shareImage({ type: photo.mime_type || 'image/jpeg', url: localFile });\n      await deleteFile({ uri: localFile });\n    } catch (error) {\n      console.log(error);\n    }\n    setShareMenuOpen(false);\n  };\n\n  return (\n    <Animated.View\n      onLayout={(event) => setHeight(event.nativeEvent.layout.height)}\n      pointerEvents={'box-none'}\n      style={styles.wrapper}\n    >\n      <ReanimatedSafeAreaView style={[container, footerStyle, { backgroundColor: white }]}>\n        {photo.type === 'video' ? (\n          videoControlElement ? (\n            videoControlElement({ duration, onPlayPause, onProgressDrag, paused, progress })\n          ) : (\n            <ImageGalleryVideoControl\n              duration={duration}\n              onPlayPause={onPlayPause}\n              onProgressDrag={onProgressDrag}\n              paused={paused}\n              progress={progress}\n            />\n          )\n        ) : null}\n        <View style={[styles.innerContainer, innerContainer, { backgroundColor: white }]}>\n          {leftElement ? (\n            leftElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <TouchableOpacity disabled={shareMenuOpen} onPress={share}>\n              <View style={[styles.leftContainer, leftContainer]}>\n                {ShareIcon ? ShareIcon : <ShareIconDefault pathFill={black} />}\n              </View>\n            </TouchableOpacity>\n          )}\n          {centerElement ? (\n            centerElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <View style={[styles.centerContainer, centerContainer]}>\n              <Text style={[styles.imageCountText, { color: black }, imageCountText]}>\n                {t('{{ index }} of {{ photoLength }}', {\n                  index: photoLength - selectedIndex,\n                  photoLength,\n                })}\n              </Text>\n            </View>\n          )}\n          {rightElement ? (\n            rightElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <TouchableOpacity onPress={openGridView}>\n              <View style={[styles.rightContainer, rightContainer]}>\n                {GridIcon ? GridIcon : <GridIconDefault />}\n              </View>\n            </TouchableOpacity>\n          )}\n        </View>\n      </ReanimatedSafeAreaView>\n    </Animated.View>\n  );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n  nextProps: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    duration: prevDuration,\n    paused: prevPaused,\n    progress: prevProgress,\n    selectedIndex: prevSelectedIndex,\n  } = prevProps;\n  const {\n    duration: nextDuration,\n    paused: nextPaused,\n    progress: nextProgress,\n    selectedIndex: nextSelectedIndex,\n  } = nextProps;\n\n  const isDurationEqual = prevDuration === nextDuration;\n  if (!isDurationEqual) return false;\n\n  const isPausedEqual = prevPaused === nextPaused;\n  if (!isPausedEqual) return false;\n\n  const isProgressEqual = prevProgress === nextProgress;\n  if (!isProgressEqual) return false;\n\n  const isSelectedIndexEqual = prevSelectedIndex === nextSelectedIndex;\n  if (!isSelectedIndexEqual) return false;\n\n  return true;\n};\n\nconst MemoizedImageGalleryFooter = React.memo(\n  ImageGalleryFooterWithContext,\n  areEqual,\n) as typeof ImageGalleryFooterWithContext;\n\nexport type ImageGalleryFooterProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryFooterPropsWithContext<StreamChatGenerics>;\n\nexport const ImageGalleryFooter = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGalleryFooterProps<StreamChatGenerics>,\n) => <MemoizedImageGalleryFooter {...props} />;\n\nImageGalleryFooter.displayName = 'ImageGalleryFooter{imageGallery{footer}}';\n"]}
+{"version":3,"sources":["ImageGalleryFooter.tsx"],"names":["ReanimatedSafeAreaView","Animated","createAnimatedComponent","SafeAreaView","styles","StyleSheet","create","centerContainer","alignItems","flex","justifyContent","imageCountText","fontSize","fontWeight","innerContainer","flexDirection","height","leftContainer","marginLeft","rightContainer","marginRight","wrapper","bottom","left","position","right","ImageGalleryFooterWithContext","props","accessibilityLabel","centerElement","duration","GridIcon","leftElement","onPlayPause","onProgressDrag","opacity","openGridView","paused","photo","photoLength","progress","rightElement","selectedIndex","ShareIcon","videoControlElement","visible","setHeight","shareMenuOpen","setShareMenuOpen","theme","colors","black","white","imageGallery","footer","container","t","footerStyle","value","transform","translateY","Extrapolate","CLAMP","share","extension","mime_type","split","fileName","user","id","messageId","fromUrl","uri","localFile","type","url","console","log","event","nativeEvent","layout","backgroundColor","color","index","areEqual","prevProps","nextProps","prevDuration","prevPaused","prevProgress","prevSelectedIndex","nextDuration","nextPaused","nextProgress","nextSelectedIndex","isDurationEqual","isPausedEqual","isProgressEqual","isSelectedIndexEqual","MemoizedImageGalleryFooter","React","memo","ImageGalleryFooter","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport { SafeAreaView, StyleSheet, Text, TouchableOpacity, View, ViewStyle } from 'react-native';\nimport Animated, { Extrapolate, interpolate, useAnimatedStyle } from 'react-native-reanimated';\n\nimport { ImageGalleryVideoControl } from './ImageGalleryVideoControl';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';\nimport { Grid as GridIconDefault, Share as ShareIconDefault } from '../../../icons';\nimport { deleteFile, saveFile, shareImage } from '../../../native';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport type { Photo } from '../ImageGallery';\n\nconst ReanimatedSafeAreaView = Animated.createAnimatedComponent\n  ? Animated.createAnimatedComponent(SafeAreaView)\n  : SafeAreaView;\n\nconst styles = StyleSheet.create({\n  centerContainer: {\n    alignItems: 'center',\n    flex: 1,\n    justifyContent: 'center',\n  },\n  imageCountText: {\n    fontSize: 16,\n    fontWeight: '600',\n  },\n  innerContainer: {\n    flexDirection: 'row',\n    height: 56,\n  },\n  leftContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginLeft: 8,\n  },\n  rightContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginRight: 8,\n  },\n  wrapper: {\n    bottom: 0,\n    left: 0,\n    position: 'absolute',\n    right: 0,\n  },\n});\n\nexport type ImageGalleryFooterCustomComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  openGridView,\n  photo,\n  share,\n  shareMenuOpen,\n}: {\n  openGridView: () => void;\n  share: () => Promise<void>;\n  shareMenuOpen: boolean;\n  photo?: Photo<StreamChatGenerics>;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryFooterVideoControlProps = {\n  duration: number;\n  onPlayPause: (status?: boolean) => void;\n  onProgressDrag: (progress: number) => void;\n  paused: boolean;\n  progress: number;\n};\n\nexport type ImageGalleryFooterVideoControlComponent = ({\n  duration,\n  onPlayPause,\n  onProgressDrag,\n  paused,\n  progress,\n}: ImageGalleryFooterVideoControlProps) => React.ReactElement | null;\n\nexport type ImageGalleryFooterCustomComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  centerElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  GridIcon?: React.ReactElement;\n  leftElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  rightElement?: ImageGalleryFooterCustomComponent<StreamChatGenerics>;\n  ShareIcon?: React.ReactElement;\n  videoControlElement?: ImageGalleryFooterVideoControlComponent;\n};\n\ntype ImageGalleryFooterPropsWithContext<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryFooterCustomComponentProps<StreamChatGenerics> & {\n  accessibilityLabel: string;\n  duration: number;\n  onPlayPause: () => void;\n  onProgressDrag: (progress: number) => void;\n  opacity: Animated.SharedValue<number>;\n  openGridView: () => void;\n  paused: boolean;\n  photo: Photo<StreamChatGenerics>;\n  photoLength: number;\n  progress: number;\n  selectedIndex: number;\n  visible: Animated.SharedValue<number>;\n};\n\nexport const ImageGalleryFooterWithContext = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    accessibilityLabel,\n    centerElement,\n    duration,\n    GridIcon,\n    leftElement,\n    onPlayPause,\n    onProgressDrag,\n    opacity,\n    openGridView,\n    paused,\n    photo,\n    photoLength,\n    progress,\n    rightElement,\n    selectedIndex,\n    ShareIcon,\n    videoControlElement,\n    visible,\n  } = props;\n\n  const [height, setHeight] = useState(200);\n  const [shareMenuOpen, setShareMenuOpen] = useState(false);\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        footer: {\n          centerContainer,\n          container,\n          imageCountText,\n          innerContainer,\n          leftContainer,\n          rightContainer,\n        },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  const footerStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: opacity.value,\n      transform: [\n        {\n          translateY: interpolate(visible.value, [0, 1], [height, 0], Extrapolate.CLAMP),\n        },\n      ],\n    }),\n    [height],\n  );\n\n  const share = async () => {\n    setShareMenuOpen(true);\n    try {\n      const extension = photo.mime_type?.split('/')[1] || 'jpg';\n      const localFile = await saveFile({\n        fileName: `${photo.user?.id || 'ChatPhoto'}-${\n          photo.messageId\n        }-${selectedIndex}.${extension}`,\n        fromUrl: photo.uri,\n      });\n      // `image/jpeg` is added for the case where the mime_type isn't available for a file/image\n      await shareImage({ type: photo.mime_type || 'image/jpeg', url: localFile });\n      await deleteFile({ uri: localFile });\n    } catch (error) {\n      console.log(error);\n    }\n    setShareMenuOpen(false);\n  };\n\n  return (\n    <Animated.View\n      accessibilityLabel={accessibilityLabel}\n      onLayout={(event) => setHeight(event.nativeEvent.layout.height)}\n      pointerEvents={'box-none'}\n      style={styles.wrapper}\n    >\n      <ReanimatedSafeAreaView style={[container, footerStyle, { backgroundColor: white }]}>\n        {photo.type === 'video' ? (\n          videoControlElement ? (\n            videoControlElement({ duration, onPlayPause, onProgressDrag, paused, progress })\n          ) : (\n            <ImageGalleryVideoControl\n              duration={duration}\n              onPlayPause={onPlayPause}\n              onProgressDrag={onProgressDrag}\n              paused={paused}\n              progress={progress}\n            />\n          )\n        ) : null}\n        <View style={[styles.innerContainer, innerContainer, { backgroundColor: white }]}>\n          {leftElement ? (\n            leftElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <TouchableOpacity\n              accessibilityLabel='Share Button'\n              disabled={shareMenuOpen}\n              onPress={share}\n            >\n              <View style={[styles.leftContainer, leftContainer]}>\n                {ShareIcon ? ShareIcon : <ShareIconDefault pathFill={black} />}\n              </View>\n            </TouchableOpacity>\n          )}\n          {centerElement ? (\n            centerElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <View style={[styles.centerContainer, centerContainer]}>\n              <Text style={[styles.imageCountText, { color: black }, imageCountText]}>\n                {t('{{ index }} of {{ photoLength }}', {\n                  index: photoLength - selectedIndex,\n                  photoLength,\n                })}\n              </Text>\n            </View>\n          )}\n          {rightElement ? (\n            rightElement({ openGridView, photo, share, shareMenuOpen })\n          ) : (\n            <TouchableOpacity onPress={openGridView}>\n              <View style={[styles.rightContainer, rightContainer]}>\n                {GridIcon ? GridIcon : <GridIconDefault />}\n              </View>\n            </TouchableOpacity>\n          )}\n        </View>\n      </ReanimatedSafeAreaView>\n    </Animated.View>\n  );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n  prevProps: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n  nextProps: ImageGalleryFooterPropsWithContext<StreamChatGenerics>,\n) => {\n  const {\n    duration: prevDuration,\n    paused: prevPaused,\n    progress: prevProgress,\n    selectedIndex: prevSelectedIndex,\n  } = prevProps;\n  const {\n    duration: nextDuration,\n    paused: nextPaused,\n    progress: nextProgress,\n    selectedIndex: nextSelectedIndex,\n  } = nextProps;\n\n  const isDurationEqual = prevDuration === nextDuration;\n  if (!isDurationEqual) return false;\n\n  const isPausedEqual = prevPaused === nextPaused;\n  if (!isPausedEqual) return false;\n\n  const isProgressEqual = prevProgress === nextProgress;\n  if (!isProgressEqual) return false;\n\n  const isSelectedIndexEqual = prevSelectedIndex === nextSelectedIndex;\n  if (!isSelectedIndexEqual) return false;\n\n  return true;\n};\n\nconst MemoizedImageGalleryFooter = React.memo(\n  ImageGalleryFooterWithContext,\n  areEqual,\n) as typeof ImageGalleryFooterWithContext;\n\nexport type ImageGalleryFooterProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryFooterPropsWithContext<StreamChatGenerics>;\n\nexport const ImageGalleryFooter = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGalleryFooterProps<StreamChatGenerics>,\n) => <MemoizedImageGalleryFooter {...props} />;\n\nImageGalleryFooter.displayName = 'ImageGalleryFooter{imageGallery{footer}}';\n"]}

package/lib/module/components/ImageGallery/components/ImageGalleryHeader.js

@@ -169,6 +169,7 @@ var ImageGalleryHeader = function ImageGalleryHeader(props) {
     hideOverlay: hideOverlay,
     photo: photo
   }) : _react["default"].createElement(_reactNative.TouchableOpacity, {
+    accessibilityLabel: "Hide Overlay",
     onPress: hideOverlay,
     __self: _this,
     __source: {

package/lib/module/components/ImageGallery/components/ImageGalleryHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryHeader.tsx"],"names":["ReanimatedSafeAreaView","Animated","createAnimatedComponent","SafeAreaView","styles","StyleSheet","create","centerContainer","alignItems","flex","justifyContent","date","fontSize","fontWeight","marginTop","opacity","innerContainer","flexDirection","height","leftContainer","marginLeft","rightContainer","marginRight","width","userName","ImageGalleryHeader","props","centerElement","CloseIcon","leftElement","photo","rightElement","visible","setHeight","theme","colors","black","white","imageGallery","header","container","dateText","usernameText","t","tDateTimeParser","setOverlay","translucentStatusBar","parsedDate","created_at","getDateObject","calendar","fromNow","headerStyle","value","transform","translateY","Extrapolate","CLAMP","androidTranslucentHeaderStyle","paddingTop","Platform","OS","StatusBar","currentHeight","undefined","hideOverlay","event","nativeEvent","layout","backgroundColor","color","user","name","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport {\n  Platform,\n  SafeAreaView,\n  StatusBar,\n  StyleSheet,\n  Text,\n  TouchableOpacity,\n  View,\n  ViewStyle,\n} from 'react-native';\nimport Animated, { Extrapolate, interpolate, useAnimatedStyle } from 'react-native-reanimated';\n\nimport { useOverlayContext } from '../../../contexts/overlayContext/OverlayContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport {\n  isDayOrMoment,\n  TDateTimeParserOutput,\n  useTranslationContext,\n} from '../../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../../icons';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport type { Photo } from '../ImageGallery';\n\nconst ReanimatedSafeAreaView = Animated.createAnimatedComponent\n  ? Animated.createAnimatedComponent(SafeAreaView)\n  : SafeAreaView;\n\nconst styles = StyleSheet.create({\n  centerContainer: {\n    alignItems: 'center',\n    flex: 1,\n    justifyContent: 'center',\n  },\n  date: {\n    fontSize: 12,\n    fontWeight: '500',\n    marginTop: 4,\n    opacity: 0.5,\n  },\n  innerContainer: {\n    flexDirection: 'row',\n    height: 56,\n  },\n  leftContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginLeft: 8,\n  },\n  rightContainer: {\n    marginRight: 8,\n    width: 24, // Width of icon currently on left\n  },\n  userName: {\n    fontSize: 16,\n    fontWeight: '700',\n  },\n});\n\nexport type ImageGalleryHeaderCustomComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  hideOverlay,\n  photo,\n}: {\n  hideOverlay: () => void;\n  photo?: Photo<StreamChatGenerics>;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryHeaderCustomComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  centerElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n  CloseIcon?: React.ReactElement;\n  leftElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n  rightElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n};\n\ntype Props<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  ImageGalleryHeaderCustomComponentProps<StreamChatGenerics> & {\n    opacity: Animated.SharedValue<number>;\n    visible: Animated.SharedValue<number>;\n    photo?: Photo<StreamChatGenerics>;\n  };\n\nexport const ImageGalleryHeader = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: Props<StreamChatGenerics>,\n) => {\n  const { centerElement, CloseIcon, leftElement, opacity, photo, rightElement, visible } = props;\n  const [height, setHeight] = useState(200);\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        header: {\n          centerContainer,\n          container,\n          dateText,\n          innerContainer,\n          leftContainer,\n          rightContainer,\n          usernameText,\n        },\n      },\n    },\n  } = useTheme();\n  const { t, tDateTimeParser } = useTranslationContext();\n  const { setOverlay, translucentStatusBar } = useOverlayContext();\n\n  const parsedDate = photo ? tDateTimeParser(photo?.created_at) : null;\n\n  /**\n   * .calendar and .fromNow can be initialized after the first render,\n   * and attempting to access them at that time will cause an error\n   * to be thrown.\n   *\n   * This falls back to null if neither exist.\n   */\n  const getDateObject = (date: TDateTimeParserOutput | null) => {\n    if (date === null || !isDayOrMoment(date)) {\n      return null;\n    }\n\n    if (date.calendar) {\n      return date.calendar();\n    }\n\n    if (date.fromNow) {\n      return date.fromNow();\n    }\n\n    return null;\n  };\n\n  const date = getDateObject(parsedDate);\n\n  const headerStyle = useAnimatedStyle<ViewStyle>(() => ({\n    opacity: opacity.value,\n    transform: [\n      {\n        translateY: interpolate(visible.value, [0, 1], [-height, 0], Extrapolate.CLAMP),\n      },\n    ],\n  }));\n\n  const androidTranslucentHeaderStyle = {\n    paddingTop:\n      Platform.OS === 'android' && translucentStatusBar ? StatusBar.currentHeight : undefined,\n  };\n\n  const hideOverlay = () => {\n    setOverlay('none');\n  };\n\n  return (\n    <View\n      onLayout={(event) => setHeight(event.nativeEvent.layout.height)}\n      pointerEvents={'box-none'}\n    >\n      <ReanimatedSafeAreaView\n        style={[{ backgroundColor: white }, androidTranslucentHeaderStyle, container, headerStyle]}\n      >\n        <View style={[styles.innerContainer, innerContainer]}>\n          {leftElement ? (\n            leftElement({ hideOverlay, photo })\n          ) : (\n            <TouchableOpacity onPress={hideOverlay}>\n              <View style={[styles.leftContainer, leftContainer]}>\n                {CloseIcon ? CloseIcon : <Close />}\n              </View>\n            </TouchableOpacity>\n          )}\n          {centerElement ? (\n            centerElement({ hideOverlay, photo })\n          ) : (\n            <View style={[styles.centerContainer, centerContainer]}>\n              <Text style={[styles.userName, { color: black }, usernameText]}>\n                {photo?.user?.name || t('Unknown User')}\n              </Text>\n              {date && <Text style={[styles.date, { color: black }, dateText]}>{date}</Text>}\n            </View>\n          )}\n          {rightElement ? (\n            rightElement({ hideOverlay, photo })\n          ) : (\n            <View style={[styles.rightContainer, rightContainer]} />\n          )}\n        </View>\n      </ReanimatedSafeAreaView>\n    </View>\n  );\n};\n\nImageGalleryHeader.displayName = 'ImageGalleryHeader{imageGallery{header}}';\n"]}
+{"version":3,"sources":["ImageGalleryHeader.tsx"],"names":["ReanimatedSafeAreaView","Animated","createAnimatedComponent","SafeAreaView","styles","StyleSheet","create","centerContainer","alignItems","flex","justifyContent","date","fontSize","fontWeight","marginTop","opacity","innerContainer","flexDirection","height","leftContainer","marginLeft","rightContainer","marginRight","width","userName","ImageGalleryHeader","props","centerElement","CloseIcon","leftElement","photo","rightElement","visible","setHeight","theme","colors","black","white","imageGallery","header","container","dateText","usernameText","t","tDateTimeParser","setOverlay","translucentStatusBar","parsedDate","created_at","getDateObject","calendar","fromNow","headerStyle","value","transform","translateY","Extrapolate","CLAMP","androidTranslucentHeaderStyle","paddingTop","Platform","OS","StatusBar","currentHeight","undefined","hideOverlay","event","nativeEvent","layout","backgroundColor","color","user","name","displayName"],"mappings":"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","sourcesContent":["import React, { useState } from 'react';\nimport {\n  Platform,\n  SafeAreaView,\n  StatusBar,\n  StyleSheet,\n  Text,\n  TouchableOpacity,\n  View,\n  ViewStyle,\n} from 'react-native';\nimport Animated, { Extrapolate, interpolate, useAnimatedStyle } from 'react-native-reanimated';\n\nimport { useOverlayContext } from '../../../contexts/overlayContext/OverlayContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport {\n  isDayOrMoment,\n  TDateTimeParserOutput,\n  useTranslationContext,\n} from '../../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../../icons';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport type { Photo } from '../ImageGallery';\n\nconst ReanimatedSafeAreaView = Animated.createAnimatedComponent\n  ? Animated.createAnimatedComponent(SafeAreaView)\n  : SafeAreaView;\n\nconst styles = StyleSheet.create({\n  centerContainer: {\n    alignItems: 'center',\n    flex: 1,\n    justifyContent: 'center',\n  },\n  date: {\n    fontSize: 12,\n    fontWeight: '500',\n    marginTop: 4,\n    opacity: 0.5,\n  },\n  innerContainer: {\n    flexDirection: 'row',\n    height: 56,\n  },\n  leftContainer: {\n    flex: 1,\n    justifyContent: 'center',\n    marginLeft: 8,\n  },\n  rightContainer: {\n    marginRight: 8,\n    width: 24, // Width of icon currently on left\n  },\n  userName: {\n    fontSize: 16,\n    fontWeight: '700',\n  },\n});\n\nexport type ImageGalleryHeaderCustomComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  hideOverlay,\n  photo,\n}: {\n  hideOverlay: () => void;\n  photo?: Photo<StreamChatGenerics>;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryHeaderCustomComponentProps<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  centerElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n  CloseIcon?: React.ReactElement;\n  leftElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n  rightElement?: ImageGalleryHeaderCustomComponent<StreamChatGenerics>;\n};\n\ntype Props<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> =\n  ImageGalleryHeaderCustomComponentProps<StreamChatGenerics> & {\n    opacity: Animated.SharedValue<number>;\n    visible: Animated.SharedValue<number>;\n    photo?: Photo<StreamChatGenerics>;\n  };\n\nexport const ImageGalleryHeader = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: Props<StreamChatGenerics>,\n) => {\n  const { centerElement, CloseIcon, leftElement, opacity, photo, rightElement, visible } = props;\n  const [height, setHeight] = useState(200);\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        header: {\n          centerContainer,\n          container,\n          dateText,\n          innerContainer,\n          leftContainer,\n          rightContainer,\n          usernameText,\n        },\n      },\n    },\n  } = useTheme();\n  const { t, tDateTimeParser } = useTranslationContext();\n  const { setOverlay, translucentStatusBar } = useOverlayContext();\n\n  const parsedDate = photo ? tDateTimeParser(photo?.created_at) : null;\n\n  /**\n   * .calendar and .fromNow can be initialized after the first render,\n   * and attempting to access them at that time will cause an error\n   * to be thrown.\n   *\n   * This falls back to null if neither exist.\n   */\n  const getDateObject = (date: TDateTimeParserOutput | null) => {\n    if (date === null || !isDayOrMoment(date)) {\n      return null;\n    }\n\n    if (date.calendar) {\n      return date.calendar();\n    }\n\n    if (date.fromNow) {\n      return date.fromNow();\n    }\n\n    return null;\n  };\n\n  const date = getDateObject(parsedDate);\n\n  const headerStyle = useAnimatedStyle<ViewStyle>(() => ({\n    opacity: opacity.value,\n    transform: [\n      {\n        translateY: interpolate(visible.value, [0, 1], [-height, 0], Extrapolate.CLAMP),\n      },\n    ],\n  }));\n\n  const androidTranslucentHeaderStyle = {\n    paddingTop:\n      Platform.OS === 'android' && translucentStatusBar ? StatusBar.currentHeight : undefined,\n  };\n\n  const hideOverlay = () => {\n    setOverlay('none');\n  };\n\n  return (\n    <View\n      onLayout={(event) => setHeight(event.nativeEvent.layout.height)}\n      pointerEvents={'box-none'}\n    >\n      <ReanimatedSafeAreaView\n        style={[{ backgroundColor: white }, androidTranslucentHeaderStyle, container, headerStyle]}\n      >\n        <View style={[styles.innerContainer, innerContainer]}>\n          {leftElement ? (\n            leftElement({ hideOverlay, photo })\n          ) : (\n            <TouchableOpacity accessibilityLabel='Hide Overlay' onPress={hideOverlay}>\n              <View style={[styles.leftContainer, leftContainer]}>\n                {CloseIcon ? CloseIcon : <Close />}\n              </View>\n            </TouchableOpacity>\n          )}\n          {centerElement ? (\n            centerElement({ hideOverlay, photo })\n          ) : (\n            <View style={[styles.centerContainer, centerContainer]}>\n              <Text style={[styles.userName, { color: black }, usernameText]}>\n                {photo?.user?.name || t('Unknown User')}\n              </Text>\n              {date && <Text style={[styles.date, { color: black }, dateText]}>{date}</Text>}\n            </View>\n          )}\n          {rightElement ? (\n            rightElement({ hideOverlay, photo })\n          ) : (\n            <View style={[styles.rightContainer, rightContainer]} />\n          )}\n        </View>\n      </ReanimatedSafeAreaView>\n    </View>\n  );\n};\n\nImageGalleryHeader.displayName = 'ImageGalleryHeader{imageGallery{header}}';\n"]}

package/lib/module/components/ImageGallery/components/ImageGalleryOverlay.js

@@ -82,6 +82,7 @@ var ImageGalleryOverlay = function ImageGalleryOverlay(props) {
     maxDeltaX: 16,
     maxDeltaY: 16,
     onHandlerStateChange: tapEvent,
+    testID: "image-gallery-overlay",
     __self: _this,
     __source: {
       fileName: _jsxFileName,
@@ -95,7 +96,7 @@ var ImageGalleryOverlay = function ImageGalleryOverlay(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 78,
+      lineNumber: 83,
       columnNumber: 7
     }
   }));

package/lib/module/components/ImageGallery/components/ImageGalleryOverlay.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryOverlay.tsx"],"names":["ImageGalleryOverlay","props","animatedBottomSheetIndex","closeGridView","currentBottomSheetIndex","theme","overlayColor","colors","overlay","imageGallery","grid","visible","setVisible","fadedIn","setFadedIn","opacity","value","duration","easing","Easing","out","ease","showOverlayStyle","tapEvent","event","nativeEvent","state","State","END","StyleSheet","absoluteFillObject","backgroundColor","displayName"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAKA;;AAQA;;;;;;;;;AAQO,IAAMA,mBAAoC,GAAG,SAAvCA,mBAAuC,CAACC,KAAD,EAAW;AAC7D,MAAQC,wBAAR,GAA6ED,KAA7E,CAAQC,wBAAR;AAAA,MAAkCC,aAAlC,GAA6EF,KAA7E,CAAkCE,aAAlC;AAAA,MAAiDC,uBAAjD,GAA6EH,KAA7E,CAAiDG,uBAAjD;;AAEA,kBAOI,6BAPJ;AAAA,kCACEC,KADF;AAAA,MAEuBC,YAFvB,mBAEIC,MAFJ,CAEcC,OAFd;AAAA,MAIcA,OAJd,mBAGIC,YAHJ,CAIMC,IAJN,CAIcF,OAJd;;AASA,kBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOG,OAAP;AAAA,MAAgBC,UAAhB;;AACA,mBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,OAAO,GAAG,2CAAe,CAAf,CAAhB;AAEA,wBAAU,YAAM;AACd,QAAIX,uBAAuB,GAAG,CAA9B,EAAiC;AAC/BQ,MAAAA,UAAU,CAAC,IAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,uCACd,CADc,EAEd;AACEC,QAAAA,QAAQ,EAAE,GADZ;AAEEC,QAAAA,MAAM,EAAEC,8BAAOC,GAAP,CAAWD,8BAAOE,IAAlB;AAFV,OAFc,EAMd;AAAA,eAAM,oCAAQP,UAAR,EAAoB,IAApB,CAAN;AAAA,OANc,CAAhB;AAQD,KAVD,MAUO;AACLF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,CAAhB;AACAF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,GAhBD,EAgBG,CAACV,uBAAD,CAhBH;AAkBA,MAAMkB,gBAAgB,GAAG,6CACvB;AAAA,WAAO;AACLP,MAAAA,OAAO,EAAEF,OAAO,GAAGX,wBAAwB,CAACc,KAA5B,GAAoCD,OAAO,CAACC;AADvD,KAAP;AAAA,GADuB,EAIvB,CAACH,OAAD,CAJuB,CAAzB;;AAOA,MAAMU,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAA8C;AAC7D,QAAIA,KAAK,CAACC,WAAN,CAAkBC,KAAlB,KAA4BC,iCAAMC,GAAtC,EAA2C;AACzCzB,MAAAA,aAAa;AACd;AACF,GAJD;;AAMA,MAAI,CAACQ,OAAL,EAAc;AACZ,WAAO,IAAP;AACD;;AAED,SACE,gCAAC,4CAAD;AAAmB,IAAA,SAAS,EAAE,EAA9B;AAAkC,IAAA,SAAS,EAAE,EAA7C;AAAiD,IAAA,oBAAoB,EAAEY,QAAvE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACE,gCAAC,iCAAD,CAAU,IAAV;AACE,IAAA,KAAK,EAAE,CACLM,wBAAWC,kBADN,EAEL;AAAEC,MAAAA,eAAe,EAAEzB;AAAnB,KAFK,EAGLE,OAHK,EAILc,gBAJK,CADT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADF,CADF;AAYD,CAhEM;;;AAkEPtB,mBAAmB,CAACgC,WAApB,GAAkC,wCAAlC","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StyleSheet, ViewStyle } from 'react-native';\nimport {\n  State,\n  TapGestureHandler,\n  TapGestureHandlerStateChangeEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  Easing,\n  runOnJS,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\ntype Props = {\n  animatedBottomSheetIndex: Animated.SharedValue<number>;\n  closeGridView: () => void;\n  currentBottomSheetIndex: number;\n};\n\nexport const ImageGalleryOverlay: React.FC<Props> = (props) => {\n  const { animatedBottomSheetIndex, closeGridView, currentBottomSheetIndex } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor },\n      imageGallery: {\n        grid: { overlay },\n      },\n    },\n  } = useTheme();\n\n  const [visible, setVisible] = useState(false);\n  const [fadedIn, setFadedIn] = useState(false);\n\n  const opacity = useSharedValue(0);\n\n  useEffect(() => {\n    if (currentBottomSheetIndex > 0) {\n      setVisible(true);\n      opacity.value = withTiming(\n        1,\n        {\n          duration: 200,\n          easing: Easing.out(Easing.ease),\n        },\n        () => runOnJS(setFadedIn)(true),\n      );\n    } else {\n      setVisible(false);\n      opacity.value = 0;\n      setFadedIn(false);\n    }\n  }, [currentBottomSheetIndex]);\n\n  const showOverlayStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: fadedIn ? animatedBottomSheetIndex.value : opacity.value,\n    }),\n    [fadedIn],\n  );\n\n  const tapEvent = (event: TapGestureHandlerStateChangeEvent) => {\n    if (event.nativeEvent.state === State.END) {\n      closeGridView();\n    }\n  };\n\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <TapGestureHandler maxDeltaX={16} maxDeltaY={16} onHandlerStateChange={tapEvent}>\n      <Animated.View\n        style={[\n          StyleSheet.absoluteFillObject,\n          { backgroundColor: overlayColor },\n          overlay,\n          showOverlayStyle,\n        ]}\n      />\n    </TapGestureHandler>\n  );\n};\n\nImageGalleryOverlay.displayName = 'ImageGrid{imageGallery{grid{overlay}}}';\n"]}
+{"version":3,"sources":["ImageGalleryOverlay.tsx"],"names":["ImageGalleryOverlay","props","animatedBottomSheetIndex","closeGridView","currentBottomSheetIndex","theme","overlayColor","colors","overlay","imageGallery","grid","visible","setVisible","fadedIn","setFadedIn","opacity","value","duration","easing","Easing","out","ease","showOverlayStyle","tapEvent","event","nativeEvent","state","State","END","StyleSheet","absoluteFillObject","backgroundColor","displayName"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAKA;;AAQA;;;;;;;;;AAQO,IAAMA,mBAAoC,GAAG,SAAvCA,mBAAuC,CAACC,KAAD,EAAW;AAC7D,MAAQC,wBAAR,GAA6ED,KAA7E,CAAQC,wBAAR;AAAA,MAAkCC,aAAlC,GAA6EF,KAA7E,CAAkCE,aAAlC;AAAA,MAAiDC,uBAAjD,GAA6EH,KAA7E,CAAiDG,uBAAjD;;AAEA,kBAOI,6BAPJ;AAAA,kCACEC,KADF;AAAA,MAEuBC,YAFvB,mBAEIC,MAFJ,CAEcC,OAFd;AAAA,MAIcA,OAJd,mBAGIC,YAHJ,CAIMC,IAJN,CAIcF,OAJd;;AASA,kBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOG,OAAP;AAAA,MAAgBC,UAAhB;;AACA,mBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,OAAO,GAAG,2CAAe,CAAf,CAAhB;AAEA,wBAAU,YAAM;AACd,QAAIX,uBAAuB,GAAG,CAA9B,EAAiC;AAC/BQ,MAAAA,UAAU,CAAC,IAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,uCACd,CADc,EAEd;AACEC,QAAAA,QAAQ,EAAE,GADZ;AAEEC,QAAAA,MAAM,EAAEC,8BAAOC,GAAP,CAAWD,8BAAOE,IAAlB;AAFV,OAFc,EAMd;AAAA,eAAM,oCAAQP,UAAR,EAAoB,IAApB,CAAN;AAAA,OANc,CAAhB;AAQD,KAVD,MAUO;AACLF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,CAAhB;AACAF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,GAhBD,EAgBG,CAACV,uBAAD,CAhBH;AAkBA,MAAMkB,gBAAgB,GAAG,6CACvB;AAAA,WAAO;AACLP,MAAAA,OAAO,EAAEF,OAAO,GAAGX,wBAAwB,CAACc,KAA5B,GAAoCD,OAAO,CAACC;AADvD,KAAP;AAAA,GADuB,EAIvB,CAACH,OAAD,CAJuB,CAAzB;;AAOA,MAAMU,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAA8C;AAC7D,QAAIA,KAAK,CAACC,WAAN,CAAkBC,KAAlB,KAA4BC,iCAAMC,GAAtC,EAA2C;AACzCzB,MAAAA,aAAa;AACd;AACF,GAJD;;AAMA,MAAI,CAACQ,OAAL,EAAc;AACZ,WAAO,IAAP;AACD;;AAED,SACE,gCAAC,4CAAD;AACE,IAAA,SAAS,EAAE,EADb;AAEE,IAAA,SAAS,EAAE,EAFb;AAGE,IAAA,oBAAoB,EAAEY,QAHxB;AAIE,IAAA,MAAM,EAAC,uBAJT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAME,gCAAC,iCAAD,CAAU,IAAV;AACE,IAAA,KAAK,EAAE,CACLM,wBAAWC,kBADN,EAEL;AAAEC,MAAAA,eAAe,EAAEzB;AAAnB,KAFK,EAGLE,OAHK,EAILc,gBAJK,CADT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IANF,CADF;AAiBD,CArEM;;;AAuEPtB,mBAAmB,CAACgC,WAApB,GAAkC,wCAAlC","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StyleSheet, ViewStyle } from 'react-native';\nimport {\n  State,\n  TapGestureHandler,\n  TapGestureHandlerStateChangeEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  Easing,\n  runOnJS,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\ntype Props = {\n  animatedBottomSheetIndex: Animated.SharedValue<number>;\n  closeGridView: () => void;\n  currentBottomSheetIndex: number;\n};\n\nexport const ImageGalleryOverlay: React.FC<Props> = (props) => {\n  const { animatedBottomSheetIndex, closeGridView, currentBottomSheetIndex } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor },\n      imageGallery: {\n        grid: { overlay },\n      },\n    },\n  } = useTheme();\n\n  const [visible, setVisible] = useState(false);\n  const [fadedIn, setFadedIn] = useState(false);\n\n  const opacity = useSharedValue(0);\n\n  useEffect(() => {\n    if (currentBottomSheetIndex > 0) {\n      setVisible(true);\n      opacity.value = withTiming(\n        1,\n        {\n          duration: 200,\n          easing: Easing.out(Easing.ease),\n        },\n        () => runOnJS(setFadedIn)(true),\n      );\n    } else {\n      setVisible(false);\n      opacity.value = 0;\n      setFadedIn(false);\n    }\n  }, [currentBottomSheetIndex]);\n\n  const showOverlayStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: fadedIn ? animatedBottomSheetIndex.value : opacity.value,\n    }),\n    [fadedIn],\n  );\n\n  const tapEvent = (event: TapGestureHandlerStateChangeEvent) => {\n    if (event.nativeEvent.state === State.END) {\n      closeGridView();\n    }\n  };\n\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <TapGestureHandler\n      maxDeltaX={16}\n      maxDeltaY={16}\n      onHandlerStateChange={tapEvent}\n      testID='image-gallery-overlay'\n    >\n      <Animated.View\n        style={[\n          StyleSheet.absoluteFillObject,\n          { backgroundColor: overlayColor },\n          overlay,\n          showOverlayStyle,\n        ]}\n      />\n    </TapGestureHandler>\n  );\n};\n\nImageGalleryOverlay.displayName = 'ImageGrid{imageGallery{grid{overlay}}}';\n"]}

package/lib/module/components/ImageGallery/components/ImageGalleryVideoControl.js

@@ -11,23 +11,21 @@ var _reactNative = require("react-native");
 
 var _dayjs = _interopRequireDefault(require("dayjs"));
 
-var _ProgressControl = require("./ProgressControl");
-
 var _ThemeContext = require("../../../contexts/themeContext/ThemeContext");
 
 var _icons = require("../../../icons");
 
+var _ProgressControl = require("../../ProgressControl/ProgressControl");
+
 var _this = this,
     _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGalleryVideoControl.tsx";
 
 var styles = _reactNative.StyleSheet.create({
   durationTextStyle: {
-    color: '#fff',
     fontWeight: 'bold'
   },
   roundedView: {
     alignItems: 'center',
-    backgroundColor: '#fff',
     borderRadius: 50,
     display: 'flex',
     elevation: 2,
@@ -56,7 +54,11 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   var progressDuration = progressValueInSeconds ? progressValueInSeconds / 3600 >= 1 ? _dayjs["default"].duration(progressValueInSeconds, 'second').format('HH:mm:ss') : _dayjs["default"].duration(progressValueInSeconds, 'second').format('mm:ss') : null;
 
   var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme$image = _useTheme.theme.imageGallery.videoControl,
+      _useTheme$theme = _useTheme.theme,
+      _useTheme$theme$color = _useTheme$theme.colors,
+      black = _useTheme$theme$color.black,
+      white_snow = _useTheme$theme$color.white_snow,
+      _useTheme$theme$image = _useTheme$theme.imageGallery.videoControl,
       durationTextStyle = _useTheme$theme$image.durationTextStyle,
       roundedView = _useTheme$theme$image.roundedView,
       videoContainer = _useTheme$theme$image.videoContainer;
@@ -66,69 +68,85 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 65,
+      lineNumber: 64,
       columnNumber: 7
     }
   }, _react["default"].createElement(_reactNative.TouchableOpacity, {
-    onPress: onPlayPause,
+    accessibilityLabel: "Play Pause Button",
+    onPress: function onPress() {
+      onPlayPause();
+    },
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 66,
+      lineNumber: 65,
       columnNumber: 9
     }
   }, _react["default"].createElement(_reactNative.View, {
-    style: [styles.roundedView, roundedView],
+    style: [styles.roundedView, roundedView, {
+      backgroundColor: white_snow
+    }],
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 67,
+      lineNumber: 71,
       columnNumber: 11
     }
   }, paused ? _react["default"].createElement(_icons.Play, {
+    accessibilityLabel: "Play Icon",
     height: 24,
-    pathFill: '#000',
+    pathFill: black,
     width: 24,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 69,
+      lineNumber: 73,
       columnNumber: 15
     }
   }) : _react["default"].createElement(_icons.Pause, {
+    accessibilityLabel: "Pause Icon",
     height: 24,
     width: 24,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 71,
+      lineNumber: 75,
       columnNumber: 15
     }
   }))), _react["default"].createElement(_reactNative.Text, {
-    style: [styles.durationTextStyle, durationTextStyle],
+    accessibilityLabel: "Progress Duration",
+    style: [styles.durationTextStyle, durationTextStyle, {
+      color: white_snow
+    }],
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 75,
+      lineNumber: 79,
       columnNumber: 9
     }
   }, progressDuration ? progressDuration : '00:00'), _react["default"].createElement(_ProgressControl.ProgressControl, {
     duration: duration,
+    filledColor: white_snow,
     onPlayPause: onPlayPause,
     onProgressDrag: onProgressDrag,
     progress: progress,
+    testID: 'progress-control',
+    width: 180,
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 78,
+      lineNumber: 85,
       columnNumber: 9
     }
   }), _react["default"].createElement(_reactNative.Text, {
-    style: [styles.durationTextStyle, durationTextStyle],
+    accessibilityLabel: "Video Duration",
+    style: [styles.durationTextStyle, durationTextStyle, {
+      color: white_snow
+    }],
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 84,
+      lineNumber: 94,
       columnNumber: 9
     }
   }, videoDuration ? videoDuration : '00:00'));

package/lib/module/components/ImageGallery/components/ImageGalleryVideoControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryVideoControl.tsx"],"names":["styles","StyleSheet","create","durationTextStyle","color","fontWeight","roundedView","alignItems","backgroundColor","borderRadius","display","elevation","height","justifyContent","width","videoContainer","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","onProgressDrag","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","theme","imageGallery","videoControl","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\nimport { ProgressControl } from './ProgressControl';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    color: '#fff',\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    backgroundColor: '#fff',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, onProgressDrag, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity onPress={onPlayPause}>\n          <View style={[styles.roundedView, roundedView]}>\n            {paused ? (\n              <Play height={24} pathFill={'#000'} width={24} />\n            ) : (\n              <Pause height={24} width={24} />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text style={[styles.durationTextStyle, durationTextStyle]}>\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          onPlayPause={onPlayPause}\n          onProgressDrag={onProgressDrag}\n          progress={progress}\n        />\n        <Text style={[styles.durationTextStyle, durationTextStyle]}>\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"]}
+{"version":3,"sources":["ImageGalleryVideoControl.tsx"],"names":["styles","StyleSheet","create","durationTextStyle","fontWeight","roundedView","alignItems","borderRadius","display","elevation","height","justifyContent","width","videoContainer","backgroundColor","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","onProgressDrag","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","theme","colors","black","white_snow","imageGallery","videoControl","color","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\nimport { ProgressControl } from '../../ProgressControl/ProgressControl';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, onProgressDrag, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        colors: { black, white_snow },\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity\n          accessibilityLabel='Play Pause Button'\n          onPress={() => {\n            onPlayPause();\n          }}\n        >\n          <View style={[styles.roundedView, roundedView, { backgroundColor: white_snow }]}>\n            {paused ? (\n              <Play accessibilityLabel='Play Icon' height={24} pathFill={black} width={24} />\n            ) : (\n              <Pause accessibilityLabel='Pause Icon' height={24} width={24} />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text\n          accessibilityLabel='Progress Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: white_snow }]}\n        >\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          filledColor={white_snow}\n          onPlayPause={onPlayPause}\n          onProgressDrag={onProgressDrag}\n          progress={progress}\n          testID={'progress-control'}\n          width={180}\n        />\n        <Text\n          accessibilityLabel='Video Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: white_snow }]}\n        >\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"]}

package/lib/module/components/ImageGallery/components/ImageGrid.js

@@ -68,6 +68,7 @@ var GridImage = function GridImage(_ref) {
   }
 
   return _react["default"].createElement(_bottomSheet.TouchableOpacity, {
+    accessibilityLabel: "Grid Image",
     onPress: selectAndClose,
     __self: _this,
     __source: {
@@ -151,6 +152,7 @@ var ImageGrid = function ImageGrid(props) {
     });
   });
   return _react["default"].createElement(_bottomSheet.BottomSheetFlatList, {
+    accessibilityLabel: "Image Grid",
     contentContainerStyle: [styles.contentContainer, {
       backgroundColor: white
     }, contentContainer],
@@ -163,7 +165,7 @@ var ImageGrid = function ImageGrid(props) {
     __self: _this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 156,
+      lineNumber: 157,
       columnNumber: 5
     }
   });