From a6d622f8a93b9b2aadf415aee9edebfb8c6188e2 Mon Sep 17 00:00:00 2001
From: Jacob Shandling <61553566+jacobshandling@users.noreply.github.com>
Date: Thu, 18 Jan 2024 10:50:08 -0500
Subject: [PATCH] UI - update Host > Queries > Report updated column's empty
 state (#16181)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Addresses #15707
<img width="762" alt="Screenshot 2024-01-17 at 3 46 53 PM"
src="https://github.com/fleetdm/fleet/assets/61553566/77fadc4f-b5f6-461b-8ba6-479fb1a99d5a">

- [x] Changes file added for user-visible changes in `changes/`
- [x] Manual QA for all new/changed functionality

---------

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
---
 changes/15707-hqr-report-updated-empty-state-update    |  2 ++
 .../ReportUpdatedCell/ReportUpdatedCell.tests.tsx      | 10 ++++++----
 .../Queries/ReportUpdatedCell/ReportUpdatedCell.tsx    |  7 +++++--
 3 files changed, 13 insertions(+), 6 deletions(-)
 create mode 100644 changes/15707-hqr-report-updated-empty-state-update

diff --git a/changes/15707-hqr-report-updated-empty-state-update b/changes/15707-hqr-report-updated-empty-state-update
new file mode 100644
index 0000000000..31298492da
--- /dev/null
+++ b/changes/15707-hqr-report-updated-empty-state-update
@@ -0,0 +1,2 @@
+* Update the Host > Queries > Report updated column's empty state to reflect its including live as
+well as scheduled query runs.
diff --git a/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tests.tsx b/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tests.tsx
index 057de57bd3..3f059a9bb8 100644
--- a/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tests.tsx
+++ b/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tests.tsx
@@ -22,7 +22,7 @@ describe("ReportUpdatedCell component", () => {
     expect(screen.queryByText(/View report/)).toBeNull();
   });
 
-  it("Renders 'Never with tooltip and link to report when run on an interval with discard data off and no last_fetched time", () => {
+  it("Renders '---' with tooltip and link to report when run on an interval with discard data off and no last_fetched time", () => {
     render(
       <ReportUpdatedCell
         interval={1000}
@@ -32,9 +32,11 @@ describe("ReportUpdatedCell component", () => {
       />
     );
 
-    expect(screen.getByText(/Never/)).toBeInTheDocument();
-    expect(screen.getByText(/This query has not run/)).toBeInTheDocument();
-    expect(screen.getByText(/View report/)).toBeInTheDocument();
+    expect(screen.getByText(/---/)).toBeInTheDocument();
+    expect(
+      screen.getByText(/Fleet is collecting query results\./)
+    ).toBeInTheDocument();
+    expect(screen.getByText(/Check back later./)).toBeInTheDocument();
   });
 
   it("Renders a last-updated timestamp with tooltip and link to report when a last_fetched date is present", () => {
diff --git a/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tsx b/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tsx
index 8bdec1eab0..a0adf74ec8 100644
--- a/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tsx
+++ b/frontend/pages/hosts/details/cards/Queries/ReportUpdatedCell/ReportUpdatedCell.tsx
@@ -6,6 +6,7 @@ import ReactTooltip from "react-tooltip";
 import { COLORS } from "styles/var/colors";
 import Icon from "components/Icon";
 import TextCell from "components/TableContainer/DataTable/TextCell";
+import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
 
 const baseClass = "report-updated-cell";
 
@@ -51,7 +52,7 @@ const ReportUpdatedCell = ({
         const tipId = uniqueId();
         return (
           <TextCell
-            value="Never"
+            value={DEFAULT_EMPTY_CELL_VALUE}
             formatter={(val) => (
               <>
                 <span data-tip data-for={tipId}>
@@ -63,7 +64,9 @@ const ReportUpdatedCell = ({
                   backgroundColor={COLORS["tooltip-bg"]}
                   place="top"
                 >
-                  This query has not run on this host.
+                  Fleet is collecting query results.
+                  <br />
+                  Check back later.
                 </ReactTooltip>
               </>
             )}