import type { ImgHTMLAttributes } from 'react';

import { useResolvedAssetReadUrl } from '../hooks/useResolvedAssetReadUrl';

type ResolvedAssetImageProps = Omit<
  ImgHTMLAttributes<HTMLImageElement>,
  'src'
> & {
  src?: string | null;
  fallbackSrc?: string | null;
};

export function ResolvedAssetImage({
  src,
  fallbackSrc,
  alt,
  ...rest
}: ResolvedAssetImageProps) {
  const { resolvedUrl } = useResolvedAssetReadUrl(src);
  const finalSrc = resolvedUrl || fallbackSrc?.trim() || '';

  if (!finalSrc) {
    return null;
  }

  return <img {...rest} src={finalSrc} alt={alt} />;
}