From a188d030157514521b4371bb96f36f7fe9467e50 Mon Sep 17 00:00:00 2001 From: RachelElysia <71795832+RachelElysia@users.noreply.github.com> Date: Tue, 27 Jul 2021 18:04:43 -0400 Subject: [PATCH] Homepage: Refactor platform counts in host summary (#1490) Co-authored by: @gillespi314 --- changes/1490-host-count-bug | 1 + frontend/interfaces/label.ts | 29 +++++++++--- .../Homepage/HostsSummary/HostsSummary.tsx | 44 ++++++++++++------- 3 files changed, 54 insertions(+), 20 deletions(-) create mode 100644 changes/1490-host-count-bug diff --git a/changes/1490-host-count-bug b/changes/1490-host-count-bug new file mode 100644 index 0000000000..7e7547970f --- /dev/null +++ b/changes/1490-host-count-bug @@ -0,0 +1 @@ +- Fix host count bug by refactoring host counts to use built-in labels with exact label names \ No newline at end of file diff --git a/frontend/interfaces/label.ts b/frontend/interfaces/label.ts index e352ab699e..f14e185ea0 100644 --- a/frontend/interfaces/label.ts +++ b/frontend/interfaces/label.ts @@ -1,15 +1,34 @@ -import PropTypes from "prop-types"; +import PropTypes, { string } from "prop-types"; export default PropTypes.shape({ + created_at: PropTypes.string, + description: PropTypes.string, + display_text: PropTypes.string, hosts_count: PropTypes.number, + host_ids: PropTypes.arrayOf( + PropTypes.oneOfType([PropTypes.number, PropTypes.string]) + ), id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), - title: PropTypes.string, - type: PropTypes.string, + name: PropTypes.string, + label_type: PropTypes.string, + title: PropTypes.string, // confirm on rest api doc + type: PropTypes.string, // confirm on rest api doc + count: PropTypes.number, // confirm on rest api doc }); export interface ILabel { + created_at: string; + description: string; + display_text: string; hosts_count: number; + host_ids: number[] | null; id: number | string; - title: string; - type: string; + label_membership_type: string; + label_type: string; + name: string; + query: string; + updated_at: string; + title: string; // confirm on rest api doc + type: string; // confirm on rest api doc + count: number; } diff --git a/frontend/pages/Homepage/HostsSummary/HostsSummary.tsx b/frontend/pages/Homepage/HostsSummary/HostsSummary.tsx index e420f42f38..2f0e04fc66 100644 --- a/frontend/pages/Homepage/HostsSummary/HostsSummary.tsx +++ b/frontend/pages/Homepage/HostsSummary/HostsSummary.tsx @@ -1,9 +1,9 @@ import React, { useEffect } from "react"; import { useDispatch, useSelector } from "react-redux"; - +import { isEmpty, reduce } from "lodash"; +import { ILabel } from "interfaces/label"; // @ts-ignore import { getLabels } from "redux/nodes/components/ManageHostsPage/actions"; - import WindowsIcon from "../../../../assets/images/icon-windows-48x48@2x.png"; import LinuxIcon from "../../../../assets/images/icon-linux-48x48@2x.png"; import MacIcon from "../../../../assets/images/icon-mac-48x48@2x.png"; @@ -15,14 +15,18 @@ interface IRootState { labels: { isLoading: boolean; data: { - [id: number]: { - count: number; - }; + [id: number]: ILabel; }; }; }; } +const PLATFORM_STRINGS = { + macOS: ["macOS"], + windows: ["MS Windows"], + linux: ["Red Hat Linux", "CentOS Linux", "Ubuntu Linux"], +}; + const HostsSummary = (): JSX.Element => { const dispatch = useDispatch(); @@ -32,16 +36,26 @@ const HostsSummary = (): JSX.Element => { const labels = useSelector((state: IRootState) => state.entities.labels.data); - const macCount = labels[7] ? labels[7].count.toLocaleString("en-US") : ""; - const windowsCount = labels[10] - ? labels[10].count.toLocaleString("en-US") - : ""; - const linuxCount = - labels[8] && labels[9] - ? (labels[8].count + labels[9].count + labels[11].count).toLocaleString( - "en-US" - ) - : ""; + // Builtin labels from state populate os counts + const getCount = (platformTitles: string[]) => { + return reduce( + Object.values(labels), + (total, label) => { + return label.label_type === "builtin" && + platformTitles.includes(label.name) && + label.count + ? total + label.count + : total; + }, + 0 + ); + }; + + const macCount = getCount(PLATFORM_STRINGS.macOS).toLocaleString("en-US"); + const windowsCount = getCount(PLATFORM_STRINGS.windows).toLocaleString( + "en-US" + ); + const linuxCount = getCount(PLATFORM_STRINGS.linux).toLocaleString("en-US"); return (