IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Table: Use the configured field formatter if it exists (#20584)

Browse Source 
This PR lets the alpha Table component use a Fields configured 
formatter rather than the super hacky ColumnStyle.
This commit is contained in:
Ryan McKinley 2019-11-22 02:35:26 -07:00 committed by Marcus Efraimsson
parent f47759b98e
commit f78b3b1329
2 changed files with 32 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/grafana-ui/src/components/Table/Table.tsx
View File

@ -25,7 +25,7 @@ import {
import {
TableCellBuilder,
ColumnStyle,
getCellBuilder,
getFieldCellBuilder,
TableCellBuilderOptions,
simpleCellBuilder,
} from './TableCellBuilder';
@ -153,7 +153,7 @@ export class Table extends Component<Props, State> {
return {
header: title,
width: columnWidth,
builder: getCellBuilder(col.config || {}, style, this.props),
builder: getFieldCellBuilder(col, style, this.props),
};
});
}

30
packages/grafana-ui/src/components/Table/TableCellBuilder.tsx
View File

@ -291,3 +291,33 @@ class CellBuilderWithStyle {
return simpleCellBuilder({ value, props, className });
};
}
export function getFieldCellBuilder(field: Field, style: ColumnStyle | null, p: Props): TableCellBuilder {
if (!field.display) {
return getCellBuilder(field.config || {}, style, p);
}
return (cell: TableCellBuilderOptions) => {
const { props } = cell;
const disp = field.display!(cell.value);
let style = props.style;
if (disp.color) {
style = {
...props.style,
background: disp.color,
};
}
let clazz = 'gf-table-cell';
if (cell.className) {
clazz += ' ' + cell.className;
}
return (
<div style={style} className={clazz} title={disp.title}>
{disp.text}
</div>
);
};
}