From dd38dca021375bfaabbf4700387a186b28f6590e Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 6 Feb 2026 05:58:05 +0000
Subject: [PATCH 1/2] Initial plan


From 8749736625fc20dd2949bb804fa60d504d3ca2de Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 6 Feb 2026 06:00:01 +0000
Subject: [PATCH 2/2] Add CRITICAL filter to copy issues panel in web UI

Co-authored-by: shrsv <796107+shrsv@users.noreply.github.com>
---
 cmd/lrc/static/components/IssuesPanel.js | 15 ++++++++++++---
 cmd/lrc/static/styles.css                |  2 ++
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/cmd/lrc/static/components/IssuesPanel.js b/cmd/lrc/static/components/IssuesPanel.js
index 925dcc1..ce78961 100644
--- a/cmd/lrc/static/components/IssuesPanel.js
+++ b/cmd/lrc/static/components/IssuesPanel.js
@@ -5,8 +5,8 @@ export async function createIssuesPanel() {
     const { html, useState, useEffect, useCallback } = await waitForPreact();
     
     return function IssuesPanel({ files, visible, onNavigate, onClose }) {
-        // Multi-select filters: Set of active severity types (default: error + warning)
-        const [activeFilters, setActiveFilters] = useState(new Set(['error', 'warning']));
+        // Multi-select filters: Set of active severity types (default: critical + error + warning)
+        const [activeFilters, setActiveFilters] = useState(new Set(['critical', 'error', 'warning']));
         const [selectedIndices, setSelectedIndices] = useState(new Set());
         const [copyStatus, setCopyStatus] = useState(null); // null, 'copied', 'error'
         
@@ -34,6 +34,7 @@ export async function createIssuesPanel() {
         });
         
         // Count issues by severity
+        const criticalCount = issues.filter(i => (i.severity || '').toLowerCase() === 'critical').length;
         const errorCount = issues.filter(i => (i.severity || '').toLowerCase() === 'error').length;
         const warningCount = issues.filter(i => (i.severity || '').toLowerCase() === 'warning').length;
         const infoCount = issues.filter(i => (i.severity || '').toLowerCase() === 'info').length;
@@ -45,7 +46,7 @@ export async function createIssuesPanel() {
             return activeFilters.has(sev);
         }, [activeFilters]);
         
-        // Initialize: select all issues matching default filters (error + warning)
+        // Initialize: select all issues matching default filters (critical + error + warning)
         useEffect(() => {
             const newSelected = new Set();
             issues.forEach((issue, idx) => {
@@ -151,6 +152,14 @@ export async function createIssuesPanel() {
                 <div class="issues-header">
                     <div class="issues-actions">
                         <div class="severity-filters">
+                            <button 
+                                class="severity-filter-btn critical ${activeFilters.has('critical') ? 'active' : ''}"
+                                onClick=${() => toggleFilter('critical')}
+                                title="Toggle critical issues"
+                            >
+                                CRITICAL
+                                <span class="filter-badge">${criticalCount}</span>
+                            </button>
                             <button 
                                 class="severity-filter-btn error ${activeFilters.has('error') ? 'active' : ''}"
                                 onClick=${() => toggleFilter('error')}
diff --git a/cmd/lrc/static/styles.css b/cmd/lrc/static/styles.css
index a1aed2e..f5bcad5 100644
--- a/cmd/lrc/static/styles.css
+++ b/cmd/lrc/static/styles.css
@@ -1095,6 +1095,8 @@ body {
 
 .severity-filter-btn.all { color: var(--accent-blue); }
 .severity-filter-btn.all.active { background: rgba(96,165,250,0.15); }
+.severity-filter-btn.critical { color: #dc2626; }
+.severity-filter-btn.critical.active { background: rgba(220,38,38,0.15); }
 .severity-filter-btn.error { color: #ef4444; }
 .severity-filter-btn.error.active { background: rgba(239,68,68,0.15); }
 .severity-filter-btn.warning { color: #eab308; }