apply code quality fixes

Author: sameersharmadev

frontend/src/components/ProgramActions.tsx

@@ -133,6 +133,7 @@ const ProgramActions: React.FC<ProgramActionsProps> = ({ status, setStatus }) =>
       {dropdownOpen && (
         <div
           role="menu"
+          tabIndex={0}
           onKeyDown={handleMenuKeyDown}
           className="absolute right-0 z-20 mt-2 w-40 rounded-md border border-gray-200 bg-white shadow-lg dark:border-gray-700 dark:bg-gray-800"
         >

frontend/src/components/Search.tsx

@@ -85,10 +85,10 @@ const SearchBar: React.FC<SearchProps> = ({
               onChange={handleSearchChange}
               placeholder={placeholder}
               className="h-12 w-full rounded-lg border-1 border-gray-300 pr-10 pl-10 text-lg text-black focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-hidden dark:border-gray-600 dark:bg-gray-800 dark:text-white dark:focus:border-blue-300 dark:focus:ring-blue-300"
-              aria-label={placeholder || 'Search'}
             />
             {searchQuery && (
               <button
+                type="button"
                 aria-label="Clear search"
                 className="absolute top-1/2 right-2 -translate-y-1/2 rounded-full p-1 hover:bg-gray-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-gray-300 focus-visible:ring-offset-1"
                 onClick={handleClearSearch}

frontend/src/components/ShowMoreButton.tsx

@@ -16,12 +16,7 @@ const ShowMoreButton = ({ onToggle }: { onToggle: () => void }) => {
       <Button
         type="button"
         disableAnimation
-        onKeyDown={(e: React.KeyboardEvent) => {
-          if (e.key === 'Enter' || e.key === ' ') {
-            e.preventDefault()
-            handleToggle()
-          }
-        }}
+        onPress={handleToggle}
         aria-expanded={isExpanded}
         aria-label={isExpanded ? 'Show less items' : 'Show more items'}
         className="flex items-center bg-transparent px-0 text-blue-400 focus:outline-none focus-visible:ring-1 focus-visible:ring-offset-1"

frontend/src/components/ToggleableList.tsx

@@ -39,6 +39,7 @@ const ToggleableList = ({
         {(showAll ? items : items.slice(0, limit)).map((item) => (
           <button
             key={item}
+            type="button"
             aria-label={`Search projects for ${item}`}
             className="rounded-lg border border-gray-400 px-3 py-1 text-sm hover:bg-gray-200 dark:border-gray-300 dark:hover:bg-gray-700 focus:outline-none focus-visible:ring-1 focus-visible:ring-offset-1 transition"
             onClick={() => !isDisabled && handleButtonClick({ item })}