Состояние моего компонента не обновляется при использовании функции обратного вызова из дочернего

Родительский компонент

function SourcePlate() {
  const [isOpen, setIsOpen] = React.useState(false);


  const handlePlateClick = () => {
    setIsOpen(true);    
  }

  const handleDialogClose = () => {
    setIsOpen(false);
    console.log(isOpen);
  }

    return (
        <div onClick={handlePlateClick}>
          <AutoCompleteDialog isOpen={isOpen} handleClose={handleDialogClose} title='Upload Plate'></AutoCompleteDialog>
        </div>        
    )
}

Дочерний компонент

export const AutoCompleteDialog = ({
        isOpen,
        handleClose
    }) => {
    return (
        <>
            <Dialog
                fullWidth
                maxWidth='md'
                open={isOpen}
                onClose={handleClose}                
            >
                <DialogActions>
                    <Button onClick={handleClose}>Close</Button>
                </DialogActions>

            </Dialog>
        </>
    )
}

Состояние моего компонента не обновляется при использовании функции обратного вызова от дочернего элемента.

Когда я нажимаю кнопку закрытия, мой диалог не закрывается, и мое состояние isOpen не обновляется до значения false. Что я могу исправить/изменить?