src/components/Select/index.tsx

@@ -62,11 +62,15 @@ interface SelectItemProps<T extends string> {
 interface SelectProps<T extends string> {
   setValue: React.Dispatch<React.SetStateAction<T>>
   options: SelectItemProps<T>[]
+  name?: string
+  id?: string
 }
 
 export function Select<T extends string>({
   setValue,
-  options
+  options,
+  name,
+  id
 }: SelectProps<T>) {
   const handleChange = (event: SelectChangeEvent<unknown>) => {
     setValue(event.target.value as T)
@@ -75,6 +79,8 @@ export function Select<T extends string>({
   return (
     <FormControl>
       <SelectCustomized
+        id={id}
+        name={name}
         size="small"
         variant="outlined"
         defaultValue={options[0].value as string}

src/pages/home/index.tsx

@@ -109,6 +109,7 @@ export const HomePage = () => {
         {isFilterVisible && (
           <>
             <Select
+              name={'filter-select'}
               setValue={setFilter}
               options={FILTERS.map((f) => {
                 return {
@@ -118,6 +119,7 @@ export const HomePage = () => {
               })}
             />
             <Select
+              name={'sort-select'}
               setValue={setSort}
               options={SORT_BY.map((s) => {
                 return { ...s }