Commit 7a251207 authored by Filipa Lacerda's avatar Filipa Lacerda

[ci skip] Emit events up to prevent accessing refs of refs

parent b45b604d
...@@ -10,12 +10,12 @@ ...@@ -10,12 +10,12 @@
export default { export default {
data() { data() {
const { getUserData, getIssueData } = this.$store.getters; const { getUserData, getIssueData, getNotesData } = this.$store.getters;
return { return {
note: '', note: '',
markdownDocsUrl: getIssueData.markdownDocs, markdownDocsUrl: getNotesData.markdownDocs,
quickActionsDocsUrl: getIssueData.quickActionsDocs, quickActionsDocsUrl: getNotesData.quickActionsDocs,
markdownPreviewUrl: getIssueData.preview_note_path, markdownPreviewUrl: getIssueData.preview_note_path,
noteType: constants.COMMENT, noteType: constants.COMMENT,
issueState: getIssueData.state, issueState: getIssueData.state,
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
this.handleError(); this.handleError();
} }
} else { } else {
this.discard(); return Flash('Something went wrong while adding your comment. Please try again.');
} }
}) })
.catch(() => { .catch(() => {
...@@ -126,9 +126,6 @@ ...@@ -126,9 +126,6 @@
setNoteType(type) { setNoteType(type) {
this.noteType = type; this.noteType = type;
}, },
handleError() {
Flash('Something went wrong while adding your comment. Please try again.');
},
editMyLastNote() { editMyLastNote() {
if (this.note === '') { if (this.note === '') {
const myLastNoteId = $('.js-my-note').last().attr('id'); const myLastNoteId = $('.js-my-note').last().attr('id');
......
...@@ -19,6 +19,7 @@ ...@@ -19,6 +19,7 @@
return { return {
isEditing: false, isEditing: false,
isDeleting: false, isDeleting: false,
currentUserId: window.gon.current_user_id,
}; };
}, },
components: { components: {
...@@ -38,12 +39,12 @@ ...@@ -38,12 +39,12 @@
return { return {
'is-editing': this.isEditing, 'is-editing': this.isEditing,
'disabled-content': this.isDeleting, 'disabled-content': this.isDeleting,
'js-my-note': this.author.id === window.gon.current_user_id, 'js-my-note': this.author.id === this.currentUserId,
target: this.targetNoteHash === this.noteAnchorId, target: this.targetNoteHash === this.noteAnchorId,
}; };
}, },
canReportAsAbuse() { canReportAsAbuse() {
return this.note.report_abuse_path && this.author.id !== window.gon.current_user_id; return this.note.report_abuse_path && this.author.id !== this.currentUserId;
}, },
noteAnchorId() { noteAnchorId() {
return `note_${this.note.id}`; return `note_${this.note.id}`;
...@@ -59,8 +60,8 @@ ...@@ -59,8 +60,8 @@
this.isEditing = true; this.isEditing = true;
}, },
deleteHandler() { deleteHandler() {
const msg = 'Are you sure you want to delete this list?'; // eslint-disable-next-line no-alert
const isConfirmed = confirm(msg); // eslint-disable-line const isConfirmed = confirm('Are you sure you want to delete this list?');
if (isConfirmed) { if (isConfirmed) {
this.isDeleting = true; this.isDeleting = true;
...@@ -88,17 +89,15 @@ ...@@ -88,17 +89,15 @@
this.updateNote(data) this.updateNote(data)
.then(() => { .then(() => {
this.isEditing = false; this.isEditing = false;
// TODO: this could be moved down, by setting a prop
$(this.$refs.noteBody.$el).renderGFM(); $(this.$refs.noteBody.$el).renderGFM();
}) })
.catch(() => Flash('Something went wrong while editing your comment. Please try again.')); .catch(() => Flash('Something went wrong while editing your comment. Please try again.'));
}, },
formCancelHandler(shouldConfirm) { formCancelHandler(shouldConfirm, isDirty) {
if (shouldConfirm && this.$refs.noteBody.$refs.noteForm.isDirty) { if (shouldConfirm && isDirty) {
const msg = 'Are you sure you want to cancel editing this comment?'; // eslint-disable-next-line no-alert
const isConfirmed = confirm(msg); // eslint-disable-line if (!confirm('Are you sure you want to cancel editing this comment?')) return;
if (!isConfirmed) {
return;
}
} }
this.isEditing = false; this.isEditing = false;
...@@ -135,7 +134,7 @@ ...@@ -135,7 +134,7 @@
:author="author" :author="author"
:created-at="note.created_at" :created-at="note.created_at"
:note-id="note.id" :note-id="note.id"
actionText="commented" action-text="commented"
/> />
<issue-note-actions <issue-note-actions
:author-id="author.id" :author-id="author.id"
...@@ -153,8 +152,8 @@ ...@@ -153,8 +152,8 @@
:note="note" :note="note"
:can-edit="note.current_user.can_edit" :can-edit="note.current_user.can_edit"
:is-editing="isEditing" :is-editing="isEditing"
:form-update-handler="formUpdateHandler" @handleFormUpdate="formUpdateHandler"
:form-cancel-handler="formCancelHandler" @cancelFormEdition="formCancelHandler"
ref="noteBody" ref="noteBody"
/> />
</div> </div>
......
...@@ -53,6 +53,7 @@ ...@@ -53,6 +53,7 @@
emojiSmiling, emojiSmiling,
emojiSmile, emojiSmile,
emojiSmiley, emojiSmiley,
currentUserId: window.gon.current_user_id,
}; };
}, },
components: { components: {
...@@ -60,13 +61,13 @@ ...@@ -60,13 +61,13 @@
}, },
computed: { computed: {
shouldShowActionsDropdown() { shouldShowActionsDropdown() {
return window.gon.current_user_id && (this.canEdit || this.canReportAsAbuse); return this.currentUserId && (this.canEdit || this.canReportAsAbuse);
}, },
canAddAwardEmoji() { canAddAwardEmoji() {
return window.gon.current_user_id; return this.currentUserId;
}, },
isAuthoredByMe() { isAuthoredByCurrentUser() {
return this.authorId === window.gon.current_user_id; return this.authorId === this.currentUserId
}, },
}, },
}; };
...@@ -82,7 +83,7 @@ ...@@ -82,7 +83,7 @@
<a <a
v-tooltip v-tooltip
v-if="canAddAwardEmoji" v-if="canAddAwardEmoji"
:class="{ 'js-user-authored': isAuthoredByMe }" :class="{ 'js-user-authored': isAuthoredByCurrentUser }"
class="note-action-button note-emoji-button js-add-award js-note-emoji" class="note-action-button note-emoji-button js-add-award js-note-emoji"
data-position="right" data-position="right"
href="#" href="#"
......
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
}, },
getAwardClassBindings(awardList, awardName) { getAwardClassBindings(awardList, awardName) {
return { return {
active: this.amIAwarded(awardList), active: this.hasReactionByCurrentUser(awardList),
disabled: !this.canInteractWithEmoji(awardList, awardName), disabled: !this.canInteractWithEmoji(awardList, awardName),
}; };
}, },
...@@ -107,18 +107,16 @@ ...@@ -107,18 +107,16 @@
return this.canAward && isAllowed; return this.canAward && isAllowed;
}, },
amIAwarded(awardList) { hasReactionByCurrentUser(awardList) {
const isAwarded = awardList.filter(award => award.user.id === this.myUserId); return awardList.filter(award => award.user.id === this.myUserId).length;
return isAwarded.length;
}, },
awardTitle(awardsList) { awardTitle(awardsList) {
const amIAwarded = this.amIAwarded(awardsList); const hasReactionByCurrentUser = this.hasReactionByCurrentUser(awardsList);
const TOOLTIP_NAME_COUNT = amIAwarded ? 9 : 10; const TOOLTIP_NAME_COUNT = hasReactionByCurrentUser ? 9 : 10;
let awardList = awardsList; let awardList = awardsList;
// Filter myself from list if I am awarded. // Filter myself from list if I am awarded.
if (amIAwarded) { if (hasReactionByCurrentUser) {
awardList = awardList.filter(award => award.user.id !== this.myUserId); awardList = awardList.filter(award => award.user.id !== this.myUserId);
} }
...@@ -129,7 +127,7 @@ ...@@ -129,7 +127,7 @@
const remainingAwardList = awardList.slice(TOOLTIP_NAME_COUNT, awardList.length); const remainingAwardList = awardList.slice(TOOLTIP_NAME_COUNT, awardList.length);
// Add myself to the begining of the list so title will start with You. // Add myself to the begining of the list so title will start with You.
if (amIAwarded) { if (hasReactionByCurrentUser) {
namesToShow.unshift('You'); namesToShow.unshift('You');
} }
......
...@@ -51,11 +51,12 @@ ...@@ -51,11 +51,12 @@
}); });
} }
}, },
handleFormUpdate() { handleFormUpdate(note) {
this.formUpdateHandler({ this.$emit('handleFormUpdate', note);
note: this.$refs.noteForm.note,
});
}, },
formCancelHandler(shouldConfirm, isDirty) {
this.$emit('cancelFormEdition', shouldConfirm, isDirty);
}
}, },
mounted() { mounted() {
this.renderGFM(); this.renderGFM();
...@@ -78,10 +79,11 @@ ...@@ -78,10 +79,11 @@
<issue-note-form <issue-note-form
v-if="isEditing" v-if="isEditing"
ref="noteForm" ref="noteForm"
:update-handler="handleFormUpdate" @handleFormUpdate="handleFormUpdate"
:cancel-handler="formCancelHandler" @cancelFormEdition="formCancelHandler"
:note-body="noteBody" :note-body="noteBody"
:note-id="note.id" /> :note-id="note.id"
/>
<textarea <textarea
v-if="canEdit" v-if="canEdit"
v-model="note.note" v-model="note.note"
...@@ -91,12 +93,14 @@ ...@@ -91,12 +93,14 @@
v-if="note.last_edited_by" v-if="note.last_edited_by"
:edited-at="note.last_edited_at" :edited-at="note.last_edited_at"
:edited-by="note.last_edited_by" :edited-by="note.last_edited_by"
actionText="Edited" /> actionText="Edited"
/>
<issue-note-awards-list <issue-note-awards-list
v-if="note.award_emoji.length" v-if="note.award_emoji.length"
:note-id="note.id" :note-id="note.id"
:note-author-id="note.author.id" :note-author-id="note.author.id"
:awards="note.award_emoji" :awards="note.award_emoji"
:toggle-award-path="note.toggle_award_path" /> :toggle-award-path="note.toggle_award_path"
/>
</div> </div>
</template> </template>
...@@ -13,14 +13,6 @@ ...@@ -13,14 +13,6 @@
type: Number, type: Number,
required: false, required: false,
}, },
updateHandler: {
type: Function,
required: true,
},
cancelHandler: {
type: Function,
required: true,
},
saveButtonTitle: { saveButtonTitle: {
type: String, type: String,
required: false, required: false,
...@@ -42,18 +34,13 @@ ...@@ -42,18 +34,13 @@
markdownField, markdownField,
}, },
computed: { computed: {
isDirty() {
return this.initialNote !== this.note;
},
noteHash() { noteHash() {
return `#note_${this.noteId}`; return `#note_${this.noteId}`;
}, },
}, },
methods: { methods: {
handleUpdate() { handleUpdate() {
this.updateHandler({ this.$emit('handleFormUpdate', note);
note: this.note,
});
}, },
editMyLastNote() { editMyLastNote() {
if (this.note === '') { if (this.note === '') {
...@@ -67,6 +54,10 @@ ...@@ -67,6 +54,10 @@
} }
} }
}, },
cancelHandler(shouldConfirm = false) {
// Sends information about confirm message and if the textarea has changed
this.$emit('cancelFormEdition', shouldConfirm, this.initialNote !== this.note);
}
}, },
mounted() { mounted() {
this.$refs.textarea.focus(); this.$refs.textarea.focus();
...@@ -95,7 +86,9 @@ ...@@ -95,7 +86,9 @@
rel="noopener noreferrer">updated comment</a> rel="noopener noreferrer">updated comment</a>
to ensure information is not lost. to ensure information is not lost.
</div> </div>
<form class="edit-note common-note-form"> <form
@submit="handleUpdate"
class="edit-note common-note-form">
<markdown-field <markdown-field
:markdown-preview-url="markdownPreviewUrl" :markdown-preview-url="markdownPreviewUrl"
:markdown-docs="markdownDocsUrl" :markdown-docs="markdownDocsUrl"
...@@ -118,8 +111,7 @@ ...@@ -118,8 +111,7 @@
</markdown-field> </markdown-field>
<div class="note-form-actions clearfix"> <div class="note-form-actions clearfix">
<button <button
@click="handleUpdate" type="submit"
type="button"
class="btn btn-nr btn-save"> class="btn btn-nr btn-save">
{{saveButtonTitle}} {{saveButtonTitle}}
</button> </button>
......
...@@ -93,7 +93,7 @@ ...@@ -93,7 +93,7 @@
@click="updateTargetNoteHash"> @click="updateTargetNoteHash">
<time-ago-tooltip <time-ago-tooltip
:time="createdAt" :time="createdAt"
tooltipPlacement="bottom" tooltip-placement="bottom"
/> />
</a> </a>
</span> </span>
......
...@@ -47,13 +47,11 @@ ...@@ -47,13 +47,11 @@
}, },
computed: { computed: {
...mapGetters([ ...mapGetters([
'notes',
'getNotesDataByProp', 'getNotesDataByProp',
]), ]),
}, },
methods: { methods: {
...mapGetters([
'getNotesDataByProp',
]),
...mapActions({ ...mapActions({
actionFetchNotes: 'fetchNotes', actionFetchNotes: 'fetchNotes',
poll: 'poll', poll: 'poll',
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
<li class="note system-note timeline-entry being-posted fade-in-half"> <li class="note system-note timeline-entry being-posted fade-in-half">
<div class="timeline-entry-inner"> <div class="timeline-entry-inner">
<div class="timeline-content"> <div class="timeline-content">
<i>{{note.body}}</i> <em>{{note.body}}</em>
</div> </div>
</div> </div>
</li> </li>
......
...@@ -18,6 +18,8 @@ document.addEventListener('DOMContentLoaded', () => new Vue({ ...@@ -18,6 +18,8 @@ document.addEventListener('DOMContentLoaded', () => new Vue({
newSessionPath: notesDataset.newSessionPath, newSessionPath: notesDataset.newSessionPath,
registerPath: notesDataset.registerPath, registerPath: notesDataset.registerPath,
notesPath: notesDataset.notesPath, notesPath: notesDataset.notesPath,
markdownDocs: notesDataset.markdownDocs,
quickActionsDocs: notesDataset.quickActionsDocs,
}, },
}; };
}, },
......
...@@ -175,17 +175,17 @@ export const toggleAward = ({ commit, getters, dispatch }, data) => { ...@@ -175,17 +175,17 @@ export const toggleAward = ({ commit, getters, dispatch }, data) => {
constants.EMOJI_THUMBSUP; constants.EMOJI_THUMBSUP;
const targetNote = getters.notesById[noteId]; const targetNote = getters.notesById[noteId];
let noteHasAward = false; let noteHasAwardByCurrentUser = false;
targetNote.award_emoji.forEach((a) => { targetNote.award_emoji.forEach((a) => {
if (a.name === counterAward && a.user.id === window.gon.current_user_id) { if (a.name === counterAward && a.user.id === window.gon.current_user_id) {
noteHasAward = true; noteHasAwardByCurrentUser = true;
} }
}); });
if (noteHasAward) { if (noteHasAwardByCurrentUser) {
Object.assign(data, { awardName: counterAward }); Object.assign(data, { awardName: counterAward });
Object.assign(data, { kipMutalityCheck: true }); Object.assign(data, { skipMutalityCheck: true });
dispatch(types.TOGGLE_AWARD, data); dispatch(types.TOGGLE_AWARD, data);
} }
......
...@@ -214,7 +214,6 @@ module IssuablesHelper ...@@ -214,7 +214,6 @@ module IssuablesHelper
initialDescriptionHtml: markdown_field(issuable, :description), initialDescriptionHtml: markdown_field(issuable, :description),
initialDescriptionText: issuable.description, initialDescriptionText: issuable.description,
initialTaskStatus: issuable.task_status, initialTaskStatus: issuable.task_status,
quickActionsDocs: help_page_path('user/project/quick_actions'),
} }
data.merge!(updated_at_by(issuable)) data.merge!(updated_at_by(issuable))
......
...@@ -7,6 +7,8 @@ ...@@ -7,6 +7,8 @@
#js-vue-notes{ data: { discussions_path: discussions_namespace_project_issue_path(@project.namespace, @project, @issue, format: :json), #js-vue-notes{ data: { discussions_path: discussions_namespace_project_issue_path(@project.namespace, @project, @issue, format: :json),
register_path: "#{new_session_path(:user, redirect_to_referer: 'yes')}#register-pane", register_path: "#{new_session_path(:user, redirect_to_referer: 'yes')}#register-pane",
new_session_path: new_session_path(:user, redirect_to_referer: 'yes'), new_session_path: new_session_path(:user, redirect_to_referer: 'yes'),
markdown_docs: help_page_path('user/markdown'),
quick_actions_docs: help_page_path('user/project/quick_actions'),
notes_path: '#{notes_url}?full_data=1', notes_path: '#{notes_url}?full_data=1',
last_fetched_at: Time.now.to_i, last_fetched_at: Time.now.to_i,
issue_data: serialize_issuable(@issue), issue_data: serialize_issuable(@issue),
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment