import {
  Image,
  ImageSourcePropType,
  StyleSheet,
  View,
} from "react-native";

export const ResponsiveImage = ({
  source,
}: {
  source: ImageSourcePropType;
}) => (
  <View style={styles.imgContainer}>
    <Image style={styles.image} source={source} />
  </View>
);

const styles = StyleSheet.create({
  imgContainer: {
    flexDirection: "row",
  },
  image: {
    resizeMode: "contain",
    flex: 1,
    aspectRatio: 1, // Your aspect ratio
  },
});