{domain} }} />,\n confirm: this.props.intl.formatMessage(messages.blockDomainConfirm),\n onConfirm: () => this.props.dispatch(blockDomain(domain)),\n }));\n }\n\n handleUnblockDomainClick = domain => {\n this.props.dispatch(unblockDomain(domain));\n }\n\n\n handleHotkeyMoveUp = () => {\n this.handleMoveUp(this.props.status.get('id'));\n }\n\n handleHotkeyMoveDown = () => {\n this.handleMoveDown(this.props.status.get('id'));\n }\n\n handleHotkeyReply = e => {\n e.preventDefault();\n this.handleReplyClick(this.props.status);\n }\n\n handleHotkeyFavourite = () => {\n this.handleFavouriteClick(this.props.status);\n }\n\n handleHotkeyBoost = () => {\n this.handleReblogClick(this.props.status);\n }\n\n handleHotkeyMention = e => {\n e.preventDefault();\n this.handleMentionClick(this.props.status.get('account'));\n }\n\n handleHotkeyOpenProfile = () => {\n this.context.router.history.push(`/accounts/${this.props.status.getIn(['account', 'id'])}`);\n }\n\n handleHotkeyToggleHidden = () => {\n this.handleToggleHidden(this.props.status);\n }\n\n handleHotkeyToggleSensitive = () => {\n this.handleToggleMediaVisibility();\n }\n\n handleMoveUp = id => {\n const { status, ancestorsIds, descendantsIds } = this.props;\n\n if (id === status.get('id')) {\n this._selectChild(ancestorsIds.size - 1, true);\n } else {\n let index = ancestorsIds.indexOf(id);\n\n if (index === -1) {\n index = descendantsIds.indexOf(id);\n this._selectChild(ancestorsIds.size + index, true);\n } else {\n this._selectChild(index - 1, true);\n }\n }\n }\n\n handleMoveDown = id => {\n const { status, ancestorsIds, descendantsIds } = this.props;\n\n if (id === status.get('id')) {\n this._selectChild(ancestorsIds.size + 1, false);\n } else {\n let index = ancestorsIds.indexOf(id);\n\n if (index === -1) {\n index = descendantsIds.indexOf(id);\n this._selectChild(ancestorsIds.size + index + 2, false);\n } else {\n this._selectChild(index + 1, false);\n }\n }\n }\n\n _selectChild (index, align_top) {\n const container = this.node;\n const element = container.querySelectorAll('.focusable')[index];\n\n if (element) {\n if (align_top && container.scrollTop > element.offsetTop) {\n element.scrollIntoView(true);\n } else if (!align_top && container.scrollTop + container.clientHeight < element.offsetTop + element.offsetHeight) {\n element.scrollIntoView(false);\n }\n element.focus();\n }\n }\n\n renderChildren (list) {\n return list.map(id => (\n \n ));\n }\n\n setRef = c => {\n this.node = c;\n }\n\n componentDidUpdate () {\n if (this._scrolledIntoView) {\n return;\n }\n\n const { status, ancestorsIds } = this.props;\n\n if (status && ancestorsIds && ancestorsIds.size > 0) {\n const element = this.node.querySelectorAll('.focusable')[ancestorsIds.size - 1];\n\n window.requestAnimationFrame(() => {\n element.scrollIntoView(true);\n });\n this._scrolledIntoView = true;\n }\n }\n\n componentWillUnmount () {\n detachFullscreenListener(this.onFullScreenChange);\n }\n\n onFullScreenChange = () => {\n this.setState({ fullscreen: isFullscreen() });\n }\n\n render () {\n let ancestors, descendants;\n const { shouldUpdateScroll, status, ancestorsIds, descendantsIds, intl, domain, multiColumn } = this.props;\n const { fullscreen } = this.state;\n\n if (status === null) {\n return (\n \n \n \n \n );\n }\n\n if (ancestorsIds && ancestorsIds.size > 0) {\n ancestors = {this.renderChildren(ancestorsIds)}
;\n }\n\n if (descendantsIds && descendantsIds.size > 0) {\n descendants = {this.renderChildren(descendantsIds)}
;\n }\n\n const handlers = {\n moveUp: this.handleHotkeyMoveUp,\n moveDown: this.handleHotkeyMoveDown,\n reply: this.handleHotkeyReply,\n favourite: this.handleHotkeyFavourite,\n boost: this.handleHotkeyBoost,\n mention: this.handleHotkeyMention,\n openProfile: this.handleHotkeyOpenProfile,\n toggleHidden: this.handleHotkeyToggleHidden,\n toggleSensitive: this.handleHotkeyToggleSensitive,\n openMedia: this.handleHotkeyOpenMedia,\n };\n\n return (\n \n \n )}\n />\n\n \n \n {ancestors}\n\n
\n \n \n\n {descendants}\n