diff --git a/app/javascript/mastodon/components/status_list.jsx b/app/javascript/mastodon/components/status_list.jsx index e92dd233e15..1e3518740ec 100644 --- a/app/javascript/mastodon/components/status_list.jsx +++ b/app/javascript/mastodon/components/status_list.jsx @@ -50,13 +50,11 @@ export default class StatusList extends ImmutablePureComponent { }; handleMoveUp = (id, featured) => { - const elementIndex = this.getCurrentStatusIndex(id, featured) - 1; - this._selectChild(elementIndex, true); + this._selectChild(id, featured, true); }; handleMoveDown = (id, featured) => { - const elementIndex = this.getCurrentStatusIndex(id, featured) + 1; - this._selectChild(elementIndex, false); + this._selectChild(id, featured, false); }; handleLoadOlder = debounce(() => { @@ -64,18 +62,29 @@ export default class StatusList extends ImmutablePureComponent { onLoadMore(lastId || (statusIds.size > 0 ? statusIds.last() : undefined)); }, 300, { leading: true }); - _selectChild (index, align_top) { + _selectChild (id, featured, up) { + const align_top = up; const container = this.node.node; - const element = container.querySelector(`article:nth-of-type(${index + 1}) .focusable`); + const elementIndex = this.getCurrentStatusIndex(id, featured); + const increment = up ? -1 : 1 + let index = elementIndex; - if (element) { - if (align_top && container.scrollTop > element.offsetTop) { - element.scrollIntoView(true); - } else if (!align_top && container.scrollTop + container.clientHeight < element.offsetTop + element.offsetHeight) { - element.scrollIntoView(false); + let element = null; + while (element === null) { + index += increment; + const article = container.querySelector(`article:nth-of-type(${index + 1})`); + if (article === null) { + return; } - element.focus(); + element = article.querySelector(".focusable"); } + + if (align_top && container.scrollTop > element.offsetTop) { + element.scrollIntoView(true); + } else if (!align_top && container.scrollTop + container.clientHeight < element.offsetTop + element.offsetHeight) { + element.scrollIntoView(false); + } + element.focus(); } setRef = c => {