diff --git a/components/StreamerCard/index.jsx b/components/StreamerCard/index.jsx index fe55bc7..7684a8c 100644 --- a/components/StreamerCard/index.jsx +++ b/components/StreamerCard/index.jsx @@ -4,7 +4,7 @@ import { TouchableOpacity, Image as NativeImage, } from "react-native"; -import React, { memo, useContext } from "react"; +import React, { memo, useContext, useMemo } from "react"; import { useTailwind } from "tailwind-rn"; import { Image } from "expo-image"; import { Video, ResizeMode } from "expo-av"; @@ -17,6 +17,8 @@ function StreamerCard({ data, screen }) { const showVideo = useContext( screen === "feed" ? FeedShowVideoContext : SameCityShowVideoContext ); + const isPlaying = useMemo(() => showVideo.includes(data?.mid), [showVideo]); + const tailwind = useTailwind(); const blurhash = "LcKUTa%gOYWBYRt6xuoJo~s8V@fk"; @@ -56,7 +58,7 @@ function StreamerCard({ data, screen }) { ), }} > - {data?.gender === 0 ? ( + {data?.gender === 1 ? ( @@ -107,21 +109,23 @@ function StreamerCard({ data, screen }) { transition={1000} placeholder={blurhash} cachePolicy="disk" - style={tailwind("w-full h-full z-0")} + style={ + isPlaying + ? tailwind("w-full h-full z-0 absolute") + : tailwind("w-full h-full z-20 absolute") + } + /> +