import * as React from "react";
import {IProps} from "./image";
import {Image, ImageStyle, StyleProp} from "react-native";
import _hooks from "./_hooks";
import app from "../../app";


const BasicImage: React.FC<IProps> = (props) => {
    const css = app.themeCss.get();
    const width = props.width ?? css.width;

    const {
        imgHeight,
    } = _hooks.useData(props.source, width, props.height, props.setHeight);

    const defaultStyle: StyleProp<ImageStyle> = {
        width, height: imgHeight,
    }

    return <Image
        source={props.localSource ?? props.source}
        defaultSource={props.defaultSource}
        loadingIndicatorSource={props.localSource}
        resizeMode={props.resizeMode}
        style={[defaultStyle, props.style ?? {}]}
    />
}

export default BasicImage