DBC22-1727: interim commit

Author: ray-oxd

src/frontend/src/Components/events/EventsTable.js

@@ -21,11 +21,11 @@ import {
 import './EventsTable.scss';
 
 export default function EventsTable({columns, data, sortingHandler, routeHandler}) {
-  const [sorting, setSorting] = useState([{ desc: false, id: 'severity' }]);
+  const [sorting, setSorting] = useState([{ desc: true, id: 'severity' }]);
 
   const prioritySortFn = (rowA, rowB, columnId) => {
-    const aValue = rowA.getValue(columnId).value;
-    const bValue = rowA.getValue(columnId).value;
+    const aValue = rowA.getValue(columnId);
+    const bValue = rowA.getValue(columnId);
 
     if (aValue != bValue) {
       return aValue < bValue ? 1 : -1;
@@ -39,6 +39,13 @@ export default function EventsTable({columns, data, sortingHandler, routeHandler
     }
   }
 
+  const reversedPrioritySortFn = (rowA, rowB, columnId) => {
+    console.log('text');
+
+//    return prioritySortFn(rowA, rowB, columnId) * -1;
+    return 10293414;
+  }
+
   const table = useReactTable({
     data: data,
     columns: columns,
@@ -53,6 +60,7 @@ export default function EventsTable({columns, data, sortingHandler, routeHandler
     onSortingChange: setSorting,
     sortingFns: {
       prioritySort: prioritySortFn,
+      reversedPrioritySort: reversedPrioritySortFn,
     },
     getPaginationRowModel: getPaginationRowModel(),
     getCoreRowModel: getCoreRowModel(),
@@ -64,9 +72,13 @@ export default function EventsTable({columns, data, sortingHandler, routeHandler
   }, [sorting]);
 
   const toggleSortingHandler = (column) => {
+    if (!column.getCanSort()) return;
+
     const nextOrder = column.getNextSortingOrder();
-    // desc=false to sort by asc when nextOrder is not 'asc' or 'desc'
-    column.toggleSorting(!nextOrder ? nextOrder : null);
+
+    // sort by asc when nextOrder is not 'asc' or 'desc', or desc on sortDescFirst columns
+    const isDescFirst = column.id == 'severity' || column.id == 'last_updated';
+    column.toggleSorting(!nextOrder ? isDescFirst : null);
   }
 
   const ascIcon = <FontAwesomeIcon icon={faArrowUpLong} alt="ascending order" />;

src/frontend/src/pages/EventsListPage.js

@@ -65,19 +65,20 @@ export default function EventsListPage() {
     {
       header: 'Type',
       accessorKey: 'display_category',
-      sortingFn: 'prioritySort',
+//      sortingFn: 'prioritySort',
       cell: (props) => <EventTypeIcon event={props.row.original} />,
     },
     {
       header: 'Severity',
       accessorKey: 'severity',
-      sortingFn: 'prioritySort',
+      sortingFn: 'reversedPrioritySort',
+      sortDescFirst: true,
       cell: (props) => <span>{props.getValue().toLowerCase()}</span>,
     },
     {
       header: 'Road',
       accessorKey: 'route_at',
-      sortingFn: 'prioritySort',
+//      sortingFn: 'prioritySort',
     },
     {
       header: 'Direction',
@@ -94,6 +95,7 @@ export default function EventsListPage() {
       header: 'Last Update',
       accessorKey: 'last_updated',
       cell: (props) => <FriendlyTime date={props.getValue()} />,
+      sortDescFirst: true,
     },
     {
       header: 'Map',