diff --git a/app/assets/javascripts/boards/icons/fullscreen_collapse.svg b/app/assets/javascripts/boards/icons/fullscreen_collapse.svg deleted file mode 100644 index 6bd773dc4c5..00000000000 --- a/app/assets/javascripts/boards/icons/fullscreen_collapse.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/app/assets/javascripts/boards/icons/fullscreen_expand.svg b/app/assets/javascripts/boards/icons/fullscreen_expand.svg deleted file mode 100644 index 306073b8af2..00000000000 --- a/app/assets/javascripts/boards/icons/fullscreen_expand.svg +++ /dev/null @@ -1 +0,0 @@ - diff --git a/app/assets/javascripts/boards/stores/mutations.js b/app/assets/javascripts/boards/stores/mutations.js index de18ec4b4f3..d60ef459232 100644 --- a/app/assets/javascripts/boards/stores/mutations.js +++ b/app/assets/javascripts/boards/stores/mutations.js @@ -10,11 +10,19 @@ const notImplemented = () => { throw new Error('Not implemented!'); }; -const removeIssueFromList = (state, listId, issueId) => { - Vue.set(state.issuesByListId, listId, pull(state.issuesByListId[listId], issueId)); +const getListById = ({ state, listId }) => { + const listIndex = state.boardLists.findIndex(l => l.id === listId); + const list = state.boardLists[listIndex]; + return { listIndex, list }; }; -const addIssueToList = ({ state, listId, issueId, moveBeforeId, moveAfterId, atIndex }) => { +export const removeIssueFromList = ({ state, listId, issueId }) => { + Vue.set(state.issuesByListId, listId, pull(state.issuesByListId[listId], issueId)); + const { listIndex, list } = getListById({ state, listId }); + Vue.set(state.boardLists, listIndex, { ...list, issuesSize: list.issuesSize - 1 }); +}; + +export const addIssueToList = ({ state, listId, issueId, moveBeforeId, moveAfterId, atIndex }) => { const listIssues = state.issuesByListId[listId]; let newIndex = atIndex || 0; if (moveBeforeId) { @@ -24,6 +32,8 @@ const addIssueToList = ({ state, listId, issueId, moveBeforeId, moveAfterId, atI } listIssues.splice(newIndex, 0, issueId); Vue.set(state.issuesByListId, listId, listIssues); + const { listIndex, list } = getListById({ state, listId }); + Vue.set(state.boardLists, listIndex, { ...list, issuesSize: list.issuesSize + 1 }); }; export default { @@ -142,7 +152,7 @@ export default { const issue = moveIssueListHelper(originalIssue, fromList, toList); Vue.set(state.issues, issue.id, issue); - removeIssueFromList(state, fromListId, issue.id); + removeIssueFromList({ state, listId: fromListId, issueId: issue.id }); addIssueToList({ state, listId: toListId, issueId: issue.id, moveBeforeId, moveAfterId }); }, @@ -157,7 +167,7 @@ export default { ) => { state.error = s__('Boards|An error occurred while moving the issue. Please try again.'); Vue.set(state.issues, originalIssue.id, originalIssue); - removeIssueFromList(state, toListId, originalIssue.id); + removeIssueFromList({ state, listId: toListId, issueId: originalIssue.id }); addIssueToList({ state, listId: fromListId, @@ -187,7 +197,7 @@ export default { [mutationTypes.ADD_ISSUE_TO_LIST_FAILURE]: (state, { list, issue }) => { state.error = s__('Boards|An error occurred while creating the issue. Please try again.'); - removeIssueFromList(state, list.id, issue.id); + removeIssueFromList({ state, listId: list.id, issueId: issue.id }); }, [mutationTypes.SET_CURRENT_PAGE]: () => { diff --git a/app/assets/javascripts/boards/toggle_focus.js b/app/assets/javascripts/boards/toggle_focus.js index e60e7059192..fa13d3a9e3c 100644 --- a/app/assets/javascripts/boards/toggle_focus.js +++ b/app/assets/javascripts/boards/toggle_focus.js @@ -1,13 +1,15 @@ import $ from 'jquery'; import Vue from 'vue'; -import collapseIcon from './icons/fullscreen_collapse.svg'; -import expandIcon from './icons/fullscreen_expand.svg'; +import { GlIcon } from '@gitlab/ui'; export default (ModalStore, boardsStore) => { const issueBoardsContent = document.querySelector('.content-wrapper > .js-focus-mode-board'); return new Vue({ el: document.getElementById('js-toggle-focus-btn'), + components: { + GlIcon, + }, data: { modal: ModalStore.store, store: boardsStore.state, @@ -32,12 +34,7 @@ export default (ModalStore, boardsStore) => { title="Toggle focus mode" ref="toggleFocusModeButton" @click="toggleFocusMode"> - - ${collapseIcon} - - - ${expandIcon} - + `, diff --git a/app/assets/javascripts/environments/components/stop_environment_modal.vue b/app/assets/javascripts/environments/components/stop_environment_modal.vue index 892d0b96da1..f0dafe0620e 100644 --- a/app/assets/javascripts/environments/components/stop_environment_modal.vue +++ b/app/assets/javascripts/environments/components/stop_environment_modal.vue @@ -71,7 +71,7 @@ export default {

{{ s__('Environments|Learn more about stopping environments') }} { * @function * @param {Number} value - Number to format * @param {Number} fractionDigits - precision decimals - * @param {Number} maxLength - Max lenght of formatted number - * if lenght is exceeded, exponential format is used. + * @param {Number} maxLength - Max length of formatted number + * if length is exceeded, exponential format is used. */ return numberFormatter(); } @@ -73,8 +73,8 @@ export const getFormatter = (format = SUPPORTED_FORMATS.engineering) => { * @function * @param {Number} value - Number to format, `1` is rendered as `100%` * @param {Number} fractionDigits - number of precision decimals - * @param {Number} maxLength - Max lenght of formatted number - * if lenght is exceeded, exponential format is used. + * @param {Number} maxLength - Max length of formatted number + * if length is exceeded, exponential format is used. */ return numberFormatter('percent'); } @@ -85,8 +85,8 @@ export const getFormatter = (format = SUPPORTED_FORMATS.engineering) => { * @function * @param {Number} value - Number to format, `100` is rendered as `100%` * @param {Number} fractionDigits - number of precision decimals - * @param {Number} maxLength - Max lenght of formatted number - * if lenght is exceeded, exponential format is used. + * @param {Number} maxLength - Max length of formatted number + * if length is exceeded, exponential format is used. */ return numberFormatter('percent', 1 / 100); } @@ -100,8 +100,8 @@ export const getFormatter = (format = SUPPORTED_FORMATS.engineering) => { * @function * @param {Number} value - Number to format, `1` is rendered as `1s` * @param {Number} fractionDigits - number of precision decimals - * @param {Number} maxLength - Max lenght of formatted number - * if lenght is exceeded, exponential format is used. + * @param {Number} maxLength - Max length of formatted number + * if length is exceeded, exponential format is used. */ return suffixFormatter(s__('Units|s')); } @@ -112,8 +112,8 @@ export const getFormatter = (format = SUPPORTED_FORMATS.engineering) => { * @function * @param {Number} value - Number to format, `1` is formatted as `1ms` * @param {Number} fractionDigits - number of precision decimals - * @param {Number} maxLength - Max lenght of formatted number - * if lenght is exceeded, exponential format is used. + * @param {Number} maxLength - Max length of formatted number + * if length is exceeded, exponential format is used. */ return suffixFormatter(s__('Units|ms')); } diff --git a/app/assets/javascripts/registry/settings/components/registry_settings_app.vue b/app/assets/javascripts/registry/settings/components/registry_settings_app.vue index fcb86fd18f0..264d39a406a 100644 --- a/app/assets/javascripts/registry/settings/components/registry_settings_app.vue +++ b/app/assets/javascripts/registry/settings/components/registry_settings_app.vue @@ -1,6 +1,6 @@