IO-2514 Only Unique items in Menu

client/src/components/production-list-columns/production-list-columns.add.component.jsx

@@ -1,7 +1,7 @@
-import React from "react";
 import { Button, Dropdown, Menu } from "antd";
-import dataSource from "./production-list-columns.data";
+import React from "react";
 import { useTranslation } from "react-i18next";
+import dataSource from "./production-list-columns.data";
 
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -24,6 +24,7 @@ export function ProductionColumnsComponent({
   columnState,
   technician,
   bodyshop,
+  data,
   tableState,
 }) {
   const [columns, setColumns] = columnState;
@@ -36,6 +37,7 @@ export function ProductionColumnsComponent({
         bodyshop,
         technician,
         state: tableState,
+        data: data,
         activeStatuses: bodyshop.md_ro_statuses.active_statuses,
       }).filter((i) => i.key === e.key),
     ]);
@@ -46,6 +48,7 @@ export function ProductionColumnsComponent({
     technician,
     state: tableState,
     activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+    data: data,
   });
   const menu = (
     <Menu

client/src/components/production-list-columns/production-list-columns.data.js

@@ -1,4 +1,4 @@
-import { PauseCircleOutlined, BranchesOutlined } from "@ant-design/icons";
+import { BranchesOutlined, PauseCircleOutlined } from "@ant-design/icons";
 import { Space, Tooltip } from "antd";
 import i18n from "i18next";
 import moment from "moment";
@@ -6,6 +6,7 @@ import { Link } from "react-router-dom";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { TimeFormatter } from "../../utils/DateFormatter";
 import PhoneFormatter from "../../utils/PhoneFormatter";
+import { onlyUnique } from "../../utils/arrayHelper";
 import { alphaSort, dateSort, statusSort } from "../../utils/sorters";
 import JobAltTransportChange from "../job-at-change/job-at-change.component";
 import JobPartsQueueCount from "../job-parts-queue-count/job-parts-queue-count.component";
@@ -25,7 +26,7 @@ import ProductionListColumnCategory from "./production-list-columns.status.categ
 import ProductionListColumnStatus from "./production-list-columns.status.component";
 import ProductionlistColumnTouchTime from "./prodution-list-columns.touchtime.component";
 
-const r = ({ technician, state, activeStatuses, bodyshop }) => {
+const r = ({ technician, state, activeStatuses, data, bodyshop }) => {
   return [
     {
       title: i18n.t("jobs.actions.viewdetail"),
@@ -536,6 +537,36 @@ const r = ({ technician, state, activeStatuses, bodyshop }) => {
         <JobPartsQueueCount parts={record.joblines_status} record={record} />
       ),
     },
+    {
+      title: i18n.t("jobs.labels.estimator"),
+      dataIndex: "estimator",
+      key: "estimator",
+      sorter: (a, b) =>
+        alphaSort(
+          `${a.est_ct_fn || ""} ${a.est_ct_ln || ""}`.trim(),
+          `${b.est_ct_fn || ""} ${b.est_ct_ln || ""}`.trim()
+        ),
+      sortOrder:
+        state.sortedInfo.columnKey === "estimator" && state.sortedInfo.order,
+      filters:
+        (data &&
+          data
+            .map((j) => `${j.est_ct_fn || ""} ${j.est_ct_ln || ""}`.trim())
+            .filter(onlyUnique)
+            .map((s) => {
+              return {
+                text: s || "N/A",
+                value: [s],
+              };
+            })) ||
+        [],
+      onFilter: (value, record) =>
+        value.includes(
+          `${record.est_ct_fn || ""} ${record.est_ct_ln || ""}`.trim()
+        ),
+      render: (text, record) =>
+        `${record.est_ct_fn || ""} ${record.est_ct_ln || ""}`.trim(),
+    },
 
     //Added as a place holder for St Claude. Not implemented as it requires another join for a field used by only 1 client.
     // {

client/src/components/production-list-table/production-list-table-view-select.component.jsx

@@ -24,6 +24,7 @@ export function ProductionListTable({
   technician,
   currentUser,
   state,
+  data,
   setColumns,
   setState,
 }) {
@@ -41,6 +42,7 @@ export function ProductionListTable({
               bodyshop,
               technician,
               state,
+              data: data,
               activeStatuses: bodyshop.md_ro_statuses.active_statuses,
             }).find((e) => e.key === k.key),
             width: k.width,
@@ -95,6 +97,7 @@ export function ProductionListTable({
           ...ProductionListColumns({
             technician,
             state,
+            data: data,
             activeStatuses: bodyshop.md_ro_statuses.active_statuses,
           }).find((e) => e.key === k.key),
           width: k.width,

client/src/components/production-list-table/production-list-table.component.jsx

@@ -10,7 +10,7 @@ import {
   Statistic,
   Table,
 } from "antd";
-import React, { useMemo, useState } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import ReactDragListView from "react-drag-listview";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
@@ -79,6 +79,7 @@ export function ProductionListTable({
             bodyshop,
             technician,
             state,
+            data: data,
             activeStatuses: bodyshop.md_ro_statuses.active_statuses,
           }).find((e) => e.key === k.key),
           width: k.width ?? 100,
@@ -87,6 +88,33 @@ export function ProductionListTable({
       []
   );
 
+  useEffect(() => {
+    const newColumns =
+      (state &&
+        matchingColumnConfig &&
+        matchingColumnConfig.columns.columnKeys.map((k) => {
+          return {
+            ...ProductionListColumns({
+              bodyshop,
+              technician,
+              state,
+              data: data,
+              activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+            }).find((e) => e.key === k.key),
+            width: k.width ?? 100,
+          };
+        })) ||
+      [];
+    setColumns(newColumns);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [
+    //state,
+    matchingColumnConfig,
+    bodyshop,
+    technician,
+    data,
+  ]); //State removed from dependency array as it causes race condition when removing columns from table view and is not needed.
+
   const handleTableChange = (pagination, filters, sorter) => {
     setState({
       ...state,
@@ -104,7 +132,8 @@ export function ProductionListTable({
 
   const removeColumn = (e) => {
     const { key } = e;
-    setColumns(columns.filter((i) => i.key !== key));
+    const newColumns = columns.filter((i) => i.key !== key);
+    setColumns(newColumns);
   };
 
   const handleResize =
@@ -227,6 +256,7 @@ export function ProductionListTable({
             <ProductionListColumnsAdd
               columnState={[columns, setColumns]}
               tableState={state}
+              data={data}
             />
             <ProductionListSaveConfigButton
               columns={columns}
@@ -237,6 +267,7 @@ export function ProductionListTable({
               state={state}
               setState={setState}
               setColumns={setColumns}
+              data={data}
             />
 
             <Input

client/src/graphql/jobs.queries.js

@@ -364,6 +364,8 @@ export const QUERY_JOBS_IN_PRODUCTION = gql`
       employee_refinish
       employee_prep
       employee_csr
+      est_ct_fn
+      est_ct_ln
       suspended
       date_repairstarted
       joblines_status {