I’m working on an app where the user can create their own product.
Imagine a burger.
They can configure the product through multiple steps, and based on what options they pick the subsequent pages/ options will be different. the general steps are below, and if they choose a particular option on a page, it may add or remove upcoming pages. also based on what product they pick, they will have different limits on the max number of ingredients they can pick.
choose the base product.
choose ingredient/s (based on the product and variant they pick, the user will have the option to choose from multiple combinations, i.e product 1 allows you to choose 1 meat and 1 vegetable, product 2 allows you to choose 1 meat and 2 vegetables.)
this dynamic ingredient list has been causing me the most difficulty, as I have set it up as a reusable element, so it’s not actually fixed to a single ingredient type.
I am able to display the correct ingredients based on the product selected, but how can I dynamically save the selected ingredients to the database thing called order?
as when I’m trying to save the ingredient list to the database thing, ingredient type could be meat, vegetables or sauces based on whatever ingredient the user is currently picking.
I know I could possibly just copy and paste the set list to custom state several times and then do the same when adding to the db, but I was hoping someone could help me with a more elegant solution.
I have attached images of how I’m trying to save the ingredient list to the correct list in the custom state, but trying to figure out how to dynamically get the name of the list in custom state.
Thank you very much for any help,