diff --git a/web/calendar/thread-picker.react.js b/web/calendar/thread-picker.react.js --- a/web/calendar/thread-picker.react.js +++ b/web/calendar/thread-picker.react.js @@ -8,7 +8,6 @@ import { useSelector } from '../redux/redux-utils'; import { htmlTargetFromEvent } from '../vector-utils'; -import { LeftPager, RightPager } from '../vectors.react'; import css from './thread-picker.css'; type OptionProps = { @@ -41,20 +40,12 @@ ...BaseProps, +onScreenThreadInfos: $ReadOnlyArray, }; -type State = { - +currentPage: number, -}; - -class ThreadPicker extends React.PureComponent { - static pageSize = 5; +class ThreadPicker extends React.PureComponent { pickerDiv: ?HTMLDivElement; constructor(props: Props) { super(props); - this.state = { - currentPage: 0, - }; invariant( props.onScreenThreadInfos.length > 0, "ThreadPicker can't be open when onScreenThreadInfos is empty", @@ -72,60 +63,14 @@ length > 0, "ThreadPicker can't be open when onScreenThreadInfos is empty", ); - const firstIndex = ThreadPicker.pageSize * this.state.currentPage; - const secondIndex = Math.min( - ThreadPicker.pageSize * (this.state.currentPage + 1), - length, - ); - - let pager = null; - if (length > ThreadPicker.pageSize) { - let leftPager = ; - if (this.state.currentPage > 0) { - leftPager = ( - - {leftPager} - - ); - } - let rightPager = ; - if (ThreadPicker.pageSize * (this.state.currentPage + 1) < length) { - rightPager = ( - - {rightPager} - - ); - } - pager = ( -
-
- {leftPager} - - {`${firstIndex + 1}–${secondIndex} of ${length}`} - - {rightPager} -
-
- ); - } - const options = this.props.onScreenThreadInfos - .slice(firstIndex, secondIndex) - .map(threadInfo => ( - - )); + const options = this.props.onScreenThreadInfos.map(threadInfo => ( + + )); return (
{options} - {pager}
); } @@ -161,26 +105,6 @@ event.preventDefault(); } }; - - onBackPagerClick = (event: SyntheticEvent) => { - event.preventDefault(); - this.setState(prevState => { - invariant(prevState.currentPage > 0, "can't go back from 0"); - return { currentPage: prevState.currentPage - 1 }; - }); - }; - - onNextPagerClick = (event: SyntheticEvent) => { - event.preventDefault(); - this.setState((prevState, props) => { - invariant( - ThreadPicker.pageSize * (prevState.currentPage + 1) < - props.onScreenThreadInfos.length, - 'page is too high', - ); - return { currentPage: prevState.currentPage + 1 }; - }); - }; } const ConnectedThreadPicker: React.ComponentType = React.memo(