Merge branch 'V2' into update-legal-links

frontend/src/components/shared/TextInput.tsx

@@ -7,6 +7,10 @@ import styles from './textInput/TextInput.module.css';
  * Props for the TextInput component
  */
 export interface TextInputProps {
+  /** The input ID (required) */
+  id: string;
+  /** The input name (required) */
+  name: string;
   /** The input value (required) */
   value: string;
   /** Callback when input value changes (required) */
@@ -36,6 +40,8 @@ export interface TextInputProps {
 }
 
 export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(({
+  id,
+  name,
   value,
   onChange,
   placeholder,
@@ -76,6 +82,8 @@ export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(({
       <input
         ref={ref}
         type="text"
+        id={id}
+        name={name}
         placeholder={placeholder}
         value={value}
         onChange={(e) => onChange(e.currentTarget.value)}

frontend/src/components/tools/toolPicker/ToolSearch.tsx

@@ -82,15 +82,17 @@ const ToolSearch = ({
   }, [autoFocus]);
 
   const searchInput = (
-        <TextInput
-          ref={searchRef}
-          value={value}
-          onChange={handleSearchChange}
-          placeholder={placeholder || t("toolPicker.searchPlaceholder", "Search tools...")}
-          icon={hideIcon ? undefined : <LocalIcon icon="search-rounded" width="1.5rem" height="1.5rem" />}
-          autoComplete="off"
-          onFocus={onFocus}
-        />
+      <TextInput
+        id="tool-search-input"
+        name="tool-search-input"
+        ref={searchRef}
+        value={value}
+        onChange={handleSearchChange}
+        placeholder={placeholder || t("toolPicker.searchPlaceholder", "Search tools...")}
+        icon={hideIcon ? undefined : <LocalIcon icon="search-rounded" width="1.5rem" height="1.5rem" />}
+        autoComplete="off"
+        onFocus={onFocus}
+      />
   );
 
   if (mode === "filter") {