From 803b688ed757246c15bb1e7f44a8b331f683db63 Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Tue, 1 Jul 2025 21:59:53 +1000
Subject: [PATCH] Prevent dashboard updates if tab not visible (#9924)

* Prevent dashboard updates if tab not visible

* Uncomment code
---
 .../dashboard/widgets/QueryCountDashboardWidget.tsx  | 12 +++++++++---
 src/frontend/src/components/nav/Header.tsx           |  6 +++---
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/frontend/src/components/dashboard/widgets/QueryCountDashboardWidget.tsx b/src/frontend/src/components/dashboard/widgets/QueryCountDashboardWidget.tsx
index 37f48d9498..58b7c95d5e 100644
--- a/src/frontend/src/components/dashboard/widgets/QueryCountDashboardWidget.tsx
+++ b/src/frontend/src/components/dashboard/widgets/QueryCountDashboardWidget.tsx
@@ -9,6 +9,7 @@ import type { ModelType } from '@lib/enums/ModelType';
 import { apiUrl } from '@lib/functions/Api';
 import { navigateToLink } from '@lib/functions/Navigation';
 import type { InvenTreeIconType } from '@lib/types/Icons';
+import { useDocumentVisibility } from '@mantine/hooks';
 import { useApi } from '../../../contexts/ApiContext';
 import { InvenTreeIcon } from '../../../functions/icons';
 import { useUserState } from '../../../states/UserState';
@@ -32,15 +33,20 @@ function QueryCountWidget({
   const api = useApi();
   const user = useUserState();
   const navigate = useNavigate();
+  const visibility = useDocumentVisibility();
 
   const modelProperties = ModelInformationDict[modelType];
 
   const query = useQuery({
-    queryKey: ['dashboard-query-count', modelType, params],
-    enabled: user.hasViewPermission(modelType),
+    queryKey: ['dashboard-query-count', modelType, params, visibility],
+    enabled: user.hasViewPermission(modelType) && visibility === 'visible',
     refetchOnMount: true,
-    refetchInterval: 5 * 60 * 1000, // 5 minutes
+    refetchInterval: 10 * 60 * 1000, // 10 minute refetch interval
     queryFn: () => {
+      if (visibility !== 'visible') {
+        return null;
+      }
+
       return api
         .get(apiUrl(modelProperties.api_endpoint), {
           params: {
diff --git a/src/frontend/src/components/nav/Header.tsx b/src/frontend/src/components/nav/Header.tsx
index 4e08ca07a6..c3c5e57054 100644
--- a/src/frontend/src/components/nav/Header.tsx
+++ b/src/frontend/src/components/nav/Header.tsx
@@ -59,7 +59,7 @@ export function Header() {
     { open: openNotificationDrawer, close: closeNotificationDrawer }
   ] = useDisclosure(false);
 
-  const { isLoggedIn, isStaff } = useUserState();
+  const { isLoggedIn } = useUserState();
   const [notificationCount, setNotificationCount] = useState<number>(0);
   const globalSettings = useGlobalSettingsState();
 
@@ -71,10 +71,10 @@ export function Header() {
 
   // Fetch number of notifications for the current user
   const notifications = useQuery({
-    queryKey: ['notification-count'],
+    queryKey: ['notification-count', visibility],
     enabled: isLoggedIn() && visibility === 'visible',
     queryFn: async () => {
-      if (!isLoggedIn()) {
+      if (!isLoggedIn() || visibility != 'visible') {
         return null;
       }