Page MenuHomePhabricator

D5230.id17150.diff
No OneTemporary

D5230.id17150.diff

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<ThreadInfo>,
};
-type State = {
- +currentPage: number,
-};
-
-class ThreadPicker extends React.PureComponent<Props, State> {
- static pageSize = 5;
+class ThreadPicker extends React.PureComponent<Props> {
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 = <LeftPager className={css.pagerIcon} />;
- if (this.state.currentPage > 0) {
- leftPager = (
- <a
- href="#"
- className={css.pagerButton}
- onClick={this.onBackPagerClick}
- >
- {leftPager}
- </a>
- );
- }
- let rightPager = <RightPager className={css.pagerIcon} />;
- if (ThreadPicker.pageSize * (this.state.currentPage + 1) < length) {
- rightPager = (
- <a
- href="#"
- className={css.pagerButton}
- onClick={this.onNextPagerClick}
- >
- {rightPager}
- </a>
- );
- }
- pager = (
- <div className={css.pagerContainer} key="pager">
- <div className={css.pager}>
- {leftPager}
- <span className={css.pagerStatus}>
- {`${firstIndex + 1}–${secondIndex} of ${length}`}
- </span>
- {rightPager}
- </div>
- </div>
- );
- }
- const options = this.props.onScreenThreadInfos
- .slice(firstIndex, secondIndex)
- .map(threadInfo => (
- <ThreadPickerOption
- threadInfo={threadInfo}
- createNewEntry={this.props.createNewEntry}
- key={threadInfo.id}
- />
- ));
+ const options = this.props.onScreenThreadInfos.map(threadInfo => (
+ <ThreadPickerOption
+ threadInfo={threadInfo}
+ createNewEntry={this.props.createNewEntry}
+ key={threadInfo.id}
+ />
+ ));
return (
<div
@@ -137,7 +82,6 @@
ref={this.pickerDivRef}
>
{options}
- {pager}
</div>
);
}
@@ -161,26 +105,6 @@
event.preventDefault();
}
};
-
- onBackPagerClick = (event: SyntheticEvent<HTMLAnchorElement>) => {
- event.preventDefault();
- this.setState(prevState => {
- invariant(prevState.currentPage > 0, "can't go back from 0");
- return { currentPage: prevState.currentPage - 1 };
- });
- };
-
- onNextPagerClick = (event: SyntheticEvent<HTMLAnchorElement>) => {
- 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<BaseProps> = React.memo<BaseProps>(
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 (
- <SVG className={props.className} viewBox="0 0 512 512">
- <polygon
- points={
- '352,128.4 319.7,96 160,256 160,256 160,256 319.7,416 ' +
- '352,383.6 224.7,256'
- }
- />
- </SVG>
- );
-}
-
-export function RightPager(props: { className?: string }): React.Node {
- return (
- <SVG className={props.className} viewBox="0 0 512 512">
- <polygon
- points={
- '160,128.4 192.3,96 352,256 352,256 352,256 192.3,416 ' +
- '160,383.6 287.3,256 '
- }
- />
- </SVG>
- );
-}
-
export function UpCaret(props: { className?: string }): React.Node {
return (
<SVG

File Metadata

Mime Type
text/plain
Expires
Tue, Nov 26, 10:09 PM (1 h, 37 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2586492
Default Alt Text
D5230.id17150.diff (5 KB)

Event Timeline