Basic posting up to fortellis-select-customer.

client/src/components/dms-cdk-makes/dms-cdk-makes.component.jsx

@@ -17,7 +17,7 @@ const mapDispatchToProps = (dispatch) => ({
 });
 export default connect(mapStateToProps, mapDispatchToProps)(DmsCdkVehicles);
 
-export function DmsCdkVehicles({ bodyshop, form, socket, job }) {
+export function DmsCdkVehicles({ bodyshop, form, job }) {
   const [open, setOpen] = useState(false);
   const [selectedModel, setSelectedModel] = useState(null);
   const { t } = useTranslation();

client/src/components/dms-customer-selector/dms-customer-selector.component.jsx

@@ -1,8 +1,10 @@
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
 import { Button, Checkbox, Col, Table } from "antd";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
+import { useSocket } from "../../contexts/SocketIO/useSocket";
 import { socket } from "../../pages/dms/dms.container";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { alphaSort } from "../../utils/sorters";
@@ -22,17 +24,47 @@ export function DmsCustomerSelector({ bodyshop }) {
   const [selectedCustomer, setSelectedCustomer] = useState(null);
   const [dmsType, setDmsType] = useState("cdk");
 
-  socket.on("cdk-select-customer", (customerList, callback) => {
-    setOpen(true);
-    setDmsType("cdk");
-    setcustomerList(customerList);
-  });
-  socket.on("pbs-select-customer", (customerList, callback) => {
-    setOpen(true);
-    setDmsType("pbs");
-    setcustomerList(customerList);
+  const {
+    treatments: { Fortellis }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Fortellis"],
+    splitKey: bodyshop.imexshopid
   });
 
+  const { socket: wsssocket } = useSocket();
+
+  useEffect(() => {
+    if (Fortellis.treatment === "on") {
+      const handleFortellisSelectCustomer = (customerList, callback) => {
+        setOpen(true);
+        setDmsType("fortellis");
+        setcustomerList(customerList);
+      };
+      wsssocket.on("fortellis-select-customer", handleFortellisSelectCustomer);
+      return () => {
+        wsssocket.off("fortellis-select-customer", handleFortellisSelectCustomer);
+      };
+    } else {
+      const handleCdkSelectCustomer = (customerList, callback) => {
+        setOpen(true);
+        setDmsType("cdk");
+        setcustomerList(customerList);
+      };
+      const handlePbsSelectCustomer = (customerList, callback) => {
+        setOpen(true);
+        setDmsType("pbs");
+        setcustomerList(customerList);
+      };
+      socket.on("cdk-select-customer", handleCdkSelectCustomer);
+      socket.on("pbs-select-customer", handlePbsSelectCustomer);
+      return () => {
+        socket.off("cdk-select-customer", handleCdkSelectCustomer);
+        socket.off("pbs-select-customer", handlePbsSelectCustomer);
+      };
+    }
+  }, []);
+
   const onUseSelected = () => {
     setOpen(false);
     socket.emit(`${dmsType}-selected-customer`, selectedCustomer);
@@ -51,6 +83,42 @@ export function DmsCustomerSelector({ bodyshop }) {
     setSelectedCustomer(null);
   };
 
+  const fortellisColumns = [
+    {
+      title: t("jobs.fields.dms.id"),
+      dataIndex: "customerId",
+      key: "id"
+    },
+    {
+      title: t("jobs.fields.dms.vinowner"),
+      dataIndex: "vinOwner",
+      key: "vinOwner",
+      render: (text, record) => <Checkbox disabled checked={record.vinOwner} />
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: ["customerName", "firstName"],
+      key: "firstName",
+      sorter: (a, b) => alphaSort(a.customerName?.firstName, b.customerName?.firstName)
+    },
+    {
+      title: t("jobs.fields.dms.name1"),
+      dataIndex: ["customerName", "lastName"],
+      key: "lastName",
+      sorter: (a, b) => alphaSort(a.customerName?.lastName, b.customerName?.lastName)
+    },
+    {
+      title: t("jobs.fields.dms.address"),
+
+      key: "address",
+      render: (record, value) =>
+        `${record.postalAddress?.addressLine1} ${record.postalAddress?.addressLine2 ? `, ${record.postalAddress?.addressLine2}` : ""},
+        ${record.postalAddress?.city} ${record.postalAddress?.state} ${record.postalAddress?.postalCode} ${
+          record.postalAddress?.country
+        }`
+    }
+  ];
+
   const cdkColumns = [
     {
       title: t("jobs.fields.dms.id"),
@@ -122,13 +190,13 @@ export function DmsCustomerSelector({ bodyshop }) {
           </div>
         )}
         pagination={{ position: "top" }}
-        columns={dmsType === "cdk" ? cdkColumns : pbsColumns}
-        rowKey={(record) => (dmsType === "cdk" ? record.id.value : record.ContactId)}
+        columns={dmsType === "cdk" ? (Fortellis.treatment === "on" ? fortellisColumns : cdkColumns) : pbsColumns}
+        rowKey={(record) => (dmsType === "cdk" ? record.id?.value || record.customerId : record.ContactId)}
         dataSource={customerList}
         //onChange={handleTableChange}
         rowSelection={{
           onSelect: (record) => {
-            setSelectedCustomer(dmsType === "cdk" ? record.id.value : record.ContactId);
+            setSelectedCustomer(dmsType === "cdk" ? record.id?.value || record.customerId : record.ContactId);
           },
           type: "radio",
           selectedRowKeys: [selectedCustomer]

client/src/components/dms-post-form/dms-post-form.component.jsx

@@ -28,6 +28,7 @@ import CurrencyInput from "../form-items-formatted/currency-form-item.component"
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 import DateTimePicker from "../form-date-time-picker/form-date-time-picker.component.jsx";
 import { useSocket } from "../../contexts/SocketIO/useSocket";
+import { useSplitTreatments } from "@splitsoftware/splitio-react";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -38,6 +39,14 @@ const mapDispatchToProps = (dispatch) => ({
 export default connect(mapStateToProps, mapDispatchToProps)(DmsPostForm);
 
 export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
+  const {
+    treatments: { Fortellis }
+  } = useSplitTreatments({
+    attributes: {},
+    names: ["Fortellis"],
+    splitKey: bodyshop.imexshopid
+  });
+
   const [form] = Form.useForm();
   const { t } = useTranslation();
   const { socket: wsssocket } = useSocket();
@@ -62,21 +71,21 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
 
   const handleFinish = (values) => {
     //TODO: Add this as a split instead.
-    if (true) {
+    if (Fortellis.treatment === "on") {
       wsssocket.emit("fortellis-export-job", { jobid: job.id, txEnvelope: values });
     } else {
       socket.emit(`${determineDmsType(bodyshop)}-export-job`, {
         jobid: job.id,
         txEnvelope: values
       });
-      console.log(logsRef);
-      if (logsRef) {
-        console.log("executing", logsRef);
-        logsRef.curent &&
-          logsRef.current.scrollIntoView({
-            behavior: "smooth"
-          });
-      }
+    }
+    console.log(logsRef);
+    if (logsRef) {
+      console.log("executing", logsRef);
+      logsRef.curent &&
+        logsRef.current.scrollIntoView({
+          behavior: "smooth"
+        });
     }
   };
 
@@ -185,7 +194,7 @@ export function DmsPostForm({ bodyshop, socket, job, logsRef }) {
               </Form.Item>
             </LayoutFormRow>
             <Space>
-              <DmsCdkMakes form={form} socket={socket} job={job} />
+              <DmsCdkMakes form={form} job={job} />
               <DmsCdkMakesRefetch />
               <Form.Item name="dms_unsold" label={t("jobs.fields.dms.dms_unsold")} initialValue={false}>
                 <Switch />