diff --git a/frontend/components/DropdownMenu/DropdownMenu.js b/frontend/components/DropdownMenu/DropdownMenu.js index 3e41ecba..0792b5b9 100644 --- a/frontend/components/DropdownMenu/DropdownMenu.js +++ b/frontend/components/DropdownMenu/DropdownMenu.js @@ -28,14 +28,17 @@ type DropdownMenuProps = { handleClick = (ev: SyntheticEvent) => { ev.preventDefault(); ev.stopPropagation(); + const currentTarget = ev.currentTarget; invariant(document.body, 'why you not here'); - const bodyRect = document.body.getBoundingClientRect(); - // $FlowIssue it's there - const targetRect = ev.currentTarget.getBoundingClientRect(); - 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 (currentTarget instanceof HTMLDivElement) { + const bodyRect = document.body.getBoundingClientRect(); + const targetRect = currentTarget.getBoundingClientRect(); + this.open = true; + this.top = targetRect.bottom - bodyRect.top; + this.right = bodyRect.width - targetRect.left - targetRect.width; + if (this.props.onShow) this.props.onShow(); + } }; handleClose = (ev: SyntheticEvent) => { diff --git a/frontend/components/Layout/components/SidebarLink.js b/frontend/components/Layout/components/SidebarLink.js index b8017198..0c213f6b 100644 --- a/frontend/components/Layout/components/SidebarLink.js +++ b/frontend/components/Layout/components/SidebarLink.js @@ -9,7 +9,9 @@ const activeStyle = { fontWeight: fontWeight.semiBold, }; -// $FlowFixMe :/ +// This is a hack for `styleComponent()` as NavLink fails to render without `to` prop +const StyleableDiv = props =>
; + const styleComponent = component => styled(component)` display: block; overflow: hidden; @@ -25,7 +27,7 @@ const styleComponent = component => styled(component)` `; function SidebarLink(props: Object) { - const Component = styleComponent(props.to ? NavLink : 'div'); + const Component = styleComponent(props.to ? NavLink : StyleableDiv); return ; } diff --git a/frontend/menus/CollectionMenu.js b/frontend/menus/CollectionMenu.js index a32da472..dd049a6e 100644 --- a/frontend/menus/CollectionMenu.js +++ b/frontend/menus/CollectionMenu.js @@ -11,8 +11,8 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu'; @observer class CollectionMenu extends Component { props: { label?: React$Element, - onShow?: Function, - onClose?: Function, + onShow?: () => void, + onClose?: () => void, history: Object, ui: UiStore, collection: Collection, @@ -49,7 +49,6 @@ import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu'; const MoreIcon = styled(Icon)` width: 22px; - height: 22px; `; export default inject('ui')(CollectionMenu);