PressableScale

src/screens/Library/components/MusicCard.js

@@ -1,21 +1,22 @@
 import { BlurView } from "expo-blur";
+import { Image as ExpoImage } from "expo-image";
 import React, { useEffect, useRef, useState } from "react";
 import {
+  Dimensions,
   Pressable,
+  Image as RNImage,
   StyleSheet,
   Text,
   View,
-  Image as RNImage,
-  Dimensions,
 } from "react-native";
-import { Image as ExpoImage } from "expo-image";
+import { responsiveWidth } from "react-native-responsive-dimensions";
 import { useGlobal } from "reactn";
 import { icons, img } from "../../../assets";
+import PressableScale from "../../../components/PressableScale";
 import { arrayRemove, arrayUnion, projectsRef } from "../../../config/firebase";
 import { Palette, Style } from "../../../styles";
 import { FONT_FAMILY } from "../../../styles/Fonts";
 import { size } from "../../../styles/Style";
-import { responsiveWidth } from "react-native-responsive-dimensions";
 
 const MusicCard = ({
   onPress,
@@ -152,16 +153,16 @@ const MusicCard = ({
                 gap: 12,
               }}
             >
-              <Pressable onPress={toggleLike}>
+              <PressableScale onPress={toggleLike}>
                 <RNImage
                   source={selected ? icons.heart : icons.heartOutline}
                   style={size({ size: 24 })}
                   resizeMode="contain"
                 />
-              </Pressable>
-              <Pressable ref={moreButtonRef} onPress={onPressMenu}>
+              </PressableScale>
+              <PressableScale ref={moreButtonRef} onPress={onPressMenu}>
                 <RNImage source={icons.more} style={size({ size: 24 })} />
-              </Pressable>
+              </PressableScale>
             </View>
           </BlurView>
         </View>