fix(authentication): removed cancel event from overlay effect (#9274)

* fix(authentication) resolved #9263 issue

* fix(authentication) hide dialog close icon

* fix(authentication) fixed lint error about missing prop

react/features/authentication/components/web/LoginDialog.js

 import { translate, translateToHTML } from '../../../base/i18n';
 import { JitsiConnectionErrors } from '../../../base/lib-jitsi-meet';
 import { connect as reduxConnect } from '../../../base/redux';
-import { authenticateAndUpgradeRole, cancelLogin } from '../../actions.web';
+import {
+    authenticateAndUpgradeRole,
+    cancelLogin
+} from '../../actions.web';
 
 /**
  * The type of the React {@code Component} props of {@link LoginDialog}.
      */
     _onCancelLogin() {
         const { dispatch } = this.props;
+        const cancelButton = document.getElementById('modal-dialog-cancel-button');
 
-        dispatch(cancelLogin());
+        if (cancelButton) {
+            cancelButton.onclick = () => {
+                dispatch(cancelLogin());
+            };
+        }
+
+        return false;
     }
 
     _onLogin: () => void;
 
         return (
             <Dialog
+                hideCloseIconButton = { true }
                 okDisabled = {
                     connecting
                     || loginStarted

react/features/authentication/components/web/WaitForOwnerDialog.js

      */
     _onCancelWaitForOwner() {
         const { dispatch } = this.props;
+        const cancelButton = document.getElementById('modal-dialog-cancel-button');
 
-        dispatch(cancelWaitForOwner());
+        if (cancelButton) {
+            cancelButton.onclick = () => {
+                dispatch(cancelWaitForOwner());
+            };
+        }
+
+        return false;
     }
 
     _onIAmHost: () => void;
 
         return (
             <Dialog
+                hideCloseIconButton = { true }
                 okKey = { t('dialog.IamHost') }
                 onCancel = { this._onCancelWaitForOwner }
                 onSubmit = { this._onIAmHost }

react/features/base/dialog/components/web/ModalHeader.js

     id: string,
     appearance?: 'danger' | 'warning',
     heading: string,
+    hideCloseIconButton: boolean,
     onClose: Function,
     showKeyline: boolean,
     isHeadingMultiline: boolean,
             id,
             appearance,
             heading,
+            hideCloseIconButton,
             onClose,
             showKeyline,
             isHeadingMultiline,
                         {heading}
                     </TitleText>
                 </Title>
-                <Icon
-                    onClick = { onClose }
-                    src = { IconClose } />
+                {
+                    !hideCloseIconButton && <Icon
+                        onClick = { onClose }
+                        src = { IconClose } />
+                }
             </Header>
         );
     }

react/features/base/dialog/components/web/StatelessDialog.js

      */
     hideCancelButton: boolean,
 
+    /**
+     * If true, the close icon button will not be displayed.
+     */
+    hideCloseIconButton: boolean,
+
     /**
      * If true, no footer will be displayed.
      */
  * Web dialog that uses atlaskit modal-dialog to display dialogs.
  */
 class StatelessDialog extends Component<Props> {
+    static defaultProps = {
+        hideCloseIconButton: false
+    };
+
     /**
      * The functional component to be used for rendering the modal footer.
      */
         const {
             customHeader,
             children,
+            hideCloseIconButton,
             t /* The following fixes a flow error: */ = _.identity,
             titleString,
             titleKey,
                     Header: customHeader ? customHeader : props => (
                         <ModalHeader
                             { ...props }
-                            heading = { titleString || t(titleKey) } />
+                            heading = { titleString || t(titleKey) }
+                            hideCloseIconButton = { hideCloseIconButton } />
                     )
                 }}
                 footer = { this._renderFooter }