Good Morning, i just have a question about generating Dynamic forms. I am looping through an array of objects and for each Genre i am generating a drop down field, i am also filtering a list of items to find what belongs in which drop down list. So my question is is there a way to dynamically assign the drop down list a value that is stored above as so?

 const [company, setCompany] = React.useState([]);
const [division, setDivision] = React.useState([]);
const [jobDescription, setJobDescription] = React.useState([]);
const [businessUnit, setBusinessUnit] = React.useState([]);
const [region, setRegion] = React.useState([]);
const [costCenter, setCostCenter] = React.useState([]);
const [personType, setPersonType] = React.useState([]);


  function getMenuItemsForType(type){
    let filtered = limiters.filter(x => x.limiter_TypeOption === type.limiterTypeId);
   return  Object.keys(filtered).map((x) => {
        return (<MenuItem value={filtered[x].limiterOptionId}>{filtered[x].limiterOptionName} </MenuItem>)
    })
}

{Object.keys(types).map((x) => {
                                        return (
                                            <div className="m-3">
                                                <FormControl variant="standard" sx={{ m: 1, minWidth: 1200 }}>
                                                    <InputLabel id="demo-simple-select-standard-label">{types[x].limiterTypeName}</InputLabel>
                                                    <Select
                                                        labelId="demo-simple-select-standard-label"
                                                        id="demo-simple-select-standard"
                                                        value={x == 0 ? company : x == 1 ? division : x == 2 ? jobDescription : x == 3 ? businessUnit  :x == 4 ? region : x == 5 ? costCenter : personType }
                                                        label={types[x].limiterTypeName}
                                                        onChange={(itm) => setTypeValue(itm.target.value[0], x)}
                                                        style={{width: '800px'}}
                                                        multiple
                                                    >
                                                       {getMenuItemsForType(types[x])}

                                                    </Select>
                                                </FormControl>
                                            </div>
                                        );
                                    })}