From 1185294174cda2676900551179aabbfb54a25fce Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Fri, 26 Dec 2025 11:13:41 +0000
Subject: [PATCH] refactor(dashboard): merge Needs Backup into Problems filter

- Removed redundant 'Needs Backup' toggle from filter bar
- Problems filter already includes backup issues (stale, critical, never)
- Reduces UI clutter while preserving functionality
- Also includes user's lint fixes for Backups tests
---
 .../src/components/Dashboard/Dashboard.tsx    | 23 +-----------------
 .../components/Dashboard/DashboardFilter.tsx  | 24 +------------------
 2 files changed, 2 insertions(+), 45 deletions(-)

diff --git a/frontend-modern/src/components/Dashboard/Dashboard.tsx b/frontend-modern/src/components/Dashboard/Dashboard.tsx
index 7a16edcf20..95535a4629 100644
--- a/frontend-modern/src/components/Dashboard/Dashboard.tsx
+++ b/frontend-modern/src/components/Dashboard/Dashboard.tsx
@@ -200,7 +200,6 @@ interface DashboardProps {
 
 type ViewMode = 'all' | 'vm' | 'lxc';
 type StatusMode = 'all' | 'running' | 'degraded' | 'stopped';
-type BackupMode = 'all' | 'needs-backup';
 type GroupingMode = 'grouped' | 'flat';
 type ProblemsMode = 'all' | 'problems';
 
@@ -243,11 +242,6 @@ export function Dashboard(props: DashboardProps) {
         : 'all',
   });
 
-  // Backup filter mode - filter by backup status
-  const [backupMode, setBackupMode] = usePersistentSignal<BackupMode>('dashboardBackupMode', 'all', {
-    deserialize: (raw) => (raw === 'all' || raw === 'needs-backup' ? raw : 'all'),
-  });
-
   // Grouping mode - grouped by node or flat list
   const [groupingMode, setGroupingMode] = usePersistentSignal<GroupingMode>(
     'dashboardGroupingMode',
@@ -576,7 +570,6 @@ export function Dashboard(props: DashboardProps) {
           selectedNode() !== null ||
           viewMode() !== 'all' ||
           statusMode() !== 'all' ||
-          backupMode() !== 'all' ||
           problemsMode() !== 'all';
 
         if (hasActiveFilters) {
@@ -588,7 +581,6 @@ export function Dashboard(props: DashboardProps) {
           setSelectedNode(null);
           setViewMode('all');
           setStatusMode('all');
-          setBackupMode('all');
           setProblemsMode('all');
 
           // Blur the search input if it's focused
@@ -688,18 +680,7 @@ export function Dashboard(props: DashboardProps) {
       guests = guests.filter((g) => g.status !== 'running');
     }
 
-    // Filter by backup status
-    if (backupMode() === 'needs-backup') {
-      guests = guests.filter((g) => {
-        // Skip templates - they don't need backups
-        if (g.template) return false;
-        const backupInfo = getBackupInfo(g.lastBackup, alertsActivation.getBackupThresholds());
-        // Show guests that need backup: stale, critical, or never backed up
-        return backupInfo.status === 'stale' || backupInfo.status === 'critical' || backupInfo.status === 'never';
-      });
-    }
-
-    // Filter by problems mode - show guests that need attention
+    // Filter by problems mode - show guests that need attention (includes backup issues)
     if (problemsMode() === 'problems') {
       guests = guests.filter((g) => {
         // Skip templates
@@ -981,8 +962,6 @@ export function Dashboard(props: DashboardProps) {
         setViewMode={setViewMode}
         statusMode={statusMode}
         setStatusMode={setStatusMode}
-        backupMode={backupMode}
-        setBackupMode={setBackupMode}
         problemsMode={problemsMode}
         setProblemsMode={setProblemsMode}
         filteredProblemGuests={problemGuests}
diff --git a/frontend-modern/src/components/Dashboard/DashboardFilter.tsx b/frontend-modern/src/components/Dashboard/DashboardFilter.tsx
index 08a5b31d26..ef573cf62b 100644
--- a/frontend-modern/src/components/Dashboard/DashboardFilter.tsx
+++ b/frontend-modern/src/components/Dashboard/DashboardFilter.tsx
@@ -17,8 +17,6 @@ interface DashboardFilterProps {
   setViewMode: (value: 'all' | 'vm' | 'lxc') => void;
   statusMode: () => 'all' | 'running' | 'degraded' | 'stopped';
   setStatusMode: (value: 'all' | 'running' | 'degraded' | 'stopped') => void;
-  backupMode: () => 'all' | 'needs-backup';
-  setBackupMode: (value: 'all' | 'needs-backup') => void;
   problemsMode: () => 'all' | 'problems';
   setProblemsMode: (value: 'all' | 'problems') => void;
   /** Guests that match the problems filter - used for AI investigation */
@@ -428,26 +426,8 @@ export const DashboardFilter: Component<DashboardFilterProps> = (props) => {
         </div>
         {/* End Primary Filters Group */}
 
-        {/* Secondary Controls Group: Backup, Grouping, View, Columns, Reset */}
+        {/* Secondary Controls Group: Grouping, View, Columns, Reset */}
         <div class="flex flex-wrap items-center gap-2">
-          {/* Backup Filter */}
-          <button
-            type="button"
-            onClick={() => props.setBackupMode(props.backupMode() === 'needs-backup' ? 'all' : 'needs-backup')}
-            class={`inline-flex items-center gap-1.5 px-2.5 py-1.5 text-xs font-medium rounded-lg transition-all duration-150 active:scale-95 ${props.backupMode() === 'needs-backup'
-              ? 'bg-orange-100 dark:bg-orange-900/50 text-orange-700 dark:text-orange-300 shadow-sm ring-1 ring-orange-200 dark:ring-orange-800'
-              : 'bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-200 dark:hover:bg-gray-600'
-              }`}
-            title="Show guests with stale or missing backups"
-          >
-            <svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-              <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" />
-              <path d="M12 8v4M12 16h.01" />
-            </svg>
-            Needs Backup
-          </button>
-
-          <div class="h-5 w-px bg-gray-200 dark:bg-gray-600 hidden sm:block"></div>
 
           {/* Grouping Mode Toggle */}
           <div class="inline-flex rounded-lg bg-gray-100 dark:bg-gray-700 p-0.5">
@@ -512,7 +492,6 @@ export const DashboardFilter: Component<DashboardFilterProps> = (props) => {
             props.search().trim() !== '' ||
             props.viewMode() !== 'all' ||
             props.statusMode() !== 'all' ||
-            props.backupMode() !== 'all' ||
             props.problemsMode() !== 'all' ||
             props.groupingMode() !== 'grouped'
           }>
@@ -524,7 +503,6 @@ export const DashboardFilter: Component<DashboardFilterProps> = (props) => {
                 props.setSortDirection('asc');
                 props.setViewMode('all');
                 props.setStatusMode('all');
-                props.setBackupMode('all');
                 props.setProblemsMode('all');
                 props.setGroupingMode('grouped');
               }}