How to Dynamically Fetch Unit Cost Using Inventory ID in Shopify Resource Picker?

[AniketJagtap]

Hi everyone,

I'm developing a Shopify app using the Remix framework and utilizing the Shopify Resource Picker component to select products. In the product webhook, there's a term called inventory ID, and I need to fetch the unit cost for each product based on this inventory ID.

Here's a snippet of my current code:

const newSelectedProducts = resources.selection.map((product) => { console.log(product); });

I came across this GraphiQL query for fetching unit cost using inventory ID:

GraphiQL inventoryItem(id: "gid://shopify/InventoryItem/44181378007179") { id unitCost { amount } } }

Could anyone guide me on how to dynamically implement this to fetch the unit cost for multiple selected products within the Resource Picker context? Specifically, I need help with:

1. Efficiently handling this for N number of selected products.
2. Providing a code prototype or example demonstrating how to achieve this.
3. Managing potential errors or rate limiting when making multiple API calls.
4. Best practices for batching these requests to minimize the number of API calls.

Any help or pointers would be greatly appreciated.

Thanks in advance!