[Search] Disable "send to background" when auto-refresh is enabled (#84106)
This commit is contained in:
parent
6a07349bb6
commit
5354008a42
|
@ -69,6 +69,7 @@ export class DataEnhancedPlugin
|
|||
createConnectedBackgroundSessionIndicator({
|
||||
sessionService: plugins.data.search.session,
|
||||
application: core.application,
|
||||
timeFilter: plugins.data.query.timefilter.timefilter,
|
||||
})
|
||||
)
|
||||
),
|
||||
|
|
|
@ -26,5 +26,14 @@ storiesOf('components/BackgroundSessionIndicator', module).add('default', () =>
|
|||
<div>
|
||||
<BackgroundSessionIndicator state={SessionState.Restored} />
|
||||
</div>
|
||||
<div>
|
||||
<BackgroundSessionIndicator
|
||||
state={SessionState.Completed}
|
||||
disabled={true}
|
||||
disabledReasonText={
|
||||
'Send to background capability is unavailable when auto-refresh is enabled'
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
));
|
||||
|
|
|
@ -100,3 +100,13 @@ test('Canceled state', async () => {
|
|||
|
||||
expect(onRefresh).toBeCalled();
|
||||
});
|
||||
|
||||
test('Disabled state', async () => {
|
||||
render(
|
||||
<Container>
|
||||
<BackgroundSessionIndicator state={SessionState.Loading} disabled={true} />
|
||||
</Container>
|
||||
);
|
||||
|
||||
expect(screen.getByTestId('backgroundSessionIndicator').querySelector('button')).toBeDisabled();
|
||||
});
|
||||
|
|
|
@ -30,6 +30,8 @@ export interface BackgroundSessionIndicatorProps {
|
|||
viewBackgroundSessionsLink?: string;
|
||||
onSaveResults?: () => void;
|
||||
onRefresh?: () => void;
|
||||
disabled?: boolean;
|
||||
disabledReasonText?: string;
|
||||
}
|
||||
|
||||
type ActionButtonProps = BackgroundSessionIndicatorProps & { buttonProps: EuiButtonEmptyProps };
|
||||
|
@ -285,12 +287,13 @@ export const BackgroundSessionIndicator: React.FC<BackgroundSessionIndicatorProp
|
|||
data-test-subj={'backgroundSessionIndicator'}
|
||||
data-state={props.state}
|
||||
button={
|
||||
<EuiToolTip content={button.tooltipText}>
|
||||
<EuiToolTip content={props.disabled ? props.disabledReasonText : button.tooltipText}>
|
||||
<EuiButtonIcon
|
||||
color={button.color}
|
||||
aria-label={button['aria-label']}
|
||||
iconType={button.iconType}
|
||||
onClick={onButtonClick}
|
||||
disabled={props.disabled}
|
||||
/>
|
||||
</EuiToolTip>
|
||||
}
|
||||
|
|
|
@ -5,21 +5,36 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { render, waitFor } from '@testing-library/react';
|
||||
import { render, waitFor, screen, act } from '@testing-library/react';
|
||||
import { dataPluginMock } from '../../../../../../../src/plugins/data/public/mocks';
|
||||
import { createConnectedBackgroundSessionIndicator } from './connected_background_session_indicator';
|
||||
import { BehaviorSubject } from 'rxjs';
|
||||
import { ISessionService, SessionState } from '../../../../../../../src/plugins/data/public';
|
||||
import {
|
||||
ISessionService,
|
||||
RefreshInterval,
|
||||
SessionState,
|
||||
TimefilterContract,
|
||||
} from '../../../../../../../src/plugins/data/public';
|
||||
import { coreMock } from '../../../../../../../src/core/public/mocks';
|
||||
|
||||
const coreStart = coreMock.createStart();
|
||||
const sessionService = dataPluginMock.createStartContract().search
|
||||
.session as jest.Mocked<ISessionService>;
|
||||
const dataStart = dataPluginMock.createStartContract();
|
||||
const sessionService = dataStart.search.session as jest.Mocked<ISessionService>;
|
||||
|
||||
const refreshInterval$ = new BehaviorSubject<RefreshInterval>({ value: 0, pause: true });
|
||||
const timeFilter = dataStart.query.timefilter.timefilter as jest.Mocked<TimefilterContract>;
|
||||
timeFilter.getRefreshIntervalUpdate$.mockImplementation(() => refreshInterval$);
|
||||
timeFilter.getRefreshInterval.mockImplementation(() => refreshInterval$.getValue());
|
||||
|
||||
beforeEach(() => {
|
||||
refreshInterval$.next({ value: 0, pause: true });
|
||||
});
|
||||
|
||||
test("shouldn't show indicator in case no active search session", async () => {
|
||||
const BackgroundSessionIndicator = createConnectedBackgroundSessionIndicator({
|
||||
sessionService,
|
||||
application: coreStart.application,
|
||||
timeFilter,
|
||||
});
|
||||
const { getByTestId, container } = render(<BackgroundSessionIndicator />);
|
||||
|
||||
|
@ -35,8 +50,32 @@ test('should show indicator in case there is an active search session', async ()
|
|||
const BackgroundSessionIndicator = createConnectedBackgroundSessionIndicator({
|
||||
sessionService: { ...sessionService, state$ },
|
||||
application: coreStart.application,
|
||||
timeFilter,
|
||||
});
|
||||
const { getByTestId } = render(<BackgroundSessionIndicator />);
|
||||
|
||||
await waitFor(() => getByTestId('backgroundSessionIndicator'));
|
||||
});
|
||||
|
||||
test('should be disabled during auto-refresh', async () => {
|
||||
const state$ = new BehaviorSubject(SessionState.Loading);
|
||||
const BackgroundSessionIndicator = createConnectedBackgroundSessionIndicator({
|
||||
sessionService: { ...sessionService, state$ },
|
||||
application: coreStart.application,
|
||||
timeFilter,
|
||||
});
|
||||
|
||||
render(<BackgroundSessionIndicator />);
|
||||
|
||||
await waitFor(() => screen.getByTestId('backgroundSessionIndicator'));
|
||||
|
||||
expect(
|
||||
screen.getByTestId('backgroundSessionIndicator').querySelector('button')
|
||||
).not.toBeDisabled();
|
||||
|
||||
act(() => {
|
||||
refreshInterval$.next({ value: 0, pause: false });
|
||||
});
|
||||
|
||||
expect(screen.getByTestId('backgroundSessionIndicator').querySelector('button')).toBeDisabled();
|
||||
});
|
||||
|
|
|
@ -5,24 +5,46 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { debounceTime } from 'rxjs/operators';
|
||||
import { debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
|
||||
import useObservable from 'react-use/lib/useObservable';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
import { BackgroundSessionIndicator } from '../background_session_indicator';
|
||||
import { ISessionService } from '../../../../../../../src/plugins/data/public/';
|
||||
import { ISessionService, TimefilterContract } from '../../../../../../../src/plugins/data/public/';
|
||||
import { RedirectAppLinks } from '../../../../../../../src/plugins/kibana_react/public';
|
||||
import { ApplicationStart } from '../../../../../../../src/core/public';
|
||||
|
||||
export interface BackgroundSessionIndicatorDeps {
|
||||
sessionService: ISessionService;
|
||||
timeFilter: TimefilterContract;
|
||||
application: ApplicationStart;
|
||||
}
|
||||
|
||||
export const createConnectedBackgroundSessionIndicator = ({
|
||||
sessionService,
|
||||
application,
|
||||
timeFilter,
|
||||
}: BackgroundSessionIndicatorDeps): React.FC => {
|
||||
const isAutoRefreshEnabled = () => !timeFilter.getRefreshInterval().pause;
|
||||
const isAutoRefreshEnabled$ = timeFilter
|
||||
.getRefreshIntervalUpdate$()
|
||||
.pipe(map(isAutoRefreshEnabled), distinctUntilChanged());
|
||||
|
||||
return () => {
|
||||
const state = useObservable(sessionService.state$.pipe(debounceTime(500)));
|
||||
const autoRefreshEnabled = useObservable(isAutoRefreshEnabled$, isAutoRefreshEnabled());
|
||||
let disabled = false;
|
||||
let disabledReasonText: string = '';
|
||||
|
||||
if (autoRefreshEnabled) {
|
||||
disabled = true;
|
||||
disabledReasonText = i18n.translate(
|
||||
'xpack.data.backgroundSessionIndicator.disabledDueToAutoRefreshMessage',
|
||||
{
|
||||
defaultMessage: 'Send to background is not available when auto refresh is enabled.',
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
if (!state) return null;
|
||||
return (
|
||||
<RedirectAppLinks application={application}>
|
||||
|
@ -40,6 +62,8 @@ export const createConnectedBackgroundSessionIndicator = ({
|
|||
onCancel={() => {
|
||||
sessionService.cancel();
|
||||
}}
|
||||
disabled={disabled}
|
||||
disabledReasonText={disabledReasonText}
|
||||
/>
|
||||
</RedirectAppLinks>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue