Commit 47302502 authored by Florie Guibert's avatar Florie Guibert

Migrate epic sidebar ancestors to widget

Changelog: changed
EE: true
parent a89ca44b
<script>
import { mapState, mapGetters, mapActions } from 'vuex';
import AncestorsTree from 'ee/sidebar/components/ancestors_tree/ancestors_tree.vue';
import SidebarAncestorsWidget from 'ee_component/sidebar/components/ancestors_tree/sidebar_ancestors_widget.vue';
import { IssuableType } from '~/issue_show/constants';
import notesEventHub from '~/notes/event_hub';
......@@ -27,7 +27,7 @@ export default {
SidebarDatePicker,
SidebarDatePickerCollapsed,
SidebarLabels,
AncestorsTree,
SidebarAncestorsWidget,
SidebarParticipants,
SidebarConfidentialityWidget,
SidebarSubscriptionsWidget,
......@@ -70,7 +70,6 @@ export default {
'dueDateTimeFromMilestones',
'dueDateTime',
'dueDateForCollapsedSidebar',
'ancestors',
]),
issuableType() {
return IssuableType.Epic;
......@@ -236,9 +235,12 @@ export default {
@expandSidebar="handleSidebarToggle"
@confidentialityUpdated="updateConfidentialityOnIssuable($event)"
/>
<div v-if="allowSubEpics" class="block ancestors">
<ancestors-tree :ancestors="ancestors" :is-fetching="false" data-testid="ancestors" />
</div>
<sidebar-ancestors-widget
v-if="allowSubEpics"
:iid="String(iid)"
:full-path="fullPath"
:issuable-type="issuableType"
/>
<div class="block participants">
<sidebar-participants
:participants="participants"
......
......@@ -54,5 +54,3 @@ export const isDateInvalid = (state, getters) => {
getters.dueDateTimeFromMilestones,
);
};
export const ancestors = (state) => (state.ancestors ? [...state.ancestors].reverse() : []);
......@@ -55,7 +55,6 @@ export default () => ({
dueDateFromMilestones: '',
dueDate: '',
labels: [],
ancestors: [],
participants: [],
subscribed: false,
confidential: false,
......
......@@ -8,12 +8,14 @@ import { getStoreConfig } from 'ee/epic/store';
import epicUtils from 'ee/epic/utils/epic_utils';
import SidebarAncestorsWidget from 'ee_component/sidebar/components/ancestors_tree/sidebar_ancestors_widget.vue';
import { parsePikadayDate } from '~/lib/utils/datetime_utility';
import SidebarReferenceWidget from '~/sidebar/components/reference/sidebar_reference_widget.vue';
import SidebarSubscriptionsWidget from '~/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue';
import { mockEpicMeta, mockEpicData, mockAncestors } from '../mock_data';
import { mockEpicMeta, mockEpicData } from '../mock_data';
describe('EpicSidebarComponent', () => {
const originalUserId = gon.current_user_id;
......@@ -28,7 +30,6 @@ describe('EpicSidebarComponent', () => {
...state,
...mockEpicMeta,
...mockEpicData,
ancestors: mockAncestors,
},
actions: { ...actions, ...actionMocks },
......@@ -218,9 +219,8 @@ describe('EpicSidebarComponent', () => {
expect(wrapper.find(SidebarReferenceWidget).exists()).toBe(true);
});
describe('when sub-epics feature is available', () => {
it('renders ancestors list', async () => {
store.dispatch('toggleSidebarFlag', false);
describe('when sub-epics feature is not available', () => {
it('does not renders ancestors list', async () => {
store.dispatch('setEpicMeta', {
...mockEpicMeta,
allowSubEpics: false,
......@@ -228,20 +228,13 @@ describe('EpicSidebarComponent', () => {
await nextTick();
expect(wrapper.find('.block.ancestors').exists()).toBe(false);
expect(wrapper.find(SidebarAncestorsWidget).exists()).toBe(false);
});
});
describe('when sub-epics feature is not available', () => {
it('does not render ancestors list', async () => {
wrapper.vm.$store.dispatch('toggleSidebarFlag', false);
await nextTick();
const ancestorsEl = wrapper.find('[data-testid="ancestors"]');
expect(ancestorsEl.exists()).toBe(true);
expect(ancestorsEl.props('ancestors')).toEqual([...mockAncestors].reverse());
describe('when sub-epics feature is available', () => {
it('renders ancestors list', () => {
expect(wrapper.find(SidebarAncestorsWidget).exists()).toBe(true);
});
});
......
......@@ -259,21 +259,4 @@ describe('Epic Store Getters', () => {
).toBe(false);
});
});
describe('ancestors', () => {
it('returns `ancestors` from state when ancestors is not null', () => {
const ancestors = getters.ancestors({
ancestors: [{ id: 1, title: 'Parent' }],
});
expect(ancestors).toHaveLength(1);
});
it('returns empty array when `ancestors` within state is null', () => {
const ancestors = getters.ancestors({});
expect(ancestors).not.toBeNull();
expect(ancestors).toHaveLength(0);
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment