54 lines
1.6 KiB
TypeScript
54 lines
1.6 KiB
TypeScript
import React from 'react';
|
|
import styled from 'styled-components';
|
|
import { TaskActivityData, ActivityType } from 'shared/generated/graphql';
|
|
import dayjs from 'dayjs';
|
|
|
|
type ActivityMessageProps = {
|
|
type: ActivityType;
|
|
data: Array<TaskActivityData>;
|
|
};
|
|
|
|
function getVariable(data: Array<TaskActivityData>, name: string) {
|
|
const target = data.find(d => d.name === name);
|
|
return target ? target.value : null;
|
|
}
|
|
|
|
function renderDate(timestamp: string | null) {
|
|
if (timestamp) {
|
|
return dayjs(timestamp).format('MMM D [at] h:mm A');
|
|
}
|
|
return null;
|
|
}
|
|
|
|
const ActivityMessage: React.FC<ActivityMessageProps> = ({ type, data }) => {
|
|
let message = '';
|
|
switch (type) {
|
|
case ActivityType.TaskAdded:
|
|
message = `added this task to ${getVariable(data, 'TaskGroup')}`;
|
|
break;
|
|
case ActivityType.TaskMoved:
|
|
message = `moved this task from ${getVariable(data, 'PrevTaskGroup')} to ${getVariable(data, 'CurTaskGroup')}`;
|
|
break;
|
|
case ActivityType.TaskDueDateAdded:
|
|
message = `set this task to be due ${renderDate(getVariable(data, 'DueDate'))}`;
|
|
break;
|
|
case ActivityType.TaskDueDateRemoved:
|
|
message = `removed the due date from this task`;
|
|
break;
|
|
case ActivityType.TaskDueDateChanged:
|
|
message = `changed the due date of this task to ${renderDate(getVariable(data, 'CurDueDate'))}`;
|
|
break;
|
|
case ActivityType.TaskMarkedComplete:
|
|
message = `marked this task complete`;
|
|
break;
|
|
case ActivityType.TaskMarkedIncomplete:
|
|
message = `marked this task incomplete`;
|
|
break;
|
|
default:
|
|
message = '<unknown type>';
|
|
}
|
|
return <>{message}</>;
|
|
};
|
|
|
|
export default ActivityMessage;
|