From d24e47a983fd074fade60f44889bb304bf274d0d Mon Sep 17 00:00:00 2001 From: Fatih Acet <acetfatih@gmail.com> Date: Wed, 28 Jun 2017 23:53:46 +0300 Subject: [PATCH] IssueDiscussionsRefactor: Do changes after data format change and fix dummy data. --- .../notes/components/issue_comment_form.vue | 38 +++++++++---------- .../notes/components/issue_discussion.vue | 14 +++---- .../notes/components/issue_note.vue | 4 +- .../components/issue_note_awards_list.vue | 4 +- .../notes/stores/issue_notes_store.js | 17 +++++++-- 5 files changed, 43 insertions(+), 34 deletions(-) diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue index b8df6359c1..ee873ba4b7 100644 --- a/app/assets/javascripts/notes/components/issue_comment_form.vue +++ b/app/assets/javascripts/notes/components/issue_comment_form.vue @@ -7,23 +7,17 @@ import MarkdownField from '../../vue_shared/components/markdown/field.vue'; export default { props: {}, data() { + const { create_note_path, state } = window.gl.issueData; + const { currentUserData } = window.gl; + return { note: '', markdownPreviewUrl: '', markdownDocsUrl: '', - - // FIXME: @fatihacet - Fix the mock data below. noteType: 'comment', - issueState: 'open', - endpoint: '/gitlab-org/gitlab-ce/notes', - author: { - avatar_url: 'http://www.gravatar.com/avatar/e64c7d89f26bd1972efa854d13d7dd61?s=80&d=identicon', - id: 1, - name: 'Administrator', - path: '/root', - state: 'active', - username: 'root', - }, + issueState: state, + endpoint: create_note_path, + author: currentUserData, }; }, components: { @@ -47,13 +41,12 @@ export default { methods: { handleSave() { const data = { - endpoint: `${this.endpoint}?full_data=1`, + endpoint: this.endpoint, noteData: { - target_type: 'issue', - target_id: '89', + full_data: true, note: { noteable_type: 'Issue', - noteable_id: 89, + noteable_id: window.gl.issueData.id, note: this.note, } }, @@ -64,12 +57,14 @@ export default { } this.$store.dispatch('createNewNote', data) - .then(() => { + .then((res) => { + if (res.errors) { + return this.handleError(); + } + this.discard(); }) - .catch(() => { - new Flash('Something went wrong while adding your comment. Please try again.'); // eslint-disable-line - }); + .catch(this.handleError); }, discard() { this.note = ''; @@ -78,6 +73,9 @@ export default { setNoteType(type) { this.noteType = type; }, + handleError() { + new Flash('Something went wrong while adding your comment. Please try again.'); // eslint-disable-line + }, }, mounted() { const issuableDataEl = document.getElementById('js-issuable-app-initial-data'); diff --git a/app/assets/javascripts/notes/components/issue_discussion.vue b/app/assets/javascripts/notes/components/issue_discussion.vue index f2ab8ba278..cf4f63968e 100644 --- a/app/assets/javascripts/notes/components/issue_discussion.vue +++ b/app/assets/javascripts/notes/components/issue_discussion.vue @@ -19,7 +19,7 @@ export default { return { registerLink: '#', signInLink: '#', - newNotePath: '', + newNotePath: window.gl.issueData.create_note_path, isReplying: false, }; }, @@ -30,6 +30,9 @@ export default { author() { return this.discussion.author; }, + canReply() { + return window.gl.issueData.current_user.can_create_note; + }, }, components: { IssueNote, @@ -48,10 +51,6 @@ export default { this.registerLink = registerLink.getAttribute('href'); this.signInLink = signInLink.getAttribute('href'); } - - // TODO: @fatihacet - Reimplement this when we have data for it. - // const newNotePath = document.querySelector('.js-main-target-form').getAttribute('action'); - // this.newNotePath = `${newNotePath}?full_data=1`; }, methods: { toggleDiscussion() { @@ -73,6 +72,7 @@ export default { target_type: 'issue', target_id: this.discussion.noteable_id, note: { note }, + full_data: true, }, }; @@ -130,7 +130,7 @@ export default { <div class="flash-container"></div> <div class="discussion-reply-holder"> <button - v-if="note.can_reply && !isReplying" + v-if="canReply && !isReplying" @click="showReplyForm" type="button" class="btn btn-text-field" @@ -141,7 +141,7 @@ export default { :updateHandler="saveReply" :cancelHandler="cancelReplyForm" /> <div - v-if="!note.can_reply" + v-if="!canReply" class="disabled-comment text-center"> Please <a :href="registerLink">register</a> diff --git a/app/assets/javascripts/notes/components/issue_note.vue b/app/assets/javascripts/notes/components/issue_note.vue index eb39cbd5e7..9a7ad1db7b 100644 --- a/app/assets/javascripts/notes/components/issue_note.vue +++ b/app/assets/javascripts/notes/components/issue_note.vue @@ -104,8 +104,8 @@ export default { <issue-note-actions :accessLevel="note.human_access" :canAward="note.emoji_awardable" - :canEdit="note.can_edit" - :canDelete="note.can_edit" + :canEdit="note.current_user.can_edit" + :canDelete="note.current_user.can_edit" :reportAbusePath="note.report_abuse_path" :editHandler="editHandler" :deleteHandler="deleteHandler" /> diff --git a/app/assets/javascripts/notes/components/issue_note_awards_list.vue b/app/assets/javascripts/notes/components/issue_note_awards_list.vue index f0e499aa47..2fc50c05c7 100644 --- a/app/assets/javascripts/notes/components/issue_note_awards_list.vue +++ b/app/assets/javascripts/notes/components/issue_note_awards_list.vue @@ -1,5 +1,5 @@ <script> -import { glEmojiTag } from '~/behaviors/gl_emoji'; +import * as Emoji from '../../emoji'; import emojiSmiling from 'icons/_emoji_slightly_smiling_face.svg'; import emojiSmile from 'icons/_emoji_smile.svg'; import emojiSmiley from 'icons/_emoji_smiley.svg'; @@ -66,7 +66,7 @@ export default { }, methods: { getAwardHTML(name) { - return glEmojiTag(name); + return Emoji.glEmojiTag(name); }, getAwardClassBindings(awardList, awardName) { return { diff --git a/app/assets/javascripts/notes/stores/issue_notes_store.js b/app/assets/javascripts/notes/stores/issue_notes_store.js index 8881ba2aa9..9914b001c2 100644 --- a/app/assets/javascripts/notes/stores/issue_notes_store.js +++ b/app/assets/javascripts/notes/stores/issue_notes_store.js @@ -53,8 +53,16 @@ const mutations = { } }, addNewNote(storeState, note) { - // TODO: @fatihacet - When we get the correct data from server update the store - // storeState.notes.push(note); + const { discussion_id, type } = note; + const noteData = { + expanded: true, + id: discussion_id, + individual_note: !(type === 'DiscussionNote'), + notes: [ note ], + reply_id: discussion_id, + }; + + storeState.notes.push(noteData); }, }; @@ -100,7 +108,10 @@ const actions = { .createNewNote(endpoint, noteData) .then(res => res.json()) .then((res) => { - context.commit('addNewNote', res); + if (!res.errors) { + context.commit('addNewNote', res); + } + return res; }); }, }; -- 2.30.9