From 8ba770965359e6679bff5e3674c99089d49ad17a Mon Sep 17 00:00:00 2001
From: Andrew P Maney <amaney@usc.edu>
Date: Tue, 17 Mar 2020 15:02:18 -0700
Subject: [PATCH] Tasks: moves Sidebar specific logic into Sidebar component

also adds amount to Due Today filter
---
 src/components/Tasks/Sidebar.tsx  | 20 ++++++++++++++++----
 src/components/Tasks/TaskList.tsx |  8 +-------
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/components/Tasks/Sidebar.tsx b/src/components/Tasks/Sidebar.tsx
index 89a705a..5af5f2b 100644
--- a/src/components/Tasks/Sidebar.tsx
+++ b/src/components/Tasks/Sidebar.tsx
@@ -10,6 +10,9 @@ import { setSettings } from '../../store/actions';
 import { StoreState } from '../../store';
 
 import { List, ListItem, ListSubheader } from '../../widgets/List';
+import { TaskType } from '../../pim-types';
+
+import moment from 'moment';
 
 interface ListItemPropsType {
   name: string | null;
@@ -39,8 +42,17 @@ function SidebarListItem(props: ListItemPropsType) {
   );
 }
 
-export default function Sidebar(props: { tags: Map<string, number>, totalTasks: number }) {
-  const { tags, totalTasks } = props;
+export default function Sidebar(props: { tasks: TaskType[] }) {
+  const { tasks } = props;
+
+  // TODO: memoize
+  const amountDueToday = tasks.filter((x) => x.dueDate && moment(x.dueDate.toJSDate()).isSame(moment(), 'day')).length;
+
+  // TODO: memoize
+  const tags = new Map<string, number>();
+  tasks.forEach((task) => task.tags.forEach((tag) => {
+    tags.set(tag, (tags.get(tag) ?? 0) + 1);
+  }));
 
   const tagsList = [...tags].sort(([a], [b]) => a.localeCompare(b)).map(([tag, amount]) => (
     <SidebarListItem
@@ -54,8 +66,8 @@ export default function Sidebar(props: { tags: Map<string, number>, totalTasks:
 
   return (
     <List dense>
-      <SidebarListItem name={null} primaryText="All" icon={<InboxIcon />} amount={totalTasks} />
-      <SidebarListItem name="today" primaryText="Due today" icon={<TodayIcon />} />
+      <SidebarListItem name={null} primaryText="All" icon={<InboxIcon />} amount={tasks.length} />
+      <SidebarListItem name="today" primaryText="Due today" icon={<TodayIcon />} amount={amountDueToday} />
 
       <ListSubheader>Tags</ListSubheader>
       {tagsList}
diff --git a/src/components/Tasks/TaskList.tsx b/src/components/Tasks/TaskList.tsx
index ac9f16e..9269f61 100644
--- a/src/components/Tasks/TaskList.tsx
+++ b/src/components/Tasks/TaskList.tsx
@@ -58,12 +58,6 @@ export default React.memo(function TaskList(props: PropsType) {
     entries = potentialEntries;
   }
 
-  // TODO: memoize
-  const tags = new Map<string, number>();
-  potentialEntries.forEach((entry) => entry.tags.forEach((tag) => {
-    tags.set(tag, (tags.get(tag) ?? 0) + 1);
-  }));
-
   // sort
   const sortedEntries = sortSelector(entries);
 
@@ -84,7 +78,7 @@ export default React.memo(function TaskList(props: PropsType) {
     <Grid container spacing={4}>
 
       <Grid item xs={3} style={{ borderRight: `1px solid ${theme.palette.divider}` }}>
-        <Sidebar totalTasks={potentialEntries.length} tags={tags} />
+        <Sidebar tasks={potentialEntries} />
       </Grid>
 
       <Grid item xs>