From a3dd5c600bd05971ff0e4e0c83f94eb8efa8a490 Mon Sep 17 00:00:00 2001 From: blam Date: Mon, 18 Jul 2022 16:03:57 +0200 Subject: [PATCH 1/2] bug: work around a material ui bug of calling the callback twice Signed-off-by: blam --- .../src/layout/HeaderTabs/HeaderTabs.tsx | 17 ++++++++++------- 1 file changed, 10 insertions(+), 7 deletions(-) diff --git a/packages/core-components/src/layout/HeaderTabs/HeaderTabs.tsx b/packages/core-components/src/layout/HeaderTabs/HeaderTabs.tsx index 0a937683a5..a97fc70e4b 100644 --- a/packages/core-components/src/layout/HeaderTabs/HeaderTabs.tsx +++ b/packages/core-components/src/layout/HeaderTabs/HeaderTabs.tsx @@ -20,7 +20,7 @@ import { makeStyles } from '@material-ui/core/styles'; import TabUI, { TabProps } from '@material-ui/core/Tab'; import Tabs from '@material-ui/core/Tabs'; -import React, { useEffect, useState } from 'react'; +import React, { useCallback, useEffect, useState } from 'react'; /** @public */ export type HeaderTabsClassKey = @@ -80,12 +80,15 @@ export function HeaderTabs(props: HeaderTabsProps) { const [selectedTab, setSelectedTab] = useState(selectedIndex ?? 0); const styles = useStyles(); - const handleChange = (_: React.ChangeEvent<{}>, index: number) => { - if (selectedIndex === undefined) { - setSelectedTab(index); - } - if (onChange) onChange(index); - }; + const handleChange = useCallback( + (_: React.ChangeEvent<{}>, index: number) => { + if (selectedIndex === undefined) { + setSelectedTab(index); + } + if (onChange && selectedIndex !== index) onChange(index); + }, + [selectedIndex, onChange], + ); useEffect(() => { if (selectedIndex !== undefined) { From 944af7f2a89ab46ed55d06595b39c3230837bdbd Mon Sep 17 00:00:00 2001 From: blam Date: Mon, 18 Jul 2022 16:07:56 +0200 Subject: [PATCH 2/2] chore: added changeset Signed-off-by: blam --- .changeset/honest-ligers-care.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/honest-ligers-care.md diff --git a/.changeset/honest-ligers-care.md b/.changeset/honest-ligers-care.md new file mode 100644 index 0000000000..7559d78a11 --- /dev/null +++ b/.changeset/honest-ligers-care.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Work around a bug calling `onChange` twice in `mui` for `RoutedTab` so you don't have to press back twice to navigate through tabs