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