RocketChat/Rocket.Chat

import { useEffect } from 'react';

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

export const useAsyncImage = (src: string | undefined): string | undefined => {
    const { value, resolve, reject, reset } = useAsyncState<string>();

    useEffect(() => {
        reset();

        if (!src) {
            return;
        }

        const image = new Image();
        image.addEventListener('load', () => {
            resolve(image.src);
        });
        image.addEventListener('error', (e) => {
            reject(e.error);
        });
        image.src = src;
    }, [src, resolve, reject, reset]);

    return value;
};