FleetUI: Update column sort options (#1680)

* Disable sort remove on react-table

* Update hosts tests

changes/Issue1507-disable-sort-remove

@@ -0,0 +1 @@
+Add disableSortRemove property to to disable react-tables's default of three clicks "asc-desc-none" for column sort

frontend/components/TableContainer/DataTable/DataTable.tsx

@@ -79,6 +79,7 @@ const DataTable = ({
         }, [sortHeader, sortDirection]),
       },
       disableMultiSort: true,
+      disableSortRemove: true,
       manualSortBy,
     },
     useSortBy,

frontend/components/TableContainer/TableContainer.tsx

@@ -109,15 +109,15 @@ const TableContainer = ({
   const onSortChange = useCallback(
     (id?: string, isDesc?: boolean) => {
       if (id === undefined) {
-        setSortHeader("");
-        setSortDirection("");
+        setSortHeader(defaultSortHeader || "");
+        setSortDirection(defaultSortDirection || "");
       } else {
         setSortHeader(id);
         const direction = isDesc ? "desc" : "asc";
         setSortDirection(direction);
       }
     },
-    [setSortHeader, setSortDirection]
+    [defaultSortHeader, defaultSortDirection, setSortHeader, setSortDirection]
   );
 
   const onSearchQueryChange = (value: string) => {

frontend/fleet/entities/hosts.tests.js

@@ -61,7 +61,8 @@ describe("Kolide - API client (hosts)", () => {
     it("calls the label endpoint when used with label filter", () => {
       const request = createRequestMock({
         bearerToken,
-        endpoint: "/api/v1/fleet/labels/6/hosts?page=2&per_page=50",
+        endpoint:
+          "/api/v1/fleet/labels/6/hosts?page=2&per_page=50&order_key=hostname&order_direction=asc",
         method: "get",
         response: { hosts: [] },
       });

frontend/fleet/entities/hosts.ts

@@ -55,6 +55,9 @@ export default (client: any) => {
         const sortItem = sortBy[0];
         orderKeyParam += `&order_key=${sortItem.id}`;
         orderDirection = `&order_direction=${sortItem.direction}`;
+      } else {
+        orderKeyParam += `&order_key=hostname`;
+        orderDirection = `&order_direction=asc`;
       }
 
       let searchQuery = "";

frontend/test/mocks/host_mocks.js

@@ -15,7 +15,8 @@ export default {
     valid: (bearerToken) => {
       return createRequestMock({
         bearerToken,
-        endpoint: "/api/v1/fleet/hosts?page=0&per_page=100",
+        endpoint:
+          "/api/v1/fleet/hosts?page=0&per_page=100&order_key=hostname&order_direction=asc",
         method: "get",
         response: { hosts: [] },
       });