diff --git a/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx b/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx index 351ac1faf6..829f05443e 100644 --- a/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx +++ b/ui/src/dashboards/components/GraphOptionsCustomizableField.tsx @@ -28,7 +28,7 @@ class GraphOptionsCustomizableField extends PureComponent { onFieldUpdate({internalName, displayName: rename, visible}) } - handleToggleVisible(e) { + handleToggleVisible() { const {onFieldUpdate, internalName, displayName, visible} = this.props onFieldUpdate({internalName, displayName, visible: !visible}) } diff --git a/ui/src/dashboards/reducers/cellEditorOverlay.js b/ui/src/dashboards/reducers/cellEditorOverlay.js index 402f488f64..4629e89750 100644 --- a/ui/src/dashboards/reducers/cellEditorOverlay.js +++ b/ui/src/dashboards/reducers/cellEditorOverlay.js @@ -11,8 +11,6 @@ import { import {initializeOptions} from 'src/dashboards/constants/cellEditor' -import {initializeOptions} from 'src/shared/constants/tableGraph' - export const initialState = { cell: null, thresholdsListType: THRESHOLD_TYPE_TEXT, diff --git a/ui/src/shared/components/TableGraph.js b/ui/src/shared/components/TableGraph.js index b6a9e90cb5..444516cc4a 100644 --- a/ui/src/shared/components/TableGraph.js +++ b/ui/src/shared/components/TableGraph.js @@ -18,27 +18,26 @@ import { } from 'src/shared/constants/tableGraph' import {generateThresholdsListHexs} from 'shared/constants/colorOperations' -const filterInvisibleRows = (data, verticalTimeAxis, fieldNames) => { - let visibleData = [[]] - if (verticalTimeAxis) { - const visibleColumns = {} - visibleData = data.map((row, i) => { - return row.filter((col, j) => { - if (i === 0) { - const foundField = fieldNames.find( - field => field.internalName === col - ) - visibleColumns[j] = foundField && foundField.visible - } - return visibleColumns[j] - }) +const filterInvisibleRows = (data, fieldNames) => { + const visibleData = data.filter(row => { + const foundField = fieldNames.find(field => field.internalName === row[0]) + return foundField && foundField.visible + }) + + return visibleData.length ? visibleData : [[]] +} + +const filterInvisibleColumns = (data, fieldNames) => { + const visibleColumns = {} + visibleData = data.map((row, i) => { + return row.filter((col, j) => { + if (i === 0) { + const foundField = fieldNames.find(field => field.internalName === col) + visibleColumns[j] = foundField && foundField.visible + } + return visibleColumns[j] }) - } else { - visibleData = data.filter(row => { - const foundField = fieldNames.find(field => field.internalName === row[0]) - return foundField && foundField.visible - }) - } + }) return visibleData[0].length ? visibleData : [[]] } @@ -59,29 +58,29 @@ class TableGraph extends Component { componentWillReceiveProps(nextProps) { const {data, unzippedData} = timeSeriesToTableGraph(nextProps.data) - const { tableOptions: {sortBy: {internalName}, fieldNames, verticalTimeAxis}, } = nextProps - const sortByColumnIndex = _.indexOf(data[0], internalName) - const sortedData = [ - data[0], - ..._.sortBy(_.drop(data, 1), sortByColumnIndex), - ] + if (!isEmpty(data[0])) { + const sortedData = [ + data[0], + ..._.sortBy(_.drop(data, 1), sortByColumnIndex), + ] - const visibleData = filterInvisibleRows( - sortedData, - verticalTimeAxis, - fieldNames - ) + const sortByColumnIndex = _.indexOf(data[0], internalName) - this.setState({ - data: sortedData, - visibleData, - unzippedData, - sortByColumnIndex, - }) + const visibleData = verticalTimeAxis + ? filterInvisibleColumns(sortedData, fieldNames) + : filterInvisibleRows(sortedData, fieldNames) + + this.setState({ + data: sortedData, + visibleData, + unzippedData, + sortByColumnIndex, + }) + } } calcHoverTimeIndex = (data, hoverTime, verticalTimeAxis) => { @@ -238,7 +237,7 @@ class TableGraph extends Component { ref={gridContainer => (this.gridContainer = gridContainer)} onMouseOut={this.handleMouseOut} > - {!isEmpty(visibleData) && + {!isEmpty(data) &&