Added first round of analytics and event tracking BOD-190

client/src/components/jobs-notes/jobs.notes.component.jsx

@@ -9,12 +9,13 @@ import React from "react";
 import { useTranslation } from "react-i18next";
 import Moment from "react-moment";
 import { connect } from "react-redux";
+import { logImEXEvent } from "../../firebase/firebase.utils";
 import { setModalContext } from "../../redux/modals/modals.actions";
 import NoteUpsertModal from "../note-upsert-modal/note-upsert-modal.container";
 
-const mapDispatchToProps = dispatch => ({
-  setNoteUpsertContext: context =>
-    dispatch(setModalContext({ context: context, modal: "noteUpsert" }))
+const mapDispatchToProps = (dispatch) => ({
+  setNoteUpsertContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "noteUpsert" })),
 });
 
 export function JobNotesComponent({
@@ -23,7 +24,7 @@ export function JobNotesComponent({
   refetch,
   deleteNote,
   jobId,
-  setNoteUpsertContext
+  setNoteUpsertContext,
 }) {
   const { t } = useTranslation();
 
@@ -40,13 +41,13 @@ export function JobNotesComponent({
           ) : null}
           {record.private ? <EyeInvisibleFilled style={{ margin: 4 }} /> : null}
         </span>
-      )
+      ),
     },
     {
       title: t("notes.fields.text"),
       dataIndex: "text",
       key: "text",
-      ellipsis: true
+      ellipsis: true,
     },
 
     {
@@ -58,15 +59,15 @@ export function JobNotesComponent({
       sorter: (a, b) => new Date(a.updated_at) - new Date(b.updated_at),
       render: (text, record) => (
         <span>
-          <Moment format="MM/DD/YYYY @ HH:mm">{record.updated_at}</Moment>
+          <Moment format='MM/DD/YYYY @ HH:mm'>{record.updated_at}</Moment>
         </span>
-      )
+      ),
     },
     {
       title: t("notes.fields.createdby"),
       dataIndex: "created_by",
       key: "created_by",
-      width: 200
+      width: 200,
     },
     {
       title: t("notes.actions.actions"),
@@ -77,18 +78,19 @@ export function JobNotesComponent({
         <span>
           <Button
             onClick={() => {
+              logImEXEvent("job_note_delete");
+
               deleteNote({
                 variables: {
-                  noteId: record.id
-                }
-              }).then(r => {
+                  noteId: record.id,
+                },
+              }).then((r) => {
                 refetch();
                 notification["success"]({
-                  message: t("notes.successes.deleted")
+                  message: t("notes.successes.deleted"),
                 });
               });
-            }}
-          >
+            }}>
             <DeleteFilled />
           </Button>
           <Button
@@ -97,16 +99,15 @@ export function JobNotesComponent({
                 actions: { refetch: refetch },
                 context: {
                   jobId: jobId,
-                  existingNote: record
-                }
+                  existingNote: record,
+                },
               });
-            }}
-          >
+            }}>
             <EditFilled />
           </Button>
         </span>
-      )
-    }
+      ),
+    },
   ];
 
   return (
@@ -117,18 +118,17 @@ export function JobNotesComponent({
           setNoteUpsertContext({
             actions: { refetch: refetch },
             context: {
-              jobId: jobId
-            }
+              jobId: jobId,
+            },
           });
-        }}
-      >
+        }}>
         {t("notes.actions.new")}
       </Button>
       <Table
         loading={loading}
         pagination={{ position: "bottom" }}
-        columns={columns.map(item => ({ ...item }))}
-        rowKey="id"
+        columns={columns.map((item) => ({ ...item }))}
+        rowKey='id'
         dataSource={data}
       />
     </div>