Insert block menu (#297)

* Insert block behavior

* Functional with horizontal rule

* Add list and image upload working

* Cleanup typing

* Closest to correct behavior so far

* Improve block insert on list

* Hide (+) after clicking menu item

* Bad merge

frontend/components/DropdownMenu/DropdownMenu.js

@@ -1,5 +1,5 @@
 // @flow
-import React from 'react';
+import React, { Component } from 'react';
 import invariant from 'invariant';
 import { observable } from 'mobx';
 import { observer } from 'mobx-react';
@@ -10,14 +10,14 @@ import { color } from 'styles/constants';
 import { fadeAndScaleIn } from 'styles/animations';
 
 type Props = {
-  label: React.Element<any>,
-  onShow?: () => void,
+  label: React.Element<*>,
+  onOpen?: () => void,
   onClose?: () => void,
-  children?: React.Element<any>,
+  children?: React.Element<*>,
   style?: Object,
 };
 
-@observer class DropdownMenu extends React.Component {
+@observer class DropdownMenu extends Component {
   props: Props;
   actionRef: Object;
   @observable open: boolean = false;
@@ -37,7 +37,7 @@ type Props = {
       this.open = true;
       this.top = targetRect.bottom - bodyRect.top;
       this.right = bodyRect.width - targetRect.left - targetRect.width;
-      if (this.props.onShow) this.props.onShow();
+      if (this.props.onOpen) this.props.onOpen();
     }
   };
 

frontend/components/DropdownMenu/DropdownMenuItem.js

@@ -7,7 +7,7 @@ const DropdownMenuItem = ({
   onClick,
   children,
 }: {
-  onClick?: () => void,
+  onClick?: SyntheticEvent => void,
   children?: React.Element<any>,
 }) => {
   return (
@@ -24,11 +24,15 @@ const MenuItem = styled.div`
 
   color: ${color.slateDark};
   display: flex;
-  justify-content: space-between;
+  justify-content: left;
   align-items: center;
   cursor: pointer;
   font-size: 15px;
 
+  svg {
+    margin-right: 8px;
+  }
+
   a {
     text-decoration: none;
     width: 100%;