Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-22 16:39:01 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 121

UI: Sort live queries/policies (#5060)

Browse source
This commit is contained in:
RachelElysia 2022-04-11 17:17:24 -04:00 committed by GitHub
parent d15957b431
commit 2eeb9142b3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 23 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
changes/issue-4572-sort-live-queries Normal file
View file

@ -0,0 +1 @@
* Users can sort all columns of live queries and live policies in the UI

1
frontend/pages/policies/PolicyPage/components/PolicyQueriesListWrapper/PolicyQueriesListWrapper.tsx
View file

@ -45,7 +45,6 @@ const PoliciesListWrapper = ({
isLoading={isLoading}
defaultSortHeader={"name"}
defaultSortDirection={"asc"}
manualSortBy
showMarkAllPages={false}
isAllPagesSelected={false}
disablePagination

30
frontend/pages/policies/PolicyPage/components/PolicyQueriesListWrapper/PolicyQueriesTableConfig.tsx
View file

@ -4,8 +4,11 @@
import React from "react";
import { memoize } from "lodash";
// @ts-ignore
import { ColumnInstance } from "react-table";
import TextCell from "components/TableContainer/DataTable/TextCell/TextCell";
import HeaderCell from "components/TableContainer/DataTable/HeaderCell/HeaderCell";
import { IHostPolicyQuery } from "interfaces/host";
import sortUtils from "utilities/sort";
import PassIcon from "../../../../../../assets/images/icon-check-circle-green-16x16@2x.png";
@ -14,10 +17,7 @@ import FailIcon from "../../../../../../assets/images/icon-exclamation-circle-re
// TODO functions for paths math e.g., path={PATHS.MANAGE_HOSTS + getParams(cellProps.row.original)}
interface IHeaderProps {
column: {
host: string;
isSortedDesc: boolean;
};
column: ColumnInstance & IDataColumn;
}
interface ICellProps {
@ -45,17 +45,28 @@ const generateTableHeaders = (): IDataColumn[] => {
const tableHeaders: IDataColumn[] = [
{
title: "Host",
Header: "Host",
disableSortBy: true,
Header: (headerProps: IHeaderProps): JSX.Element => (
<HeaderCell
value={headerProps.column.title || headerProps.column.id}
isSortedDesc={headerProps.column.isSortedDesc}
disableSortBy={false}
/>
),
accessor: "hostname",
Cell: (cellProps: ICellProps): JSX.Element => (
<TextCell value={cellProps.cell.value} />
),
disableSortBy: false,
},
{
title: "Status",
Header: "Status",
disableSortBy: true,
Header: (headerProps: IHeaderProps) => (
<HeaderCell
value={headerProps.column.title || headerProps.column.id}
isSortedDesc={headerProps.column.isSortedDesc}
disableSortBy={false}
/>
),
accessor: "query_results",
Cell: (cellProps: ICellProps): JSX.Element => (
<>
@ -72,6 +83,7 @@ const generateTableHeaders = (): IDataColumn[] => {
)}
</>
),
disableSortBy: false,
},
];
return tableHeaders;

1
frontend/pages/queries/QueryPage/components/QueryResults/QueryResultsTableConfig.tsx
View file

@ -60,6 +60,7 @@ const resultsTableHeaders = (results: ICampaignQueryResult[]): Column[] => {
Cell: (cellProps: ICellProps) => cellProps?.cell?.value || null,
Filter: DefaultColumnFilter,
// filterType: "text",
disableSortBy: false,
};
});
return _unshiftHostname(headers);