From 3b0a454fb5eedef69e7000c3483e20615ff57438 Mon Sep 17 00:00:00 2001 From: RachelElysia <71795832+RachelElysia@users.noreply.github.com> Date: Tue, 30 Nov 2021 13:24:30 -0500 Subject: [PATCH] App wide UI: Fix policies keys (#3145) --- .../issue-3112-policies-key-update-app-wide | 1 + frontend/interfaces/host.ts | 2 +- frontend/interfaces/host_policy.ts | 19 ------------ frontend/interfaces/host_summary.ts | 2 +- frontend/interfaces/policy.ts | 31 ++++++++++++++++++- .../cards/WelcomeHost/WelcomeHost.tsx | 8 ++--- .../hosts/HostDetailsPage/HostDetailsPage.tsx | 2 +- .../HostPoliciesTableConfig.tsx | 6 ++-- .../PolicyDetailsModal/PolicyDetailsModal.tsx | 6 ++-- .../PolicyFailingCount/PolicyFailingCount.tsx | 2 +- .../ManagePoliciesPage/ManagePoliciesPage.tsx | 10 ++++-- .../PoliciesListWrapper.tsx | 4 +-- .../PoliciesTableConfig.tsx | 18 ++++++----- frontend/utilities/constants.ts | 2 ++ 14 files changed, 66 insertions(+), 47 deletions(-) create mode 100644 changes/issue-3112-policies-key-update-app-wide delete mode 100644 frontend/interfaces/host_policy.ts diff --git a/changes/issue-3112-policies-key-update-app-wide b/changes/issue-3112-policies-key-update-app-wide new file mode 100644 index 0000000000..08dfb5583d --- /dev/null +++ b/changes/issue-3112-policies-key-update-app-wide @@ -0,0 +1 @@ +* Frontend and UI use new policies API keys appwide \ No newline at end of file diff --git a/frontend/interfaces/host.ts b/frontend/interfaces/host.ts index faceeea756..0e8fc540c0 100644 --- a/frontend/interfaces/host.ts +++ b/frontend/interfaces/host.ts @@ -1,5 +1,5 @@ import PropTypes from "prop-types"; -import hostPolicyInterface, { IHostPolicy } from "./host_policy"; +import hostPolicyInterface, { IHostPolicy } from "./policy"; import hostUserInterface, { IHostUser } from "./host_users"; import labelInterface, { ILabel } from "./label"; import packInterface, { IPack } from "./pack"; diff --git a/frontend/interfaces/host_policy.ts b/frontend/interfaces/host_policy.ts deleted file mode 100644 index d29b3f7a2a..0000000000 --- a/frontend/interfaces/host_policy.ts +++ /dev/null @@ -1,19 +0,0 @@ -import PropTypes from "prop-types"; - -export default PropTypes.shape({ - id: PropTypes.number.isRequired, - query_id: PropTypes.number, - query_name: PropTypes.string.isRequired, - query_description: PropTypes.string, - response: PropTypes.string, - resolution: PropTypes.string, -}); - -export interface IHostPolicy { - id: number; - query_id: number; - query_name: string; - query_description?: string; - response: string; - resolution?: string; -} diff --git a/frontend/interfaces/host_summary.ts b/frontend/interfaces/host_summary.ts index a41a52cd29..4937ee6ada 100644 --- a/frontend/interfaces/host_summary.ts +++ b/frontend/interfaces/host_summary.ts @@ -1,4 +1,4 @@ -import PropTypes, { string } from "prop-types"; +import PropTypes from "prop-types"; export default PropTypes.shape({ online_count: PropTypes.number, diff --git a/frontend/interfaces/policy.ts b/frontend/interfaces/policy.ts index 229a1b4db8..c7f813cdb4 100644 --- a/frontend/interfaces/policy.ts +++ b/frontend/interfaces/policy.ts @@ -1,3 +1,21 @@ +import PropTypes from "prop-types"; + +// Legacy PropTypes used on host interface +export default PropTypes.shape({ + author_email: PropTypes.string.isRequired, + author_id: PropTypes.number.isRequired, + author_name: PropTypes.string.isRequired, + created_at: PropTypes.string.isRequired, + description: PropTypes.string.isRequired, + id: PropTypes.number.isRequired, + name: PropTypes.string.isRequired, + query: PropTypes.string.isRequired, + resoluton: PropTypes.string.isRequired, + response: PropTypes.string, + team_id: PropTypes.number, + updated_at: PropTypes.string.isRequired, +}); + export interface IPolicy { id: number; name: string; @@ -7,9 +25,20 @@ export interface IPolicy { author_name: string; author_email: string; resolution: string; + team_id?: number; + created_at: string; + updated_at: string; +} + +// Used on the manage hosts page and other places where aggregate stats are displayed +export interface IPolicyStats extends IPolicy { passing_host_count: number; failing_host_count: number; - team_id?: number; +} + +// Used on the host details page and other places where the status of individual hosts are displayed +export interface IHostPolicy extends IPolicy { + response: string; } export interface IPolicyFormData { diff --git a/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx b/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx index fd4567c11c..4b1f1a6498 100644 --- a/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx +++ b/frontend/pages/Homepage/cards/WelcomeHost/WelcomeHost.tsx @@ -6,7 +6,7 @@ import { useDispatch } from "react-redux"; import moment from "moment"; import { IHost } from "interfaces/host"; -import { IHostPolicy } from "interfaces/host_policy"; +import { IHostPolicy } from "interfaces/policy"; import hostAPI from "services/entities/hosts"; // @ts-ignore import { renderFlash } from "redux/nodes/notifications/actions"; @@ -234,7 +234,7 @@ const WelcomeHost = (): JSX.Element => { alt={p.response} src={p.response === policyPass ? IconPassed : IconError} /> - {p.query_name} + {p.name} diff --git a/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyDetailsModal/PolicyDetailsModal.tsx b/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyDetailsModal/PolicyDetailsModal.tsx index b9c4d237a3..4fbbc405de 100644 --- a/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyDetailsModal/PolicyDetailsModal.tsx +++ b/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyDetailsModal/PolicyDetailsModal.tsx @@ -2,7 +2,7 @@ import React from "react"; import Button from "components/buttons/Button"; import Modal from "components/Modal"; -import { IHostPolicy } from "interfaces/host_policy"; +import { IHostPolicy } from "interfaces/policy"; interface IPolicyDetailsProps { onCancel: () => void; @@ -17,12 +17,12 @@ const PolicyDetailsModal = ({ }: IPolicyDetailsProps): JSX.Element => { return (
-

{policy?.query_description}

+

{policy?.description}

{policy?.resolution && (
Resolve: diff --git a/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyFailingCount/PolicyFailingCount.tsx b/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyFailingCount/PolicyFailingCount.tsx index e94673a3c4..81fe713905 100644 --- a/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyFailingCount/PolicyFailingCount.tsx +++ b/frontend/pages/hosts/HostDetailsPage/HostPoliciesTable/PolicyFailingCount/PolicyFailingCount.tsx @@ -1,4 +1,4 @@ -import { IHostPolicy } from "interfaces/host_policy"; +import { IHostPolicy } from "interfaces/policy"; import React from "react"; import IssueIcon from "../../../../../../assets/images/icon-issue-fleet-black-50-16x16@2x.png"; diff --git a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx index 0f57655ace..b13bf89721 100644 --- a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx +++ b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx @@ -9,7 +9,7 @@ import { renderFlash } from "redux/nodes/notifications/actions"; import PATHS from "router/paths"; -import { IPolicy } from "interfaces/policy"; +import { IPolicy, IPolicyStats } from "interfaces/policy"; import { ITeam } from "interfaces/team"; import { IUser } from "interfaces/user"; @@ -99,10 +99,14 @@ const ManagePolicyPage = (managePoliciesPageProps: { ); // ===== local state - const [globalPolicies, setGlobalPolicies] = useState([]); + const [globalPolicies, setGlobalPolicies] = useState< + IPolicyStats[] | never[] + >([]); const [isLoadingGlobalPolicies, setIsLoadingGlobalPolicies] = useState(true); const [isGlobalPoliciesError, setIsGlobalPoliciesError] = useState(false); - const [teamPolicies, setTeamPolicies] = useState([]); + const [teamPolicies, setTeamPolicies] = useState( + [] + ); const [isLoadingTeamPolicies, setIsLoadingTeamPolicies] = useState(true); const [isTeamPoliciesError, setIsTeamPoliciesError] = useState(false); const [userTeams, setUserTeams] = useState(null); diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx index b819b32978..4a12ce2869 100644 --- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx +++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesListWrapper.tsx @@ -3,7 +3,7 @@ import { noop } from "lodash"; import paths from "router/paths"; import Button from "components/buttons/Button"; -import { IPolicy } from "interfaces/policy"; +import { IPolicyStats } from "interfaces/policy"; import { ITeam } from "interfaces/team"; import TableContainer from "components/TableContainer"; import { generateTableHeaders, generateDataSet } from "./PoliciesTableConfig"; @@ -20,7 +20,7 @@ const TAGGED_TEMPLATES = { }; interface IPoliciesListWrapperProps { - policiesList: IPolicy[]; + policiesList: IPolicyStats[]; isLoading: boolean; onRemovePoliciesClick: (selectedTableIds: number[]) => void; resultsTitle?: string; diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesTableConfig.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesTableConfig.tsx index 8491e6043d..72eed6cdbd 100644 --- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesTableConfig.tsx +++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesListWrapper/PoliciesTableConfig.tsx @@ -8,7 +8,7 @@ import { memoize } from "lodash"; import Checkbox from "components/forms/fields/Checkbox"; import LinkCell from "components/TableContainer/DataTable/LinkCell/LinkCell"; import TextCell from "components/TableContainer/DataTable/TextCell"; -import { IPolicy } from "interfaces/policy"; +import { IPolicyStats } from "interfaces/policy"; import PATHS from "router/paths"; import sortUtils from "utilities/sort"; import { PolicyResponse } from "utilities/constants"; @@ -42,7 +42,7 @@ interface ICellProps { value: any; }; row: { - original: IPolicy; + original: IPolicyStats; getToggleRowSelectedProps: () => any; // TODO: do better with types toggleRowSelected: () => void; }; @@ -175,11 +175,13 @@ const generateTableHeaders = (options: { } }; -const generateDataSet = memoize((policiesList: IPolicy[] = []): IPolicy[] => { - policiesList = policiesList.sort((a, b) => - sortUtils.caseInsensitiveAsc(a.name, b.name) - ); - return policiesList; -}); +const generateDataSet = memoize( + (policiesList: IPolicyStats[] = []): IPolicyStats[] => { + policiesList = policiesList.sort((a, b) => + sortUtils.caseInsensitiveAsc(a.name, b.name) + ); + return policiesList; + } +); export { generateTableHeaders, generateDataSet }; diff --git a/frontend/utilities/constants.ts b/frontend/utilities/constants.ts index fc6ac51f28..f8ea919874 100644 --- a/frontend/utilities/constants.ts +++ b/frontend/utilities/constants.ts @@ -90,6 +90,8 @@ export const DEFAULT_POLICY = { resolution: "Resolution steps", passing_host_count: 2000, failing_host_count: 300, + created_at: "", + updated_at: "", }; export const DEFAULT_CAMPAIGN = {