import React from "react";
import {
  Image,
  ImageBackground,
  ImageProps,
  ImageStyle,
  StyleProp,
} from "react-native";

export interface Props extends ImageProps {
  style?: StyleProp<ImageStyle> | undefined;
}

// TODO - React.FC<Props> QBImage should process incoming url and apply any transformations if needed
export const QBImage = ({
  children,
  ...props
}: Props & { children?: React.ReactNode }) => {
  if (children) {
    return <ImageBackground {...props}>{children}</ImageBackground>;
  }

  return <Image {...props} />;
};