diff --git a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js index e53162992..70fe0cdd5 100644 --- a/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js +++ b/client/coral-admin/src/containers/ModerationQueue/ModerationContainer.js @@ -3,6 +3,7 @@ import {connect} from 'react-redux'; import {compose} from 'react-apollo'; import key from 'keymaster'; import isEqual from 'lodash/isEqual'; +import styles from './components/styles.css'; import {modQueueQuery} from '../../graphql/queries'; import {banUser, setCommentStatus} from '../../graphql/mutations'; @@ -90,6 +91,15 @@ class ModerationContainer extends Component { key.unbind('t'); } + componentDidUpdate(_, prevState) { + + // If paging through using keybaord shortcuts, scroll the page to keep the selected + // comment in view. + if (prevState.selectedIndex !== this.state.selectedIndex) { + document.querySelector(`.${styles.selected}`).scrollIntoViewIfNeeded(); + } + } + componentWillReceiveProps(nextProps) { const {updateAssets} = this.props; if(!isEqual(nextProps.data.assets, this.props.data.assets)) {