fix: remove useless isPlaying, fix hide/show controls video

TERITORI · Nov 6, 2023 · 942ed7a · 942ed7a
1 parent 1cbe259
commit 942ed7a
Show file tree

Hide file tree

Showing 6 changed files with 193 additions and 150 deletions.
diff --git a/packages/components/FilePreview/AudioView.tsx b/packages/components/FilePreview/AudioView.tsx
@@ -35,13 +35,8 @@ export const AudioView: React.FC<{
   const selectedNetwork = useSelectedNetworkInfo();
   const userInfo = useNSUserInfo(authorId);
   const { isDAO } = useIsDAO(authorId);
-  const {
-    media,
-    isPlaying,
-    handlePlayPause,
-    loadAndPlaySoundsQueue,
-    playbackStatus,
-  } = useMediaPlayer();
+  const { media, handlePlayPause, loadAndPlaySoundsQueue, playbackStatus } =
+    useMediaPlayer();
   const isInMediaPlayer = useMemo(
     () => media?.postId === postId,
     [media?.postId, postId]
@@ -107,7 +102,9 @@ export const AudioView: React.FC<{
         activeOpacity={0.9}
         style={{
           backgroundColor:
-            isInMediaPlayer && isPlaying ? secondaryColor : neutral00,
+            isInMediaPlayer && playbackStatus?.isPlaying
+              ? secondaryColor
+              : neutral00,
           height: 40,
           width: 40,
           borderRadius: 30,
@@ -116,10 +113,16 @@ export const AudioView: React.FC<{
         }}
       >
         <SVG
-          source={isInMediaPlayer && isPlaying ? pauseSVG : playSVG}
+          source={
+            isInMediaPlayer && playbackStatus?.isPlaying ? pauseSVG : playSVG
+          }
           width={24}
           height={24}
-          color={isInMediaPlayer && isPlaying ? neutral00 : secondaryColor}
+          color={
+            isInMediaPlayer && playbackStatus?.isPlaying
+              ? neutral00
+              : secondaryColor
+          }
         />
       </TouchableOpacity>
 

diff --git a/packages/components/mediaPlayer/MediaPlayerBar.tsx b/packages/components/mediaPlayer/MediaPlayerBar.tsx
@@ -32,7 +32,6 @@ export const MediaPlayerBar: FC<{
   const { contentWidth } = useMaxResolution();
   const isMobile = useIsMobile();
   const {
-    isPlaying,
     handlePlayPause,
     media,
     isRandom,
@@ -113,7 +112,9 @@ export const MediaPlayerBar: FC<{
         <CustomPressable onPress={handlePlayPause} disabled={!media}>
           <SVG
             source={
-              isPlaying && !playbackStatus?.didJustFinish ? PauseIcon : PlayIcon
+              playbackStatus?.isPlaying && !playbackStatus?.didJustFinish
+                ? PauseIcon
+                : PlayIcon
             }
             height={28}
             width={28}

diff --git a/packages/components/mediaPlayer/MediaPlayerBarMobile.tsx b/packages/components/mediaPlayer/MediaPlayerBarMobile.tsx
@@ -27,7 +27,6 @@ export const MediaPlayerBarMobile: FC<{
   style?: StyleProp<ViewStyle>;
 }> = ({ style }) => {
   const {
-    isPlaying,
     handlePlayPause,
     media,
     isRandom,
@@ -96,7 +95,7 @@ export const MediaPlayerBarMobile: FC<{
           <CustomPressable onPress={handlePlayPause} disabled={!media}>
             <SVG
               source={
-                isPlaying && !playbackStatus?.didJustFinish
+                playbackStatus?.isPlaying && !playbackStatus?.didJustFinish
                   ? PauseIcon
                   : PlayIcon
               }