Fleet UI: Clean up dashboard loading state (#12395)

changes/bug-12332-dashboard-loading-state

@@ -0,0 +1 @@
+- Clean up dashboard loading states

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: {
+    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.

frontend/pages/DashboardPage/cards/ActivityFeed/_styles.scss

@@ -104,8 +104,5 @@
     display: flex;
     justify-content: center;
     align-items: center;
-    .loading-spinner {
-      margin-top: 33px;
-    }
   }
 }

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;