From 17302a9333dc9c3c3035b8b6dd39ece2ee6dc7df Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Fri, 19 Jun 2026 22:20:34 +0000
Subject: [PATCH 1/3] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Add=20ARIA=20role?=
 =?UTF-8?q?s=20to=20FilterPanel=20buttons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

💡 What: Added `aria-pressed` to filter category toggle buttons and updated the 'Show only unresolved' button with proper `role="switch"`, `aria-checked`, and `aria-labelledby`.
🎯 Why: Enhances screen reader accessibility by accurately communicating active button states and properly linking labels with controls.
♿ Accessibility: Ensures toggle buttons behave as standard accessible switches and groups.

Co-authored-by: aarjava <218419324+aarjava@users.noreply.github.com>
---
 src/components/FilterPanel.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/FilterPanel.tsx b/src/components/FilterPanel.tsx
index 7cb855e4..62579619 100644
--- a/src/components/FilterPanel.tsx
+++ b/src/components/FilterPanel.tsx
@@ -104,6 +104,7 @@ export default function FilterPanel() {
               <button
                 key={dept}
                 onClick={() => toggleDepartment(dept)}
+                aria-pressed={isActive}
                 className={`rounded-md px-3 py-1.5 text-xs font-medium transition-all ${
                   isActive
                     ? 'bg-[#6C63FF] text-white'
@@ -135,6 +136,7 @@ export default function FilterPanel() {
               <button
                 key={risk}
                 onClick={() => toggleRiskLevel(risk)}
+                aria-pressed={isActive}
                 className={`rounded-md px-3 py-1.5 text-xs font-medium capitalize transition-all ${
                   isActive
                     ? `bg-[${colors.bg}] text-white`
@@ -167,6 +169,7 @@ export default function FilterPanel() {
               <button
                 key={type}
                 onClick={() => toggleEventType(type)}
+                aria-pressed={isActive}
                 className={`rounded-md px-3 py-1.5 text-xs font-medium capitalize transition-all ${
                   isActive
                     ? 'bg-[#6C63FF] text-white'
@@ -182,8 +185,13 @@ export default function FilterPanel() {
 
       {/* Show Only Unresolved Toggle */}
       <div className="flex items-center justify-between rounded-md border border-[#E5E5E5] bg-[#FAFAFA] p-3">
-        <span className="text-xs text-[#666666]">Show only unresolved</span>
+        <span id="show-unresolved-label" className="text-xs text-[#666666]">
+          Show only unresolved
+        </span>
         <button
+          role="switch"
+          aria-checked={filters.showOnlyUnresolved}
+          aria-labelledby="show-unresolved-label"
           onClick={() => setFilters({ showOnlyUnresolved: !filters.showOnlyUnresolved })}
           className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors ${
             filters.showOnlyUnresolved ? 'bg-[#6C63FF]' : 'bg-[#E5E5E5]'

From 7d4b672019a770a838027305008128d26d7de93d Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Fri, 19 Jun 2026 22:22:38 +0000
Subject: [PATCH 2/3] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Add=20ARIA=20role?=
 =?UTF-8?q?s=20to=20FilterPanel=20buttons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

💡 What: Added `aria-pressed` to filter category toggle buttons and updated the 'Show only unresolved' button with proper `role="switch"`, `aria-checked`, and `aria-labelledby`.
🎯 Why: Enhances screen reader accessibility by accurately communicating active button states and properly linking labels with controls.
♿ Accessibility: Ensures toggle buttons behave as standard accessible switches and groups.

Co-authored-by: aarjava <218419324+aarjava@users.noreply.github.com>

From d2a6e5602293abb92f37bdefe3931d82094bdb7b Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Fri, 19 Jun 2026 22:31:56 +0000
Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=8E=A8=20Palette:=20Add=20ARIA=20role?=
 =?UTF-8?q?s=20to=20FilterPanel=20buttons?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

💡 What: Added `aria-pressed` to filter category toggle buttons and updated the 'Show only unresolved' button with proper `role="switch"`, `aria-checked`, and `aria-labelledby`.
🎯 Why: Enhances screen reader accessibility by accurately communicating active button states and properly linking labels with controls.
♿ Accessibility: Ensures toggle buttons behave as standard accessible switches and groups.

Co-authored-by: aarjava <218419324+aarjava@users.noreply.github.com>