diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-02 00:09:29 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-02 00:09:29 +0300 |
commit | 1f96548c39f3f9b03d1b2156e7cb707e748193d8 (patch) | |
tree | 119c750ef16ffcf90f82f0a62931de193ccc8699 /app | |
parent | 102255f6d4209b9ee54c6f36d9391aae0a4b0dfb (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app')
7 files changed, 118 insertions, 100 deletions
diff --git a/app/assets/javascripts/boards/components/boards_selector.vue b/app/assets/javascripts/boards/components/boards_selector.vue index 0b079c78209..2daec46e64b 100644 --- a/app/assets/javascripts/boards/components/boards_selector.vue +++ b/app/assets/javascripts/boards/components/boards_selector.vue @@ -3,10 +3,10 @@ import { throttle } from 'lodash'; import { GlLoadingIcon, GlSearchBoxByType, - GlDeprecatedDropdown, - GlDeprecatedDropdownDivider, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, + GlDropdown, + GlDropdownDivider, + GlDropdownSectionHeader, + GlDropdownItem, } from '@gitlab/ui'; import httpStatusCodes from '~/lib/utils/http_status'; @@ -26,10 +26,10 @@ export default { BoardForm, GlLoadingIcon, GlSearchBoxByType, - GlDeprecatedDropdown, - GlDeprecatedDropdownDivider, - GlDeprecatedDropdownHeader, - GlDeprecatedDropdownItem, + GlDropdown, + GlDropdownDivider, + GlDropdownSectionHeader, + GlDropdownItem, }, props: { currentBoard: { @@ -235,22 +235,17 @@ export default { <template> <div class="boards-switcher js-boards-selector gl-mr-3"> <span class="boards-selector-wrapper js-boards-selector-wrapper"> - <gl-deprecated-dropdown + <gl-dropdown data-qa-selector="boards_dropdown" toggle-class="dropdown-menu-toggle js-dropdown-toggle" menu-class="flex-column dropdown-extended-height" :text="board.name" @show="loadBoards" > - <div> - <div class="dropdown-title mb-0" @mousedown.prevent> - {{ s__('IssueBoards|Switch board') }} - </div> - </div> - - <gl-deprecated-dropdown-header class="mt-0"> - <gl-search-box-by-type ref="searchBox" v-model="filterTerm" /> - </gl-deprecated-dropdown-header> + <p class="gl-new-dropdown-header-top" @mousedown.prevent> + {{ s__('IssueBoards|Switch board') }} + </p> + <gl-search-box-by-type ref="searchBox" v-model="filterTerm" class="m-2" /> <div v-if="!loading" @@ -259,49 +254,50 @@ export default { class="dropdown-content flex-fill" @scroll.passive="throttledSetScrollFade" > - <gl-deprecated-dropdown-item + <gl-dropdown-item v-show="filteredBoards.length === 0" class="gl-pointer-events-none text-secondary" > {{ s__('IssueBoards|No matching boards found') }} - </gl-deprecated-dropdown-item> + </gl-dropdown-item> - <h6 v-if="showRecentSection" class="dropdown-bold-header my-0"> + <gl-dropdown-section-header v-if="showRecentSection"> {{ __('Recent') }} - </h6> + </gl-dropdown-section-header> <template v-if="showRecentSection"> - <gl-deprecated-dropdown-item + <gl-dropdown-item v-for="recentBoard in recentBoards" :key="`recent-${recentBoard.id}`" class="js-dropdown-item" :href="`${boardBaseUrl}/${recentBoard.id}`" > {{ recentBoard.name }} - </gl-deprecated-dropdown-item> + </gl-dropdown-item> </template> - <hr v-if="showRecentSection" class="my-1" /> + <gl-dropdown-divider v-if="showRecentSection" /> - <h6 v-if="showRecentSection" class="dropdown-bold-header my-0"> + <gl-dropdown-section-header v-if="showRecentSection"> {{ __('All') }} - </h6> + </gl-dropdown-section-header> - <gl-deprecated-dropdown-item + <gl-dropdown-item v-for="otherBoard in filteredBoards" :key="otherBoard.id" class="js-dropdown-item" :href="`${boardBaseUrl}/${otherBoard.id}`" > {{ otherBoard.name }} - </gl-deprecated-dropdown-item> - <gl-deprecated-dropdown-item v-if="hasMissingBoards" class="small unclickable"> + </gl-dropdown-item> + + <gl-dropdown-item v-if="hasMissingBoards" class="no-pointer-events"> {{ s__( 'IssueBoards|Some of your boards are hidden, activate a license to see them again.', ) }} - </gl-deprecated-dropdown-item> + </gl-dropdown-item> </div> <div @@ -313,25 +309,25 @@ export default { <gl-loading-icon v-if="loading" /> <div v-if="canAdminBoard"> - <gl-deprecated-dropdown-divider /> + <gl-dropdown-divider /> - <gl-deprecated-dropdown-item + <gl-dropdown-item v-if="multipleIssueBoardsAvailable" data-qa-selector="create_new_board_button" @click.prevent="showPage('new')" > {{ s__('IssueBoards|Create new board') }} - </gl-deprecated-dropdown-item> + </gl-dropdown-item> - <gl-deprecated-dropdown-item + <gl-dropdown-item v-if="showDelete" class="text-danger js-delete-board" @click.prevent="showPage('delete')" > {{ s__('IssueBoards|Delete board') }} - </gl-deprecated-dropdown-item> + </gl-dropdown-item> </div> - </gl-deprecated-dropdown> + </gl-dropdown> <board-form v-if="currentPage" diff --git a/app/assets/javascripts/pages/projects/pipelines/index/index.js b/app/assets/javascripts/pages/projects/pipelines/index/index.js index bed9a751d4c..63b1f2bf975 100644 --- a/app/assets/javascripts/pages/projects/pipelines/index/index.js +++ b/app/assets/javascripts/pages/projects/pipelines/index/index.js @@ -1,60 +1,3 @@ -import Vue from 'vue'; -import { GlToast } from '@gitlab/ui'; -import { doesHashExistInUrl } from '~/lib/utils/url_utility'; -import { - parseBoolean, - historyReplaceState, - buildUrlWithCurrentLocation, -} from '~/lib/utils/common_utils'; -import { __ } from '~/locale'; -import PipelinesStore from '../../../../pipelines/stores/pipelines_store'; -import pipelinesComponent from '../../../../pipelines/components/pipelines_list/pipelines.vue'; -import Translate from '../../../../vue_shared/translate'; +import { initPipelinesIndex } from '~/pipelines/pipelines_index'; -Vue.use(Translate); -Vue.use(GlToast); - -document.addEventListener( - 'DOMContentLoaded', - () => - new Vue({ - el: '#pipelines-list-vue', - components: { - pipelinesComponent, - }, - data() { - return { - store: new PipelinesStore(), - }; - }, - created() { - this.dataset = document.querySelector(this.$options.el).dataset; - - if (doesHashExistInUrl('delete_success')) { - this.$toast.show(__('The pipeline has been deleted')); - historyReplaceState(buildUrlWithCurrentLocation()); - } - }, - render(createElement) { - return createElement('pipelines-component', { - props: { - store: this.store, - endpoint: this.dataset.endpoint, - pipelineScheduleUrl: this.dataset.pipelineScheduleUrl, - helpPagePath: this.dataset.helpPagePath, - emptyStateSvgPath: this.dataset.emptyStateSvgPath, - errorStateSvgPath: this.dataset.errorStateSvgPath, - noPipelinesSvgPath: this.dataset.noPipelinesSvgPath, - autoDevopsPath: this.dataset.helpAutoDevopsPath, - newPipelinePath: this.dataset.newPipelinePath, - canCreatePipeline: parseBoolean(this.dataset.canCreatePipeline), - hasGitlabCi: parseBoolean(this.dataset.hasGitlabCi), - ciLintPath: this.dataset.ciLintPath, - resetCachePath: this.dataset.resetCachePath, - projectId: this.dataset.projectId, - params: JSON.parse(this.dataset.params), - }, - }); - }, - }), -); +initPipelinesIndex(); diff --git a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue index 38d48517bd6..258633e0125 100644 --- a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue +++ b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue @@ -47,7 +47,7 @@ export default { class="dropdown-menu-toggle build-content gl-build-content" > <div class="gl-display-flex gl-align-items-center gl-justify-content-space-between"> - <span class="gl-display-flex gl-align-items-center"> + <span class="gl-display-flex gl-align-items-center gl-w-90"> <ci-icon :status="group.status" :size="24" /> <span class="gl-text-truncate mw-70p gl-pl-3 gl-display-inline-block"> diff --git a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines.vue b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines.vue index 9ee427d01fd..ff27226b408 100644 --- a/app/assets/javascripts/pipelines/components/pipelines_list/pipelines.vue +++ b/app/assets/javascripts/pipelines/components/pipelines_list/pipelines.vue @@ -62,7 +62,7 @@ export default { type: String, required: true, }, - autoDevopsPath: { + autoDevopsHelpPath: { type: String, required: true, }, @@ -342,7 +342,7 @@ export default { :pipelines="state.pipelines" :pipeline-schedule-url="pipelineScheduleUrl" :update-graph-dropdown="updateGraphDropdown" - :auto-devops-help-path="autoDevopsPath" + :auto-devops-help-path="autoDevopsHelpPath" :view-type="viewType" /> </div> diff --git a/app/assets/javascripts/pipelines/pipelines_index.js b/app/assets/javascripts/pipelines/pipelines_index.js new file mode 100644 index 00000000000..4575a99f60f --- /dev/null +++ b/app/assets/javascripts/pipelines/pipelines_index.js @@ -0,0 +1,75 @@ +import Vue from 'vue'; +import { GlToast } from '@gitlab/ui'; +import { __ } from '~/locale'; +import { doesHashExistInUrl } from '~/lib/utils/url_utility'; +import { + parseBoolean, + historyReplaceState, + buildUrlWithCurrentLocation, +} from '~/lib/utils/common_utils'; +import Translate from '~/vue_shared/translate'; +import Pipelines from './components/pipelines_list/pipelines.vue'; +import PipelinesStore from './stores/pipelines_store'; + +Vue.use(Translate); +Vue.use(GlToast); + +export const initPipelinesIndex = (selector = '#pipelines-list-vue') => { + const el = document.querySelector(selector); + if (!el) { + return null; + } + + const { + endpoint, + pipelineScheduleUrl, + helpPagePath, + emptyStateSvgPath, + errorStateSvgPath, + noPipelinesSvgPath, + autoDevopsHelpPath, + newPipelinePath, + canCreatePipeline, + hasGitlabCi, + ciLintPath, + resetCachePath, + projectId, + params, + } = el.dataset; + + return new Vue({ + el, + data() { + return { + store: new PipelinesStore(), + }; + }, + created() { + if (doesHashExistInUrl('delete_success')) { + this.$toast.show(__('The pipeline has been deleted')); + historyReplaceState(buildUrlWithCurrentLocation()); + } + }, + render(createElement) { + return createElement(Pipelines, { + props: { + store: this.store, + endpoint, + pipelineScheduleUrl, + helpPagePath, + emptyStateSvgPath, + errorStateSvgPath, + noPipelinesSvgPath, + autoDevopsHelpPath, + newPipelinePath, + canCreatePipeline: parseBoolean(canCreatePipeline), + hasGitlabCi: parseBoolean(hasGitlabCi), + ciLintPath, + resetCachePath, + projectId, + params: JSON.parse(params), + }, + }); + }, + }); +}; diff --git a/app/assets/stylesheets/page_bundles/pipeline.scss b/app/assets/stylesheets/page_bundles/pipeline.scss index 7b424882ffa..502f5b08522 100644 --- a/app/assets/stylesheets/page_bundles/pipeline.scss +++ b/app/assets/stylesheets/page_bundles/pipeline.scss @@ -139,6 +139,10 @@ width: 186px; } +.gl-w-90 { + width: 90%; +} + .gl-build-content { @include build-content(); } diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml index 6aa1a564499..64ae4ff8daf 100644 --- a/app/views/projects/pipelines/index.html.haml +++ b/app/views/projects/pipelines/index.html.haml @@ -8,7 +8,7 @@ project_id: @project.id, params: params.to_json, "help-page-path" => help_page_path('ci/quick_start/README'), - "help-auto-devops-path" => help_page_path('topics/autodevops/index.md'), + "auto-devops-help-path" => help_page_path('topics/autodevops/index.md'), "pipeline-schedule-url" => pipeline_schedules_path(@project), "empty-state-svg-path" => image_path('illustrations/pipelines_empty.svg'), "error-state-svg-path" => image_path('illustrations/pipelines_failed.svg'), |