mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
* disable Add to favorites button for Elastic templates (#101471) Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> * fix types error Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
57d707c27d
commit
ec8c738bf3
2 changed files with 169 additions and 4 deletions
|
@ -8,10 +8,21 @@
|
|||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
|
||||
import { NewTimeline, NewTimelineProps } from './helpers';
|
||||
import { AddToFavoritesButton, NewTimeline, NewTimelineProps } from './helpers';
|
||||
import { useCreateTimelineButton } from './use_create_timeline';
|
||||
|
||||
jest.mock('../../../../common/hooks/use_selector');
|
||||
import {
|
||||
apolloClientObservable,
|
||||
kibanaObservable,
|
||||
TestProviders,
|
||||
} from '../../../../common/mock/test_providers';
|
||||
import { timelineActions } from '../../../../timelines/store/timeline';
|
||||
import { TimelineStatus, TimelineType } from '../../../../../common/types/timeline';
|
||||
import {
|
||||
createSecuritySolutionStorageMock,
|
||||
mockGlobalState,
|
||||
SUB_PLUGINS_REDUCER,
|
||||
} from '../../../../common/mock';
|
||||
import { createStore } from '../../../../common/store';
|
||||
|
||||
jest.mock('./use_create_timeline');
|
||||
|
||||
|
@ -84,3 +95,146 @@ describe('NewTimeline', () => {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Favorite Button', () => {
|
||||
describe('Non Elastic prebuilt templates', () => {
|
||||
test('should render favorite button', () => {
|
||||
const wrapper = mount(
|
||||
<TestProviders>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
|
||||
expect(wrapper.find('[data-test-subj="timeline-favorite-empty-star"]').exists()).toBeTruthy();
|
||||
});
|
||||
|
||||
test('Favorite button should be enabled ', () => {
|
||||
const wrapper = mount(
|
||||
<TestProviders>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
|
||||
expect(
|
||||
wrapper.find('[data-test-subj="timeline-favorite-empty-star"]').first().prop('disabled')
|
||||
).toEqual(false);
|
||||
});
|
||||
|
||||
test('Should update isFavorite after clicking on favorite button', async () => {
|
||||
const spy = jest.spyOn(timelineActions, 'updateIsFavorite');
|
||||
const wrapper = mount(
|
||||
<TestProviders>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
|
||||
wrapper.simulate('click');
|
||||
|
||||
expect(spy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('should disable favorite button with filled star', () => {
|
||||
const { storage } = createSecuritySolutionStorageMock();
|
||||
|
||||
const store = createStore(
|
||||
{
|
||||
...mockGlobalState,
|
||||
timeline: {
|
||||
...mockGlobalState.timeline,
|
||||
timelineById: {
|
||||
test: {
|
||||
...mockGlobalState.timeline.timelineById.test,
|
||||
isFavorite: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
SUB_PLUGINS_REDUCER,
|
||||
apolloClientObservable,
|
||||
kibanaObservable,
|
||||
storage
|
||||
);
|
||||
const wrapper = mount(
|
||||
<TestProviders store={store}>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
|
||||
expect(
|
||||
wrapper.find('[data-test-subj="timeline-favorite-filled-star"]').exists()
|
||||
).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
describe('Elast prebuilt templates', () => {
|
||||
test('should disable favorite button', () => {
|
||||
const { storage } = createSecuritySolutionStorageMock();
|
||||
|
||||
const store = createStore(
|
||||
{
|
||||
...mockGlobalState,
|
||||
timeline: {
|
||||
...mockGlobalState.timeline,
|
||||
timelineById: {
|
||||
test: {
|
||||
...mockGlobalState.timeline.timelineById.test,
|
||||
status: TimelineStatus.immutable,
|
||||
timelineType: TimelineType.template,
|
||||
templateTimelineId: 'mock-template-timeline-id',
|
||||
templateTimelineVersion: 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
SUB_PLUGINS_REDUCER,
|
||||
apolloClientObservable,
|
||||
kibanaObservable,
|
||||
storage
|
||||
);
|
||||
const wrapper = mount(
|
||||
<TestProviders store={store}>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
expect(
|
||||
wrapper.find('[data-test-subj="timeline-favorite-empty-star"]').first().prop('disabled')
|
||||
).toEqual(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Custom templates', () => {
|
||||
test('should enable favorite button', () => {
|
||||
const { storage } = createSecuritySolutionStorageMock();
|
||||
|
||||
const store = createStore(
|
||||
{
|
||||
...mockGlobalState,
|
||||
timeline: {
|
||||
...mockGlobalState.timeline,
|
||||
timelineById: {
|
||||
test: {
|
||||
...mockGlobalState.timeline.timelineById.test,
|
||||
status: TimelineStatus.active,
|
||||
timelineType: TimelineType.template,
|
||||
templateTimelineId: 'mock-template-timeline-id',
|
||||
templateTimelineVersion: 1,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
SUB_PLUGINS_REDUCER,
|
||||
apolloClientObservable,
|
||||
kibanaObservable,
|
||||
storage
|
||||
);
|
||||
const wrapper = mount(
|
||||
<TestProviders store={store}>
|
||||
<AddToFavoritesButton timelineId="test" />
|
||||
</TestProviders>
|
||||
);
|
||||
expect(
|
||||
wrapper.find('[data-test-subj="timeline-favorite-empty-star"]').first().prop('disabled')
|
||||
).toEqual(false);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
@ -10,7 +10,11 @@ import React, { useCallback, useMemo } from 'react';
|
|||
import styled from 'styled-components';
|
||||
import { useDispatch } from 'react-redux';
|
||||
|
||||
import { TimelineTypeLiteral, TimelineType } from '../../../../../common/types/timeline';
|
||||
import {
|
||||
TimelineTypeLiteral,
|
||||
TimelineType,
|
||||
TimelineStatus,
|
||||
} from '../../../../../common/types/timeline';
|
||||
import { timelineActions, timelineSelectors } from '../../../../timelines/store/timeline';
|
||||
import { useShallowEqualSelector } from '../../../../common/hooks/use_selector';
|
||||
|
||||
|
@ -39,6 +43,12 @@ const AddToFavoritesButtonComponent: React.FC<AddToFavoritesButtonProps> = ({ ti
|
|||
(state) => (getTimeline(state, timelineId) ?? timelineDefaults).isFavorite
|
||||
);
|
||||
|
||||
const status = useShallowEqualSelector(
|
||||
(state) => (getTimeline(state, timelineId) ?? timelineDefaults).status
|
||||
);
|
||||
|
||||
const disableFavoriteButton = status === TimelineStatus.immutable;
|
||||
|
||||
const handleClick = useCallback(
|
||||
() => dispatch(timelineActions.updateIsFavorite({ id: timelineId, isFavorite: !isFavorite })),
|
||||
[dispatch, timelineId, isFavorite]
|
||||
|
@ -51,6 +61,7 @@ const AddToFavoritesButtonComponent: React.FC<AddToFavoritesButtonProps> = ({ ti
|
|||
iconType={isFavorite ? 'starFilled' : 'starEmpty'}
|
||||
onClick={handleClick}
|
||||
data-test-subj={`timeline-favorite-${isFavorite ? 'filled' : 'empty'}-star`}
|
||||
disabled={disableFavoriteButton}
|
||||
>
|
||||
{isFavorite ? i18n.REMOVE_FROM_FAVORITES : i18n.ADD_TO_FAVORITES}
|
||||
</EuiButton>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue