From 5b7d1a4360117a2190f05ae79bfa055b2fb86f74 Mon Sep 17 00:00:00 2001
From: Lukas <lukas.pupkalipinski@lpl-mind.de>
Date: Mon, 16 Mar 2026 19:48:39 +0100
Subject: [PATCH] Fix Failures tooltip wording; move Service Health to top of
 Server tab
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Task 2: rename 'Failures:' label to 'Failed Attempts:' and update tooltip
to 'Total failed authentication attempts currently tracked by fail2ban
across all active jails' — more accurate than 'Currently failing IPs'.

Task 3: move <ServerHealthSection /> to the top of ServerTab so users
see connectivity status before scrolling through all settings fields.
---
 Docs/Tasks.md                                             | 8 ++++++--
 frontend/src/components/ServerStatusBar.tsx               | 4 ++--
 .../src/components/__tests__/ServerStatusBar.test.tsx     | 2 ++
 frontend/src/components/config/ServerTab.tsx              | 6 ++++--
 4 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/Docs/Tasks.md b/Docs/Tasks.md
index bec20ef..c9d5b7a 100644
--- a/Docs/Tasks.md
+++ b/Docs/Tasks.md
@@ -30,7 +30,9 @@ This document breaks the entire BanGUI project into development stages, ordered
 
 ---
 
-### 2. Dashboard — Improve "Failures" Tooltip
+### ~~2. Dashboard — Improve "Failures" Tooltip~~ ✅ Done
+
+**Implemented:** In `frontend/src/components/ServerStatusBar.tsx`, changed the `Failures:` label to `Failed Attempts:` and updated the tooltip from `"Currently failing IPs"` to `"Total failed authentication attempts currently tracked by fail2ban across all active jails"`. Updated `ServerStatusBar.test.tsx` to assert the new label text.
 
 **Problem:** The `ServerStatusBar` shows a "Failures: 42" counter with the tooltip `"Currently failing IPs"`. In fail2ban terminology *failures* are individual **failed authentication attempts** tracked in the fail2ban DB, not the number of unique IPs that failed. The current wording is ambiguous and misleading — users may think it means broken connections or error states.
 
@@ -42,7 +44,9 @@ This document breaks the entire BanGUI project into development stages, ordered
 
 ---
 
-### 3. Config → Server Tab — Move "Service Health" to Top
+### ~~3. Config → Server Tab — Move "Service Health" to Top~~ ✅ Done
+
+**Implemented:** In `frontend/src/components/config/ServerTab.tsx`, moved `<ServerHealthSection />` from the end of the JSX return to be the first element rendered inside the tab container, before all settings fields.
 
 **Problem:** In the Config page → Server tab, the `Service Health` panel (`ServerHealthSection`) is rendered at the bottom of the tab, after all settings sections (log level, log target, DB purge settings, map thresholds, reload/restart buttons). This means users must scroll past all editable fields to check service connectivity status, even though the health status is the most critical piece of context — it indicates whether the server is reachable at all.
 
diff --git a/frontend/src/components/ServerStatusBar.tsx b/frontend/src/components/ServerStatusBar.tsx
index 5b7c287..c0851e8 100644
--- a/frontend/src/components/ServerStatusBar.tsx
+++ b/frontend/src/components/ServerStatusBar.tsx
@@ -139,9 +139,9 @@ export function ServerStatusBar(): React.JSX.Element {
             </div>
           </Tooltip>
 
-          <Tooltip content="Currently failing IPs" relationship="description">
+          <Tooltip content="Total failed authentication attempts currently tracked by fail2ban across all active jails" relationship="description">
             <div className={styles.statGroup}>
-              <Text size={200}>Failures:</Text>
+              <Text size={200}>Failed Attempts:</Text>
               <Text size={200} className={styles.statValue}>
                 {status.total_failures}
               </Text>
diff --git a/frontend/src/components/__tests__/ServerStatusBar.test.tsx b/frontend/src/components/__tests__/ServerStatusBar.test.tsx
index 87d748d..a827bf8 100644
--- a/frontend/src/components/__tests__/ServerStatusBar.test.tsx
+++ b/frontend/src/components/__tests__/ServerStatusBar.test.tsx
@@ -136,6 +136,8 @@ describe("ServerStatusBar", () => {
     expect(screen.getByText("4")).toBeInTheDocument();
     expect(screen.getByText("21")).toBeInTheDocument();
     expect(screen.getByText("99")).toBeInTheDocument();
+    // Verify the "Failed Attempts:" label (renamed from "Failures:").
+    expect(screen.getByText("Failed Attempts:")).toBeInTheDocument();
   });
 
   it("renders an error message when the status fetch fails", () => {
diff --git a/frontend/src/components/config/ServerTab.tsx b/frontend/src/components/config/ServerTab.tsx
index addc3d8..2937ac4 100644
--- a/frontend/src/components/config/ServerTab.tsx
+++ b/frontend/src/components/config/ServerTab.tsx
@@ -219,6 +219,10 @@ export function ServerTab(): React.JSX.Element {
 
   return (
     <div>
+      {/* Service Health & Log Viewer section — shown first so users can
+          immediately see whether fail2ban is reachable before editing settings. */}
+      <ServerHealthSection />
+
       <div className={styles.sectionCard}>
         <div style={{ marginBottom: tokens.spacingVerticalS }}>
           <AutoSaveIndicator
@@ -412,8 +416,6 @@ export function ServerTab(): React.JSX.Element {
         </div>
       ) : null}
 
-      {/* Service Health & Log Viewer section */}
-      <ServerHealthSection />
     </div>
   );
 }