JavaScript (React): How to extend async function's await to a given time

I would like to have a async function that sends a request to a server and awaits the response. It will then wait upto 1000ms to ensure that an animation has played out.
i was wondering if I could combine these 2 tasks somehow so they add up to having waited 1000ms in total dynamically.

My current code:

const loadingHandler = async (func, target) => {
        setIsLoading(true);

        await new Promise(r => setTimeout(r, 1000));
        await func(target);

        setIsLoading(false);
    };

Some examples to further explain what exactly I mean: the function calls func() and gets a response after (lets say) 200ms. Now the timeout is only supposed to be 800ms. If the func() returns after 20ms the timeout is supposed to be 980ms. If func() takes longer than 1000ms it should continue immedietly after getting the response and not wait additionally.
So is something like this ‘stretcher await function’ possible?

>Solution :

Sure, just remember how long it’s been so far, then delay that much longer:

const loadingHandler = async (func, target) => {
    setIsLoading(true);

    const started = Date.now();
    await func(target);
    const elapsed = Date.now() - started;
    const delayFurther = 1000 - elapsed;
    if (delayFurther > 0) {
        await new Promise(r => setTimeout(r, delayFurther));
    }

    setIsLoading(false);
};

That said, holding up the user because an animation hasn’t finished might not be the best UX. Perhaps you could make the animation finish more quickly when func is already done. (Humans tend to notice delays > about 80-100ms, a bit less when we’re younger.)