How can I render unique color options for product variants?

Technical Q&A
1

I’m trying to create a section inside the product page where the user chooses a color of a shirt (as well as the size)

I learned that to get separate values for variant options, I should loop through the variants and get variant.option1 for the first option and variant.option2 for the second option.

However, it’s rendering each option multiple times since there’s a combination (small + red, large + red, hence renders red twice, for example)

How can I render each color once? uniquely?

2

Has this been solved @cedrichadjian ? Asking cz I’m looking for the exact solution. Also want to extract the variant ID for the particular variant selected.