Improve Search input

src/components/Search.tsx

@@ -19,13 +19,10 @@ export const Search = ({
 		justify='center'
 		margin={{ top: 'large' }}
 	>
-		<Box
+		<Box as='div' margin={{ vertical: 'none' }} width='500px'>
-			as='div'
-			margin={{ vertical: 'none' }}
-			width='500px'
-
-		>
 			<TextInput
+				type='search'
+				name='q'
 				value={inputValue}
 				suggestions={suggestions}
 				onChange={(e) => handleChange(e.target.value)}
@@ -33,7 +30,9 @@ export const Search = ({
 				icon={<FormSearch color='plain' />}
 				dropHeight='large'
 				placeholder='Type an artist name'
+				autoFocus
+				aria-label='Search for an artist name'
 			/>
 		</Box>
 	</Box>
-);
+);