mirror of
https://github.com/apache/superset.git
synced 2026-04-22 17:45:21 +00:00
refactor(Menu): Use items prop instead of deprecated Menu.Item HOC (#32587)
This commit is contained in:
committed by
GitHub
parent
527c8de773
commit
d15b0e4f6d
@@ -38,6 +38,7 @@ import {
|
||||
toggleLeftBar,
|
||||
} from 'src/SqlLab/actions/sqlLab';
|
||||
import { QueryEditor, SqlLabRootState } from 'src/SqlLab/types';
|
||||
import { MenuItemType } from 'antd-v5/es/menu/interface';
|
||||
import { Icons, IconType } from 'src/components/Icons';
|
||||
|
||||
const TabTitleWrapper = styled.div`
|
||||
@@ -132,84 +133,101 @@ const SqlEditorTabHeader: FC<Props> = ({ queryEditor }) => {
|
||||
<MenuDotsDropdown
|
||||
trigger={['click']}
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item
|
||||
className="close-btn"
|
||||
key="1"
|
||||
onClick={() => actions.removeQueryEditor(qe)}
|
||||
data-test="close-tab-menu-option"
|
||||
>
|
||||
<IconContainer>
|
||||
<Icons.CloseOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
verticalalign: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Close tab')}
|
||||
</Menu.Item>
|
||||
<Menu.Item
|
||||
key="2"
|
||||
onClick={renameTab}
|
||||
data-test="rename-tab-menu-option"
|
||||
>
|
||||
<IconContainer>
|
||||
<Icons.EditOutlined
|
||||
css={css`
|
||||
verticalalign: middle;
|
||||
`}
|
||||
iconSize="l"
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Rename tab')}
|
||||
</Menu.Item>
|
||||
<Menu.Item
|
||||
key="3"
|
||||
onClick={() => actions.toggleLeftBar(qe)}
|
||||
data-test="toggle-menu-option"
|
||||
>
|
||||
<IconContainer>
|
||||
<Icons.VerticalAlignBottomOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
rotate: ${qe.hideLeftBar ? '-90deg;' : '90deg;'};
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{qe.hideLeftBar ? t('Expand tool bar') : t('Hide tool bar')}
|
||||
</Menu.Item>
|
||||
<Menu.Item
|
||||
key="4"
|
||||
onClick={() => actions.removeAllOtherQueryEditors(qe)}
|
||||
data-test="close-all-other-menu-option"
|
||||
>
|
||||
<IconContainer>
|
||||
<Icons.CloseOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
vertical-align: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Close all other tabs')}
|
||||
</Menu.Item>
|
||||
<Menu.Item
|
||||
key="5"
|
||||
onClick={() => actions.cloneQueryToNewTab(qe, false)}
|
||||
data-test="clone-tab-menu-option"
|
||||
>
|
||||
<IconContainer>
|
||||
<Icons.CopyOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
vertical-align: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Duplicate tab')}
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
<Menu
|
||||
items={[
|
||||
{
|
||||
className: 'close-btn',
|
||||
key: '1',
|
||||
onClick: () => actions.removeQueryEditor(qe),
|
||||
'data-test': 'close-tab-menu-option',
|
||||
label: (
|
||||
<>
|
||||
<IconContainer>
|
||||
<Icons.CloseOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
verticalalign: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Close tab')}
|
||||
</>
|
||||
),
|
||||
} as MenuItemType,
|
||||
{
|
||||
key: '2',
|
||||
onClick: renameTab,
|
||||
'data-test': 'rename-tab-menu-option',
|
||||
label: (
|
||||
<>
|
||||
<IconContainer>
|
||||
<Icons.EditOutlined
|
||||
css={css`
|
||||
verticalalign: middle;
|
||||
`}
|
||||
iconSize="l"
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Rename tab')}
|
||||
</>
|
||||
),
|
||||
} as MenuItemType,
|
||||
{
|
||||
key: '3',
|
||||
onClick: () => actions.toggleLeftBar(qe),
|
||||
'data-test': 'toggle-menu-option',
|
||||
label: (
|
||||
<>
|
||||
<IconContainer>
|
||||
<Icons.VerticalAlignBottomOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
rotate: ${qe.hideLeftBar ? '-90deg;' : '90deg;'};
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{qe.hideLeftBar ? t('Expand tool bar') : t('Hide tool bar')}
|
||||
</>
|
||||
),
|
||||
} as MenuItemType,
|
||||
{
|
||||
key: '4',
|
||||
onClick: () => actions.removeAllOtherQueryEditors(qe),
|
||||
'data-test': 'close-all-other-menu-option',
|
||||
label: (
|
||||
<>
|
||||
<IconContainer>
|
||||
<Icons.CloseOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
vertical-align: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Close all other tabs')}
|
||||
</>
|
||||
),
|
||||
} as MenuItemType,
|
||||
{
|
||||
key: '5',
|
||||
onClick: () => actions.cloneQueryToNewTab(qe, false),
|
||||
'data-test': 'clone-tab-menu-option',
|
||||
label: (
|
||||
<>
|
||||
<IconContainer>
|
||||
<Icons.CopyOutlined
|
||||
iconSize="l"
|
||||
css={css`
|
||||
vertical-align: middle;
|
||||
`}
|
||||
/>
|
||||
</IconContainer>
|
||||
{t('Duplicate tab')}
|
||||
</>
|
||||
),
|
||||
} as MenuItemType,
|
||||
]}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
<TabTitle>{qe.name}</TabTitle>{' '}
|
||||
|
||||
Reference in New Issue
Block a user