Commit 4cd87594 authored by Florie Guibert's avatar Florie Guibert

Swimlanes - Update list WIP limit

Use graphQL mutation to update list WIP limit in settings sidebar
parent 91bf399d
<script>
import { mapActions, mapState } from 'vuex';
import { mapActions, mapGetters, mapState } from 'vuex';
import { GlButton, GlFormInput } from '@gitlab/ui';
import boardsStoreEE from 'ee/boards/stores/boards_store_ee';
import { deprecatedCreateFlash as flash } from '~/flash';
......@@ -37,6 +37,7 @@ export default {
},
computed: {
...mapState(['activeId']),
...mapGetters(['shouldUseGraphQL']),
wipLimitTypeText() {
return n__('%d issue', '%d issues', this.maxIssueCount);
},
......@@ -75,9 +76,11 @@ export default {
const wipLimit = this.currentWipLimit;
const id = this.activeId;
this.updateListWipLimit({ maxIssueCount: this.currentWipLimit, id })
this.updateListWipLimit({ maxIssueCount: wipLimit, listId: id })
.then(() => {
boardsStoreEE.setMaxIssueCountOnList(id, wipLimit);
if (!this.shouldUseGraphQL) {
boardsStoreEE.setMaxIssueCountOnList(id, wipLimit);
}
})
.catch(() => {
this.unsetActiveId();
......@@ -91,9 +94,11 @@ export default {
}
},
clearWipLimit() {
this.updateListWipLimit({ maxIssueCount: 0, id: this.activeId })
this.updateListWipLimit({ maxIssueCount: 0, listId: this.activeId })
.then(() => {
boardsStoreEE.setMaxIssueCountOnList(this.activeId, inactiveId);
if (!this.shouldUseGraphQL) {
boardsStoreEE.setMaxIssueCountOnList(this.activeId, inactiveId);
}
})
.catch(() => {
this.unsetActiveId();
......
#import "ee_else_ce/boards/queries/board_list.fragment.graphql"
mutation boardListUpdateLimitMetrics($input: BoardListUpdateLimitMetricsInput!) {
boardListUpdateLimitMetrics(input: $input) {
list {
...BoardListFragment
}
errors
}
}
......@@ -27,6 +27,7 @@ import issueSetEpic from '../queries/issue_set_epic.mutation.graphql';
import issueSetWeight from '../queries/issue_set_weight.mutation.graphql';
import listsIssuesQuery from '~/boards/queries/lists_issues.query.graphql';
import issueMoveListMutation from '../queries/issue_move_list.mutation.graphql';
import listUpdateLimitMetrics from '../queries/list_update_limit_metrics.mutation.graphql';
import updateBoardEpicUserPreferencesMutation from '../queries/updateBoardEpicUserPreferences.mutation.graphql';
const notImplemented = () => {
......@@ -184,10 +185,33 @@ export default {
commit(types.SET_SHOW_LABELS, val);
},
updateListWipLimit({ state }, { maxIssueCount }) {
const { activeId } = state;
updateListWipLimit({ commit, getters }, { maxIssueCount, listId }) {
if (getters.shouldUseGraphQL) {
return gqlClient
.mutate({
mutation: listUpdateLimitMetrics,
variables: {
input: {
listId,
maxIssueCount,
},
},
})
.then(({ data }) => {
if (data?.boardListUpdateLimitMetrics?.errors.length) {
commit(types.UPDATE_LIST_FAILURE);
} else {
const list = data.boardListUpdateLimitMetrics?.list;
commit(types.UPDATE_LIST_SUCCESS, {
listId,
list: boardsStore.updateListPosition({ ...list, doNotFetchIssues: true }),
});
}
})
.catch(() => commit(types.UPDATE_LIST_FAILURE));
}
return axios.put(`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeId}`, {
return axios.put(`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${listId}`, {
list: {
max_issue_count: maxIssueCount,
},
......
......@@ -20,6 +20,8 @@ export const RECEIVE_ISSUES_FOR_EPIC_FAILURE = 'RECEIVE_ISSUES_FOR_EPIC_FAILURE'
export const TOGGLE_EPICS_SWIMLANES = 'TOGGLE_EPICS_SWIMLANES';
export const SET_EPICS_SWIMLANES = 'SET_EPICS_SWIMLANES';
export const RECEIVE_BOARD_LISTS_SUCCESS = 'RECEIVE_BOARD_LISTS_SUCCESS';
export const UPDATE_LIST_SUCCESS = 'UPDATE_LIST_SUCCESS';
export const UPDATE_LIST_FAILURE = 'UPDATE_LIST_FAILURE';
export const RECEIVE_SWIMLANES_FAILURE = 'RECEIVE_SWIMLANES_FAILURE';
export const RECEIVE_FIRST_EPICS_SUCCESS = 'RECEIVE_FIRST_EPICS_SUCCESS';
export const RECEIVE_EPICS_SUCCESS = 'RECEIVE_EPICS_SUCCESS';
......
......@@ -67,6 +67,13 @@ export default {
[mutationTypes.TOGGLE_PROMOTION_STATE]: () => {
notImplemented();
},
[mutationTypes.UPDATE_LIST_SUCCESS]: (state, { listId, list }) => {
Vue.set(state.boardLists, listId, list);
},
[mutationTypes.UPDATE_LIST_FAILURE]: state => {
state.error = s__('Boards|An error occurred while updating the list. Please try again.');
},
[mutationTypes.RECEIVE_ISSUES_FOR_LIST_SUCCESS]: (
state,
......
......@@ -49,6 +49,7 @@ describe('BoardSettingsWipLimit', () => {
const store = new Vuex.Store({
state: vuexState,
actions: storeActions,
getters: { shouldUseGraphQL: () => false },
});
wrapper = shallowMount(BoardSettingsWipLimit, {
......
......@@ -244,6 +244,7 @@ describe('setShowLabels', () => {
describe('updateListWipLimit', () => {
let storeMock;
const getters = { shouldUseGraphQL: false };
beforeEach(() => {
storeMock = {
......@@ -262,16 +263,67 @@ describe('updateListWipLimit', () => {
jest.restoreAllMocks();
});
it('should call the correct url', () => {
it('axios - should call the correct url', () => {
const maxIssueCount = 0;
const activeId = 1;
return actions.updateListWipLimit({ state: { activeId } }, { maxIssueCount }).then(() => {
expect(axios.put).toHaveBeenCalledWith(
`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeId}`,
{ list: { max_issue_count: maxIssueCount } },
);
return actions
.updateListWipLimit({ state: { activeId }, getters }, { maxIssueCount, listId: activeId })
.then(() => {
expect(axios.put).toHaveBeenCalledWith(
`${boardsStoreEE.store.state.endpoints.listsEndpoint}/${activeId}`,
{ list: { max_issue_count: maxIssueCount } },
);
});
});
it('graphql - commit UPDATE_LIST_SUCCESS mutation on success', () => {
const maxIssueCount = 0;
const activeId = 1;
getters.shouldUseGraphQL = true;
jest.spyOn(gqlClient, 'mutate').mockResolvedValue({
data: {
boardListUpdateLimitMetrics: {
list: {
id: activeId,
},
errors: [],
},
},
});
return testAction(
actions.updateListWipLimit,
{ maxIssueCount, listId: activeId },
{ isShowingEpicsSwimlanes: true, ...getters },
[
{
type: types.UPDATE_LIST_SUCCESS,
payload: {
listId: activeId,
list: expect.objectContaining({
id: activeId,
}),
},
},
],
[],
);
});
it('graphql - commit UPDATE_LIST_FAILURE mutation on failure', () => {
const maxIssueCount = 0;
const activeId = 1;
getters.shouldUseGraphQL = true;
jest.spyOn(gqlClient, 'mutate').mockResolvedValue(Promise.reject());
return testAction(
actions.updateListWipLimit,
{ maxIssueCount, listId: activeId },
{ isShowingEpicsSwimlanes: true, ...getters },
[{ type: types.UPDATE_LIST_FAILURE }],
[],
);
});
});
......
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