- PR Change Requests (Progress)

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/task-list/task-list.component.jsx

@@ -15,7 +15,7 @@ import {
   PlusCircleFilled,
   SyncOutlined
 } from "@ant-design/icons";
-import { DateFormatter } from "../../utils/DateFormatter.jsx";
+import { DateFormatter, DateTimeFormatter } from "../../utils/DateFormatter.jsx";
 import { connect } from "react-redux";
 import { setModalContext } from "../../redux/modals/modals.actions";
 
@@ -33,12 +33,26 @@ const DueDateRecord = ({ dueDate }) => {
   const isBeforeToday = dueDateDayjs.isBefore(dayjs());
 
   return (
-    <div title={relativeDueDate} style={{ color: isBeforeToday ? "red" : "black" }}>
+    <div title={relativeDueDate} style={isBeforeToday ? { color: "red" } : {}}>
       <DateFormatter>{dueDate}</DateFormatter>
     </div>
   );
 };
 
+const RemindAtRecord = ({ remindAt }) => {
+  if (!remindAt) return <></>;
+
+  const remindAtDayjs = dayjs(remindAt);
+  const relativeRemindAtDate = remindAtDayjs.fromNow();
+  const isBeforeToday = remindAtDayjs.isBefore(dayjs());
+
+  return (
+    <div title={relativeRemindAtDate} style={isBeforeToday ? { color: "red" } : {}}>
+      <DateTimeFormatter>{remindAt}</DateTimeFormatter>
+    </div>
+  );
+};
+
 /**
  * Priority Label Component
  * @param priority
@@ -68,7 +82,7 @@ const PriorityLabel = ({ priority }) => {
     default:
       return (
         <div>
-          None <ExclamationCircleFilled style={{ marginLeft: "5px", color: "black" }} />
+          None <ExclamationCircleFilled style={{ marginLeft: "5px" }} />
         </div>
       );
   }
@@ -79,9 +93,7 @@ const mapDispatchToProps = (dispatch) => ({
   setTaskUpsertContext: (context) => dispatch(setModalContext({ context, modal: "taskUpsert" }))
 });
 
-const mapStateToProps = (state) => ({
-  // Existing state props...
-});
+const mapStateToProps = (state) => ({});
 
 export default connect(mapStateToProps, mapDispatchToProps)(TaskListComponent);
 
@@ -99,6 +111,7 @@ function TaskListComponent({
   relationshipId,
   onlyMine,
   parentJobId,
+  query,
   showRo = true
 }) {
   const { t } = useTranslation();
@@ -111,6 +124,17 @@ function TaskListComponent({
   const history = useNavigate();
   const columns = [];
 
+  columns.push({
+    title: t("tasks.fields.created_at"),
+    dataIndex: "created_at",
+    key: "created_at",
+    width: "8%",
+    defaultSortOrder: "ascend",
+    sorter: true,
+    sortOrder: sortcolumn === "created_at" && sortorder,
+    render: (text, record) => <DateTimeFormatter>{record.created_at}</DateTimeFormatter>
+  });
+
   if (!onlyMine) {
     columns.push({
       title: t("tasks.fields.assigned_to"),
@@ -204,7 +228,7 @@ function TaskListComponent({
       sorter: true,
       sortOrder: sortcolumn === "remind_at" && sortorder,
       width: "8%",
-      render: (text, record) => <DueDateRecord dueDate={record.remind_at} />
+      render: (text, record) => <RemindAtRecord remindAt={record.remind_at} />
     },
     {
       title: t("tasks.fields.priority"),
@@ -226,7 +250,8 @@ function TaskListComponent({
             onClick={() => {
               setTaskUpsertContext({
                 context: {
-                  existingTask: record
+                  existingTask: record,
+                  query
                 }
               });
             }}
@@ -252,10 +277,11 @@ function TaskListComponent({
       actions: {},
       context: {
         jobid: parentJobId,
-        [relationshipType]: relationshipId
+        [relationshipType]: relationshipId,
+        query
       }
     });
-  }, [parentJobId, relationshipId, relationshipType, setTaskUpsertContext]);
+  }, [parentJobId, relationshipId, relationshipType, setTaskUpsertContext, query]);
 
   const handleTableChange = (pagination, filters, sorter) => {
     search.page = pagination.current;