diff --git a/plugins/search/src/components/SearchBar/SearchBar.tsx b/plugins/search/src/components/SearchBar/SearchBar.tsx index 53802899eb..8d493df5f8 100644 --- a/plugins/search/src/components/SearchBar/SearchBar.tsx +++ b/plugins/search/src/components/SearchBar/SearchBar.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ -import React, { useEffect, KeyboardEvent, useState } from 'react'; +import React, { useEffect, KeyboardEvent, useState, useRef } from 'react'; import { configApiRef, useApi } from '@backstage/core-plugin-api'; import { useDebounce } from 'react-use'; import { InputBase, InputAdornment, IconButton } from '@material-ui/core'; @@ -40,6 +40,11 @@ export const SearchBarBase = ({ placeholder: overridePlaceholder, }: PresenterProps) => { const configApi = useApi(configApiRef); + const inputRef = useRef(); + + useEffect(() => { + inputRef?.current?.focus(); + }, []); const onKeyDown = React.useCallback( (e: KeyboardEvent) => { @@ -60,6 +65,7 @@ export const SearchBarBase = ({ return (