[MM-62971][MM-63017] Search box accessibility fixes (#30910)

* [MM-62971] Add role='button' and focusability to the file suggestion list items

* [MM-63017] Add aria-label to Close button in Search

webapp/channels/src/components/new_search/extension_suggestions.tsx

@@ -110,15 +110,34 @@ SuggestionProps<ExtensionItem>
         onClick(item.value, matchedPretext);
     }, [onClick, item.value, matchedPretext]);
 
+    const handleKeyDown = useCallback((e: React.KeyboardEvent) => {
+        if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            optionClicked();
+        }
+    }, [optionClicked]);
+
     const labelName = messages[item.type] ?
         intl.formatMessage(messages[item.type]) :
         item.type;
 
+    const ariaLabel = intl.formatMessage({
+        id: 'search_file_extension_suggestion.aria_label',
+        defaultMessage: '{fileType} (.{extension})',
+    }, {
+        fileType: labelName,
+        extension: item.value,
+    });
+
     return (
         <SearchFileExtensionSuggestionContainer
             ref={ref}
             className={classNames({selected: isSelection})}
             onClick={optionClicked}
+            onKeyDown={handleKeyDown}
+            role='button'
+            tabIndex={0}
+            aria-label={ariaLabel}
         >
             <div className={classNames('file-icon', getCompassIconClassName(item.type))}/>
             {labelName}

webapp/channels/src/components/new_search/search_box.tsx

@@ -279,6 +279,10 @@ const SearchBox = forwardRef(
                     data-testid='searchBoxClose'
                     className='btn btn-icon btn-m'
                     onClick={closeHandler}
+                    aria-label={intl.formatMessage({
+                        id: 'search_bar.close',
+                        defaultMessage: 'Close',
+                    })}
                 >
                     <i className='icon icon-close'/>
                 </CloseIcon>

webapp/channels/src/i18n/en.json

@@ -5037,6 +5037,7 @@
   "scheduledPosts.title": "{prefix}Scheduled - {displayName} {siteName}",
   "search_bar.channels": "Channels",
   "search_bar.clear": "Clear",
+  "search_bar.close": "Close",
   "search_bar.file_types": "File types",
   "search_bar.files_tab": "Files",
   "search_bar.messages_tab": "Messages",
@@ -5054,6 +5055,7 @@
   "search_bar.usage.title_files": "File search options",
   "search_bar.usage.title_messages": "Message search options",
   "search_bar.users": "Users",
+  "search_file_extension_suggestion.aria_label": "{fileType} (.{extension})",
   "search_files_list_option.after": "Files after a date",
   "search_files_list_option.before": "Files before a date",
   "search_files_list_option.exclude": "Exclude search terms",