Missed in last commit IO-575

client/src/components/time-ticket-list/time-ticket-list.component.jsx

@@ -1,14 +1,13 @@
 import { Table } from "antd";
-import React, { useState } from "react";
+import moment from "moment";
+import React, { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
-import { alphaSort } from "../../utils/sorters";
-import { DateFormatter } from "../../utils/DateFormatter";
-import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
-import { DateTimeFormatter } from "../../utils/DateFormatter";
-import moment from "moment";
 import { onlyUnique } from "../../utils/arrayHelper";
+import { DateFormatter, DateTimeFormatter } from "../../utils/DateFormatter";
+import { alphaSort } from "../../utils/sorters";
 import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
+import TimeTicketEnterButton from "../time-ticket-enter-button/time-ticket-enter-button.component";
 
 export default function TimeTicketList({
   disabled,
@@ -24,6 +23,19 @@ export default function TimeTicketList({
 
   const { t } = useTranslation();
 
+  const totals = useMemo(() => {
+    if (timetickets)
+      return timetickets.reduce(
+        (acc, val) => {
+          acc.productivehrs = acc.productivehrs + val.productivehrs;
+          acc.actualhrs = acc.actualhrs + val.actualhrs;
+          return acc;
+        },
+        { productivehrs: 0, actualhrs: 0 }
+      );
+    return { productivehrs: 0, actualhrs: 0 };
+  }, [timetickets]);
+
   const columns = [
     {
       title: t("timetickets.fields.date"),
@@ -182,6 +194,29 @@ export default function TimeTicketList({
       rowKey="id"
       dataSource={timetickets}
       onChange={handleTableChange}
+      summary={() => {
+        return (
+          <Table.Summary.Row>
+            <Table.Summary.Cell>
+              {t("general.labels.totals")}
+            </Table.Summary.Cell>
+            <Table.Summary.Cell />
+            <Table.Summary.Cell />
+            <Table.Summary.Cell>{totals.productivehrs}</Table.Summary.Cell>
+            <Table.Summary.Cell>{totals.actualhrs}</Table.Summary.Cell>
+            <Table.Summary.Cell>
+              {totals.actualhrs === 0 || !totals.actualhrs
+                ? "∞"
+                : `${((totals.productivehrs / totals.actualhrs) * 100).toFixed(
+                    2
+                  )}% ${t("timetickets.labels.efficiency")}`}
+            </Table.Summary.Cell>
+            <Table.Summary.Cell />
+            <Table.Summary.Cell />
+            <Table.Summary.Cell />
+          </Table.Summary.Row>
+        );
+      }}
     />
   );
 }