diff --git a/.changeset/small-scissors-end.md b/.changeset/small-scissors-end.md
new file mode 100644
index 0000000000..366877c5eb
--- /dev/null
+++ b/.changeset/small-scissors-end.md
@@ -0,0 +1,5 @@
+---
+'@backstage/core-components': patch
+---
+
+SupportButton auto focus first item when opened.
diff --git a/packages/core-components/src/components/SupportButton/SupportButton.tsx b/packages/core-components/src/components/SupportButton/SupportButton.tsx
index 35cf228f52..dcd4ead321 100644
--- a/packages/core-components/src/components/SupportButton/SupportButton.tsx
+++ b/packages/core-components/src/components/SupportButton/SupportButton.tsx
@@ -13,17 +13,16 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-
import { useApp } from '@backstage/core-plugin-api';
import { BackstageTheme } from '@backstage/theme';
import Box from '@material-ui/core/Box';
import Button from '@material-ui/core/Button';
import DialogActions from '@material-ui/core/DialogActions';
import IconButton from '@material-ui/core/IconButton';
-import List from '@material-ui/core/List';
-import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListItemIcon';
import ListItemText from '@material-ui/core/ListItemText';
+import MenuItem from '@material-ui/core/MenuItem';
+import MenuList from '@material-ui/core/MenuList';
import Popover from '@material-ui/core/Popover';
import { makeStyles } from '@material-ui/core/styles';
import Typography from '@material-ui/core/Typography';
@@ -63,7 +62,7 @@ const SupportLink = ({ link }: { link: SupportItemLink }) => (
const SupportListItem = ({ item }: { item: SupportItem }) => {
return (
-
+
+
);
};
@@ -141,21 +140,24 @@ export function SupportButton(props: SupportButtonProps) {
}}
onClose={popoverCloseHandler}
>
-
+
{title && (
-
+
+
)}
{React.Children.map(children, (child, i) => (
-
+
+
))}
{(items ?? configItems).map((item, i) => (
))}
-
+