I am trying to display an image using the Image component from expo-image. I have tried using the Image component using react-native and using that one the image gets displayed but I would like to be able to use the one provided by Expo.

I can not seem to find what I am missing. This is what I have:

import { Image } from "expo-image";
import { useRef, useState } from "react";
import {
    Dimensions,
    StyleSheet,
    Text,
    useWindowDimensions,
    View,
} from "react-native";

export function Page() {
    return (
        <View>
            <Image
                style={styles.image}
                contentFit="contain"
                transition={1000}
                source={`../../assets/mockImages/image1.png`}
            />
        </View>
    );
}

const styles = StyleSheet.create({
    image: {
        width: 100,
        height: 100,
        flex: 1,
    },
});