fix(Windows + Linux): Fix not clickable window titlebar & menu

Remove need for #portalContainer

Author: adlk

src/containers/settings/SettingsWindow.js

@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import { observer, inject } from 'mobx-react';
 
@@ -11,18 +10,6 @@ import ErrorBoundary from '../../components/util/ErrorBoundary';
 import { workspaceStore } from '../../features/workspaces';
 
 export default @inject('stores', 'actions') @observer class SettingsContainer extends Component {
-  portalRoot = document.querySelector('#portalContainer');
-
-  el = document.createElement('div');
-
-  componentDidMount() {
-    this.portalRoot.appendChild(this.el);
-  }
-
-  componentWillUnmount() {
-    this.portalRoot.removeChild(this.el);
-  }
-
   render() {
     const { children, stores } = this.props;
     const { closeSettings } = this.props.actions.ui;
@@ -35,18 +22,15 @@ export default @inject('stores', 'actions') @observer class SettingsContainer ex
       />
     );
 
-    return ReactDOM.createPortal(
-      (
-        <ErrorBoundary>
-          <Layout
-            navigation={navigation}
-            closeSettings={closeSettings}
-          >
-            {children}
-          </Layout>
-        </ErrorBoundary>
-      ),
-      this.el,
+    return (
+      <ErrorBoundary>
+        <Layout
+          navigation={navigation}
+          closeSettings={closeSettings}
+        >
+          {children}
+        </Layout>
+      </ErrorBoundary>
     );
   }
 }

src/index.html

@@ -11,7 +11,6 @@
   <div class="window-draggable"></div>
   <div class="dev-warning">DEV MODE</div>
   <div id="root"></div>
-  <div id="portalContainer"></div>
   <script>
     document.querySelector('body').classList.add(process.env.OS_PLATFORM ? process.env.OS_PLATFORM : process.platform);
 

src/overlay.html

@@ -11,7 +11,6 @@
   <!-- <div class="window-draggable"></div> -->
   <!-- <button class="dev-warning" onclick="window.close()" style="pointer-events:all;">DEV MODE</button> -->
   <div id="root"></div>
-  <div id="portalContainer"></div>
   <script>
     document.querySelector('body').classList.add(process.env.OS_PLATFORM ? process.env.OS_PLATFORM : process.platform);
 

src/styles/layout.scss

@@ -172,12 +172,4 @@ body.win32 .window-draggable {
   width: auto;
   z-index: 999999999;
   pointer-events: none;
-}
-
-#portalContainer {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
 }