client: Fix node incident layout and stats descriptions

Magpie-Monitor · Dec 3, 2024 · 139c50e · 139c50e
1 parent 0fe417c
commit 139c50e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 19 deletions.
diff --git a/client/src/pages/Home/components/ReportDetailsSection/ReportDetailsSection.tsx b/client/src/pages/Home/components/ReportDetailsSection/ReportDetailsSection.tsx
@@ -77,7 +77,7 @@ const statItems = (
     });
 
     defaultStats.push({
-      title: `Incidents from ${stats.nodeWithMostIncidents.numberOfIncidents}`,
+      title: `Incidents from ${stats.nodeWithMostIncidents.nodeName}`,
       value: stats.nodeWithMostIncidents.numberOfIncidents,
       unit: 'incidents',
       valueColor: colors.urgency.low,

diff --git a/client/src/pages/Incident/NodeIncident.tsx b/client/src/pages/Incident/NodeIncident.tsx
@@ -140,24 +140,22 @@ const NodeIncidentPage = () => {
             />
           </div>
         </div>
-        <div className="incident__sources">
-          <div className="incident__row--two-columns">
-            <SummarySection summary={incident.summary} />
-            <RecommendationSection recommendation={incident.recommendation} />
-          </div>
-
-          {transitions((style, source) => (
-            <animated.div style={style}>
-              <NodeSourceSection
-                content={source.content}
-                filename={source.filename}
-                timestamp={source.timestamp}
-              />
-            </animated.div>
-          ))}
-
-          {isFetchingSources && <CenteredSpinner />}
+        <div className="incident__row--two-columns">
+          <SummarySection summary={incident.summary} />
+          <RecommendationSection recommendation={incident.recommendation} />
         </div>
+
+        {transitions((style, source) => (
+          <animated.div style={style}>
+            <NodeSourceSection
+              content={source.content}
+              filename={source.filename}
+              timestamp={source.timestamp}
+            />
+          </animated.div>
+        ))}
+
+        {isFetchingSources && <CenteredSpinner />}
       </div>
     </PageTemplate>
   );

diff --git a/client/src/pages/ReportDetails/ReportDetails.tsx b/client/src/pages/ReportDetails/ReportDetails.tsx
@@ -76,7 +76,7 @@ const statItems = (
     });
 
     defaultStats.push({
-      title: `Incidents from ${stats.nodeWithMostIncidents.numberOfIncidents}`,
+      title: `Incidents from ${stats.nodeWithMostIncidents.nodeName}`,
       value: stats.nodeWithMostIncidents.numberOfIncidents,
       unit: 'incidents',
       valueColor: colors.urgency.low,