remove actions support from context menu

adela/table_actions_context_menu
Adela Almasan 5 months ago
parent 3027f8ab99
commit e339875121
  1. 7
      packages/grafana-ui/src/components/Table/BarGaugeCell.tsx
  2. 8
      packages/grafana-ui/src/components/Table/DefaultCell.tsx
  3. 6
      packages/grafana-ui/src/components/Table/ImageCell.tsx
  4. 7
      packages/grafana-ui/src/components/Table/JSONViewCell.tsx

@ -24,7 +24,7 @@ const defaultScale: ThresholdsConfig = {
};
export const BarGaugeCell = (props: TableCellProps) => {
const { field, innerWidth, tableStyles, cell, cellProps, row, actions } = props;
const { field, innerWidth, tableStyles, cell, cellProps, row } = props;
const displayValue = field.display!(cell.value);
const cellOptions = getCellOptions(field);
@ -56,7 +56,6 @@ export const BarGaugeCell = (props: TableCellProps) => {
};
const hasLinks = Boolean(getLinks().length);
const hasActions = Boolean(actions?.length);
const alignmentFactors = getAlignmentFactor(field, displayValue, cell.row.index);
const renderComponent = (menuProps: DataLinksContextMenuApi) => {
@ -85,8 +84,8 @@ export const BarGaugeCell = (props: TableCellProps) => {
return (
<div {...cellProps} className={tableStyles.cellContainer}>
{hasLinks || hasActions ? (
<DataLinksContextMenu links={getLinks} actions={actions} style={{ display: 'flex', width: '100%' }}>
{hasLinks ? (
<DataLinksContextMenu links={getLinks} style={{ display: 'flex', width: '100%' }}>
{(api) => renderComponent(api)}
</DataLinksContextMenu>
) : (

@ -17,8 +17,7 @@ import { TableCellProps, CustomCellRendererProps, TableCellOptions } from './typ
import { getCellColors, getCellOptions } from './utils';
export const DefaultCell = (props: TableCellProps) => {
const { field, cell, tableStyles, row, cellProps, frame, rowStyled, rowExpanded, textWrapped, height, actions } =
props;
const { field, cell, tableStyles, row, cellProps, frame, rowStyled, rowExpanded, textWrapped, height } = props;
const inspectEnabled = Boolean(field.config.custom?.inspect);
const displayValue = field.display!(cell.value);
@ -26,7 +25,6 @@ export const DefaultCell = (props: TableCellProps) => {
const showActions = (showFilters && cell.value !== undefined) || inspectEnabled;
const cellOptions = getCellOptions(field);
const hasLinks = Boolean(getCellLinks(field, row)?.length);
const hasActions = Boolean(actions?.length);
const clearButtonStyle = useStyles2(clearLinkButtonStyles);
let value: string | ReactElement;
@ -81,8 +79,8 @@ export const DefaultCell = (props: TableCellProps) => {
return (
<div key={key} {...rest} className={cellStyle}>
{hasLinks || hasActions ? (
<DataLinksContextMenu links={() => getCellLinks(field, row) || []} actions={actions}>
{hasLinks ? (
<DataLinksContextMenu links={() => getCellLinks(field, row) || []}>
{(api) => {
if (api.openMenu) {
return (

@ -9,13 +9,12 @@ import { getCellOptions } from './utils';
const DATALINKS_HEIGHT_OFFSET = 10;
export const ImageCell = (props: TableCellProps) => {
const { field, cell, tableStyles, row, cellProps, actions } = props;
const { field, cell, tableStyles, row, cellProps } = props;
const cellOptions = getCellOptions(field);
const { title, alt } =
cellOptions.type === TableCellDisplayMode.Image ? cellOptions : { title: undefined, alt: undefined };
const displayValue = field.display!(cell.value);
const hasLinks = Boolean(getCellLinks(field, row)?.length);
const hasActions = Boolean(actions?.length);
// The image element
const img = (
@ -32,11 +31,10 @@ export const ImageCell = (props: TableCellProps) => {
<div {...cellProps} className={tableStyles.cellContainer}>
{/* If there are data links/actions, we render them with image */}
{/* Otherwise we simply render the image */}
{hasLinks || hasActions ? (
{hasLinks ? (
<DataLinksContextMenu
style={{ height: tableStyles.cellHeight - DATALINKS_HEIGHT_OFFSET, width: 'auto' }}
links={() => getCellLinks(field, row) || []}
actions={actions}
>
{(api) => {
if (api.openMenu) {

@ -11,7 +11,7 @@ import { TableCellInspectorMode } from './TableCellInspector';
import { TableCellProps } from './types';
export function JSONViewCell(props: TableCellProps): JSX.Element {
const { cell, tableStyles, cellProps, field, row, actions } = props;
const { cell, tableStyles, cellProps, field, row } = props;
const inspectEnabled = Boolean(field.config.custom?.inspect);
const txt = css({
cursor: 'pointer',
@ -30,14 +30,13 @@ export function JSONViewCell(props: TableCellProps): JSX.Element {
}
const hasLinks = Boolean(getCellLinks(field, row)?.length);
const hasActions = Boolean(actions?.length);
const clearButtonStyle = useStyles2(clearLinkButtonStyles);
return (
<div {...cellProps} className={inspectEnabled ? tableStyles.cellContainerNoOverflow : tableStyles.cellContainer}>
<div className={cx(tableStyles.cellText, txt)}>
{hasLinks || hasActions ? (
<DataLinksContextMenu links={() => getCellLinks(field, row) || []} actions={actions}>
{hasLinks ? (
<DataLinksContextMenu links={() => getCellLinks(field, row) || []}>
{(api) => {
if (api.openMenu) {
return (

Loading…
Cancel
Save