This is an automated email from the ASF dual-hosted git repository. enzomartellucci pushed a commit to branch enxdev/refactor/replace-native-html-elements-with-antd5-components in repository https://gitbox.apache.org/repos/asf/superset.git
commit 0d3bd71f3748411546c4e9eb5d9a64a71b1f6bc1 Author: Enzo Martellucci <[email protected]> AuthorDate: Thu Apr 10 12:10:12 2025 +0200 refactor(IconTooltip): replace <button> element with antd5 Button --- .../components/IconTooltip/IconTooltip.stories.tsx | 26 ++++++++++++---------- .../src/components/IconTooltip/index.tsx | 9 ++++---- .../PopoverDropdown/PopoverDropdown.stories.tsx | 7 ++---- 3 files changed, 20 insertions(+), 22 deletions(-) diff --git a/superset-frontend/src/components/IconTooltip/IconTooltip.stories.tsx b/superset-frontend/src/components/IconTooltip/IconTooltip.stories.tsx index 7e165a2fab..71c5805c67 100644 --- a/superset-frontend/src/components/IconTooltip/IconTooltip.stories.tsx +++ b/superset-frontend/src/components/IconTooltip/IconTooltip.stories.tsx @@ -39,19 +39,21 @@ const PLACEMENTS = [ 'topRight', ]; -const theme = useTheme(); +export const InteractiveIconTooltip = (args: Props) => { + const theme = useTheme(); -export const InteractiveIconTooltip = (args: Props) => ( - <div - css={css` - margin: ${theme.sizeUnit * 10}px ${theme.sizeUnit * 17.5}px; - `} - > - <IconTooltip {...args}> - <Icons.InfoCircleOutlined /> - </IconTooltip> - </div> -); + return ( + <div + css={css` + margin: ${theme.sizeUnit * 10}px ${theme.sizeUnit * 17.5}px; + `} + > + <IconTooltip {...args}> + <Icons.InfoCircleOutlined /> + </IconTooltip> + </div> + ); +}; InteractiveIconTooltip.args = { tooltip: 'Tooltip', diff --git a/superset-frontend/src/components/IconTooltip/index.tsx b/superset-frontend/src/components/IconTooltip/index.tsx index 3e5cea7b3d..11dccd8e99 100644 --- a/superset-frontend/src/components/IconTooltip/index.tsx +++ b/superset-frontend/src/components/IconTooltip/index.tsx @@ -18,6 +18,7 @@ */ import { ReactNode } from 'react'; import { Tooltip } from 'src/components/Tooltip'; +import Button from 'src/components/Button'; export interface Props { children?: ReactNode; @@ -49,19 +50,17 @@ const IconTooltip = ({ tooltip = null, }: Props) => { const iconTooltip = ( - <button - type="button" + <Button onClick={onClick} style={{ - background: 'none', - border: 'none', padding: 0, ...style, }} + buttonStyle="link" className={`IconTooltip ${className}`} > {children} - </button> + </Button> ); if (tooltip) { return ( diff --git a/superset-frontend/src/components/PopoverDropdown/PopoverDropdown.stories.tsx b/superset-frontend/src/components/PopoverDropdown/PopoverDropdown.stories.tsx index 36527b16eb..039bfa5b23 100644 --- a/superset-frontend/src/components/PopoverDropdown/PopoverDropdown.stories.tsx +++ b/superset-frontend/src/components/PopoverDropdown/PopoverDropdown.stories.tsx @@ -17,6 +17,7 @@ * under the License. */ import { useState } from 'react'; +import Button from 'src/components/Button'; import PopoverDropdown, { PopoverDropdownProps, OptionProps } from '.'; const OPTIONS: OptionProps[] = [ @@ -40,11 +41,7 @@ export const InteractivePopoverDropdown = (props: Props) => { (type: ElementType) => ({ label, value }: OptionProps) => { if (type === 'button') { - return ( - <button type="button" key={value}> - {label} - </button> - ); + return <Button key={value}>{label}</Button>; } return <span>{label}</span>; };
