diff options
author | Fatih Acet <acetfatih@gmail.com> | 2018-07-17 15:47:02 +0000 |
---|---|---|
committer | Felipe Artur <felipefac@gmail.com> | 2018-07-17 19:23:17 -0300 |
commit | 07f4b095f8de2a3968705f103701c5075669b2a5 (patch) | |
tree | ece80bbc2a475bf3cdb45d6247cd6c29c351bfe7 | |
parent | e561f0557657b397302cf9f347845bdf3ae30c75 (diff) | |
download | gitlab-ce-07f4b095f8de2a3968705f103701c5075669b2a5.tar.gz |
Merge branch '48964-mr-reduce-the-memory-footprint-of-the-component-tree' into 'master'11-1-stable-prepare-rc13
Resolve "MR: Reduce the memory footprint of the component tree"
Closes #48964
See merge request gitlab-org/gitlab-ce!20448
18 files changed, 170 insertions, 145 deletions
diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue index 1d1415fe6ca..7cc4e6a2c3a 100644 --- a/app/assets/javascripts/diffs/components/app.vue +++ b/app/assets/javascripts/diffs/components/app.vue @@ -85,6 +85,9 @@ export default { } return __('Show latest version'); }, + canCurrentUserFork() { + return this.currentUser.canFork === true && this.currentUser.canCreateMergeRequest; + }, }, watch: { diffViewType() { @@ -192,7 +195,7 @@ export default { v-for="file in diffFiles" :key="file.newPath" :file="file" - :current-user="currentUser" + :can-current-user-fork="canCurrentUserFork" /> </div> <no-changes v-else /> diff --git a/app/assets/javascripts/diffs/components/diff_file.vue b/app/assets/javascripts/diffs/components/diff_file.vue index 944084f05c9..7e7058d8d08 100644 --- a/app/assets/javascripts/diffs/components/diff_file.vue +++ b/app/assets/javascripts/diffs/components/diff_file.vue @@ -18,8 +18,8 @@ export default { type: Object, required: true, }, - currentUser: { - type: Object, + canCurrentUserFork: { + type: Boolean, required: true, }, }, @@ -87,7 +87,7 @@ export default { class="diff-file file-holder" > <diff-file-header - :current-user="currentUser" + :can-current-user-fork="canCurrentUserFork" :diff-file="file" :collapsible="true" :expanded="!isCollapsed" diff --git a/app/assets/javascripts/diffs/components/diff_file_header.vue b/app/assets/javascripts/diffs/components/diff_file_header.vue index c5abd0a9568..c494d3bcd3e 100644 --- a/app/assets/javascripts/diffs/components/diff_file_header.vue +++ b/app/assets/javascripts/diffs/components/diff_file_header.vue @@ -39,8 +39,8 @@ export default { required: false, default: true, }, - currentUser: { - type: Object, + canCurrentUserFork: { + type: Boolean, required: true, }, }, @@ -228,7 +228,7 @@ export default { <edit-button v-if="!diffFile.deletedFile" - :current-user="currentUser" + :can-current-user-fork="canCurrentUserFork" :edit-path="diffFile.editPath" :can-modify-blob="diffFile.canModifyBlob" @showForkMessage="showForkMessage" diff --git a/app/assets/javascripts/diffs/components/diff_line_note_form.vue b/app/assets/javascripts/diffs/components/diff_line_note_form.vue index db380e68bd1..32f9516d332 100644 --- a/app/assets/javascripts/diffs/components/diff_line_note_form.vue +++ b/app/assets/javascripts/diffs/components/diff_line_note_form.vue @@ -13,12 +13,8 @@ export default { noteForm, }, props: { - diffFile: { - type: Object, - required: true, - }, - diffLines: { - type: Array, + diffFileHash: { + type: String, required: true, }, line: { @@ -40,6 +36,7 @@ export default { noteableData: state => state.notes.noteableData, diffViewType: state => state.diffs.diffViewType, }), + ...mapGetters('diffs', ['getDiffFileByHash']), ...mapGetters(['isLoggedIn', 'noteableType', 'getNoteableData', 'getNotesDataByProp']), }, mounted() { @@ -68,13 +65,14 @@ export default { }); }, handleSaveNote(note) { + const selectedDiffFile = this.getDiffFileByHash(this.diffFileHash); const postData = getNoteFormData({ note, noteableData: this.noteableData, noteableType: this.noteableType, noteTargetLine: this.noteTargetLine, diffViewType: this.diffViewType, - diffFile: this.diffFile, + diffFile: selectedDiffFile, linePosition: this.position, }); diff --git a/app/assets/javascripts/diffs/components/diff_table_cell.vue b/app/assets/javascripts/diffs/components/diff_table_cell.vue index bd02b45a63c..5962f30d9bb 100644 --- a/app/assets/javascripts/diffs/components/diff_table_cell.vue +++ b/app/assets/javascripts/diffs/components/diff_table_cell.vue @@ -24,8 +24,12 @@ export default { type: Object, required: true, }, - diffFile: { - type: Object, + fileHash: { + type: String, + required: true, + }, + contextLinesPath: { + type: String, required: true, }, diffViewType: { @@ -120,14 +124,14 @@ export default { :class="classNameMap" > <diff-line-gutter-content - :file-hash="diffFile.fileHash" + :file-hash="fileHash" + :context-lines-path="contextLinesPath" :line-type="normalizedLine.type" :line-code="normalizedLine.lineCode" :line-position="linePosition" :line-number="lineNumber" :meta-data="normalizedLine.metaData" :show-comment-button="showCommentButton" - :context-lines-path="diffFile.contextLinesPath" :is-bottom="isBottom" :is-match-line="isMatchLine" :is-context-line="isContentLine" diff --git a/app/assets/javascripts/diffs/components/edit_button.vue b/app/assets/javascripts/diffs/components/edit_button.vue index ebf90631d76..2fb85ca2f07 100644 --- a/app/assets/javascripts/diffs/components/edit_button.vue +++ b/app/assets/javascripts/diffs/components/edit_button.vue @@ -5,8 +5,8 @@ export default { type: String, required: true, }, - currentUser: { - type: Object, + canCurrentUserFork: { + type: Boolean, required: true, }, canModifyBlob: { @@ -17,12 +17,12 @@ export default { }, methods: { handleEditClick(evt) { - if (!this.currentUser || this.canModifyBlob) { + if (!this.canCurrentUserFork || this.canModifyBlob) { // if we can Edit, do default Edit button behavior return; } - if (this.currentUser.canFork && this.currentUser.canCreateMergeRequest) { + if (this.canCurrentUserFork) { evt.preventDefault(); this.$emit('showForkMessage'); } diff --git a/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue b/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue index 1e8f2eecd76..ca265dd892c 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue @@ -13,12 +13,8 @@ export default { type: Object, required: true, }, - diffFile: { - type: Object, - required: true, - }, - diffLines: { - type: Array, + diffFileHash: { + type: String, required: true, }, lineIndex: { @@ -58,10 +54,9 @@ export default { /> <diff-line-note-form v-if="diffLineCommentForms[line.lineCode]" - :diff-file="diffFile" - :diff-lines="diffLines" + :diff-file-hash="diffFileHash" :line="line" - :note-target-line="diffLines[lineIndex]" + :note-target-line="line" /> </div> </td> diff --git a/app/assets/javascripts/diffs/components/inline_diff_table_row.vue b/app/assets/javascripts/diffs/components/inline_diff_table_row.vue index 8e4715c9862..0197a510ef1 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_table_row.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_table_row.vue @@ -16,8 +16,12 @@ export default { DiffTableCell, }, props: { - diffFile: { - type: Object, + fileHash: { + type: String, + required: true, + }, + contextLinesPath: { + type: String, required: true, }, line: { @@ -50,7 +54,7 @@ export default { inlineRowId() { const { lineCode, oldLine, newLine } = this.line; - return lineCode || `${this.diffFile.fileHash}_${oldLine}_${newLine}`; + return lineCode || `${this.fileHash}_${oldLine}_${newLine}`; }, }, created() { @@ -78,7 +82,8 @@ export default { @mouseout="handleMouseMove" > <diff-table-cell - :diff-file="diffFile" + :file-hash="fileHash" + :context-lines-path="contextLinesPath" :line="line" :line-type="oldLineType" :is-bottom="isBottom" @@ -87,7 +92,8 @@ export default { class="diff-line-num old_line" /> <diff-table-cell - :diff-file="diffFile" + :file-hash="fileHash" + :context-lines-path="contextLinesPath" :line="line" :line-type="newLineType" :is-bottom="isBottom" diff --git a/app/assets/javascripts/diffs/components/inline_diff_view.vue b/app/assets/javascripts/diffs/components/inline_diff_view.vue index 9c1359f7c89..9fd19b74cd7 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_view.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_view.vue @@ -60,15 +60,15 @@ export default { v-for="(line, index) in normalizedDiffLines" > <inline-diff-table-row - :diff-file="diffFile" + :file-hash="diffFile.fileHash" + :context-lines-path="diffFile.contextLinesPath" :line="line" :is-bottom="index + 1 === diffLinesLength" :key="line.lineCode" /> <inline-diff-comment-row v-if="shouldRenderCommentRow(line)" - :diff-file="diffFile" - :diff-lines="normalizedDiffLines" + :diff-file-hash="diffFile.fileHash" :line="line" :line-index="index" :key="index" diff --git a/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue b/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue index 1e20792b647..cc5248c25d9 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue @@ -13,12 +13,8 @@ export default { type: Object, required: true, }, - diffFile: { - type: Object, - required: true, - }, - diffLines: { - type: Array, + diffFileHash: { + type: String, required: true, }, lineIndex: { @@ -91,10 +87,9 @@ export default { <diff-line-note-form v-if="diffLineCommentForms[leftLineCode] && diffLineCommentForms[leftLineCode]" - :diff-file="diffFile" - :diff-lines="diffLines" + :diff-file-hash="diffFileHash" :line="line.left" - :note-target-line="diffLines[lineIndex].left" + :note-target-line="line.left" position="left" /> </td> @@ -112,10 +107,9 @@ export default { <diff-line-note-form v-if="diffLineCommentForms[rightLineCode] && diffLineCommentForms[rightLineCode] && line.right.type" - :diff-file="diffFile" - :diff-lines="diffLines" + :diff-file-hash="diffFileHash" :line="line.right" - :note-target-line="diffLines[lineIndex].right" + :note-target-line="line.right" position="right" /> </td> diff --git a/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue b/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue index b76fc63205b..ee5bb4d8d05 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue @@ -19,8 +19,12 @@ export default { DiffTableCell, }, props: { - diffFile: { - type: Object, + fileHash: { + type: String, + required: true, + }, + contextLinesPath: { + type: String, required: true, }, line: { @@ -103,7 +107,8 @@ export default { @mouseout="handleMouseMove" > <diff-table-cell - :diff-file="diffFile" + :file-hash="fileHash" + :context-lines-path="contextLinesPath" :line="line" :line-type="oldLineType" :line-position="linePositionLeft" @@ -123,7 +128,8 @@ export default { > </td> <diff-table-cell - :diff-file="diffFile" + :file-hash="fileHash" + :context-lines-path="contextLinesPath" :line="line" :line-type="newLineType" :line-position="linePositionRight" diff --git a/app/assets/javascripts/diffs/components/parallel_diff_view.vue b/app/assets/javascripts/diffs/components/parallel_diff_view.vue index 216865474a6..32528c9e7ab 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_view.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_view.vue @@ -93,17 +93,17 @@ export default { v-for="(line, index) in parallelDiffLines" > <parallel-diff-table-row - :diff-file="diffFile" + :file-hash="diffFile.fileHash" + :context-lines-path="diffFile.contextLinesPath" :line="line" :is-bottom="index + 1 === diffLinesLength" :key="index" /> <parallel-diff-comment-row v-if="shouldRenderCommentRow(line)" - :key="line.left.lineCode || line.right.lineCode" + :key="`dcr-${index}`" :line="line" - :diff-file="diffFile" - :diff-lines="parallelDiffLines" + :diff-file-hash="diffFile.fileHash" :line-index="index" /> </template> diff --git a/app/assets/javascripts/diffs/store/getters.js b/app/assets/javascripts/diffs/store/getters.js index f89acb73ed8..855de79adf8 100644 --- a/app/assets/javascripts/diffs/store/getters.js +++ b/app/assets/javascripts/diffs/store/getters.js @@ -57,4 +57,8 @@ export const getDiffFileDiscussions = (state, getters, rootState, rootGetters) = ) || []; // prevent babel-plugin-rewire from generating an invalid default during karma∂ tests +export const getDiffFileByHash = state => fileHash => + state.diffFiles.find(file => file.fileHash === fileHash); + +// prevent babel-plugin-rewire from generating an invalid default during karma tests export default () => {}; diff --git a/app/assets/javascripts/notes/components/diff_with_note.vue b/app/assets/javascripts/notes/components/diff_with_note.vue index 9c2908c477e..27ff7dea909 100644 --- a/app/assets/javascripts/notes/components/diff_with_note.vue +++ b/app/assets/javascripts/notes/components/diff_with_note.vue @@ -1,94 +1,90 @@ <script> - import { mapState, mapActions } from 'vuex'; - import imageDiffHelper from '~/image_diff/helpers/index'; - import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils'; - import DiffFileHeader from '~/diffs/components/diff_file_header.vue'; - import SkeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue'; - import { trimFirstCharOfLineContent } from '~/diffs/store/utils'; +import { mapState, mapActions } from 'vuex'; +import imageDiffHelper from '~/image_diff/helpers/index'; +import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils'; +import DiffFileHeader from '~/diffs/components/diff_file_header.vue'; +import SkeletonLoadingContainer from '~/vue_shared/components/skeleton_loading_container.vue'; +import { trimFirstCharOfLineContent } from '~/diffs/store/utils'; - export default { - components: { - DiffFileHeader, - SkeletonLoadingContainer, +export default { + components: { + DiffFileHeader, + SkeletonLoadingContainer, + }, + props: { + discussion: { + type: Object, + required: true, }, - props: { - discussion: { - type: Object, - required: true, - }, + }, + data() { + return { + error: false, + }; + }, + computed: { + ...mapState({ + noteableData: state => state.notes.noteableData, + }), + hasTruncatedDiffLines() { + return this.discussion.truncatedDiffLines && this.discussion.truncatedDiffLines.length !== 0; }, - data() { - return { - error: false, - }; + isDiscussionsExpanded() { + return true; // TODO: @fatihacet - Fix this. }, - computed: { - ...mapState({ - noteableData: state => state.notes.noteableData, - }), - hasTruncatedDiffLines() { - return this.discussion.truncatedDiffLines && - this.discussion.truncatedDiffLines.length !== 0; - }, - isDiscussionsExpanded() { - return true; // TODO: @fatihacet - Fix this. - }, - isCollapsed() { - return this.diffFile.collapsed || false; - }, - isImageDiff() { - return !this.diffFile.text; - }, - diffFileClass() { - const { text } = this.diffFile; - return text ? 'text-file' : 'js-image-file'; - }, - diffFile() { - return convertObjectPropsToCamelCase(this.discussion.diffFile, { deep: true }); - }, - imageDiffHtml() { - return this.discussion.imageDiffHtml; - }, - currentUser() { - return this.noteableData.current_user; - }, - userColorScheme() { - return window.gon.user_color_scheme; - }, - normalizedDiffLines() { - if (this.discussion.truncatedDiffLines) { - return this.discussion.truncatedDiffLines.map(line => - trimFirstCharOfLineContent(convertObjectPropsToCamelCase(line)), - ); - } - - return []; - }, + isCollapsed() { + return this.diffFile.collapsed || false; + }, + isImageDiff() { + return !this.diffFile.text; + }, + diffFileClass() { + const { text } = this.diffFile; + return text ? 'text-file' : 'js-image-file'; + }, + diffFile() { + return convertObjectPropsToCamelCase(this.discussion.diffFile, { deep: true }); }, - mounted() { - if (this.isImageDiff) { - const canCreateNote = false; - const renderCommentBadge = true; - imageDiffHelper.initImageDiff(this.$refs.fileHolder, canCreateNote, renderCommentBadge); - } else if (!this.hasTruncatedDiffLines) { - this.fetchDiff(); + imageDiffHtml() { + return this.discussion.imageDiffHtml; + }, + userColorScheme() { + return window.gon.user_color_scheme; + }, + normalizedDiffLines() { + if (this.discussion.truncatedDiffLines) { + return this.discussion.truncatedDiffLines.map(line => + trimFirstCharOfLineContent(convertObjectPropsToCamelCase(line)), + ); } + + return []; + }, + }, + mounted() { + if (this.isImageDiff) { + const canCreateNote = false; + const renderCommentBadge = true; + imageDiffHelper.initImageDiff(this.$refs.fileHolder, canCreateNote, renderCommentBadge); + } else if (!this.hasTruncatedDiffLines) { + this.fetchDiff(); + } + }, + methods: { + ...mapActions(['fetchDiscussionDiffLines']), + rowTag(html) { + return html.outerHTML ? 'tr' : 'template'; }, - methods: { - ...mapActions(['fetchDiscussionDiffLines']), - rowTag(html) { - return html.outerHTML ? 'tr' : 'template'; - }, - fetchDiff() { - this.error = false; - this.fetchDiscussionDiffLines(this.discussion) - .then(this.highlight) - .catch(() => { - this.error = true; - }); - }, + fetchDiff() { + this.error = false; + this.fetchDiscussionDiffLines(this.discussion) + .then(this.highlight) + .catch(() => { + this.error = true; + }); }, - }; + }, +}; </script> <template> @@ -99,7 +95,7 @@ > <diff-file-header :diff-file="diffFile" - :current-user="currentUser" + :can-current-user-fork="false" :discussions-expanded="isDiscussionsExpanded" :expanded="!isCollapsed" /> diff --git a/spec/javascripts/diffs/components/diff_file_header_spec.js b/spec/javascripts/diffs/components/diff_file_header_spec.js index 0f3a95da5bf..241ff07026e 100644 --- a/spec/javascripts/diffs/components/diff_file_header_spec.js +++ b/spec/javascripts/diffs/components/diff_file_header_spec.js @@ -24,7 +24,7 @@ describe('diff_file_header', () => { const diffFile = convertObjectPropsToCamelCase(diffDiscussionMock.diff_file, { deep: true }); props = { diffFile, - currentUser: {}, + canCurrentUserFork: false, }; }); diff --git a/spec/javascripts/diffs/components/diff_file_spec.js b/spec/javascripts/diffs/components/diff_file_spec.js index 9b994543e19..7a4616ec8eb 100644 --- a/spec/javascripts/diffs/components/diff_file_spec.js +++ b/spec/javascripts/diffs/components/diff_file_spec.js @@ -11,7 +11,7 @@ describe('DiffFile', () => { beforeEach(() => { vm = createComponentWithStore(Vue.extend(DiffFileComponent), store, { file: getDiffFileMock(), - currentUser: {}, + canCurrentUserFork: false, }).$mount(); }); diff --git a/spec/javascripts/diffs/components/diff_line_note_form_spec.js b/spec/javascripts/diffs/components/diff_line_note_form_spec.js index 81cd4f9769a..4600aaea70b 100644 --- a/spec/javascripts/diffs/components/diff_line_note_form_spec.js +++ b/spec/javascripts/diffs/components/diff_line_note_form_spec.js @@ -15,7 +15,7 @@ describe('DiffLineNoteForm', () => { diffLines = diffFile.highlightedDiffLines; component = createComponentWithStore(Vue.extend(DiffLineNoteForm), store, { - diffFile, + diffFileHash: diffFile.fileHash, diffLines, line: diffLines[0], noteTargetLine: diffLines[0], diff --git a/spec/javascripts/diffs/store/getters_spec.js b/spec/javascripts/diffs/store/getters_spec.js index 919b612bb6a..6210d4a7124 100644 --- a/spec/javascripts/diffs/store/getters_spec.js +++ b/spec/javascripts/diffs/store/getters_spec.js @@ -184,4 +184,23 @@ describe('Diffs Module Getters', () => { ).toEqual(0); }); }); + + describe('getDiffFileByHash', () => { + it('returns file by hash', () => { + const fileA = { + fileHash: '123', + }; + const fileB = { + fileHash: '456', + }; + localState.diffFiles = [fileA, fileB]; + + expect(getters.getDiffFileByHash(localState)('456')).toEqual(fileB); + }); + + it('returns null if no matching file is found', () => { + localState.diffFiles = []; + expect(getters.getDiffFileByHash(localState)('123')).toBeUndefined(); + }); + }); }); |