diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-07-20 12:26:25 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-07-20 12:26:25 +0000 |
commit | a09983ae35713f5a2bbb100981116d31ce99826e (patch) | |
tree | 2ee2af7bd104d57086db360a7e6d8c9d5d43667a /app/assets/javascripts/issue_show | |
parent | 18c5ab32b738c0b6ecb4d0df3994000482f34bd8 (diff) | |
download | gitlab-ce-a09983ae35713f5a2bbb100981116d31ce99826e.tar.gz |
Add latest changes from gitlab-org/gitlab@13-2-stable-ee
Diffstat (limited to 'app/assets/javascripts/issue_show')
7 files changed, 86 insertions, 30 deletions
diff --git a/app/assets/javascripts/issue_show/components/app.vue b/app/assets/javascripts/issue_show/components/app.vue index 09acfd1cfae..bcf5dc2aaaf 100644 --- a/app/assets/javascripts/issue_show/components/app.vue +++ b/app/assets/javascripts/issue_show/components/app.vue @@ -420,7 +420,7 @@ export default { <transition name="issuable-header-slide"> <div v-if="shouldShowStickyHeader" - class="issue-sticky-header gl-fixed gl-z-index-2 gl-bg-white gl-border-1 gl-border-b-solid gl-border-b-gray-200 gl-py-3" + class="issue-sticky-header gl-fixed gl-z-index-3 gl-bg-white gl-border-1 gl-border-b-solid gl-border-b-gray-100 gl-py-3" data-testid="issue-sticky-header" > <div diff --git a/app/assets/javascripts/issue_show/components/edit_actions.vue b/app/assets/javascripts/issue_show/components/edit_actions.vue index 588ae655de4..4ee44e50d2f 100644 --- a/app/assets/javascripts/issue_show/components/edit_actions.vue +++ b/app/assets/javascripts/issue_show/components/edit_actions.vue @@ -63,7 +63,7 @@ export default { </script> <template> - <div class="prepend-top-default append-bottom-default clearfix"> + <div class="gl-mt-3 gl-mb-3 clearfix"> <button :class="{ disabled: formState.updateLoading || !isSubmitEnabled }" :disabled="formState.updateLoading || !isSubmitEnabled" @@ -81,7 +81,7 @@ export default { v-if="shouldShowDeleteButton" :class="{ disabled: deleteLoading }" :disabled="deleteLoading" - class="btn btn-danger float-right append-right-default qa-delete-button" + class="btn btn-danger float-right gl-mr-3 qa-delete-button" type="button" @click="deleteIssuable" > diff --git a/app/assets/javascripts/issue_show/components/fields/description.vue b/app/assets/javascripts/issue_show/components/fields/description.vue index 35165c9b481..0de0060615b 100644 --- a/app/assets/javascripts/issue_show/components/fields/description.vue +++ b/app/assets/javascripts/issue_show/components/fields/description.vue @@ -55,7 +55,7 @@ export default { class="note-textarea js-gfm-input js-autosize markdown-area qa-description-textarea" dir="auto" - data-supports-quick-actions="false" + data-supports-quick-actions="true" :aria-label="__('Description')" :placeholder="__('Write a comment or drag your files hereā¦')" @keydown.meta.enter="updateIssuable" diff --git a/app/assets/javascripts/issue_show/components/issuable_header_warnings.vue b/app/assets/javascripts/issue_show/components/issuable_header_warnings.vue new file mode 100644 index 00000000000..b6816be9eb8 --- /dev/null +++ b/app/assets/javascripts/issue_show/components/issuable_header_warnings.vue @@ -0,0 +1,28 @@ +<script> +import { mapState } from 'vuex'; +import Icon from '~/vue_shared/components/icon.vue'; + +export default { + components: { + Icon, + }, + computed: { + ...mapState({ + confidential: ({ noteableData }) => noteableData.confidential, + dicussionLocked: ({ noteableData }) => noteableData.discussion_locked, + }), + }, +}; +</script> + +<template> + <div class="gl-display-inline-block"> + <div v-if="confidential" class="issuable-warning-icon inline"> + <icon class="icon" name="eye-slash" data-testid="confidential" /> + </div> + + <div v-if="dicussionLocked" class="issuable-warning-icon inline"> + <icon class="icon" name="lock" data-testid="locked" /> + </div> + </div> +</template> diff --git a/app/assets/javascripts/issue_show/components/pinned_links.vue b/app/assets/javascripts/issue_show/components/pinned_links.vue index 4b50acceb62..a877aa2ac96 100644 --- a/app/assets/javascripts/issue_show/components/pinned_links.vue +++ b/app/assets/javascripts/issue_show/components/pinned_links.vue @@ -1,11 +1,10 @@ <script> -import { GlLink } from '@gitlab/ui'; -import Icon from '~/vue_shared/components/icon.vue'; +import { GlButton } from '@gitlab/ui'; +import { STATUS_PAGE_PUBLISHED, JOIN_ZOOM_MEETING } from '../constants'; export default { components: { - Icon, - GlLink, + GlButton, }, props: { zoomMeetingUrl: { @@ -19,32 +18,46 @@ export default { default: '', }, }, + computed: { + pinnedLinks() { + return [ + { + id: 'publishedIncidentUrl', + url: this.publishedIncidentUrl, + text: STATUS_PAGE_PUBLISHED, + icon: 'tanuki', + }, + { + id: 'zoomMeetingUrl', + url: this.zoomMeetingUrl, + text: JOIN_ZOOM_MEETING, + icon: 'brand-zoom', + }, + ]; + }, + }, + methods: { + needsPaddingClass(i) { + return i < this.pinnedLinks.length - 1; + }, + }, }; </script> <template> <div class="border-bottom gl-mb-6 gl-display-flex gl-justify-content-start"> - <div v-if="publishedIncidentUrl" class="gl-pr-3"> - <gl-link - :href="publishedIncidentUrl" - target="_blank" - class="btn btn-inverted btn-secondary btn-sm text-dark mb-3" - data-testid="publishedIncidentUrl" - > - <icon name="tanuki" :size="14" /> - <strong class="vertical-align-top">{{ __('Published on status page') }}</strong> - </gl-link> - </div> - <div v-if="zoomMeetingUrl"> - <gl-link - :href="zoomMeetingUrl" - target="_blank" - class="btn btn-inverted btn-secondary btn-sm text-dark mb-3" - data-testid="zoomMeetingUrl" - > - <icon name="brand-zoom" :size="14" /> - <strong class="vertical-align-top">{{ __('Join Zoom meeting') }}</strong> - </gl-link> - </div> + <template v-for="(link, i) in pinnedLinks"> + <div v-if="link.url" :key="link.id" :class="{ 'gl-pr-3': needsPaddingClass(i) }"> + <gl-button + :href="link.url" + target="_blank" + :icon="link.icon" + size="small" + class="gl-font-weight-bold gl-mb-5" + :data-testid="link.id" + >{{ link.text }}</gl-button + > + </div> + </template> </div> </template> diff --git a/app/assets/javascripts/issue_show/constants.js b/app/assets/javascripts/issue_show/constants.js index d73cc8cf007..6bc6ed2b372 100644 --- a/app/assets/javascripts/issue_show/constants.js +++ b/app/assets/javascripts/issue_show/constants.js @@ -15,3 +15,6 @@ export const IssuableType = { Epic: 'epic', MergeRequest: 'merge_request', }; + +export const STATUS_PAGE_PUBLISHED = __('Published on status page'); +export const JOIN_ZOOM_MEETING = __('Join Zoom meeting'); diff --git a/app/assets/javascripts/issue_show/index.js b/app/assets/javascripts/issue_show/index.js index e170d338408..fe4ff133145 100644 --- a/app/assets/javascripts/issue_show/index.js +++ b/app/assets/javascripts/issue_show/index.js @@ -1,6 +1,8 @@ import Vue from 'vue'; import issuableApp from './components/app.vue'; +import IssuableHeaderWarnings from './components/issuable_header_warnings.vue'; import { parseIssuableData } from './utils/parse_data'; +import { store } from '~/notes/stores'; export default function initIssueableApp() { return new Vue({ @@ -15,3 +17,13 @@ export default function initIssueableApp() { }, }); } + +export function issuableHeaderWarnings() { + return new Vue({ + el: document.getElementById('js-issuable-header-warnings'), + store, + render(createElement) { + return createElement(IssuableHeaderWarnings); + }, + }); +} |