Created sider for Chat messages.

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

@@ -28,7 +28,7 @@ export default withRouter(function JobsList({
       width: "8%",
       // onFilter: (value, record) => record.ro_number.includes(value),
       // filteredValue: state.filteredInfo.text || null,
-      sorter: (a, b) => alphaSort(a, b),
+      sorter: (a, b) => alphaSort(a.ro_number, b.ro_number),
       sortOrder:
         state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order,
 
@@ -74,7 +74,7 @@ export default withRouter(function JobsList({
             <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>
             <Icon
               style={{ margin: 4 }}
-              type='message'
+              type="message"
               onClick={() => {
                 alert("SMSing will happen here.");
               }}
@@ -91,7 +91,7 @@ export default withRouter(function JobsList({
       key: "status",
       width: "10%",
       ellipsis: true,
-      sorter: (a, b) => alphaSort(a, b),
+      sorter: (a, b) => alphaSort(a.status, b.status),
       sortOrder:
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
       render: (text, record) => {
@@ -122,7 +122,7 @@ export default withRouter(function JobsList({
       key: "plate_no",
       width: "8%",
       ellipsis: true,
-      sorter: (a, b) => alphaSort(a, b),
+      sorter: (a, b) => alphaSort(a.vehicle?.plate_no, b.vehicle?.plate_no),
       sortOrder:
         state.sortedInfo.columnKey === "plate_no" && state.sortedInfo.order,
       render: (text, record) => {
@@ -139,7 +139,7 @@ export default withRouter(function JobsList({
       key: "clm_no",
       width: "12%",
       ellipsis: true,
-      sorter: (a, b) => alphaSort(a, b),
+      sorter: (a, b) => alphaSort(a.clm_no, b.clm_no),
       sortOrder:
         state.sortedInfo.columnKey === "clm_no" && state.sortedInfo.order,
       render: (text, record) => {
@@ -155,11 +155,9 @@ export default withRouter(function JobsList({
       dataIndex: "clm_total",
       key: "clm_total",
       width: "8%",
-      // sorter: (a, b) => {
-      //   return a > b;
-      // },
-      // sortOrder:
-      //   state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order,
+      sorter: (a, b) => a.clm_total - b.clm_total,
+      sortOrder:
+        state.sortedInfo.columnKey === "clm_total" && state.sortedInfo.order,
       render: (text, record) => {
         return record.clm_total ? (
           <span>{record.clm_total}</span>
@@ -196,7 +194,6 @@ export default withRouter(function JobsList({
     if (record) {
       if (record.id) {
         setSelectedJob(record.id);
-        history.push(`#${record.id}`);
         return;
       }
     }
@@ -210,7 +207,7 @@ export default withRouter(function JobsList({
         title={() => {
           return (
             <Input.Search
-              placeholder='Search...'
+              placeholder="Search..."
               onSearch={value => {
                 console.log(value);
               }}
@@ -218,10 +215,10 @@ export default withRouter(function JobsList({
             />
           );
         }}
-        size='small'
+        size="small"
         pagination={{ position: "top" }}
         columns={columns.map(item => ({ ...item }))}
-        rowKey='id'
+        rowKey="id"
         dataSource={jobs}
         rowSelection={{ selectedRowKeys: [selectedJob] }}
         onChange={handleTableChange}