From 2efb48ee0ceafedd536f5cd6efe2da06d649e195 Mon Sep 17 00:00:00 2001
From: RachelElysia <71795832+RachelElysia@users.noreply.github.com>
Date: Mon, 19 Jun 2023 12:08:33 -0400
Subject: [PATCH] Fleet UI: Clean up dashboard loading state (#12395)

---
 changes/bug-12332-dashboard-loading-state        |  1 +
 frontend/pages/DashboardPage/DashboardPage.tsx   | 16 +++++++++++-----
 .../cards/ActivityFeed/_styles.scss              |  3 ---
 .../pages/DashboardPage/cards/MDM/_styles.scss   |  1 +
 4 files changed, 13 insertions(+), 8 deletions(-)
 create mode 100644 changes/bug-12332-dashboard-loading-state

diff --git a/changes/bug-12332-dashboard-loading-state b/changes/bug-12332-dashboard-loading-state
new file mode 100644
index 0000000000..526bdfbdb7
--- /dev/null
+++ b/changes/bug-12332-dashboard-loading-state
@@ -0,0 +1 @@
+- Clean up dashboard loading states
diff --git a/frontend/pages/DashboardPage/DashboardPage.tsx b/frontend/pages/DashboardPage/DashboardPage.tsx
index 6c05cb33bb..d1a9febd4b 100644
--- a/frontend/pages/DashboardPage/DashboardPage.tsx
+++ b/frontend/pages/DashboardPage/DashboardPage.tsx
@@ -422,12 +422,18 @@ const DashboardPage = ({ router, location }: IDashboardProps): JSX.Element => {
     setShowAddHostsModal(!showAddHostsModal);
   };
 
+  const { MANAGE_HOSTS } = paths;
+
   const HostsSummaryCard = useInfoCard({
     title: "Hosts",
-    action: {
-      type: "link",
-      text: "View all hosts",
-    },
+    action:
+      selectedPlatform === "all"
+        ? {
+            type: "link",
+            text: "View all hosts",
+          }
+        : undefined,
+    actionUrl: selectedPlatform === "all" ? MANAGE_HOSTS : undefined,
     total_host_count: (() => {
       if (!isHostSummaryFetching && !errorHosts) {
         return `${hostSummaryData?.totals_hosts_count}` || undefined;
@@ -596,7 +602,7 @@ const DashboardPage = ({ router, location }: IDashboardProps): JSX.Element => {
       {useInfoCard({
         title: "Mobile device management (MDM)",
         titleDetail: mdmTitleDetail,
-        showTitle: !isMacAdminsFetching,
+        showTitle: !isMdmFetching,
         description: (
           <p>
             MDM is used to change settings and install software on your hosts.
diff --git a/frontend/pages/DashboardPage/cards/ActivityFeed/_styles.scss b/frontend/pages/DashboardPage/cards/ActivityFeed/_styles.scss
index 0657a49523..531f20c494 100644
--- a/frontend/pages/DashboardPage/cards/ActivityFeed/_styles.scss
+++ b/frontend/pages/DashboardPage/cards/ActivityFeed/_styles.scss
@@ -104,8 +104,5 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    .loading-spinner {
-      margin-top: 33px;
-    }
   }
 }
diff --git a/frontend/pages/DashboardPage/cards/MDM/_styles.scss b/frontend/pages/DashboardPage/cards/MDM/_styles.scss
index 8452d1ebff..8fe69290f7 100644
--- a/frontend/pages/DashboardPage/cards/MDM/_styles.scss
+++ b/frontend/pages/DashboardPage/cards/MDM/_styles.scss
@@ -1,6 +1,7 @@
 .home-mdm {
   margin-top: $pad-large;
   position: relative;
+  height: 100%; // centers loading spinner
 
   .component__tabs-wrapper .table-container__header {
     display: none;