React Material-UI: открыть диалог по кнопке (на более высоком уровне), при этом createRef не работает с использованием withMobileDialog

Question

В моей демонстрации здесь https://codesandbox.io/s/zq833pq6o3 вы можете открыть одно диалоговое окно (Child-Dialog) двумя различными способами.

1. кнопкой, которая находится в этом диалоге (кнопка: ОТКРЫТА ЭТОМ)
2. кнопкой на родительском уровне (кнопка: OPEN BY REF)

Но тот же случай не работает с моим Login-Dialog в панели приложений. Разница между обоими случаями в том, что я использую

import withMobileDialog from "@material-ui/core/withMobileDialog";

...

export default withMobileDialog()(LoginDialog);
// instead of normal way: export default LoginDialog;

в моем логине-диалоге

1. Кнопка: LOGIN => работает и открывает диалог входа в систему

2. Кнопка: LOGIN REF => не работает, и я получаю ошибку:

   TypeError _this.dialogRef.current.handleClickOpen не является функцией

Как я могу исправить проблему ref? Изменяя команду экспорта?

те же проблемы также с использованием

export default withStyles(styles)(LoginForm); // instead of: export default LoginForm;

Спасибо!