Material UI fill in select component based on outside source

I am writing a program that has a select field with options 1, 2, and 3. Users can choose between the 3. However another select that has an object that has a value relating to that select.

For example, if I choose ‘ten’ on the ‘Cycles’ select it is associated with an object (data) that contains a value associated with the type field. So if I select ‘Ten’, it has an object value data[‘type’] that would be 1. How can I have it so when I select a cycle option it will fill in the ‘type’ field.

              <FormControl
                sx={{ minWidth: 200 }}
                variant="standard"
                size="small"
              >
                <InputLabel>Type</InputLabel>
                <Select disabled={radioEdit}>
                  <MenuItem value="">
                    <em>None</em>
                  </MenuItem>
                  <MenuItem value={1}>1</MenuItem>
                  <MenuItem value={2}>2</MenuItem>
                  <MenuItem value={3}>3</MenuItem>
                </Select>
              </FormControl>

Here is the code I am using to declare my ‘type’ select component. The object is called data[‘type’]. How can I have that ‘type’ field empty until I select an option from ‘Cycles’ then fill it in automatically? Let me know if you need any other information, been stumped on this for awhile.