diff options
Diffstat (limited to 'app/assets/javascripts/repo/components/repo_preview.vue')
-rw-r--r-- | app/assets/javascripts/repo/components/repo_preview.vue | 49 |
1 files changed, 22 insertions, 27 deletions
diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index b5be771d539..d1883299bd9 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -1,26 +1,20 @@ <script> /* global LineHighlighter */ - -import Store from '../stores/repo_store'; +import { mapGetters } from 'vuex'; export default { - data() { - return Store; - }, computed: { - html() { - return this.activeFile.html; + ...mapGetters([ + 'activeFile', + ]), + renderErrorTooLarge() { + return this.activeFile.renderError === 'too_large'; }, }, methods: { highlightFile() { $(this.$el).find('.file-content').syntaxHighlight(); }, - highlightLine() { - if (Store.activeLine > -1) { - this.lineHighlighter.highlightHash(`#L${Store.activeLine}`); - } - }, }, mounted() { this.highlightFile(); @@ -29,38 +23,39 @@ export default { scrollFileHolder: true, }); }, - watch: { - html() { - this.$nextTick(() => { - this.highlightFile(); - this.highlightLine(); - }); - }, - activeLine() { - this.highlightLine(); - }, + updated() { + this.$nextTick(() => { + this.highlightFile(); + }); }, }; </script> <template> -<div> +<div class="blob-viewer-container"> <div - v-if="!activeFile.render_error" + v-if="!activeFile.renderError" v-html="activeFile.html"> </div> <div - v-else-if="activeFile.tooLarge" + v-else-if="activeFile.tempFile" + class="vertical-center render-error"> + <p class="text-center"> + The source could not be displayed for this temporary file. + </p> + </div> + <div + v-else-if="renderErrorTooLarge" class="vertical-center render-error"> <p class="text-center"> - The source could not be displayed because it is too large. You can <a :href="activeFile.raw_path">download</a> it instead. + The source could not be displayed because it is too large. You can <a :href="activeFile.rawPath" download>download</a> it instead. </p> </div> <div v-else class="vertical-center render-error"> <p class="text-center"> - The source could not be displayed because a rendering error occurred. You can <a :href="activeFile.raw_path">download</a> it instead. + The source could not be displayed because a rendering error occurred. You can <a :href="activeFile.rawPath" download>download</a> it instead. </p> </div> </div> |