From 6df47766b2405c7fca5037e800b50ee4c10b0b66 Mon Sep 17 00:00:00 2001
From: Robbie Lankford <robert.lankford@grafana.com>
Date: Sun, 5 Dec 2021 03:07:03 -0600
Subject: [PATCH 1/2] disable fetching alertmanagers on status page in agent
 mode

Signed-off-by: Robbie Lankford <robert.lankford@grafana.com>
---
 web/ui/react-app/src/App.tsx                 |  2 +-
 web/ui/react-app/src/pages/status/Status.tsx | 39 ++++++++++++--------
 2 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/web/ui/react-app/src/App.tsx b/web/ui/react-app/src/App.tsx
index 8c96a3f73b..7ba77d8f05 100755
--- a/web/ui/react-app/src/App.tsx
+++ b/web/ui/react-app/src/App.tsx
@@ -103,7 +103,7 @@ const App: FC<AppProps> = ({ consolesLink, agentMode }) => {
                 <ServiceDiscoveryPage />
               </Route>
               <Route path="/status">
-                <StatusPage />
+                <StatusPage agentMode={agentMode} />
               </Route>
               <Route path="/tsdb-status">
                 <TSDBStatusPage />
diff --git a/web/ui/react-app/src/pages/status/Status.tsx b/web/ui/react-app/src/pages/status/Status.tsx
index 20d2e9e99c..faeb6d25ae 100644
--- a/web/ui/react-app/src/pages/status/Status.tsx
+++ b/web/ui/react-app/src/pages/status/Status.tsx
@@ -83,28 +83,35 @@ const StatusWithStatusIndicator = withStatusIndicator(StatusContent);
 
 StatusContent.displayName = 'Status';
 
-const Status: FC = () => {
+const StatusResult: FC<{ fetchPath: string; title: string; agentMode: boolean }> = ({ fetchPath, title, agentMode }) => {
+  const { response, isLoading, error } = useFetch(fetchPath);
+  return (
+    <StatusWithStatusIndicator
+      key={title}
+      data={response.data}
+      title={title}
+      isLoading={isLoading}
+      error={error}
+      componentTitle={title}
+    />
+  );
+};
+
+const Status: FC<{ agentMode: boolean }> = ({ agentMode }) => {
   const pathPrefix = usePathPrefix();
   const path = `${pathPrefix}/${API_PATH}`;
 
   return (
     <>
       {[
-        { fetchResult: useFetch<Record<string, string>>(`${path}/status/runtimeinfo`), title: 'Runtime Information' },
-        { fetchResult: useFetch<Record<string, string>>(`${path}/status/buildinfo`), title: 'Build Information' },
-        { fetchResult: useFetch<Record<string, string>>(`${path}/alertmanagers`), title: 'Alertmanagers' },
-      ].map(({ fetchResult, title }) => {
-        const { response, isLoading, error } = fetchResult;
-        return (
-          <StatusWithStatusIndicator
-            key={title}
-            data={response.data}
-            title={title}
-            isLoading={isLoading}
-            error={error}
-            componentTitle={title}
-          />
-        );
+        { fetchPath: `${path}/status/runtimeinfo`, title: 'Runtime Information' },
+        { fetchPath: `${path}/status/buildinfo`, title: 'Build Information' },
+        { fetchPath: `${path}/alertmanagers`, title: 'Alertmanagers' },
+      ].map(({ fetchPath, title }) => {
+        if (agentMode && title === 'Alertmanagers') {
+          return null;
+        }
+        return <StatusResult fetchPath={fetchPath} title={title} agentMode={agentMode} />;
       })}
     </>
   );

From 5fb63c1071240f7e79e0c1f89661a8697679e443 Mon Sep 17 00:00:00 2001
From: Robbie Lankford <robert.lankford@grafana.com>
Date: Sun, 5 Dec 2021 03:14:20 -0600
Subject: [PATCH 2/2] remove unused agentMode param

Signed-off-by: Robbie Lankford <robert.lankford@grafana.com>
---
 web/ui/react-app/src/pages/status/Status.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/ui/react-app/src/pages/status/Status.tsx b/web/ui/react-app/src/pages/status/Status.tsx
index faeb6d25ae..0d37db9619 100644
--- a/web/ui/react-app/src/pages/status/Status.tsx
+++ b/web/ui/react-app/src/pages/status/Status.tsx
@@ -83,7 +83,7 @@ const StatusWithStatusIndicator = withStatusIndicator(StatusContent);
 
 StatusContent.displayName = 'Status';
 
-const StatusResult: FC<{ fetchPath: string; title: string; agentMode: boolean }> = ({ fetchPath, title, agentMode }) => {
+const StatusResult: FC<{ fetchPath: string; title: string }> = ({ fetchPath, title }) => {
   const { response, isLoading, error } = useFetch(fetchPath);
   return (
     <StatusWithStatusIndicator
@@ -111,7 +111,7 @@ const Status: FC<{ agentMode: boolean }> = ({ agentMode }) => {
         if (agentMode && title === 'Alertmanagers') {
           return null;
         }
-        return <StatusResult fetchPath={fetchPath} title={title} agentMode={agentMode} />;
+        return <StatusResult fetchPath={fetchPath} title={title} />;
       })}
     </>
   );