Resolve promise inside javascript map function

I have gone through several questions and posts regarding how to accomplish this but none have worked. I have tried an array (no pun intended) of possible solutions involving Promise.*, thenable, await and none have worked.

I have an array of payments that I extract from a Prisma db call, the object looks like this:

[{
    "id": 1,
    "amount": 100,
    "payment_data": [{
        "credits": 2,
        "subscription_id": 534
    }, {
        "credits": 3,
        "subscription_id": 469
    }],
    "customerId": 14
}]

I am trying to run another database query using the subscription_id under each payment_data for which I built a simple function:

const get_subscription = async function (subscription_id) {
    return await db.subscriptions.findUnique({
        where: {
            id: Number(subscription_id)
        }
    })
}

And then I execute it inside a .map like this:

const mapped_payments = payments.map((payment) => ({
    ...payment,
    payment_data: payment.payment_data.map(function (data) {
        data.subscription = get_subscription(data.subscription_id).then((resp => resp))
        return data
    })
}))

The problem is no matter what I have tried this never resolves. If I console log mapped_payments the subscription object shows as Promise {<pending>} and entirely empty when I return the response in express.

I am sure this is a simple solution but I have moved all possible solutions (Promise.*, thenable, await) into the function, into the .map and into the res.send but none work.

Any help is appreciated!

Answer

You need to use async map callback to await the get_subscription function, Also it would be better to use Promise.all to handle all mapped promises.

const mapped_payments = await Promise.all(payments.map(async (payment) => ({
    ...payment,
    payment_data: await Promise.all(payment.payment_data.map(async function (data) {
        data.subscription = await get_subscription(data.subscription_id)
        return data
    }))
})))