diff --git a/public/app/features/explore/QueryRow.tsx b/public/app/features/explore/QueryRow.tsx index 5b782ccdf71..f0514f24c4e 100644 --- a/public/app/features/explore/QueryRow.tsx +++ b/public/app/features/explore/QueryRow.tsx @@ -85,7 +85,7 @@ export class QueryRow extends PureComponent { this.props.addQueryRow(exploreId, index); }; - onClickToggleHiddenQuery = () => { + onClickToggleDisabled = () => { const { exploreId, index, query } = this.props; const newQuery = { ...query, @@ -136,7 +136,7 @@ export class QueryRow extends PureComponent { const canToggleEditorModes = mode === ExploreMode.Metrics && has(datasourceInstance, 'components.QueryCtrl.prototype.toggleEditorMode'); - const canHide = queryResponse.state !== LoadingState.NotStarted; + const isNotStarted = queryResponse.state === LoadingState.NotStarted; const queryErrors = queryResponse.error && queryResponse.error.refId === query.refId ? [queryResponse.error] : []; let QueryField; @@ -181,10 +181,10 @@ export class QueryRow extends PureComponent { diff --git a/public/app/features/explore/QueryRowActions.test.tsx b/public/app/features/explore/QueryRowActions.test.tsx index 6dcc098543c..4b9f5685cf3 100644 --- a/public/app/features/explore/QueryRowActions.test.tsx +++ b/public/app/features/explore/QueryRowActions.test.tsx @@ -4,11 +4,11 @@ import { shallow } from 'enzyme'; const setup = (propOverrides?: object) => { const props: Props = { - hideQuery: false, - canHide: true, + isDisabled: false, + isNotStarted: true, canToggleEditorModes: true, onClickToggleEditorMode: () => {}, - onClickToggleHiddenQuery: () => {}, + onClickToggleDisabled: () => {}, onClickAddButton: () => {}, onClickRemoveButton: () => {}, }; @@ -29,11 +29,11 @@ describe('QueryRowActions', () => { expect(wrapper.find({ 'aria-label': 'Edit mode button' })).toHaveLength(0); }); it('should change icon to fa-eye-slash when query row result is hidden', () => { - const wrapper = setup({ hideQuery: true }); + const wrapper = setup({ isDisabled: true }); expect(wrapper.find('i.fa-eye-slash')).toHaveLength(1); }); it('should change icon to fa-eye when query row result is not hidden', () => { - const wrapper = setup({ hideQuery: false }); + const wrapper = setup({ isDisabled: false }); expect(wrapper.find('i.fa-eye')).toHaveLength(1); }); }); diff --git a/public/app/features/explore/QueryRowActions.tsx b/public/app/features/explore/QueryRowActions.tsx index 59ec5049215..373656c4d59 100644 --- a/public/app/features/explore/QueryRowActions.tsx +++ b/public/app/features/explore/QueryRowActions.tsx @@ -2,10 +2,10 @@ import React from 'react'; export type Props = { canToggleEditorModes: boolean; - hideQuery: boolean; - canHide: boolean; + isDisabled: boolean; + isNotStarted: boolean; onClickToggleEditorMode: () => void; - onClickToggleHiddenQuery: () => void; + onClickToggleDisabled: () => void; onClickAddButton: () => void; onClickRemoveButton: () => void; }; @@ -14,11 +14,11 @@ export function QueryRowActions(props: Props) { const { canToggleEditorModes, onClickToggleEditorMode, - onClickToggleHiddenQuery, + onClickToggleDisabled, onClickAddButton, onClickRemoveButton, - hideQuery, - canHide, + isDisabled, + isNotStarted, } = props; return ( @@ -35,17 +35,22 @@ export function QueryRowActions(props: Props) { )}
-
-
-
diff --git a/public/app/features/explore/__snapshots__/QueryRowActions.test.tsx.snap b/public/app/features/explore/__snapshots__/QueryRowActions.test.tsx.snap index 77d2ce94fcf..2b3018e8dd0 100644 --- a/public/app/features/explore/__snapshots__/QueryRowActions.test.tsx.snap +++ b/public/app/features/explore/__snapshots__/QueryRowActions.test.tsx.snap @@ -22,8 +22,9 @@ exports[`QueryRowActions should render component 1`] = ` >