Tasks: make overdue secondary text red
Also add some logic to display tasks due today as "Due today" Tasks: fixesmaster
parent
5eea4e89a5
commit
0b5274887f
|
@ -58,6 +58,7 @@ export default React.memo(function TaskListItem(props: PropsType) {
|
|||
<ListItem
|
||||
primaryText={title}
|
||||
secondaryText={task.dueDate && `Due ${moment().to(task.dueDate.toJSDate())}`}
|
||||
secondaryTextColor={task.overdue ? 'error' : 'textSecondary'}
|
||||
onClick={() => onClick(task)}
|
||||
leftIcon={
|
||||
<Checkbox
|
||||
|
|
|
@ -230,6 +230,16 @@ export class TaskType extends EventType {
|
|||
return this.dueDate && moment(this.dueDate.toJSDate()).isSameOrBefore(moment(), 'day');
|
||||
}
|
||||
|
||||
get overdue() {
|
||||
if (!this.dueDate) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const dueDate = moment(this.dueDate.toJSDate());
|
||||
const now = moment();
|
||||
return (this.dueDate.isDate) ? dueDate.isBefore(now, 'day') : dueDate.isBefore(now);
|
||||
}
|
||||
|
||||
public clone() {
|
||||
const ret = new TaskType(new ICAL.Component(this.component.toJSON()));
|
||||
ret.color = this.color;
|
||||
|
|
|
@ -46,6 +46,7 @@ interface ListItemPropsType {
|
|||
insetChildren?: boolean;
|
||||
nestedItems?: React.ReactNode[];
|
||||
selected?: boolean;
|
||||
secondaryTextColor?: 'initial' | 'inherit' | 'primary' | 'secondary' | 'textPrimary' | 'textSecondary' | 'error';
|
||||
}
|
||||
|
||||
export const ListItem = React.memo(function ListItem(_props: ListItemPropsType) {
|
||||
|
@ -62,6 +63,7 @@ export const ListItem = React.memo(function ListItem(_props: ListItemPropsType)
|
|||
insetChildren,
|
||||
nestedItems,
|
||||
selected,
|
||||
secondaryTextColor,
|
||||
} = _props;
|
||||
|
||||
const extraProps = (onClick || href) ? {
|
||||
|
@ -84,7 +86,7 @@ export const ListItem = React.memo(function ListItem(_props: ListItemPropsType)
|
|||
{leftIcon}
|
||||
</ListItemIcon>
|
||||
)}
|
||||
<ListItemText inset={insetChildren} primary={primaryText} secondary={secondaryText}>
|
||||
<ListItemText inset={insetChildren} primary={primaryText} secondary={secondaryText} secondaryTypographyProps={{ color: secondaryTextColor }}>
|
||||
{children}
|
||||
</ListItemText>
|
||||
{rightIcon && (
|
||||
|
|
Loading…
Reference in New Issue