diff --git a/web/calendar/thread-picker.css b/web/calendar/thread-picker.css --- a/web/calendar/thread-picker.css +++ b/web/calendar/thread-picker.css @@ -43,30 +43,3 @@ div.threadName { padding-top: 1px; } -div.pagerContainer { - text-align: center; - height: 15px; - margin-top: -2px; - cursor: default; - background-color: #eaeaea; - position: relative; - border-radius: 0 0 3px 3px; -} -div.pager { - position: relative; - top: -2px; -} -span.pagerStatus { - text-transform: uppercase; - color: #777777; - font-size: 9px; -} -svg.pagerIcon { - fill: #777777; - vertical-align: middle; - width: 13px; - height: 13px; -} -a.pagerButton > svg.pagerIcon { - fill: #2a5db0; -} 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( diff --git a/web/vectors.react.js b/web/vectors.react.js --- a/web/vectors.react.js +++ b/web/vectors.react.js @@ -21,32 +21,6 @@ ); } -export function LeftPager(props: { className?: string }): React.Node { - return ( - - - - ); -} - -export function RightPager(props: { className?: string }): React.Node { - return ( - - - - ); -} - export function UpCaret(props: { className?: string }): React.Node { return (