diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-07 18:06:21 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-07 18:06:21 +0000 |
commit | d8ccc7a00b7a1ea954263170a2044257424a2cfe (patch) | |
tree | 0a29cb558aae61795da47c82ce7e87983c5dc4af /app/assets/javascripts/repository/components/preview/index.vue | |
parent | 90a06a20be61bb6d48d77746091492831153e075 (diff) | |
download | gitlab-ce-d8ccc7a00b7a1ea954263170a2044257424a2cfe.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/repository/components/preview/index.vue')
-rw-r--r-- | app/assets/javascripts/repository/components/preview/index.vue | 49 |
1 files changed, 49 insertions, 0 deletions
diff --git a/app/assets/javascripts/repository/components/preview/index.vue b/app/assets/javascripts/repository/components/preview/index.vue new file mode 100644 index 00000000000..564be211c46 --- /dev/null +++ b/app/assets/javascripts/repository/components/preview/index.vue @@ -0,0 +1,49 @@ +<script> +import { GlLink, GlLoadingIcon } from '@gitlab/ui'; +import getReadmeQuery from '../../queries/getReadme.query.graphql'; + +export default { + apollo: { + readme: { + query: getReadmeQuery, + variables() { + return { + url: this.blob.webUrl, + }; + }, + loadingKey: 'loading', + }, + }, + components: { + GlLink, + GlLoadingIcon, + }, + props: { + blob: { + type: Object, + required: true, + }, + }, + data() { + return { + readme: null, + loading: 0, + }; + }, +}; +</script> + +<template> + <article class="file-holder js-hide-on-navigation limited-width-container readme-holder"> + <div class="file-title"> + <i aria-hidden="true" class="fa fa-file-text-o fa-fw"></i> + <gl-link :href="blob.webUrl"> + <strong>{{ blob.name }}</strong> + </gl-link> + </div> + <div class="blob-viewer"> + <gl-loading-icon v-if="loading > 0" size="md" class="my-4 mx-auto" /> + <div v-else-if="readme" v-html="readme.html"></div> + </div> + </article> +</template> |