How to wait for a forEach() to finish before executing another code?

Question

I have code as below:

const images: string[] = [];
data.forEach(async (file: any) => {
    const extension = file
                .split(".")
                .pop()
                ?.split("?")[0]
                .toLocaleLowerCase();

    if (extension === "pdf") {
        await convertFromPdf(file).then((res) =>
            images.push(...res.map((x) => x as string))
        );
        window.dispatchEvent(new Event("resize"));
    } else if (
        extension === "jpg" ||
        extension === "jpeg" ||
        extension === "png"
    ) {
        images.push(file);
    }
});

// HERE FUNCTION THAT TAKES IN `images` AS A PARAMETER

How can I wait for data.forEach() to finish up, then execute the function after the loop? Note that here if the extension is pdf then the async function convertFromPdf is executed, if not then the file is just pushed into the image variable. So if the data is a mix of both pdf and non-pdf files, I want all of them to get processed in order.