admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Updates date style on tasks page (#1244)

Browse Source 
* updates date style on tasks page

* re-run tests
This commit is contained in:
Srikar Samudrala
2023-08-18 01:19:09 +05:30
committed by GitHub
parent f4accc66fa
commit cf1dfb8c42
3 changed files with 77 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
front/src/modules/activities/components/TaskRow.tsx
View File

@ -9,7 +9,7 @@ import {
CheckboxShape,
} from '@/ui/input/checkbox/components/Checkbox';
import { OverflowingTextWithTooltip } from '@/ui/tooltip/OverflowingTextWithTooltip';
import { beautifyExactDate } from '~/utils/date-utils';
import { beautifyExactDate, hasDatePassed } from '~/utils/date-utils';
import { useCompleteTask } from '../hooks/useCompleteTask';
import { TaskForList } from '../types/TaskForList';
@ -49,9 +49,12 @@ const StyledCommentIcon = styled.div`
margin-left: ${({ theme }) => theme.spacing(2)};
`;
const StyledDueDate = styled.div`
const StyledDueDate = styled.div<{
isPast: boolean;
}>`
align-items: center;
color: ${({ theme }) => theme.font.color.secondary};
color: ${({ theme, isPast }) =>
isPast ? theme.font.color.danger : theme.font.color.secondary};
display: flex;
gap: ${({ theme }) => theme.spacing(1)};
padding-left: ${({ theme }) => theme.spacing(2)};
@ -98,7 +101,7 @@ export function TaskRow({ task }: { task: TaskForList }) {
</StyledTaskBody>
<StyledFieldsContainer>
<ActivityTargetChips targets={task.activityTargets} />
<StyledDueDate>
<StyledDueDate isPast={!!task.dueAt && hasDatePassed(task.dueAt)}>
<IconCalendar size={theme.icon.size.md} />
{task.dueAt && beautifyExactDate(task.dueAt)}
</StyledDueDate>