close modal by clicking outside of it

src/renderer/component/video/view.jsx

@@ -195,7 +195,10 @@ class Video extends React.PureComponent<Props> {
             style={layoverStyle}
           >
             <VideoPlayButton
-              play={this.playContent}
+              play={e => {
+                e.stopPropagation();
+                this.playContent();
+              }}
               fileInfo={fileInfo}
               uri={uri}
               isLoading={isLoading}

src/renderer/modal/modal.jsx

@@ -56,7 +56,7 @@ export class Modal extends React.PureComponent<ModalProps> {
     return (
       <ReactModal
         {...modalProps}
-        onCloseRequested={onAborted || onConfirmed}
+        onRequestClose={onAborted || onConfirmed}
         className={classnames(className, {
           modal: !fullScreen,
           'modal--fullscreen': fullScreen,

src/renderer/modal/modalAffirmPurchase/view.jsx

@@ -3,6 +3,12 @@ import FilePrice from 'component/filePrice';
 import { Modal } from 'modal/modal';
 
 class ModalAffirmPurchase extends React.PureComponent {
+  constructor() {
+    super();
+
+    this.onAffirmPurchase = this.onAffirmPurchase.bind(this);
+  }
+
   onAffirmPurchase() {
     this.props.closeModal();
     this.props.loadVideo(this.props.uri);
@@ -20,7 +26,7 @@ class ModalAffirmPurchase extends React.PureComponent {
         type="confirm"
         isOpen
         contentLabel={__('Confirm Purchase')}
-        onConfirmed={this.onAffirmPurchase.bind(this)}
+        onConfirmed={this.onAffirmPurchase}
         onAborted={cancelPurchase}
       >
         {__('This will purchase')} <strong>{title}</strong> {__('for')}{' '}