feat: search autofocus

client/src/app/pages/dashboard/search/SearchPage.tsx

@@ -40,6 +40,7 @@ export default function SearchPage() {
 		<Row>
 			<Col xs={12}>
 				<DebounceSearch
+					autoFocus
 					className="form-control-lg"
 					setSearch={setSearch}
 					placeholder="Search songs, users..."

client/src/components/util/DebounceSearch.tsx

@@ -5,10 +5,12 @@ export default function DebounceSearch({
 	className,
 	setSearch,
 	placeholder,
+	autoFocus = false,
 }: {
 	className?: string;
 	setSearch: SetState<string>;
 	placeholder: string;
+	autoFocus?: boolean;
 }) {
 	const [lastTimeout, setLastTimeout] = useState<null | number>(null);
 	const [uiSearch, setUISearch] = useState("");
@@ -16,6 +18,7 @@ export default function DebounceSearch({
 	return (
 		<div className="input-group">
 			<input
+				autoFocus={autoFocus}
 				className={`form-control ${className}`}
 				type="text"
 				value={uiSearch}