E-commerce product page (Next.js + Tailwind.css)

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

1. I'm proud that the challenge didn't seem complicated to me.

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

I was not sure shall I try to make a component reusable or I need to make two separate ones.

1. Navigation component. I made a separate one for a mobile navigation because it's a modal window.

2. Photo gallery. I also made two separate components, a photo gallery is also a modal window.

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

1. Is it ok if I make a separate component for a mobile navigation (meaning I'm not reusing desktop navigation component)? A mobile nav is a modal window.

2. What's the best way to make components for the PhotoGallery and PhotoGalleryModal to make PhotoGallery reusable and not to repeat the code?

3. Where to have useState for cart modal? In the header? Then the whole component must be client. The same with the PhotoGallery modal which makes the Main.tsx a client component as well, is it ok?