Commit 06212e0c authored by Scott Stern's avatar Scott Stern Committed by Andrew Fontaine

Rename listid to id for generalization of sidebar mechanism

parent a8d7c5d4
......@@ -13,7 +13,7 @@ export const ListType = {
blank: 'blank',
};
export const inactiveListId = 0;
export const inactiveId = 0;
export default {
BoardType,
......
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
export default () => ({
endpoints: {},
isShowingLabels: true,
activeListId: inactiveListId,
activeId: inactiveId,
});
......@@ -3,7 +3,7 @@ import { mapState, mapActions } from 'vuex';
import BoardListHeaderFoss from '~/boards/components/board_list_header.vue';
import { __, sprintf, s__ } from '~/locale';
import boardsStore from '~/boards/stores/boards_store';
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
import eventHub from '~/sidebar/event_hub';
export default {
......@@ -14,7 +14,7 @@ export default {
};
},
computed: {
...mapState(['activeListId']),
...mapState(['activeId']),
issuesTooltip() {
const { issuesSize, maxIssueCount } = this.list;
......@@ -39,13 +39,13 @@ export default {
},
},
methods: {
...mapActions(['setActiveListId']),
...mapActions(['setActiveId']),
openSidebarSettings() {
if (this.activeListId === inactiveListId) {
if (this.activeId === inactiveId) {
eventHub.$emit('sidebar.closeAll');
}
this.setActiveListId(this.list.id);
this.setActiveId(this.list.id);
},
},
};
......
......@@ -15,7 +15,7 @@ import boardsStoreEE from '../stores/boards_store_ee';
import eventHub from '~/sidebar/event_hub';
import flash from '~/flash';
import { isScopedLabel } from '~/lib/utils/common_utils';
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
// NOTE: need to revisit how we handle headerHeight, because we have so many different header and footer options.
export default {
......@@ -52,16 +52,16 @@ export default {
};
},
computed: {
...mapState(['activeListId']),
...mapState(['activeId']),
activeList() {
/*
Warning: Though a computed property it is not reactive because we are
referencing a List Model class. Reactivity only applies to plain JS objects
*/
return boardsStoreEE.store.state.lists.find(({ id }) => id === this.activeListId);
return boardsStoreEE.store.state.lists.find(({ id }) => id === this.activeId);
},
isSidebarOpen() {
return this.activeListId !== inactiveListId;
return this.activeId !== inactiveId;
},
activeListLabel() {
return this.activeList.label;
......@@ -108,10 +108,10 @@ export default {
eventHub.$off('sidebar.closeAll', this.closeSidebar);
},
methods: {
...mapActions(['setActiveListId', 'updateListWipLimit']),
...mapActions(['setActiveId', 'updateListWipLimit']),
closeSidebar() {
this.edit = false;
this.setActiveListId(inactiveListId);
this.setActiveId(inactiveId);
},
showInput() {
this.edit = true;
......@@ -128,7 +128,7 @@ export default {
this.updating = true;
// need to reassign bc were clearing the ref in resetStateAfterUpdate.
const wipLimit = this.currentWipLimit;
const id = this.activeListId;
const id = this.activeId;
this.updateListWipLimit({ maxIssueCount: this.currentWipLimit, id })
.then(() => {
......@@ -137,7 +137,7 @@ export default {
})
.catch(() => {
this.resetStateAfterUpdate();
this.setActiveListId(inactiveListId);
this.setActiveId(inactiveId);
flash(__('Something went wrong while updating your list settings'));
});
} else {
......@@ -145,14 +145,14 @@ export default {
}
},
clearWipLimit() {
this.updateListWipLimit({ maxIssueCount: 0, id: this.activeListId })
this.updateListWipLimit({ maxIssueCount: 0, id: this.activeId })
.then(() => {
boardsStoreEE.setMaxIssueCountOnList(this.activeListId, 0);
boardsStoreEE.setMaxIssueCountOnList(this.activeId, 0);
this.resetStateAfterUpdate();
})
.catch(() => {
this.resetStateAfterUpdate();
this.setActiveListId(inactiveListId);
this.setActiveId(inactiveId);
flash(__('Something went wrong while updating your list settings'));
});
},
......@@ -202,9 +202,9 @@ export default {
</gl-avatar-link>
</template>
<template v-else-if="boardListType === $options.milestone">
<gl-link class="js-milestone" :href="activeListMilestone.webUrl">{{
activeListMilestone.title
}}</gl-link>
<gl-link class="js-milestone" :href="activeListMilestone.webUrl">
{{ activeListMilestone.title }}
</gl-link>
</template>
</div>
<div class="d-flex justify-content-between flex-column">
......
......@@ -67,13 +67,13 @@ export default {
commit(types.SET_SHOW_LABELS, val);
},
setActiveListId({ commit }, listId) {
setActiveId({ commit }, listId) {
commit(types.SET_ACTIVE_LIST_ID, listId);
},
updateListWipLimit({ state }, { maxIssueCount }) {
const { activeListId } = state;
const { activeId } = state;
return axios.put(`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeListId}`, {
return axios.put(`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeId}`, {
list: {
max_issue_count: maxIssueCount,
},
......
......@@ -12,7 +12,7 @@ export default {
state.isShowingLabels = val;
},
[mutationTypes.SET_ACTIVE_LIST_ID]: (state, id) => {
state.activeListId = id;
state.activeId = id;
},
[mutationTypes.REQUEST_AVAILABLE_BOARDS]: () => {
......
......@@ -5,7 +5,7 @@ import AxiosMockAdapter from 'axios-mock-adapter';
import BoardListHeader from 'ee/boards/components/board_list_header.vue';
import List from '~/boards/models/list';
import { ListType, inactiveListId } from '~/boards/constants';
import { ListType, inactiveId } from '~/boards/constants';
import axios from '~/lib/utils/axios_utils';
import sidebarEventHub from '~/sidebar/event_hub';
......@@ -29,7 +29,7 @@ describe('Board List Header Component', () => {
window.gon = {};
axiosMock = new AxiosMockAdapter(axios);
axiosMock.onGet(`${TEST_HOST}/lists/1/issues`).reply(200, { issues: [] });
store = new Vuex.Store({ state: { activeListId: inactiveListId } });
store = new Vuex.Store({ state: { activeId: inactiveId } });
jest.spyOn(store, 'dispatch').mockImplementation();
});
......@@ -145,7 +145,7 @@ describe('Board List Header Component', () => {
});
it('does not emits event when there is an active List', () => {
store.state.activeListId = listObj.id;
store.state.activeId = listObj.id;
createComponent({ listType: hasSettings[0] });
wrapper.vm.openSidebarSettings();
......
......@@ -11,7 +11,7 @@ import bs from '~/boards/stores/boards_store';
import sidebarEventHub from '~/sidebar/event_hub';
import flash from '~/flash';
import waitForPromises from 'helpers/wait_for_promises';
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
jest.mock('~/flash');
// NOTE: needed for calling boardsStore.addList
......@@ -29,11 +29,7 @@ describe('BoardSettingsSideBar', () => {
const listId = 1;
const currentWipLimit = 1; // Needs to be other than null to trigger requests.
const createComponent = (
state = { activeListId: inactiveListId },
actions = {},
localState = {},
) => {
const createComponent = (state = { activeId: inactiveId }, actions = {}, localState = {}) => {
storeActions = actions;
const store = new Vuex.Store({
......@@ -93,35 +89,35 @@ describe('BoardSettingsSideBar', () => {
describe('on close', () => {
it('calls closeSidebar', () => {
const spy = jest.fn();
createComponent({ activeListId: inactiveListId }, { setActiveListId: spy });
createComponent({ activeId: inactiveId }, { setActiveId: spy });
wrapper.find(GlDrawer).vm.$emit('close');
return wrapper.vm.$nextTick().then(() => {
expect(storeActions.setActiveListId).toHaveBeenCalledWith(
expect(storeActions.setActiveId).toHaveBeenCalledWith(
expect.anything(),
inactiveListId,
inactiveId,
undefined,
);
});
});
it('calls closeSidebar on sidebar.closeAll event', () => {
createComponent({ activeListId: inactiveListId }, { setActiveListId: jest.fn() });
createComponent({ activeId: inactiveId }, { setActiveId: jest.fn() });
sidebarEventHub.$emit('sidebar.closeAll');
return wrapper.vm.$nextTick().then(() => {
expect(storeActions.setActiveListId).toHaveBeenCalledWith(
expect(storeActions.setActiveId).toHaveBeenCalledWith(
expect.anything(),
inactiveListId,
inactiveId,
undefined,
);
});
});
});
describe('when activeListId is zero', () => {
describe('when activeId is zero', () => {
it('renders GlDrawer with open false', () => {
createComponent();
......@@ -129,7 +125,7 @@ describe('BoardSettingsSideBar', () => {
});
});
describe('when activeListId is greater than zero', () => {
describe('when activeId is greater than zero', () => {
beforeEach(() => {
mock = new MockAdapter(axios);
......@@ -145,13 +141,13 @@ describe('BoardSettingsSideBar', () => {
});
it('renders GlDrawer with open false', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find(GlDrawer).props('open')).toBe(true);
});
});
describe('when activeListId is in boardsStore', () => {
describe('when activeId is in boardsStore', () => {
beforeEach(() => {
mock = new MockAdapter(axios);
......@@ -161,7 +157,7 @@ describe('BoardSettingsSideBar', () => {
list_type: 'label',
});
createComponent({ activeListId: listId });
createComponent({ activeId: listId });
});
afterEach(() => {
......@@ -177,13 +173,13 @@ describe('BoardSettingsSideBar', () => {
});
});
describe('when activeListId is not in boardsStore', () => {
describe('when activeId is not in boardsStore', () => {
beforeEach(() => {
mock = new MockAdapter(axios);
boardsStore.store.addList({ id: listId, label: { title: labelTitle, color: labelColor } });
createComponent({ activeListId: inactiveListId });
createComponent({ activeId: inactiveId });
});
afterEach(() => {
......@@ -216,7 +212,7 @@ describe('BoardSettingsSideBar', () => {
});
it('renders "None" in the block', () => {
createComponent({ activeListId: listId });
createComponent({ activeId: listId });
expect(wrapper.find('.js-wip-limit').text()).toMatchSnapshot();
});
......@@ -242,13 +238,13 @@ describe('BoardSettingsSideBar', () => {
});
it('renders the correct milestone text', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find('.js-milestone').text()).toMatchSnapshot();
});
it('renders the correct list type text', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find('.js-list-label').text()).toMatchSnapshot();
});
......@@ -270,14 +266,14 @@ describe('BoardSettingsSideBar', () => {
});
it('renders gl-avatar-link with correct href', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find(GlAvatarLink).exists()).toBe(true);
expect(wrapper.find(GlAvatarLink).attributes('href')).toEqual('https://gitlab.com/root');
});
it('renders gl-avatar-labeled with "root" as username and name as "Test"', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find(GlAvatarLabeled).exists()).toBe(true);
expect(wrapper.find(GlAvatarLabeled).attributes('label')).toEqual('Test');
......@@ -285,7 +281,7 @@ describe('BoardSettingsSideBar', () => {
});
it('renders the correct list type text', () => {
createComponent({ activeListId: 1 });
createComponent({ activeId: 1 });
expect(wrapper.find('.js-list-label').text()).toMatchSnapshot();
});
......@@ -303,7 +299,7 @@ describe('BoardSettingsSideBar', () => {
list_type: 'label',
});
createComponent({ activeListId: num });
createComponent({ activeId: num });
expect(wrapper.find('.js-wip-limit').text()).toMatchSnapshot();
});
......@@ -320,7 +316,7 @@ describe('BoardSettingsSideBar', () => {
list_type: 'label',
});
createComponent({ activeListId: listId }, { updateListWipLimit: () => {} });
createComponent({ activeId: listId }, { updateListWipLimit: () => {} });
});
it('renders an input', () => {
......@@ -364,7 +360,7 @@ describe('BoardSettingsSideBar', () => {
config: { data: JSON.stringify({ list: { max_issue_count: 0 } }) },
});
createComponent({ activeListId: listId }, { updateListWipLimit: spy });
createComponent({ activeId: listId }, { updateListWipLimit: spy });
});
it('resets wipLimit to 0', () => {
......@@ -388,7 +384,7 @@ describe('BoardSettingsSideBar', () => {
list_type: 'label',
});
createComponent({ activeListId: listId }, { updateListWipLimit: () => {} });
createComponent({ activeId: listId }, { updateListWipLimit: () => {} });
});
it('does not render the remove limit button', () => {
......@@ -425,7 +421,7 @@ describe('BoardSettingsSideBar', () => {
config: { data: JSON.stringify({ list: { max_issue_count: '4' } }) },
});
createComponent(
{ activeListId: 1 },
{ activeId: 1 },
{ updateListWipLimit: spy },
{ edit: true, currentWipLimit },
);
......@@ -441,7 +437,7 @@ describe('BoardSettingsSideBar', () => {
it('doesnt call updateListWipLimit', () => {
const spy = jest.fn().mockResolvedValue({});
createComponent(
{ activeListId: 1 },
{ activeId: 1 },
{ updateListWipLimit: spy },
{ edit: true, currentWipLimit: 2 },
);
......@@ -458,7 +454,7 @@ describe('BoardSettingsSideBar', () => {
it('doesnt call updateListWipLimit', () => {
const spy = jest.fn().mockResolvedValue({});
createComponent(
{ activeListId: 1 },
{ activeId: 1 },
{ updateListWipLimit: spy },
{ edit: true, currentWipLimit: null },
);
......@@ -477,7 +473,7 @@ describe('BoardSettingsSideBar', () => {
beforeEach(() => {
const spy = jest.fn().mockResolvedValue({});
createComponent(
{ activeListId: 1 },
{ activeId: 1 },
{ updateListWipLimit: spy },
{ edit: true, currentWipLimit: maxIssueCount },
);
......@@ -508,8 +504,8 @@ describe('BoardSettingsSideBar', () => {
beforeEach(() => {
const spy = jest.fn().mockRejectedValue();
createComponent(
{ activeListId: 1 },
{ updateListWipLimit: spy, setActiveListId: () => {} },
{ activeId: 1 },
{ updateListWipLimit: spy, setActiveId: () => {} },
{ edit: true, currentWipLimit },
);
......@@ -527,7 +523,7 @@ describe('BoardSettingsSideBar', () => {
describe('passing of props to gl-form-input', () => {
beforeEach(() => {
createComponent({ activeListId: listId }, { updateListWipLimit: () => {} }, { edit: true });
createComponent({ activeId: listId }, { updateListWipLimit: () => {} }, { edit: true });
});
it('passes `trim`', () => {
......
......@@ -3,7 +3,7 @@ import boardsStoreEE from 'ee/boards/stores/boards_store_ee';
import actions from 'ee/boards/stores/actions';
import * as types from 'ee/boards/stores/mutation_types';
import testAction from 'helpers/vuex_action_helper';
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
jest.mock('axios');
......@@ -30,14 +30,14 @@ describe('setShowLabels', () => {
});
});
describe('setActiveListId', () => {
describe('setActiveId', () => {
it('should commit mutation SET_ACTIVE_LIST_ID', done => {
const state = {
activeListId: inactiveListId,
activeId: inactiveId,
};
testAction(
actions.setActiveListId,
actions.setActiveId,
1,
state,
[{ type: types.SET_ACTIVE_LIST_ID, payload: 1 }],
......@@ -63,11 +63,11 @@ describe('updateListWipLimit', () => {
it('should call the correct url', () => {
axios.put.mockResolvedValue({ data: {} });
const maxIssueCount = 0;
const activeListId = 1;
const activeId = 1;
return actions.updateListWipLimit({ state: { activeListId } }, { maxIssueCount }).then(() => {
return actions.updateListWipLimit({ state: { activeId } }, { maxIssueCount }).then(() => {
expect(axios.put).toHaveBeenCalledWith(
`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeListId}`,
`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeId}`,
{ list: { max_issue_count: maxIssueCount } },
);
});
......
import mutations from 'ee/boards/stores/mutations';
import { inactiveListId } from '~/boards/constants';
import { inactiveId } from '~/boards/constants';
import { mockLists, mockEpics } from '../mock_data';
const expectNotImplemented = action => {
......@@ -24,12 +24,12 @@ describe('SET_ACTIVE_LIST_ID', () => {
it('updates aciveListId to be the value that is passed', () => {
const expectedId = 1;
const state = {
activeListId: inactiveListId,
activeId: inactiveId,
};
mutations.SET_ACTIVE_LIST_ID(state, expectedId);
expect(state.activeListId).toBe(expectedId);
expect(state.activeId).toBe(expectedId);
});
});
......
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