diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components')
9 files changed, 73 insertions, 24 deletions
diff --git a/app/assets/javascripts/vue_shared/components/ci_icon.vue b/app/assets/javascripts/vue_shared/components/ci_icon.vue index e6f0a1c69cd..25f80219993 100644 --- a/app/assets/javascripts/vue_shared/components/ci_icon.vue +++ b/app/assets/javascripts/vue_shared/components/ci_icon.vue @@ -22,6 +22,7 @@ import Icon from '../../vue_shared/components/icon.vue'; * - Jobs show view header * - Jobs show view sidebar * - Linked pipelines + * - Extended MR Popover */ const validSizes = [8, 12, 16, 18, 24, 32, 48, 72]; diff --git a/app/assets/javascripts/vue_shared/components/commit.vue b/app/assets/javascripts/vue_shared/components/commit.vue index ee685a4b8cd..3f282138bdf 100644 --- a/app/assets/javascripts/vue_shared/components/commit.vue +++ b/app/assets/javascripts/vue_shared/components/commit.vue @@ -1,5 +1,6 @@ <script> -import { GlTooltipDirective } from '@gitlab/ui'; +import _ from 'underscore'; +import { GlTooltipDirective, GlLink } from '@gitlab/ui'; import UserAvatarLink from './user_avatar/user_avatar_link.vue'; import Icon from '../../vue_shared/components/icon.vue'; @@ -10,6 +11,7 @@ export default { components: { UserAvatarLink, Icon, + GlLink, }, props: { /** @@ -33,6 +35,27 @@ export default { required: false, default: () => ({}), }, + + /** + * If provided, is used the render the MR IID and link + * in place of the branch name. Must contains the + * following properties: + * - iid (number) + * - path (non-empty string) + * + * May optionally contain the following properties: + * - title (string): used in a tooltip if provided + * + * Any additional properties are ignored. + */ + mergeRequestRef: { + type: Object, + required: false, + default: undefined, + validator: ref => + _.isUndefined(ref) || (_.isFinite(ref.iid) && _.isString(ref.path) && !_.isEmpty(ref.path)), + }, + /** * Used to link to the commit sha. */ @@ -70,7 +93,11 @@ export default { required: false, default: () => ({}), }, - showBranch: { + + /** + * Indicates whether or not to show the branch/MR ref info + */ + showRefInfo: { type: Boolean, required: false, default: true, @@ -78,14 +105,12 @@ export default { }, computed: { /** - * Used to verify if all the properties needed to render the commit - * ref section were provided. - * - * @returns {Boolean} + * Determines if we shoud render the ref info section based */ - hasCommitRef() { - return this.commitRef && this.commitRef.name && this.commitRef.ref_url; + shouldShowRefInfo() { + return this.showRefInfo && (this.commitRef || this.mergeRequestRef); }, + /** * Used to verify if all the properties needed to render the commit * author section were provided. @@ -109,18 +134,35 @@ export default { </script> <template> <div class="branch-commit"> - <template v-if="hasCommitRef && showBranch"> + <template v-if="shouldShowRefInfo"> <div class="icon-container"> - <i v-if="tag" class="fa fa-tag" aria-hidden="true"> </i> <icon v-if="!tag" name="fork" /> + <icon v-if="tag" name="tag" /> + <icon v-else-if="mergeRequestRef" name="git-merge" /> + <icon v-else name="branch" /> </div> - <a v-gl-tooltip :href="commitRef.ref_url" :title="commitRef.name" class="ref-name"> + <gl-link + v-if="mergeRequestRef" + v-gl-tooltip + :href="mergeRequestRef.path" + :title="mergeRequestRef.title" + class="ref-name" + > + {{ mergeRequestRef.iid }} + </gl-link> + <gl-link + v-else + v-gl-tooltip + :href="commitRef.ref_url" + :title="commitRef.name" + class="ref-name" + > {{ commitRef.name }} - </a> + </gl-link> </template> <icon name="commit" class="commit-icon js-commit-icon" /> - <a :href="commitUrl" class="commit-sha"> {{ shortSha }} </a> + <gl-link :href="commitUrl" class="commit-sha"> {{ shortSha }} </gl-link> <div class="commit-title flex-truncate-parent"> <span v-if="title" class="flex-truncate-child"> @@ -132,7 +174,7 @@ export default { :tooltip-text="author.username" class="avatar-image-container" /> - <a :href="commitUrl" class="commit-row-message"> {{ title }} </a> + <gl-link :href="commitUrl" class="commit-row-message"> {{ title }} </gl-link> </span> <span v-else> Can't find HEAD commit for this branch </span> </div> diff --git a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue index c9915f7d685..5fdc915fffb 100644 --- a/app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue +++ b/app/assets/javascripts/vue_shared/components/content_viewer/viewers/markdown_viewer.vue @@ -78,8 +78,8 @@ export default { </script> <template> - <div ref="markdown-preview" class="md md-previewer"> + <div ref="markdown-preview" class="md-previewer"> <gl-skeleton-loading v-if="isLoading" /> - <div v-else v-html="previewContent"></div> + <div v-else class="md" v-html="previewContent"></div> </div> </template> diff --git a/app/assets/javascripts/vue_shared/components/loading_button.vue b/app/assets/javascripts/vue_shared/components/loading_button.vue index 7a53d053eec..216f6c62e69 100644 --- a/app/assets/javascripts/vue_shared/components/loading_button.vue +++ b/app/assets/javascripts/vue_shared/components/loading_button.vue @@ -53,7 +53,7 @@ export default { <template> <button :class="containerClass" :disabled="loading || disabled" type="button" @click="onClick"> - <transition name="fade"> + <transition name="fade-in"> <gl-loading-icon v-if="loading" :inline="true" @@ -63,7 +63,7 @@ export default { class="js-loading-button-icon" /> </transition> - <transition name="fade"> + <transition name="fade-in"> <slot> <span v-if="label" class="js-loading-button-label"> {{ label }} </span> </slot> diff --git a/app/assets/javascripts/vue_shared/components/markdown/field.vue b/app/assets/javascripts/vue_shared/components/markdown/field.vue index 3f607aa2a0a..eccf73e227c 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/field.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/field.vue @@ -189,7 +189,7 @@ export default { <div ref="gl-form" :class="{ 'prepend-top-default append-bottom-default': addSpacingClasses }" - class="md-area js-vue-markdown-field" + class="js-vue-markdown-field md-area position-relative" > <markdown-header :preview-markdown="previewMarkdown" @@ -215,7 +215,7 @@ export default { <div v-show="previewMarkdown" ref="markdown-preview" - class="md-preview js-vue-md-preview md md-preview-holder" + class="js-vue-md-preview md-preview-holder" > <suggestions v-if="hasSuggestion" @@ -233,7 +233,7 @@ export default { <div v-show="previewMarkdown" ref="markdown-preview" - class="md-preview js-vue-md-preview md md-preview-holder" + class="js-vue-md-preview md md-preview-holder" v-html="markdownPreview" ></div> </template> diff --git a/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue b/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue index dcda701f049..177d78cb904 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue @@ -130,6 +130,6 @@ export default { <template> <div> <div class="flash-container js-suggestions-flash"></div> - <div v-show="isRendered" ref="container" v-html="noteHtml"></div> + <div v-show="isRendered" ref="container" class="md" v-html="noteHtml"></div> </div> </template> diff --git a/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue b/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue index 8d3a3009c55..a50f49c1279 100644 --- a/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue +++ b/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue @@ -57,7 +57,7 @@ export default { </div> </div> <div class="note-body"> - <div class="note-text"> + <div class="note-text md"> <p>{{ note.body }}</p> </div> </div> diff --git a/app/assets/javascripts/vue_shared/components/notes/system_note.vue b/app/assets/javascripts/vue_shared/components/notes/system_note.vue index b0af8399955..acc179b3834 100644 --- a/app/assets/javascripts/vue_shared/components/notes/system_note.vue +++ b/app/assets/javascripts/vue_shared/components/notes/system_note.vue @@ -93,7 +93,7 @@ export default { 'system-note-commit-list': hasMoreCommits, 'hide-shade': expanded, }" - class="note-text" + class="note-text md" v-html="note.note_html" ></div> <div v-if="hasMoreCommits" class="flex-list"> diff --git a/app/assets/javascripts/vue_shared/components/svg_gradient.vue b/app/assets/javascripts/vue_shared/components/svg_gradient.vue index cca90af275e..5ce45d492f9 100644 --- a/app/assets/javascripts/vue_shared/components/svg_gradient.vue +++ b/app/assets/javascripts/vue_shared/components/svg_gradient.vue @@ -4,10 +4,16 @@ export default { colors: { type: Array, required: true, + validator(value) { + return value.length === 2; + }, }, opacity: { type: Array, required: true, + validator(value) { + return value.length === 2; + }, }, identifierName: { type: String, |