Product preview card component with react

What are you most proud of, and what would you do differently next time?

Building this preview card component in react was quite a challenge, but I could end up with mostly satisfied result. Next time, I would try to build it in vanilla html and css.

What challenges did you encounter, and how did you overcome them?

As the screen size gets larger or smaller, I need to choose accordingly the size of product photo (two different sizes). For this, I implemented some state logic to detect the viewport size and then choose the appropriate sized photo, but I didn't work.

What specific areas of your project would you like help with?

I need help in product photo area with react state logic. Why doesn't product photo get replaced as screen gets larger?