From 7287351b489ec402eaa8860460e867757e9060ab Mon Sep 17 00:00:00 2001 From: Camron Staley <55006027+CamronStaley@users.noreply.github.com> Date: Wed, 27 Nov 2024 15:48:31 -0600 Subject: [PATCH] make icon in panel table have circle background on hover (#5197) * make icon in panel table have circle background on hover * cleanup * fix icon --- .../SchemaIO/components/ActionsMenu.tsx | 44 +++++++++++++------ .../plugins/SchemaIO/components/TableView.tsx | 4 +- 2 files changed, 33 insertions(+), 15 deletions(-) diff --git a/app/packages/core/src/plugins/SchemaIO/components/ActionsMenu.tsx b/app/packages/core/src/plugins/SchemaIO/components/ActionsMenu.tsx index 24b8a86037..cf8cee3b78 100644 --- a/app/packages/core/src/plugins/SchemaIO/components/ActionsMenu.tsx +++ b/app/packages/core/src/plugins/SchemaIO/components/ActionsMenu.tsx @@ -77,9 +77,13 @@ function Action(props: ActionPropsType) { const { label, name, onClick, icon, variant, mode, color, size, tooltip } = props; const resolvedColor = color ? getColorByCode(color) : undefined; - const Icon = icon ? ( - <MuiIconFont name={icon} sx={{ color: resolvedColor }} /> + <MuiIconFont + name={icon} + sx={{ + color: resolvedColor, + }} + /> ) : null; const handleClick = useCallback( @@ -91,18 +95,30 @@ function Action(props: ActionPropsType) { const content = mode === "inline" ? ( - <Button - variant={variant} - startIcon={Icon} - onClick={handleClick} - sx={{ - color: resolvedColor, - padding: size === "small" ? 0 : undefined, - minWidth: size === "small" ? 40 : undefined, - }} - > - {label} - </Button> + label ? ( + <Button + variant={variant} + startIcon={Icon} + onClick={handleClick} + sx={{ + color: resolvedColor, + padding: size === "small" ? 0 : undefined, + minWidth: size === "small" ? 40 : undefined, + }} + > + {label} + </Button> + ) : ( + <IconButton + onClick={handleClick} + size={size} + sx={{ + color: resolvedColor, + }} + > + {Icon} + </IconButton> + ) ) : ( <MenuItem onClick={handleClick}> {Icon && <ListItemIcon>{Icon}</ListItemIcon>} diff --git a/app/packages/core/src/plugins/SchemaIO/components/TableView.tsx b/app/packages/core/src/plugins/SchemaIO/components/TableView.tsx index 9fbc83000e..47ddd65f4f 100644 --- a/app/packages/core/src/plugins/SchemaIO/components/TableView.tsx +++ b/app/packages/core/src/plugins/SchemaIO/components/TableView.tsx @@ -222,12 +222,14 @@ export default function TableView(props: ViewPropsType) { : "unset", }} > - {currentRowHasActions && ( + {currentRowHasActions ? ( <ActionsMenu actions={getRowActions(rowIndex)} size={size} maxInline={max_inline_actions} /> + ) : ( + <Box sx={{ minHeight: "32px" }} /> )} </TableCell> )}