From c510e5b6e275170d7e1bdcd12c10132c08bd571c Mon Sep 17 00:00:00 2001
From: Noah Talerman <47070608+noahtalerman@users.noreply.github.com>
Date: Fri, 7 Aug 2026 13:18:24 -0400
Subject: [PATCH] Add tooltip explaining no Refetch button for Android hosts on
 Host details page (#50666)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Follow up PR for the following quick win based on feedback here:
- https://github.com/fleetdm/fleet/issues/50001
<img width="899" height="217" alt="Screenshot 2026-08-06 at 10 32 24 AM"
src="https://github.com/user-attachments/assets/462df6ae-ec09-433d-831b-9a0e3c242081"
/>

- [x] QA'd all new/changed functionality manually


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Android host details now display a disabled **Refetch** button with an
explanatory tooltip.
* The tooltip explains automatic synchronization and links to manual
Android synchronization instructions in a new tab.
* The **Last fetched** information is displayed directly without an
additional tooltip.

* **Documentation**
* Updated Android host documentation to reflect the disabled Refetch
control and manual synchronization guidance.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: LeAnn Gove <leann@fleetdm.com>
Co-authored-by: LeAnn <97471894+Leanngove@users.noreply.github.com>
---
 changes/50001-android-refetch-tooltip         |  2 +-
 .../cards/HostHeader/HostHeader.tests.tsx     | 12 +++++------
 .../details/cards/HostHeader/HostHeader.tsx   | 20 +++++++++----------
 .../details/cards/HostHeader/helpers.tsx      | 13 ++++++++++--
 4 files changed, 26 insertions(+), 21 deletions(-)

diff --git a/changes/50001-android-refetch-tooltip b/changes/50001-android-refetch-tooltip
index c3c9f8f23a..442adfb172 100644
--- a/changes/50001-android-refetch-tooltip
+++ b/changes/50001-android-refetch-tooltip
@@ -1 +1 @@
-- Added a tooltip to "Last fetched" on the Host details page for Android hosts, explaining why there's no Refetch button (Android hosts sync data automatically when they change).
+- Added a disabled Refetch button with a tooltip on the Host details page for Android hosts, explaining that Android hosts sync data automatically and linking to how to sync manually.
diff --git a/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tests.tsx b/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tests.tsx
index 433d1d1a7c..8ec148b06b 100644
--- a/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tests.tsx
+++ b/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tests.tsx
@@ -43,7 +43,7 @@ describe("HostHeader", () => {
     expect(screen.getByText("My device")).toBeInTheDocument();
     expect(screen.getByText(/unavailable/i)).toBeInTheDocument();
   });
-  it("does not render refetch button for Android", () => {
+  it("renders a disabled refetch button for Android", () => {
     render(
       <HostHeader
         summaryData={{ ...defaultSummaryData, platform: "android" }}
@@ -53,10 +53,10 @@ describe("HostHeader", () => {
         hostMdmEnrollmentStatus={null}
       />
     );
-    expect(screen.queryByText("Refetch")).not.toBeInTheDocument();
+    expect(screen.getByRole("button", { name: /refetch/i })).toBeDisabled();
   });
 
-  it("shows a tooltip explaining the missing refetch button for Android hosts", async () => {
+  it("shows a tooltip on the disabled refetch button explaining why Android hosts can't be refetched", async () => {
     const { user } = renderWithSetup(
       <HostHeader
         summaryData={{ ...defaultSummaryData, platform: "android" }}
@@ -67,11 +67,9 @@ describe("HostHeader", () => {
       />
     );
 
-    await user.hover(screen.getByText(/Last fetched/i));
+    await user.hover(screen.getByText("Refetch"));
 
-    expect(
-      await screen.findByText(/there's no Refetch button/i)
-    ).toBeInTheDocument();
+    expect(await screen.findByText(/there's no manual/i)).toBeInTheDocument();
   });
 
   it("disables refetch button when host is offline", () => {
diff --git a/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tsx b/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tsx
index fa56cb3414..b0e31b423e 100644
--- a/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tsx
+++ b/frontend/pages/hosts/details/cards/HostHeader/HostHeader.tsx
@@ -101,7 +101,14 @@ const HostHeader = ({
 
   const renderRefetch = () => {
     if (isAndroid(platform)) {
-      return null;
+      return (
+        <RefetchButton
+          isDisabled
+          isFetching={false}
+          tooltip={ANDROID_NO_REFETCH_TOOLTIP_MESSAGE}
+          onRefetchHost={onRefetchHost}
+        />
+      );
     }
 
     const isOnline = summaryData.status === "online";
@@ -213,16 +220,7 @@ const HostHeader = ({
           {renderDeviceStatusTag()}
 
           <div className={`${baseClass}__last-fetched`}>
-            <TooltipWrapper
-              disableTooltip={!isAndroid(platform)}
-              tipContent={ANDROID_NO_REFETCH_TOOLTIP_MESSAGE}
-              underline={isAndroid(platform)}
-              position="bottom"
-              showArrow
-            >
-              {"Last fetched"} {lastFetched}
-              &nbsp;
-            </TooltipWrapper>
+            {"Last fetched"} {lastFetched}
           </div>
         </div>
       </div>
diff --git a/frontend/pages/hosts/details/cards/HostHeader/helpers.tsx b/frontend/pages/hosts/details/cards/HostHeader/helpers.tsx
index 4fd88cb5e7..33f38e6dc2 100644
--- a/frontend/pages/hosts/details/cards/HostHeader/helpers.tsx
+++ b/frontend/pages/hosts/details/cards/HostHeader/helpers.tsx
@@ -1,5 +1,7 @@
 import React from "react";
 import { isMacOS, isIPadOrIPhone } from "interfaces/platform";
+import CustomLink from "components/CustomLink";
+import { LEARN_MORE_ABOUT_BASE_LINK } from "utilities/constants";
 import { HostMdmDeviceStatusUIState } from "../../helpers";
 
 interface IDeviceStatusTag {
@@ -170,7 +172,14 @@ export const REFETCH_TOOLTIP_MESSAGES: Record<
 
 export const ANDROID_NO_REFETCH_TOOLTIP_MESSAGE = (
   <>
-    For Android hosts, there&apos;s no Refetch button on the Host details page
-    in Fleet because Android hosts sync data automatically when they change.
+    There&apos;s no manual <b>Refetch</b> button because Android hosts sync data
+    automatically when they change. If changes aren&apos;t appearing,{" "}
+    <CustomLink
+      url={`${LEARN_MORE_ABOUT_BASE_LINK}/android-manual-sync`}
+      text="learn how to sync manually"
+      newTab
+      variant="tooltip-link"
+    />
+    .
   </>
 );