fix: Optimise the type of search input to search

ui/src/components/Header/index.tsx

@@ -178,6 +178,7 @@ const Header: FC = () => {
               className="w-100 maxw-400"
               onSubmit={handleSearch}>
               <FormControl
+                type="search"
                 placeholder={t('header.search.placeholder')}
                 className="placeholder-search"
                 value={searchStr}

ui/src/components/TagSelector/index.tsx

@@ -246,8 +246,9 @@ const TagSelector: FC<IProps> = ({
                       e.preventDefault();
                     }}>
                     <FormControl
-                      placeholder={t('search_tag')}
                       autoFocus
+                      type="search"
+                      placeholder={t('search_tag')}
                       value={searchValue}
                       onChange={handleSearch}
                     />

ui/src/index.tsx

@@ -22,7 +22,8 @@ document.addEventListener(
     }
 
     if (/IMG/.test(target.nodeName)) {
-      if (!target.getAttribute('alt')) {
+      const altText = target.getAttribute('alt')?.trim();
+      if (!altText) {
         target.classList.add('invisible');
       }
     }

ui/src/pages/Admin/Answers/index.tsx

@@ -103,7 +103,7 @@ const Answers: FC = () => {
           value={curQuery}
           onChange={handleFilter}
           size="sm"
-          type="input"
+          type="search"
           placeholder={t('filter.placeholder')}
           style={{ width: '12.25rem' }}
         />

ui/src/pages/Admin/Questions/index.tsx

@@ -112,7 +112,7 @@ const Questions: FC = () => {
         <Form.Control
           value={curQuery}
           size="sm"
-          type="input"
+          type="search"
           placeholder={t('filter.placeholder')}
           onChange={handleFilter}
           style={{ width: '12.25rem' }}

ui/src/pages/Admin/Users/index.tsx

@@ -193,6 +193,7 @@ const Users: FC = () => {
 
         <Form.Control
           size="sm"
+          type="search"
           value={curQuery}
           onChange={handleFilter}
           placeholder={t('filter.placeholder')}

ui/src/pages/Questions/Detail/components/InviteToAnswer/PeopleDropdown.tsx

@@ -130,6 +130,7 @@ const Index: FC<Props> = ({
           {toggleState ? (
             <Form.Control
               autoFocus
+              type="search"
               placeholder={t('search')}
               value={searchValue}
               onChange={handleSearch}

ui/src/pages/Tags/index.tsx

@@ -62,7 +62,7 @@ const Tags = () => {
                 <Form.Control
                   value={searchTag}
                   placeholder={t('search_placeholder')}
-                  type="text"
+                  type="search"
                   onChange={handleChange}
                   size="sm"
                 />