Problem with creating dependency using autocomplete API of material UI

I'm working on a project that uses typescript in conjunction with react js. Material UI is used for styling. With the material UI, I am using the autocomplete component. The problem is to make the component dependent on the parent. If the field in the parent element is empty, the second element should not be active. Docs of autocomplete API said that, you can use a disabled props. Please help me find a solution. Below is a part of the code of the component from the project

<GreenAutocomplete
  id="sub-economic-sector-input"
  dataFromApi={childItems}
  name="subEconomicSector"
  onChange={handelSubChangeEconomicSector}
  value={gkseChild}
  label={translate(
          "registerPage.thirdStep.subEconomicSector"
  )}
  childItems={childItems}
  disabled={childItems.length === 0}
  noOptionsText={translate(
                 "registerPage.inputHelperText.no_options_text"
  )}
  openText={translate(
           "registerPage.inputHelperText.open_text"
  )}
  clearText={translate(
            "registerPage.inputHelperText.clear_text"
  )}
   />

And there is the logic of childItems:

const handelChangeEconomicSector = (event: any): void => {
    let value = event.target.value;

    let currentArray: {}[] = gkseCode.filter(
        (parent: any) => value === parent.code
    );
    let currentItem: any = currentArray[0];

    if (currentItem.child.length !== 0) {
        setChildItems(currentItem.child);
        setOpen(true);
    } else {
        setChildItems([]);
        setOpen(false);
    }

    setGkseParent(value);
    dispatch(changeEconomicSector(currentItem.name_ru));
    dispatch(changeGksefCode(Number(currentItem.code)));
};

And the last, code of component itself:

<Autocomplete
            selectOnFocus={true}
            noOptionsText={noOptionsText}
            openText={openText}
            clearText={clearText}
            options={dataFromApi.map((item: any) => {
                let multiLangName =
                    language === "tm"
                        ? item.name_tm
                        : language === "ru"
                        ? item.name_ru
                        : language;
                return (
                    <option
                        className={classes.option}
                        value={item.code}
                        key={item.id}
                    >
                        {item.code} {multiLangName}
                    </option>
                );
            })}
            id={id}
            disabled={disabled}
            getOptionLabel={(option) => SelectInputName(option)}
            renderInput={(params) => (
                <TextField {...params} label={label} variant="outlined" 
                />
            )}
        />