Clear selection if no element is clicked

src/index.js

@@ -327,6 +327,7 @@ class App extends React.Component {
           onMouseDown={e => {
             const x = e.clientX - e.target.offsetLeft;
             const y = e.clientY - e.target.offsetTop;
+            const element = newElement(this.state.elementType, x, y);
             let isDraggingElements = false;
             const cursorStyle = document.documentElement.style.cursor;
             if (this.state.elementType === "selection") {
@@ -341,8 +342,7 @@ class App extends React.Component {
               if (isDraggingElements) {
                 document.documentElement.style.cursor = "move";
               }
-            } else {
-              const element = newElement(this.state.elementType, x, y);
+            } 
 
             if (this.state.elementType === "text") {
               const text = prompt("What text do you want?");
@@ -376,7 +376,6 @@ class App extends React.Component {
             } else {
               this.setState({ draggingElement: element });
             }
-            }
 
             let lastX = x;
             let lastY = y;
@@ -417,22 +416,30 @@ class App extends React.Component {
             };
 
             const onMouseUp = e => {
+              const { draggingElement, elementType } = this.state
+
               window.removeEventListener("mousemove", onMouseMove);
               window.removeEventListener("mouseup", onMouseUp);
+
               document.documentElement.style.cursor = cursorStyle;
 
-              const draggingElement = this.state.draggingElement;
+              // if no element is clicked, clear the selection and redraw
               if (draggingElement === null) {
-                return;
+                clearSelection()
+                drawScene();
+                return
               }
-              if (this.state.elementType === "selection") {
+
+              if (elementType === "selection") {
                 if (isDraggingElements) {
                   isDraggingElements = false;
                 } 
+                elements.pop()
                 setSelection(draggingElement);
               } else {
                 draggingElement.isSelected = true;
               }
+
               this.setState({
                 draggingElement: null,
                 elementType: "selection"