summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorPhil Hughes <me@iamphill.com>2017-10-25 15:45:40 +0000
committerPhil Hughes <me@iamphill.com>2017-10-25 15:45:40 +0000
commit3ddffec0d62146e27298a982a7d2935dbe518fb9 (patch)
tree66e6d8ea771f06ee0c79d0928a74dc68c824e819
parent53ab16f6fff4c73960f3324ac71db2c1a18b7c35 (diff)
parent1ab8aeeefd2ee826485a0be9d1c862782eaba3d4 (diff)
downloadgitlab-ce-3ddffec0d62146e27298a982a7d2935dbe518fb9.tar.gz
Merge branch '38178-fl-mr-notes-components' into 'master'
Moves placeholders components into shared folder with documentation. See merge request gitlab-org/gitlab-ce!14964
-rw-r--r--app/assets/javascripts/notes/components/issue_discussion.vue4
-rw-r--r--app/assets/javascripts/notes/components/issue_notes_app.vue10
-rw-r--r--app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue (renamed from app/assets/javascripts/notes/components/issue_placeholder_note.vue)21
-rw-r--r--app/assets/javascripts/vue_shared/components/notes/placeholder_system_note.vue (renamed from app/assets/javascripts/notes/components/issue_placeholder_system_note.vue)8
-rw-r--r--app/assets/javascripts/vue_shared/components/notes/system_note.vue (renamed from app/assets/javascripts/notes/components/issue_system_note.vue)25
-rw-r--r--changelogs/unreleased/38178-fl-mr-notes-components.yml6
-rw-r--r--spec/javascripts/notes/components/issue_placeholder_system_note_spec.js24
-rw-r--r--spec/javascripts/vue_shared/components/notes/placeholder_note_spec.js (renamed from spec/javascripts/notes/components/issue_placeholder_note_spec.js)4
-rw-r--r--spec/javascripts/vue_shared/components/notes/placeholder_system_note_spec.js25
-rw-r--r--spec/javascripts/vue_shared/components/notes/system_note_spec.js (renamed from spec/javascripts/notes/components/issue_system_note_spec.js)6
10 files changed, 94 insertions, 39 deletions
diff --git a/app/assets/javascripts/notes/components/issue_discussion.vue b/app/assets/javascripts/notes/components/issue_discussion.vue
index baf43190d9e..0f13221b81e 100644
--- a/app/assets/javascripts/notes/components/issue_discussion.vue
+++ b/app/assets/javascripts/notes/components/issue_discussion.vue
@@ -9,8 +9,8 @@
import issueNoteSignedOutWidget from './issue_note_signed_out_widget.vue';
import issueNoteEditedText from './issue_note_edited_text.vue';
import issueNoteForm from './issue_note_form.vue';
- import placeholderNote from './issue_placeholder_note.vue';
- import placeholderSystemNote from './issue_placeholder_system_note.vue';
+ import placeholderNote from '../../vue_shared/components/notes/placeholder_note.vue';
+ import placeholderSystemNote from '../../vue_shared/components/notes/placeholder_system_note.vue';
import autosave from '../mixins/autosave';
export default {
diff --git a/app/assets/javascripts/notes/components/issue_notes_app.vue b/app/assets/javascripts/notes/components/issue_notes_app.vue
index aecd1f957e5..5c9119644e3 100644
--- a/app/assets/javascripts/notes/components/issue_notes_app.vue
+++ b/app/assets/javascripts/notes/components/issue_notes_app.vue
@@ -5,10 +5,10 @@
import * as constants from '../constants';
import issueNote from './issue_note.vue';
import issueDiscussion from './issue_discussion.vue';
- import issueSystemNote from './issue_system_note.vue';
+ import systemNote from '../../vue_shared/components/notes/system_note.vue';
import issueCommentForm from './issue_comment_form.vue';
- import placeholderNote from './issue_placeholder_note.vue';
- import placeholderSystemNote from './issue_placeholder_system_note.vue';
+ import placeholderNote from '../../vue_shared/components/notes/placeholder_note.vue';
+ import placeholderSystemNote from '../../vue_shared/components/notes/placeholder_system_note.vue';
import loadingIcon from '../../vue_shared/components/loading_icon.vue';
export default {
@@ -37,7 +37,7 @@
components: {
issueNote,
issueDiscussion,
- issueSystemNote,
+ systemNote,
issueCommentForm,
loadingIcon,
placeholderNote,
@@ -68,7 +68,7 @@
}
return placeholderNote;
} else if (note.individual_note) {
- return note.notes[0].system ? issueSystemNote : issueNote;
+ return note.notes[0].system ? systemNote : issueNote;
}
return issueDiscussion;
diff --git a/app/assets/javascripts/notes/components/issue_placeholder_note.vue b/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue
index 6921d91372f..e467ca56704 100644
--- a/app/assets/javascripts/notes/components/issue_placeholder_note.vue
+++ b/app/assets/javascripts/vue_shared/components/notes/placeholder_note.vue
@@ -1,9 +1,26 @@
<script>
+ /**
+ * Common component to render a placeholder note and user information.
+ *
+ * This component needs to be used with a vuex store.
+ * That vuex store needs to have a `getUserData` getter that contains
+ * {
+ * path: String,
+ * avatar_url: String,
+ * name: String,
+ * username: String,
+ * }
+ *
+ * @example
+ * <placeholder-note
+ * :note="{body: 'This is a note'}"
+ * />
+ */
import { mapGetters } from 'vuex';
- import userAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
+ import userAvatarLink from '../user_avatar/user_avatar_link.vue';
export default {
- name: 'issuePlaceholderNote',
+ name: 'placeholderNote',
props: {
note: {
type: Object,
diff --git a/app/assets/javascripts/notes/components/issue_placeholder_system_note.vue b/app/assets/javascripts/vue_shared/components/notes/placeholder_system_note.vue
index 80a8ef56a83..d805fea8006 100644
--- a/app/assets/javascripts/notes/components/issue_placeholder_system_note.vue
+++ b/app/assets/javascripts/vue_shared/components/notes/placeholder_system_note.vue
@@ -1,4 +1,12 @@
<script>
+ /**
+ * Common component to render a placeholder system note.
+ *
+ * @example
+ * <placeholder-system-note
+ * :note="{ body: 'Commands are being applied'}"
+ * />
+ */
export default {
name: 'placeholderSystemNote',
props: {
diff --git a/app/assets/javascripts/notes/components/issue_system_note.vue b/app/assets/javascripts/vue_shared/components/notes/system_note.vue
index 0cfb6522e77..98f8f32557d 100644
--- a/app/assets/javascripts/notes/components/issue_system_note.vue
+++ b/app/assets/javascripts/vue_shared/components/notes/system_note.vue
@@ -1,6 +1,24 @@
<script>
+ /**
+ * Common component to render a system note, icon and user information.
+ *
+ * This component needs to be used with a vuex store.
+ * That vuex store needs to have a `targetNoteHash` getter
+ *
+ * @example
+ * <system-note
+ * :note="{
+ * id: String,
+ * author: Object,
+ * createdAt: String,
+ * note_html: String,
+ * system_note_icon_name: String
+ * }"
+ * />
+ */
import { mapGetters } from 'vuex';
- import issueNoteHeader from './issue_note_header.vue';
+ import issueNoteHeader from '../../../notes/components/issue_note_header.vue';
+ import { spriteIcon } from '../../../lib/utils/common_utils';
export default {
name: 'systemNote',
@@ -24,7 +42,7 @@
return this.targetNoteHash === this.noteAnchorId;
},
iconHtml() {
- return gl.utils.spriteIcon(this.note.system_note_icon_name);
+ return spriteIcon(this.note.system_note_icon_name);
},
},
};
@@ -46,7 +64,8 @@
:author="note.author"
:created-at="note.created_at"
:note-id="note.id"
- :action-text-html="note.note_html" />
+ :action-text-html="note.note_html"
+ />
</div>
</div>
</div>
diff --git a/changelogs/unreleased/38178-fl-mr-notes-components.yml b/changelogs/unreleased/38178-fl-mr-notes-components.yml
new file mode 100644
index 00000000000..244ccfb3071
--- /dev/null
+++ b/changelogs/unreleased/38178-fl-mr-notes-components.yml
@@ -0,0 +1,6 @@
+---
+title: Moves placeholders components into shared folder with documentation. Makes
+ them easier to reuse in MR and Snippets comments
+merge_request:
+author:
+type: other
diff --git a/spec/javascripts/notes/components/issue_placeholder_system_note_spec.js b/spec/javascripts/notes/components/issue_placeholder_system_note_spec.js
deleted file mode 100644
index d508a49f710..00000000000
--- a/spec/javascripts/notes/components/issue_placeholder_system_note_spec.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import Vue from 'vue';
-import placeholderSystemNote from '~/notes/components/issue_placeholder_system_note.vue';
-
-describe('issue placeholder system note component', () => {
- let mountComponent;
- beforeEach(() => {
- const PlaceholderSystemNote = Vue.extend(placeholderSystemNote);
-
- mountComponent = props => new PlaceholderSystemNote({
- propsData: {
- note: {
- body: props,
- },
- },
- }).$mount();
- });
-
- it('should render system note placeholder with plain text', () => {
- const vm = mountComponent('This is a placeholder');
-
- expect(vm.$el.tagName).toEqual('LI');
- expect(vm.$el.querySelector('.timeline-content em').textContent.trim()).toEqual('This is a placeholder');
- });
-});
diff --git a/spec/javascripts/notes/components/issue_placeholder_note_spec.js b/spec/javascripts/vue_shared/components/notes/placeholder_note_spec.js
index 6e5275087f3..ba8ab0b2cd7 100644
--- a/spec/javascripts/notes/components/issue_placeholder_note_spec.js
+++ b/spec/javascripts/vue_shared/components/notes/placeholder_note_spec.js
@@ -1,7 +1,7 @@
import Vue from 'vue';
-import issuePlaceholderNote from '~/notes/components/issue_placeholder_note.vue';
+import issuePlaceholderNote from '~/vue_shared/components/notes/placeholder_note.vue';
import store from '~/notes/stores';
-import { userDataMock } from '../mock_data';
+import { userDataMock } from '../../../notes/mock_data';
describe('issue placeholder system note component', () => {
let vm;
diff --git a/spec/javascripts/vue_shared/components/notes/placeholder_system_note_spec.js b/spec/javascripts/vue_shared/components/notes/placeholder_system_note_spec.js
new file mode 100644
index 00000000000..7b8e6c330c2
--- /dev/null
+++ b/spec/javascripts/vue_shared/components/notes/placeholder_system_note_spec.js
@@ -0,0 +1,25 @@
+import Vue from 'vue';
+import placeholderSystemNote from '~/vue_shared/components/notes/placeholder_system_note.vue';
+import mountComponent from '../../../helpers/vue_mount_component_helper';
+
+describe('placeholder system note component', () => {
+ let PlaceholderSystemNote;
+ let vm;
+
+ beforeEach(() => {
+ PlaceholderSystemNote = Vue.extend(placeholderSystemNote);
+ });
+
+ afterEach(() => {
+ vm.$destroy();
+ });
+
+ it('should render system note placeholder with plain text', () => {
+ vm = mountComponent(PlaceholderSystemNote, {
+ note: { body: 'This is a placeholder' },
+ });
+
+ expect(vm.$el.tagName).toEqual('LI');
+ expect(vm.$el.querySelector('.timeline-content em').textContent.trim()).toEqual('This is a placeholder');
+ });
+});
diff --git a/spec/javascripts/notes/components/issue_system_note_spec.js b/spec/javascripts/vue_shared/components/notes/system_note_spec.js
index c317ce32716..36aaf0a6c2e 100644
--- a/spec/javascripts/notes/components/issue_system_note_spec.js
+++ b/spec/javascripts/vue_shared/components/notes/system_note_spec.js
@@ -1,5 +1,5 @@
import Vue from 'vue';
-import issueSystemNote from '~/notes/components/issue_system_note.vue';
+import issueSystemNote from '~/vue_shared/components/notes/system_note.vue';
import store from '~/notes/stores';
describe('issue system note', () => {
@@ -33,6 +33,10 @@ describe('issue system note', () => {
}).$mount();
});
+ afterEach(() => {
+ vm.$destroy();
+ });
+
it('should render a list item with correct id', () => {
expect(vm.$el.getAttribute('id')).toEqual(`note_${props.note.id}`);
});