Merge branch 'ICSHWI-10594_Removing_sort_ability' into 'develop'

ICSHWI-10594: Removing sort ability on tables

See merge request !220

src/components/IOC/IOCAsyncList.js

@@ -4,7 +4,7 @@ import { IOCDetailFetcher } from "./IOCDetailFetcher";
 import { IOCList } from "./IOCList";
 import { IOCTable } from "./IOCTable";
 
-export function IOCAsyncList({ iocs, setIocs, rowType, totalCount, lazyParams, setLazyParams, columnSort, setColumnSort, rowsPerPage, loading, asyncDetails = true}) {
+export function IOCAsyncList({ iocs, setIocs, rowType, totalCount, lazyParams, setLazyParams, rowsPerPage, loading, asyncDetails = true}) {
   return(
     <>
       <Hidden smUp>
@@ -12,7 +12,7 @@ export function IOCAsyncList({ iocs, setIocs, rowType, totalCount, lazyParams, s
       </Hidden>
       <Hidden xsDown>
         <IOCTable iocs={iocs} setIocs={setIocs} loading={loading} rowType={rowType}
-          lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort} totalCount={totalCount} 
+          lazyParams={lazyParams} setLazyParams={setLazyParams} totalCount={totalCount} 
           rowsPerPage={rowsPerPage} />
       </Hidden>
       {asyncDetails && iocs.map((ioc, index) => <IOCDetailFetcher key={`ioc-${ioc.id}`} ioc={ioc} index={index} setIocs={setIocs} />)}

src/components/IOC/IOCTable.js

@@ -7,7 +7,7 @@ import { useRedirect } from '../../hooks/Redirect';
 
 const ownIocsColumns = [
   { id: "status", label: 'Status', width: '8ch', textAlign: "center" },
-  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: true },
+  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: false },
   { id: "host", label: 'Host', width: '10ch', sortable: false },
   { id: "network", label: 'Network', width: '10ch', sortable: false },
   { id: "sourceVersion", label: 'Reference', width: '12ch', sortable: false },
@@ -15,16 +15,16 @@ const ownIocsColumns = [
 
 const exploreIocsColumns = [
   { id: "status", label: 'Status', width: '8ch', textAlign: "center" },
-  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: true },
+  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: false },
   { id: "host", label: 'Host', width: '10ch', sortable: false },
   { id: "network", label: 'Network', width: '10ch', sortable: false },
-  { id: "owner", label: 'Owner', width: '13ch', sortable: true },
+  { id: "owner", label: 'Owner', width: '13ch', sortable: false },
   { id: "sourceVersion", label: 'Reference', width: '12ch', sortable: false },
 ]
 
 const hostDetailsColumns = [
   { id: "status", label: 'Status', width: '8ch', textAlign: "center" },
-  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: true },
+  { id: "namingName", label: 'IOC Name', width: '15ch', sortable: false },
   { id: "sourceVersion", label: 'Reference', width: '12ch', sortable: false },
 ]
 
@@ -107,7 +107,7 @@ function createTableRowForExploreIocs(ioc) {
   };
 }
 
-export function IOCTable({ iocs, rowType = "own", totalCount, lazyParams, setLazyParams, columnSort, setColumnSort, rowsPerPage, loading, paginator }) {
+export function IOCTable({ iocs, rowType = "own", totalCount, lazyParams, setLazyParams, rowsPerPage, loading, paginator }) {
   const tableTypeSpecifics = {
     "own": [ownIocsColumns, createTableRowForOwnIocs],
     "host": [hostDetailsColumns, createTableRowForHostDetails],
@@ -133,8 +133,6 @@ export function IOCTable({ iocs, rowType = "own", totalCount, lazyParams, setLaz
       itemLink={itemLink}
       lazyParams={lazyParams}
       setLazyParams={setLazyParams}
-      columnSort={columnSort}
-      setColumnSort={setColumnSort}
       rowsPerPage={rowsPerPage}
       loading={loading}
       paginator={paginator}

src/components/Job/JobAsyncList.js

@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
 import { useTagsAndCommitIds, useCSentryHost } from "../../api/SwaggerApi";
 import { JobTable } from './JobTable';
 
-export function JobAsyncList({ jobs, setJobs, rowType, totalCount, lazyParams, setLazyParams, columnSort, setColumnSort, rowsPerPage, loading, paginator, deploymentId }) {
+export function JobAsyncList({ jobs, setJobs, rowType, totalCount, lazyParams, setLazyParams, rowsPerPage, loading, paginator, deploymentId }) {
   const jobDetailFetchers =
     jobs?.map((job, index) => <JobDetailFetcher
       key={`${job.type}-fetcher-${job.id}`} deployment={job} index={index} setDeployments={setJobs} />);
@@ -10,7 +10,7 @@ export function JobAsyncList({ jobs, setJobs, rowType, totalCount, lazyParams, s
     <>
       <JobTable
         jobs={jobs} rowType={rowType} loading={loading}
-        totalCount={totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort}
+        totalCount={totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams}
         rowsPerPage={rowsPerPage} deploymentId={deploymentId}
       />
       {jobDetailFetchers}

src/components/Job/JobTable.js

@@ -14,12 +14,12 @@ const formatJobDate = (value) => {
 
 const jobLogColumns = [
   { id: 'type', label: 'Type', width: '8ch', textAlign: "center"},
-  { id: 'ioc', label: 'IOC Name', width: '15ch', sortable: true },
+  { id: 'ioc', label: 'IOC Name', width: '15ch', sortable: false },
   { id: 'host', label: 'Host', width: '15ch', sortable: false },
   { id: 'network', label: 'Network', width: '10ch', sortable: false },
-  { id: 'user', label: 'User', width: '10ch', sortable: true },
-  { id: 'version', label: 'Reference', width: '10ch', sortable: true },
-  { id: 'start', label: 'Time', width: '15ch', sortable: true }
+  { id: 'user', label: 'User', width: '10ch', sortable: false },
+  { id: 'version', label: 'Reference', width: '10ch', sortable: false },
+  { id: 'start', label: 'Time', width: '15ch', sortable: false }
 ];
 
 const iocServiceControlColumns = [
@@ -66,7 +66,7 @@ function createTableRowJobLog(job, deploymentId) {
   return createTableRow(job, deploymentId, "black")
 }
 
-export function JobTable({ jobs, rowType = "jobLog", totalCount, lazyParams, setLazyParams, columnSort, setColumnSort, rowsPerPage, loading, deploymentId}) {
+export function JobTable({ jobs, rowType = "jobLog", totalCount, lazyParams, setLazyParams, rowsPerPage, loading, deploymentId}) {
 
   const tableTypeSpecifics = {
     "jobLog": [jobLogColumns, createTableRowJobLog],
@@ -90,7 +90,7 @@ export function JobTable({ jobs, rowType = "jobLog", totalCount, lazyParams, set
 
   return (
     <CustomTable columns={columns} rows={jobs?.map(job => createRow(job, deploymentId))} handleRowClick={onRowClicked} itemLink={itemLink}
-      totalCount={totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort}
+      totalCount={totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams} 
       rowsPerPage={rowsPerPage} loading={loading} />
   );
 }
\ No newline at end of file

src/components/common/table/CustomTable.js

@@ -91,8 +91,8 @@ export function CustomTable(props) {
           first={lazyParams.first}
           onPage={onPage}
           onSort={onSort}
-          sortField={columnSort.sortField} 
-          sortOrder={columnSort.sortOrder}
+          sortField={columnSort?.sortField} 
+          sortOrder={columnSort?.sortOrder}
           value={rows}
           stripedRows
           scrollable 

src/components/host/HostTable.js

@@ -46,7 +46,7 @@ export function createRow(hostContainer) {
 
 }
 
-export function HostTable({ hosts, totalCount, lazyParams, setLazyParams, columnSort, setColumnSort, rowsPerPage, loading}) {
+export function HostTable({ hosts, totalCount, lazyParams, setLazyParams, rowsPerPage, loading}) {
     const redirect = useRedirect();
 
     const itemLink = id => `/hosts/${id}`;
@@ -56,5 +56,5 @@ export function HostTable({ hosts, totalCount, lazyParams, setLazyParams, column
     };
 
     return <CustomTable columns={columns} rows={hosts.map(host => createRow(host))} handleRowClick={onRowClicked} itemLink={itemLink} totalCount={totalCount}
-        lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort} rowsPerPage={rowsPerPage} loading={loading} />;
+        lazyParams={lazyParams} setLazyParams={setLazyParams} rowsPerPage={rowsPerPage} loading={loading} />;
 }
\ No newline at end of file

src/views/IOC/IOCListView.js

@@ -45,11 +45,6 @@ export function IOCListView() {
         page: 0
     });
 
-    const [columnSort, setColumnSort] = useState({
-        sortField: null,
-        sortOrder: null
-    });
-
     const handleChangeOwn = (event) => {
         const own = event.target.checked;
         setOwnOnly(own);
@@ -62,24 +57,16 @@ export function IOCListView() {
     }, [iocs, setIocList])
 
     useEffect(() => {
-        let requestParams = initRequestParams(lazyParams, query, columnSort);
+        let requestParams = initRequestParams(lazyParams, query);
 
         if (ownOnly) {
             requestParams.owner = user?.loginName;
         }
 
-        if (columnSort.sortField === "owner") {
-            requestParams.order_by = "OWNER";
-        }
-
-        if (columnSort.sortField === "namingName") {
-            requestParams.order_by = "IOC_NAME";
-        }
-
         requestParams.deployment_status = deploymentStatus;
 
         getIocs(requestParams);
-    }, [getIocs, lazyParams, columnSort, query, user, ownOnly, deploymentStatus])
+    }, [getIocs, lazyParams, query, user, ownOnly, deploymentStatus])
 
     const title = "IOCs";
     useGlobalAppBar(title);
@@ -87,7 +74,7 @@ export function IOCListView() {
     let content = (
         <SearchBar search={setQuery} loading={loading} placeholder="search in IOC name or user">
             <IOCAsyncList iocs={iocList} setIocs={setIocList} loading={loading} rowType="explore"
-                lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort} totalCount={iocs.totalCount}
+                lazyParams={lazyParams} setLazyParams={setLazyParams} totalCount={iocs.totalCount}
                 rowsPerPage={rowsPerPage} />
         </SearchBar>
     );

src/views/home/HomeView.js

@@ -33,13 +33,6 @@ export function HomeView() {
     page: 0
   });
 
-  const [columnSort, setColumnSort] = useState({
-    sortField: null,
-    sortOrder: null
-  });
-
-  console.log("rendering Own IOCs")
-
   useGlobalAppBar("Home");
 
   const closeModal = () => {
@@ -76,7 +69,6 @@ export function HomeView() {
             <SimpleAccordion summary="IOCs with issues" defaultExpanded>
               <IOCAsyncList iocs={iocsWithAlarms} asyncDetails={false} rowType="own" loading={loading}
                 lazyParams={lazyParams} setLazyParams={setLazyParams}
-                columnSort={columnSort} setColumnSort={setColumnSort}
                 totalCount={iocsWithAlarms?.length}
                 paginator={false} />
             </SimpleAccordion>

src/views/host/HostListView.js

@@ -66,19 +66,14 @@ export function HostListView() {
         page: 0
     });
 
-    const [columnSort, setColumnSort] = useState({
-        sortField: null,
-        sortOrder: null
-    });
-
     const rowsPerPage = [20, 50];
 
     useEffect(() => {
-        let requestParams = initRequestParams(lazyParams, transformHostQuery(query), columnSort);
+        let requestParams = initRequestParams(lazyParams, transformHostQuery(query));
         requestParams.filter = ((hostFilter !== "NO_IOCS") && ownOnly) ? "OWN" : hostFilter;
 
         getHosts(requestParams);
-    }, [getHosts, lazyParams, query, columnSort, hostFilter, ownOnly])
+    }, [getHosts, lazyParams, query, hostFilter, ownOnly])
 
     const content = (
         <>
@@ -88,7 +83,7 @@ export function HostListView() {
                 </Hidden>
                 <Hidden xsDown>
                     <HostTable hosts={hosts.hostList} loading={loading}
-                        totalCount={hosts.totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort}
+                        totalCount={hosts.totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams}
                         rowsPerPage={rowsPerPage} />
                 </Hidden>
             </SearchBar>

src/views/jobs/JobListView.js

@@ -65,37 +65,16 @@ export function JobListView() {
     page: 0
   });
 
-  const [columnSort, setColumnSort] = useState({
-    sortField: null,
-    sortOrder: null
-  });
-
   const rowsPerPage = [20, 50];
 
   useEffect(() => {
 
-    let requestParams = initRequestParams(lazyParams, query, columnSort);
+    let requestParams = initRequestParams(lazyParams, query);
 
     if (ownOnly) {
       requestParams.user = user?.loginName;
     }
 
-    if (columnSort.sortField === "start") {
-      requestParams.order_by = "TIME";
-    }
-
-    if (columnSort.sortField === "user") {
-      requestParams.order_by = "USER";
-    }
-
-    if (columnSort.sortField === "ioc") {
-      requestParams.order_by = "IOC_NAME";
-    }
-
-    if (columnSort.sortField === "version") {
-      requestParams.order_by = "GIT_REFERENCE";
-    }
-
     if (deploymentStatus) {
       requestParams.status = deploymentStatus;
     }
@@ -106,7 +85,7 @@ export function JobListView() {
 
     getOperations(requestParams);
 
-  }, [getOperations, lazyParams, query, columnSort, user, deploymentStatus, ownOnly, jobType])
+  }, [getOperations, lazyParams, query, user, deploymentStatus, ownOnly, jobType])
 
   useEffect(() => {
     setJobList(operations.operationsList);
@@ -116,7 +95,7 @@ export function JobListView() {
     <SearchBar search={setQuery} loading={loading} placeholder="search in IOC name, user or git reference">
       <JobAsyncList
         jobs={jobList} setJobs={setJobList} loading={loading}
-        totalCount={operations.totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams} columnSort={columnSort} setColumnSort={setColumnSort}
+        totalCount={operations.totalCount} lazyParams={lazyParams} setLazyParams={setLazyParams}
         rowsPerPage={rowsPerPage} />
     </SearchBar>
   );