Refactor

app/src/components/Layout/ContentView.tsx

@@ -23,6 +23,12 @@ function ContentView(props: Props) {
     setDetectedHeight(newHeight)
   }, [])
 
+  const closeDrawerCompletelyIfItSitsOnTheEdge = React.useCallback(() => {
+    if (detectedHeight < 30) {
+      setHeight('100%')
+    }
+  }, [detectedHeight])
+
   // Open chart panel on start and when a new chart is added but the panel is closed
   React.useEffect(() => {
     const almostClosed = !isNaN(height as any) && detectedHeight < 30
@@ -48,6 +54,7 @@ function ContentView(props: Props) {
         pane1Style={{ maxHeight: '100%' }}
         pane2Style={{ borderTop: '1px solid #999', display: 'flex' }}
         onChange={setHeight}
+        onDragFinished={closeDrawerCompletelyIfItSitsOnTheEdge}
       >
         <span>
           <ReactSplitPane

app/src/components/Layout/PauseButton.tsx

@@ -2,7 +2,7 @@ import * as React from 'react'
 import * as q from '../../../../backend/src/Model'
 import CustomIconButton from '../helper/CustomIconButton'
 import Pause from '@material-ui/icons/PauseCircleFilled'
-import Resume from '@material-ui/icons/PlayCircleFilled'
+import Resume from '@material-ui/icons/PlayArrow'
 import { AppState } from '../../reducers'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'