diff --git a/src/components/Tasks/Sidebar.tsx b/src/components/Tasks/Sidebar.tsx index 69fff91..89a705a 100644 --- a/src/components/Tasks/Sidebar.tsx +++ b/src/components/Tasks/Sidebar.tsx @@ -4,6 +4,7 @@ import { useSelector, useDispatch } from 'react-redux'; import InboxIcon from '@material-ui/icons/Inbox'; import LabelIcon from '@material-ui/icons/LabelOutlined'; +import TodayIcon from '@material-ui/icons/Today'; import { setSettings } from '../../store/actions'; import { StoreState } from '../../store'; @@ -54,6 +55,7 @@ export default function Sidebar(props: { tags: Map, totalTasks: return ( } amount={totalTasks} /> + } /> Tags {tagsList} diff --git a/src/components/Tasks/TaskList.tsx b/src/components/Tasks/TaskList.tsx index 3b5559c..ac9f16e 100644 --- a/src/components/Tasks/TaskList.tsx +++ b/src/components/Tasks/TaskList.tsx @@ -24,6 +24,8 @@ import Sidebar from './Sidebar'; import { StoreState } from '../../store'; +import moment from 'moment'; + const sortSelector = createSelector( (entries: TaskType[]) => entries, (entries) => entries.sort((a, b) => a.title.localeCompare(b.title)) @@ -44,10 +46,14 @@ export default React.memo(function TaskList(props: PropsType) { const potentialEntries = props.entries.filter((x) => showCompleted || !x.finished); let entries; + + // filter const tagPrefix = 'tag:'; if (filterBy?.startsWith(tagPrefix)) { const tag = filterBy.slice(tagPrefix.length); entries = potentialEntries.filter((x) => x.tags.includes(tag)); + } else if (filterBy === 'today') { + entries = potentialEntries.filter((x) => x.dueDate && moment(x.dueDate.toJSDate()).isSame(moment(), 'day')); } else { entries = potentialEntries; } @@ -58,6 +64,7 @@ export default React.memo(function TaskList(props: PropsType) { tags.set(tag, (tags.get(tag) ?? 0) + 1); })); + // sort const sortedEntries = sortSelector(entries); const itemList = sortedEntries.map((entry) => {