Fleet UI: Update software updated time tooltip (#20029)

changes/19760-software-update-tooltip

@@ -0,0 +1 @@
+* Update software updated timestamp tooltip

frontend/components/LastUpdatedText/LastUpdatedText.tsx

@@ -6,14 +6,27 @@ import TooltipWrapper from "components/TooltipWrapper";
 
 const baseClass = "component__last-updated-text";
 
-interface ILastUpdatedTextProps {
+interface ILastUpdatedTextBase {
   lastUpdatedAt?: string;
+}
+
+interface ILastUpdatedTextWithCustomTooltip extends ILastUpdatedTextBase {
+  customTooltipText: React.ReactNode;
+  whatToRetrieve?: never;
+}
+
+interface ILastUpdatedTextWithWhatToRetrieve extends ILastUpdatedTextBase {
+  customTooltipText?: never;
   whatToRetrieve: string;
 }
+
 const LastUpdatedText = ({
   lastUpdatedAt,
   whatToRetrieve,
-}: ILastUpdatedTextProps): JSX.Element => {
+  customTooltipText,
+}:
+  | ILastUpdatedTextWithCustomTooltip
+  | ILastUpdatedTextWithWhatToRetrieve): JSX.Element => {
   if (!lastUpdatedAt || lastUpdatedAt === "0001-01-01T00:00:00Z") {
     lastUpdatedAt = "never";
   } else {
@@ -24,16 +37,16 @@ const LastUpdatedText = ({
     );
   }
 
+  const tooltipContent = customTooltipText || (
+    <>
+      Fleet periodically queries all hosts <br />
+      to retrieve {whatToRetrieve}.
+    </>
+  );
+
   return (
     <span className={baseClass}>
-      <TooltipWrapper
-        tipContent={
-          <>
-            Fleet periodically queries all hosts <br />
-            to retrieve {whatToRetrieve}.
-          </>
-        }
-      >
+      <TooltipWrapper tipContent={tooltipContent}>
         {`Updated ${lastUpdatedAt}`}
       </TooltipWrapper>
     </span>

frontend/pages/SoftwarePage/SoftwareOS/SoftwareOSTable/SoftwareOSTable.tsx

@@ -1,6 +1,6 @@
 /** software/os OS tab > Table */
 
-import React, { useCallback, useContext, useMemo } from "react";
+import React, { useCallback, useMemo } from "react";
 import { InjectedRouter } from "react-router";
 import { Row } from "react-table";
 
@@ -137,7 +137,13 @@ const SoftwareOSTable = ({
         {data?.os_versions && data?.counts_updated_at && (
           <LastUpdatedText
             lastUpdatedAt={data.counts_updated_at}
-            whatToRetrieve="vulnerabilities"
+            customTooltipText={
+              <>
+                The last time software data was <br />
+                updated, including vulnerabilities <br />
+                and host counts.
+              </>
+            }
           />
         )}
       </>

frontend/pages/SoftwarePage/SoftwareTitles/SoftwareTable/SoftwareTable.tsx

@@ -270,7 +270,13 @@ const SoftwareTable = ({
         {tableData && data?.counts_updated_at && (
           <LastUpdatedText
             lastUpdatedAt={data.counts_updated_at}
-            whatToRetrieve="software"
+            customTooltipText={
+              <>
+                The last time software data was <br />
+                updated, including vulnerabilities <br />
+                and host counts.
+              </>
+            }
           />
         )}
       </>

frontend/pages/SoftwarePage/SoftwareVulnerabilities/SoftwareVulnerabilitiesTable/SoftwareVulnerabilitiesTable.tsx

@@ -189,7 +189,13 @@ const SoftwareVulnerabilitiesTable = ({
         {data?.vulnerabilities && data?.counts_updated_at && (
           <LastUpdatedText
             lastUpdatedAt={data.counts_updated_at}
-            whatToRetrieve="vulnerabilities"
+            customTooltipText={
+              <>
+                The last time software data was <br />
+                updated, including vulnerabilities <br />
+                and host counts.
+              </>
+            }
           />
         )}
       </>