diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-24 12:09:42 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-24 12:09:42 +0000 |
commit | 729e3765d5feb762df1ccfbc228a8dd4662aa3f9 (patch) | |
tree | f326420fc64999c6bcc28816ed54f0972fb46459 /app/assets | |
parent | 6f7881ee9dcec34141a8f34fc814b56b366d2b48 (diff) | |
download | gitlab-ce-729e3765d5feb762df1ccfbc228a8dd4662aa3f9.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets')
9 files changed, 146 insertions, 55 deletions
diff --git a/app/assets/javascripts/notes/components/discussion_counter.vue b/app/assets/javascripts/notes/components/discussion_counter.vue index 577612de06a..c28ac94b3ed 100644 --- a/app/assets/javascripts/notes/components/discussion_counter.vue +++ b/app/assets/javascripts/notes/components/discussion_counter.vue @@ -1,5 +1,5 @@ <script> -import { mapGetters } from 'vuex'; +import { mapGetters, mapActions } from 'vuex'; import { GlTooltipDirective } from '@gitlab/ui'; import Icon from '~/vue_shared/components/icon.vue'; import discussionNavigation from '../mixins/discussion_navigation'; @@ -18,13 +18,11 @@ export default { 'getNoteableData', 'resolvableDiscussionsCount', 'unresolvedDiscussionsCount', + 'discussions', ]), isLoggedIn() { return this.getUserData.id; }, - hasNextButton() { - return this.isLoggedIn && !this.allResolved; - }, allResolved() { return this.unresolvedDiscussionsCount === 0; }, @@ -34,6 +32,21 @@ export default { resolvedDiscussionsCount() { return this.resolvableDiscussionsCount - this.unresolvedDiscussionsCount; }, + toggeableDiscussions() { + return this.discussions.filter(discussion => !discussion.individual_note); + }, + allExpanded() { + return this.toggeableDiscussions.every(discussion => discussion.expanded); + }, + }, + methods: { + ...mapActions(['setExpandDiscussions']), + handleExpandDiscussions() { + this.setExpandDiscussions({ + discussionIds: this.toggeableDiscussions.map(discussion => discussion.id), + expanded: !this.allExpanded, + }); + }, }, }; </script> @@ -44,8 +57,8 @@ export default { ref="discussionCounter" class="line-resolve-all-container full-width-mobile" > - <div class="full-width-mobile d-flex d-sm-block"> - <div :class="{ 'has-next-btn': hasNextButton }" class="line-resolve-all"> + <div class="full-width-mobile d-flex d-sm-flex"> + <div class="line-resolve-all"> <span :class="{ 'is-active': allResolved }" class="line-resolve-btn is-disabled" @@ -75,7 +88,7 @@ export default { <div v-if="isLoggedIn && !allResolved" class="btn-group btn-group-sm" role="group"> <button v-gl-tooltip - title="Jump to next unresolved thread" + :title="__('Jump to next unresolved thread')" class="btn btn-default discussion-next-btn" data-track-event="click_button" data-track-label="mr_next_unresolved_thread" @@ -85,6 +98,16 @@ export default { <icon name="comment-next" /> </button> </div> + <div v-if="isLoggedIn" class="btn-group btn-group-sm" role="group"> + <button + v-gl-tooltip + :title="__('Toggle all threads')" + class="btn btn-default toggle-all-discussions-btn" + @click="handleExpandDiscussions" + > + <icon :name="allExpanded ? 'angle-up' : 'angle-down'" /> + </button> + </div> </div> </div> </template> diff --git a/app/assets/javascripts/notes/stores/actions.js b/app/assets/javascripts/notes/stores/actions.js index 2e6719bb4fb..accc37121d0 100644 --- a/app/assets/javascripts/notes/stores/actions.js +++ b/app/assets/javascripts/notes/stores/actions.js @@ -46,6 +46,10 @@ export const setNotesFetchedState = ({ commit }, state) => export const toggleDiscussion = ({ commit }, data) => commit(types.TOGGLE_DISCUSSION, data); +export const setExpandDiscussions = ({ commit }, { discussionIds, expanded }) => { + commit(types.SET_EXPAND_DISCUSSIONS, { discussionIds, expanded }); +}; + export const fetchDiscussions = ({ commit, dispatch }, { path, filter, persistFilter }) => { const config = filter !== undefined @@ -54,6 +58,7 @@ export const fetchDiscussions = ({ commit, dispatch }, { path, filter, persistFi return axios.get(path, config).then(({ data }) => { commit(types.SET_INITIAL_DISCUSSIONS, data); + dispatch('updateResolvableDiscussionsCounts'); }); }; diff --git a/app/assets/javascripts/notes/stores/mutation_types.js b/app/assets/javascripts/notes/stores/mutation_types.js index 6554aee0d5b..0cc59f9150c 100644 --- a/app/assets/javascripts/notes/stores/mutation_types.js +++ b/app/assets/javascripts/notes/stores/mutation_types.js @@ -24,6 +24,7 @@ export const REMOVE_CONVERTED_DISCUSSION = 'REMOVE_CONVERTED_DISCUSSION'; export const COLLAPSE_DISCUSSION = 'COLLAPSE_DISCUSSION'; export const EXPAND_DISCUSSION = 'EXPAND_DISCUSSION'; export const TOGGLE_DISCUSSION = 'TOGGLE_DISCUSSION'; +export const SET_EXPAND_DISCUSSIONS = 'SET_EXPAND_DISCUSSIONS'; export const UPDATE_RESOLVABLE_DISCUSSIONS_COUNTS = 'UPDATE_RESOLVABLE_DISCUSSIONS_COUNTS'; export const SET_CURRENT_DISCUSSION_ID = 'SET_CURRENT_DISCUSSION_ID'; diff --git a/app/assets/javascripts/notes/stores/mutations.js b/app/assets/javascripts/notes/stores/mutations.js index c23ef93c056..68bf8394508 100644 --- a/app/assets/javascripts/notes/stores/mutations.js +++ b/app/assets/javascripts/notes/stores/mutations.js @@ -190,6 +190,15 @@ export default { }); }, + [types.SET_EXPAND_DISCUSSIONS](state, { discussionIds, expanded }) { + if (discussionIds?.length) { + discussionIds.forEach(discussionId => { + const discussion = utils.findNoteObjectById(state.discussions, discussionId); + Object.assign(discussion, { expanded }); + }); + } + }, + [types.UPDATE_NOTE](state, note) { const noteObj = utils.findNoteObjectById(state.discussions, note.discussion_id); diff --git a/app/assets/javascripts/releases/components/evidence_block.vue b/app/assets/javascripts/releases/components/evidence_block.vue index 0c51fffc96c..59c1b3eb48e 100644 --- a/app/assets/javascripts/releases/components/evidence_block.vue +++ b/app/assets/javascripts/releases/components/evidence_block.vue @@ -1,8 +1,9 @@ <script> -import { GlLink, GlTooltipDirective } from '@gitlab/ui'; +import dateFormat from 'dateformat'; +import { GlLink, GlTooltipDirective, GlIcon } from '@gitlab/ui'; import { __, sprintf } from '~/locale'; import { truncateSha } from '~/lib/utils/text_utility'; -import Icon from '~/vue_shared/components/icon.vue'; +import { getTimeago } from '~/lib/utils/datetime_utility'; import ClipboardButton from '~/vue_shared/components/clipboard_button.vue'; import ExpandButton from '~/vue_shared/components/expand_button.vue'; @@ -12,7 +13,7 @@ export default { ClipboardButton, ExpandButton, GlLink, - Icon, + GlIcon, }, directives: { GlTooltip: GlTooltipDirective, @@ -24,17 +25,33 @@ export default { }, }, computed: { - evidenceTitle() { - return sprintf(__('%{tag}-evidence.json'), { tag: this.release.tagName }); + evidences() { + return this.release.evidences; }, - evidenceUrl() { - return this.release.assets && this.release.assets.evidenceFilePath; + }, + methods: { + evidenceTitle(index) { + const [tag, evidence, filename] = this.release.evidences[index].filepath.split('/').slice(-3); + return sprintf(__('%{tag}-%{evidence}-%{filename}'), { tag, evidence, filename }); + }, + evidenceUrl(index) { + return this.release.evidences[index].filepath; + }, + sha(index) { + return this.release.evidences[index].sha; }, - shortSha() { - return truncateSha(this.sha); + shortSha(index) { + return truncateSha(this.release.evidences[index].sha); }, - sha() { - return this.release.evidenceSha; + collectedAt(index) { + return dateFormat(this.release.evidences[index].collectedAt, 'mmmm dS, yyyy, h:MM TT'); + }, + timeSummary(index) { + const { format } = getTimeago(); + const summary = sprintf(__(' Collected %{time}'), { + time: format(this.release.evidences[index].collectedAt), + }); + return summary; }, }, }; @@ -43,34 +60,45 @@ export default { <template> <div> <div class="card-text prepend-top-default"> - <b> - {{ __('Evidence collection') }} - </b> + <b>{{ __('Evidence collection') }}</b> </div> - <div class="d-flex align-items-baseline"> - <gl-link - v-gl-tooltip - class="monospace" - :title="__('Download evidence JSON')" - :download="evidenceTitle" - :href="evidenceUrl" - > - <icon name="review-list" class="align-top append-right-4" /><span>{{ evidenceTitle }}</span> - </gl-link> + <div v-for="(evidence, index) in evidences" :key="evidenceTitle(index)" class="mb-2"> + <div class="d-flex align-items-center"> + <gl-link + v-gl-tooltip + class="d-flex align-items-center monospace" + :title="__('Download evidence JSON')" + :download="evidenceTitle(index)" + :href="evidenceUrl(index)" + > + <gl-icon name="review-list" class="align-middle append-right-8" /> + <span>{{ evidenceTitle(index) }}</span> + </gl-link> + + <expand-button> + <template slot="short"> + <span class="js-short monospace">{{ shortSha(index) }}</span> + </template> + <template slot="expanded"> + <span class="js-expanded monospace gl-pl-1">{{ sha(index) }}</span> + </template> + </expand-button> + <clipboard-button + :title="__('Copy evidence SHA')" + :text="sha(index)" + css-class="btn-default btn-transparent btn-clipboard" + /> + </div> - <expand-button> - <template slot="short"> - <span class="js-short monospace">{{ shortSha }}</span> - </template> - <template slot="expanded"> - <span class="js-expanded monospace gl-pl-1">{{ sha }}</span> - </template> - </expand-button> - <clipboard-button - :title="__('Copy evidence SHA')" - :text="sha" - css-class="btn-default btn-transparent btn-clipboard" - /> + <div class="d-flex align-items-center text-muted"> + <gl-icon + v-gl-tooltip + name="clock" + class="align-middle append-right-8" + :title="collectedAt(index)" + /> + <span>{{ timeSummary(index) }}</span> + </div> </div> </div> </template> diff --git a/app/assets/javascripts/releases/components/release_block.vue b/app/assets/javascripts/releases/components/release_block.vue index 61cd22dc161..515aa629476 100644 --- a/app/assets/javascripts/releases/components/release_block.vue +++ b/app/assets/javascripts/releases/components/release_block.vue @@ -44,7 +44,7 @@ export default { return this.release.assets || {}; }, hasEvidence() { - return Boolean(this.release.evidenceSha); + return Boolean(this.release.evidences && this.release.evidences.length); }, milestones() { return this.release.milestones || []; diff --git a/app/assets/stylesheets/framework/gitlab_theme.scss b/app/assets/stylesheets/framework/gitlab_theme.scss index 418eafa153c..d0c3de59937 100644 --- a/app/assets/stylesheets/framework/gitlab_theme.scss +++ b/app/assets/stylesheets/framework/gitlab_theme.scss @@ -68,6 +68,23 @@ .header-user-avatar { border-color: $search-and-nav-links; } + + .header-user-notification-dot { + border: 2px solid $nav-svg-color; + } + } + + &:focus:hover, + &:focus { + &.header-user-dropdown-toggle .header-user-notification-dot { + border-color: $white-light; + } + } + + &:hover { + &.header-user-dropdown-toggle .header-user-notification-dot { + border-color: $nav-svg-color + 33; + } } &:hover, diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss index 5ae4f72de56..dd338a7134b 100644 --- a/app/assets/stylesheets/framework/header.scss +++ b/app/assets/stylesheets/framework/header.scss @@ -567,6 +567,14 @@ border: 1px solid $gray-normal; } +.header-user-notification-dot { + background-color: $orange-500; + height: 10px; + width: 10px; + right: 8px; + top: -8px; +} + .with-performance-bar .navbar-gitlab { top: $performance-bar-height; } diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index aaecbd6ff00..f2b8433a995 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -842,11 +842,11 @@ $note-form-margin-left: 72px; white-space: nowrap; } - .btn-group { - margin-left: -4px; + .discussion-next-btn { + border-radius: 0; } - .discussion-next-btn { + .toggle-all-discussions-btn { border-top-left-radius: 0; border-bottom-left-radius: 0; } @@ -859,7 +859,6 @@ $note-form-margin-left: 72px; } &.discussion-create-issue-btn { - margin-left: -4px; border-radius: 0; border-right: 0; @@ -873,6 +872,10 @@ $note-form-margin-left: 72px; } } } + + &.discussion-next-btn { + border-right: 0; + } } } @@ -884,12 +887,9 @@ $note-form-margin-left: 72px; border: 1px solid $border-color; border-radius: $border-radius-default; font-size: $gl-btn-small-font-size; - - &.has-next-btn { - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right: 0; - } + border-top-right-radius: 0; + border-bottom-right-radius: 0; + border-right: 0; .line-resolve-btn { margin-right: 5px; |