diff --git a/changes/23512-clarify-expected-behavior-of-host-counts b/changes/23512-clarify-expected-behavior-of-host-counts
new file mode 100644
index 000000000000..98e0b64acb81
--- /dev/null
+++ b/changes/23512-clarify-expected-behavior-of-host-counts
@@ -0,0 +1,2 @@
+- Clarify expected behavior of policy host counts, dashboard controls software count, and controls
+ os updates versions count.
diff --git a/frontend/pages/DashboardPage/DashboardPage.tsx b/frontend/pages/DashboardPage/DashboardPage.tsx
index 056acc965c17..51f846941fc2 100644
--- a/frontend/pages/DashboardPage/DashboardPage.tsx
+++ b/frontend/pages/DashboardPage/DashboardPage.tsx
@@ -322,7 +322,15 @@ const DashboardPage = ({ router, location }: IDashboardProps): JSX.Element => {
setSoftwareTitleDetail(
<LastUpdatedText
lastUpdatedAt={data.counts_updated_at}
- whatToRetrieve="software"
+ customTooltipText={
+ <>
+ Fleet periodically queries all hosts to
+ <br />
+ retrieve software. Click to view
+ <br />
+ hosts for the most up-to-date lists.
+ </>
+ }
/>
);
setShowSoftwareCard(true);
diff --git a/frontend/pages/ManageControlsPage/OSUpdates/components/CurrentVersionSection/CurrentVersionSection.tsx b/frontend/pages/ManageControlsPage/OSUpdates/components/CurrentVersionSection/CurrentVersionSection.tsx
index 7e1cc7f085d5..0b76c3189d0e 100644
--- a/frontend/pages/ManageControlsPage/OSUpdates/components/CurrentVersionSection/CurrentVersionSection.tsx
+++ b/frontend/pages/ManageControlsPage/OSUpdates/components/CurrentVersionSection/CurrentVersionSection.tsx
@@ -81,7 +81,17 @@ const CurrentVersionSection = ({
return (
<LastUpdatedText
lastUpdatedAt={data?.counts_updated_at}
- whatToRetrieve="operating systems"
+ customTooltipText={
+ <>
+ Fleet periodically queries all hosts to
+ <br />
+ retrieve operating systems. Click to
+ <br />
+ view hosts for the most up-to-date
+ <br />
+ lists.
+ </>
+ }
/>
);
};
diff --git a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
index dd0d122aae58..3b2ce1cb427b 100644
--- a/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/ManagePoliciesPage.tsx
@@ -4,6 +4,7 @@ import { useQuery } from "react-query";
import { InjectedRouter } from "react-router/lib/Router";
import PATHS from "router/paths";
import { isEqual } from "lodash";
+import { formatDistanceToNowStrict } from "date-fns";
import { getNextLocationPath, wait } from "utilities/helpers";
@@ -44,6 +45,7 @@ import Spinner from "components/Spinner";
import TeamsDropdown from "components/TeamsDropdown";
import TableDataError from "components/DataError";
import MainContent from "components/MainContent";
+import LastUpdatedText from "components/LastUpdatedText";
import PoliciesTable from "./components/PoliciesTable";
import OtherWorkflowsModal from "./components/OtherWorkflowsModal";
@@ -776,22 +778,43 @@ const ManagePolicyPage = ({
}
}
- const renderPoliciesCount = (count?: number) => {
+ const renderPoliciesCountAndLastUpdated = (
+ count?: number,
+ policies?: IPolicyStats[]
+ ) => {
// Hide count if fetching count || there are errors OR there are no policy results with no a search filter
const isFetchingCount = !isAllTeamsSelected
? isFetchingTeamCountMergeInherited
: isFetchingGlobalCount;
- const hideCount =
+ const hide =
isFetchingCount ||
policiesErrors ||
(!policyResults && searchQuery === "");
- if (hideCount) {
+ if (hide) {
return null;
}
+ // Figure the time since the host counts were updated by finding first policy item with host_count_updated_at.
+ const updatedAt =
+ policies?.find((p) => !!p.host_count_updated_at)?.host_count_updated_at ||
+ "";
- return <TableCount name="policies" count={count} />;
+ return (
+ <>
+ <TableCount name="policies" count={count} />
+ <LastUpdatedText
+ lastUpdatedAt={updatedAt}
+ customTooltipText={
+ <>
+ Counts are updated hourly. Click host
+ <br />
+ counts for the most up-to-date count.
+ </>
+ }
+ />
+ </>
+ );
};
const renderMainTable = () => {
@@ -815,7 +838,12 @@ const ManagePolicyPage = ({
currentTeam={currentTeamSummary}
currentAutomatedPolicies={currentAutomatedPolicies}
isPremiumTier={isPremiumTier}
- renderPoliciesCount={() => renderPoliciesCount(globalPoliciesCount)}
+ renderPoliciesCount={() =>
+ renderPoliciesCountAndLastUpdated(
+ globalPoliciesCount,
+ globalPolicies
+ )
+ }
searchQuery={searchQuery}
sortHeader={sortHeader}
sortDirection={sortDirection}
@@ -844,7 +872,10 @@ const ManagePolicyPage = ({
currentTeam={currentTeamSummary}
currentAutomatedPolicies={currentAutomatedPolicies}
renderPoliciesCount={() =>
- renderPoliciesCount(teamPoliciesCountMergeInherited)
+ renderPoliciesCountAndLastUpdated(
+ teamPoliciesCountMergeInherited,
+ teamPolicies
+ )
}
isPremiumTier={isPremiumTier}
searchQuery={searchQuery}
diff --git a/frontend/pages/policies/ManagePoliciesPage/_styles.scss b/frontend/pages/policies/ManagePoliciesPage/_styles.scss
index 4edf0c5432d9..1de07894b2ad 100644
--- a/frontend/pages/policies/ManagePoliciesPage/_styles.scss
+++ b/frontend/pages/policies/ManagePoliciesPage/_styles.scss
@@ -295,4 +295,8 @@
}
}
}
+
+ .component__last-updated-text {
+ font-weight: normal;
+ }
}
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PassingColumnHeader/PassingColumnHeader.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PassingColumnHeader/PassingColumnHeader.tsx
index c3910fd4c0a1..7f9f85ca3c3a 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/PassingColumnHeader/PassingColumnHeader.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/PassingColumnHeader/PassingColumnHeader.tsx
@@ -1,37 +1,20 @@
import Icon from "components/Icon";
import React from "react";
-import TooltipWrapper from "components/TooltipWrapper";
interface IPassingColumnHeaderProps {
isPassing: boolean;
- timeSinceHostCountUpdate: string;
}
const baseClass = "passing-column-header";
-const PassingColumnHeader = ({
- isPassing,
- timeSinceHostCountUpdate,
-}: IPassingColumnHeaderProps) => {
+const PassingColumnHeader = ({ isPassing }: IPassingColumnHeaderProps) => {
const iconName = isPassing ? "success" : "error";
const columnText = isPassing ? "Yes" : "No";
- const updateText = timeSinceHostCountUpdate
- ? `Host count updated ${timeSinceHostCountUpdate}.`
- : "";
return (
<div className={baseClass}>
<Icon name={iconName} />
- <TooltipWrapper
- tipContent={
- <>
- {updateText}
- <br /> Counts are updated hourly.
- </>
- }
- >
- <span className="status-header-text">{columnText}</span>
- </TooltipWrapper>
+ <span className="status-header-text">{columnText}</span>
</div>
);
};
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
index 6db439a07392..88dc32998330 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTable.tsx
@@ -97,7 +97,6 @@ const PoliciesTable = ({
selectedTeamId: currentTeam?.id,
hasPermissionAndPoliciesToDelete,
},
- policiesList,
isPremiumTier
)}
data={generateDataSet(
diff --git a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTableConfig.tsx b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTableConfig.tsx
index 76e785d7416d..6f09884cb92c 100644
--- a/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTableConfig.tsx
+++ b/frontend/pages/policies/ManagePoliciesPage/components/PoliciesTable/PoliciesTableConfig.tsx
@@ -2,11 +2,7 @@
// disable this rule as it was throwing an error in Header and Cell component
// definitions for the selection row for some reason when we dont really need it.
import React from "react";
-import {
- formatDistanceToNowStrict,
- millisecondsToHours,
- millisecondsToMinutes,
-} from "date-fns";
+import { millisecondsToHours, millisecondsToMinutes } from "date-fns";
import { Tooltip as ReactTooltip5 } from "react-tooltip-5";
// @ts-ignore
import Checkbox from "components/forms/fields/Checkbox";
@@ -91,27 +87,10 @@ const generateTableHeaders = (
hasPermissionAndPoliciesToDelete?: boolean;
tableType?: string;
},
- policiesList: IPolicyStats[] = [],
isPremiumTier?: boolean
): IDataColumn[] => {
const { selectedTeamId, hasPermissionAndPoliciesToDelete } = options;
const viewingTeamPolicies = selectedTeamId !== -1;
- // Figure the time since the host counts were updated.
- // First, find first policy item with host_count_updated_at.
- const updatedAt =
- policiesList.find((p) => !!p.host_count_updated_at)
- ?.host_count_updated_at || "";
- let timeSinceHostCountUpdate = "";
- if (updatedAt) {
- try {
- timeSinceHostCountUpdate = formatDistanceToNowStrict(
- new Date(updatedAt),
- { addSuffix: true }
- );
- } catch (e) {
- // Do nothing.
- }
- }
const tableHeaders: IDataColumn[] = [
{
@@ -170,12 +149,7 @@ const generateTableHeaders = (
title: "Yes",
Header: (cellProps) => (
<HeaderCell
- value={
- <PassingColumnHeader
- isPassing
- timeSinceHostCountUpdate={timeSinceHostCountUpdate}
- />
- }
+ value={<PassingColumnHeader isPassing />}
isSortedDesc={cellProps.column.isSortedDesc}
/>
),
@@ -221,12 +195,7 @@ const generateTableHeaders = (
title: "No",
Header: (cellProps) => (
<HeaderCell
- value={
- <PassingColumnHeader
- isPassing={false}
- timeSinceHostCountUpdate={timeSinceHostCountUpdate}
- />
- }
+ value={<PassingColumnHeader isPassing={false} />}
isSortedDesc={cellProps.column.isSortedDesc}
/>
),