How to ergonomically build data handling in Next.js?

Question

React

There is a page with a list of goods (bicycles). When you click on a bike, it opens in a modal window. Here, in the modal window, there is a choice of accessories, for example, a saddle with a choice of color, color, and so on.

Question on the back - what data to send to api my-site.ru/api/velo/all ? Only photo, model, and id? Or the entire bike object? I just started learning next so I'm swimming. But it seems to me that if you give objects completely in the API, then when you click on the bike, the modal window will work faster.

On the other hand, the request itself will be heavier, since all the data will be loaded. But do I understand correctly that next will make this request only once and cache it on the server?