Defining complex nested variables for use in symbols

Our product catalog is keyed on on a physical location that is selected by the customer when browsing. I have exposed this locationCode to builder through the data prop and understand how to use that to control display logic of elements.

Our product team now wants the ability to create pages that look something like

Fathers Day Products in {{locationName}}

Box locationCode={{locationCode}}
  PrdocutTile productid={{product1}}
  PrdocutTile productid={{product2}}
  PrdocutTile productid={{product3}}

I know how to do the locationName string replacement.

I know how to fetch api data based on product id to populate the tile symbols.

However, they want to be able to specify different groups of 3 product-ids for various locations. For bonus points they want to be able to say
Country1.City1 = prodA, prodB, prodC
Country1.City2 = prodD,prodE,prodF
Country1.All other Cities = prodX,prodY,prodZ
Country2.All cites = prodG,prodH,prodI

For this usecase, we can assume that there will always be 3 or 0 products.

Dose the builder ui provide an interface for allowing the designer to attach ‘complex’ data structures to pages like this ?

Or should I just create an api in the backend that internalises the logic and allows them to create ‘fathers-day-featured-products’ group, and then simply attach that code to the symbol.