adapt frontend for stream message count with stream id

Graylog2 · Feb 10, 2025 · f25658d · f25658d
1 parent 479c256
commit f25658d
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 12 deletions.
diff --git a/graylog2-web-interface/src/components/inputs/InputDiagnosis/useInputDiagnosis.ts b/graylog2-web-interface/src/components/inputs/InputDiagnosis/useInputDiagnosis.ts
@@ -40,7 +40,7 @@ export type InputDiagnosisMetrics = {
   failures_indexing: any;
   failures_processing: any;
   failures_inputs_codecs: any;
-  stream_message_count: [string, number][];
+  stream_message_count: StreamMessageCount[];
 }
 
 export type InputNodeStateInfo = {
@@ -60,10 +60,14 @@ export type InputNodeStates = {
   total: number;
 }
 
+export type StreamMessageCount = {
+  stream_name : string,
+  stream_id : string,
+  count : number
+}
+
 export type InputDiagnostics = {
-  stream_message_count: {
-    [streamName: string]: number,
-  },
+  stream_message_count: StreamMessageCount[],
 }
 
 export const metricWithPrefix = (input: Input, metric: string) => `${input?.type}.${input?.id}.${metric}`;
@@ -145,7 +149,7 @@ const useInputDiagnosis = (inputId: string): {
       failures_indexing: (nodeMetrics[failures_indexing] as GaugeMetric)?.metric?.value || 0,
       failures_processing: (nodeMetrics[failures_processing] as GaugeMetric)?.metric?.value || 0,
       failures_inputs_codecs: (nodeMetrics[failures_inputs_codecs] as GaugeMetric)?.metric?.value || 0,
-      stream_message_count: Object.entries(messageCountByStream?.stream_message_count || {}),
+      stream_message_count: messageCountByStream?.stream_message_count || [],
     },
   };
 };

diff --git a/graylog2-web-interface/src/pages/InputDiagnosisPage.test.tsx b/graylog2-web-interface/src/pages/InputDiagnosisPage.test.tsx
@@ -61,9 +61,9 @@ const inputMetrics = {
   failures_processing: 20,
   failures_inputs_codecs: 21,
   stream_message_count: [
-    ['Test Stream 1', 22],
-    ['Test Stream 2', 23],
-  ] as [string, number][],
+    { stream_name: 'Test Stream 1', stream_id: '1', count: 22 },
+    { stream_name: 'Test Stream 2', stream_id: '2', count: 23 },
+  ],
 };
 
 const useInputDiagnosisMock = { input, inputNodeStates, inputMetrics };

diff --git a/graylog2-web-interface/src/pages/InputDiagnosisPage.tsx b/graylog2-web-interface/src/pages/InputDiagnosisPage.tsx
@@ -20,6 +20,7 @@ import styled, { css } from 'styled-components';
 import { DocumentTitle, LinkToNode, PageHeader } from 'components/common';
 import useParams from 'routing/useParams';
 import { Row, Col, DropdownButton, MenuItem } from 'components/bootstrap';
+import type { StreamMessageCount } from 'components/inputs/InputDiagnosis/useInputDiagnosis';
 import useInputDiagnosis from 'components/inputs/InputDiagnosis/useInputDiagnosis';
 import ShowReceivedMessagesButton from 'components/inputs/InputDiagnosis/ShowReceivedMessagesButton';
 import NetworkStats from 'components/inputs/InputDiagnosis/NetworkStats';
@@ -173,10 +174,10 @@ const InputDiagnosisPage = () => {
                 <h3>Received Message count by Stream</h3>
                 {inputMetrics.stream_message_count?.length && (
                   <StyledDl>
-                    {inputMetrics.stream_message_count.map(([key, value]) => (
-                      <span key={key}>
-                        <dt>{key}</dt>
-                        <dd>{value}</dd>
+                    {inputMetrics.stream_message_count.map((stream: StreamMessageCount) => (
+                      <span key={stream.stream_id}>
+                        <dt>{stream.stream_name}</dt>
+                        <dd>{stream.count}</dd>
                       </span>
                     ))}
                   </StyledDl>