diff options
author | Tim Zallmann <tzallmann@gitlab.com> | 2018-06-26 18:49:22 +0000 |
---|---|---|
committer | Clement Ho <clemmakesapps@gmail.com> | 2018-06-26 18:49:22 +0000 |
commit | 53f77cfee164b3e0f7e3efb6511dee5e72dd75e6 (patch) | |
tree | 7ed5580947af4b34c946f51403480fd6d5b01ed1 /app/assets/javascripts/diffs/components | |
parent | 869d645069f46585b73b261c79aefece2fd87b08 (diff) | |
download | gitlab-ce-53f77cfee164b3e0f7e3efb6511dee5e72dd75e6.tar.gz |
Added Diff Viewer to new VUE based MR page
Diffstat (limited to 'app/assets/javascripts/diffs/components')
3 files changed, 45 insertions, 19 deletions
diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue index 82ca10f4163..deddb61ca31 100644 --- a/app/assets/javascripts/diffs/components/app.vue +++ b/app/assets/javascripts/diffs/components/app.vue @@ -26,6 +26,10 @@ export default { type: String, required: true, }, + projectPath: { + type: String, + required: true, + }, shouldShow: { type: Boolean, required: false, @@ -94,18 +98,16 @@ export default { }, }, mounted() { - this.setEndpoint(this.endpoint); - this - .fetchDiffFiles() - .catch(() => { - createFlash(__('Something went wrong on our end. Please try again!')); - }); + this.setBaseConfig({ endpoint: this.endpoint, projectPath: this.projectPath }); + this.fetchDiffFiles().catch(() => { + createFlash(__('Fetching diff files failed. Please reload the page to try again!')); + }); }, created() { this.adjustView(); }, methods: { - ...mapActions(['setEndpoint', 'fetchDiffFiles']), + ...mapActions(['setBaseConfig', 'fetchDiffFiles']), setActive(filePath) { this.activeFile = filePath; }, diff --git a/app/assets/javascripts/diffs/components/diff_content.vue b/app/assets/javascripts/diffs/components/diff_content.vue index adcd22f7876..48ba967285f 100644 --- a/app/assets/javascripts/diffs/components/diff_content.vue +++ b/app/assets/javascripts/diffs/components/diff_content.vue @@ -1,5 +1,7 @@ <script> -import { mapGetters } from 'vuex'; +import { mapGetters, mapState } from 'vuex'; +import DiffViewer from '~/vue_shared/components/diff_viewer/diff_viewer.vue'; +import { diffModes } from '~/ide/constants'; import InlineDiffView from './inline_diff_view.vue'; import ParallelDiffView from './parallel_diff_view.vue'; @@ -7,6 +9,7 @@ export default { components: { InlineDiffView, ParallelDiffView, + DiffViewer, }, props: { diffFile: { @@ -15,7 +18,18 @@ export default { }, }, computed: { + ...mapState({ + projectPath: state => state.diffs.projectPath, + endpoint: state => state.diffs.endpoint, + }), ...mapGetters(['isInlineView', 'isParallelView']), + diffMode() { + const diffModeKey = Object.keys(diffModes).find(key => this.diffFile[`${key}File`]); + return diffModes[diffModeKey] || diffModes.replaced; + }, + isTextFile() { + return this.diffFile.text; + }, }, }; </script> @@ -23,16 +37,26 @@ export default { <template> <div class="diff-content"> <div class="diff-viewer"> - <inline-diff-view - v-if="isInlineView" - :diff-file="diffFile" - :diff-lines="diffFile.highlightedDiffLines || []" - /> - <parallel-diff-view - v-if="isParallelView" - :diff-file="diffFile" - :diff-lines="diffFile.parallelDiffLines || []" - /> + <template v-if="isTextFile"> + <inline-diff-view + v-if="isInlineView" + :diff-file="diffFile" + :diff-lines="diffFile.highlightedDiffLines || []" + /> + <parallel-diff-view + v-else-if="isParallelView" + :diff-file="diffFile" + :diff-lines="diffFile.parallelDiffLines || []" + /> + </template> + <diff-viewer + v-else + :diff-mode="diffMode" + :new-path="diffFile.newPath" + :new-sha="diffFile.diffRefs.headSha" + :old-path="diffFile.oldPath" + :old-sha="diffFile.diffRefs.baseSha" + :project-path="projectPath"/> </div> </div> </template> diff --git a/app/assets/javascripts/diffs/components/inline_diff_view.vue b/app/assets/javascripts/diffs/components/inline_diff_view.vue index 0ed3dc7f3ad..21376117bef 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_view.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_view.vue @@ -36,7 +36,7 @@ export default { <table :class="userColorScheme" :data-commit-id="commitId" - class="code diff-wrap-lines js-syntax-highlight text-file"> + class="code diff-wrap-lines js-syntax-highlight text-file js-diff-inline-view"> <tbody> <template v-for="(line, index) in normalizedDiffLines" |