react-native-chating-ui-kit/lib/shared/views/CometChatVideoBubble/CometChatVideoBubble.js

CometChat React Native UI Kit is a collection of custom UI Components designed to build text , chat and calling features in your application. The UI Kit is developed to keep developers in mind and aims to reduce development efforts significantly

import React, { useContext } from "react";
import { TouchableOpacity, Image, ImageBackground, NativeModules, Platform } from "react-native";
import { CometChatContext } from "../../CometChatContext";
import { VideoBubbleStyle } from "./VideoBubbleStyle";
import { defaultPlayIcon } from "./resources";
import { Style } from "./style";
const { VideoManager, FileManager } = NativeModules;
export const CometChatVideoBubble = (props) => {
    const { videoUrl, thumbnailUrl, placeholderImage, style, playIcon, onPress, } = props;
    const { theme } = useContext(CometChatContext);
    const _style = new VideoBubbleStyle({
        backgroundColor: theme?.palette.getBackgroundColor(),
        playIconTint: theme?.palette.getSecondary(),
        ...style
    });
    const { height, width, backgroundColor, border, borderRadius, playIconTint, playIconBackgroundColor } = _style;
    const getFileName = (url) => {
        return (url.substring(url.lastIndexOf("/") + 1, url.length)).replace(" ", "_");
    };
    const playVideo = () => {
        if (onPress) {
            onPress(videoUrl);
            return;
        }
        Platform.OS == 'ios' ?
            FileManager.openFile(videoUrl, getFileName(videoUrl), (s) => { }) :
            VideoManager.openVideo(videoUrl, (s) => { });
    };
    return (<ImageBackground source={thumbnailUrl || placeholderImage} resizeMode={"contain"} style={{ backgroundColor, ...border, borderRadius, height, width }}>
            <TouchableOpacity onPress={playVideo} activeOpacity={1} style={[Style.playIconPosition, { backgroundColor: playIconBackgroundColor, borderRadius }]}>
                <Image source={playIcon || defaultPlayIcon} style={{ tintColor: playIconTint }}/>
            </TouchableOpacity>
        </ImageBackground>);
};
//# sourceMappingURL=CometChatVideoBubble.js.map