TaskList: convert to a pure functional component.

master
Tom Hacohen 5 years ago
parent 1d792add0f
commit ec5d1faaa1

@ -26,34 +26,30 @@ const sortSelector = createSelector(
(entries) => entries.sort((a, b) => a.title.localeCompare(b.title))
);
class TaskList extends React.PureComponent {
public props: {
entries: TaskType[];
onItemClick: (entry: TaskType) => void;
};
public render() {
const entries = this.props.entries.filter((x) => !x.finished);
const sortedEntries = sortSelector(entries);
const itemList = sortedEntries.map((entry) => {
const uid = entry.uid;
return (
<TaskListItem
key={uid}
entry={entry}
onClick={this.props.onItemClick}
/>
);
});
interface PropsType {
entries: TaskType[];
onItemClick: (entry: TaskType) => void;
}
export default React.memo(function TaskList(props: PropsType) {
const entries = props.entries.filter((x) => !x.finished);
const sortedEntries = sortSelector(entries);
const itemList = sortedEntries.map((entry) => {
const uid = entry.uid;
return (
<List>
{itemList}
</List>
<TaskListItem
key={uid}
entry={entry}
onClick={props.onItemClick}
/>
);
}
}
});
export default TaskList;
return (
<List>
{itemList}
</List>
);
});

Loading…
Cancel
Save