From 16eb4b192421ff5c18d9148a88b940084a14ad7d Mon Sep 17 00:00:00 2001
From: ParthAggarwal16 <parth22012006@gmail.com>
Date: Tue, 10 Feb 2026 19:36:32 +0530
Subject: [PATCH 1/2] fix(a11y): add labels and ARIA attributes to SearchBar

---
 .../src/pages/Search/components/SearchBar.tsx | 23 ++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/application/frontend/src/pages/Search/components/SearchBar.tsx b/application/frontend/src/pages/Search/components/SearchBar.tsx
index 36eb1726..84debb90 100644
--- a/application/frontend/src/pages/Search/components/SearchBar.tsx
+++ b/application/frontend/src/pages/Search/components/SearchBar.tsx
@@ -32,15 +32,25 @@ export const SearchBar = () => {
     }
   };
 
+  const inputId = 'navbar-search-input';
+  const errorId = 'navbar-search-error';
   return (
     <div className="navbar__search">
       <form onSubmit={onSubmit}>
-        <Search className="search-icon" />
+        <label htmlFor={inputId} className="visually-hidden">
+          Search OpenCRE
+        </label>
+
+        <Search className="search-icon" aria-hidden="true" />
 
         <input
+          id={inputId}
           type="text"
           placeholder="Search..."
           value={search.term}
+          aria-label="Search OpenCRE"
+          aria-invalid={Boolean(search.error)}
+          aria-describedby={search.error ? errorId : undefined}
           onChange={(e) =>
             setSearch({
               ...search,
@@ -50,8 +60,15 @@ export const SearchBar = () => {
         />
       </form>
 
-      {/* Error text */}
-      {search.error && <p className="search-error">{search.error}</p>}
+      {search.error && (
+        <p
+          id={errorId}
+          className="search-error"
+          role="alert"
+        >
+          {search.error}
+        </p>
+      )}
     </div>
   );
 };

From a049a1b5f439122ba7cdcbe26e576a64342afffa Mon Sep 17 00:00:00 2001
From: ParthAggarwal16 <parth22012006@gmail.com>
Date: Tue, 10 Feb 2026 20:02:00 +0530
Subject: [PATCH 2/2] docs: re-add explanatory comment for error text in
 SearchBar

---
 application/frontend/src/pages/Search/components/SearchBar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/application/frontend/src/pages/Search/components/SearchBar.tsx b/application/frontend/src/pages/Search/components/SearchBar.tsx
index 84debb90..7fa4830e 100644
--- a/application/frontend/src/pages/Search/components/SearchBar.tsx
+++ b/application/frontend/src/pages/Search/components/SearchBar.tsx
@@ -59,7 +59,7 @@ export const SearchBar = () => {
           }
         />
       </form>
-
+      {/* Error text */}
       {search.error && (
         <p
           id={errorId}