diff options
Diffstat (limited to 'app/assets/javascripts/repository/components/blob_viewers')
3 files changed, 57 insertions, 0 deletions
diff --git a/app/assets/javascripts/repository/components/blob_viewers/index.js b/app/assets/javascripts/repository/components/blob_viewers/index.js index 3e6d2e675ed..a480710f8ac 100644 --- a/app/assets/javascripts/repository/components/blob_viewers/index.js +++ b/app/assets/javascripts/repository/components/blob_viewers/index.js @@ -10,6 +10,8 @@ const viewers = { audio: () => import('./audio_viewer.vue'), svg: () => import('./image_viewer.vue'), sketch: () => import('./sketch_viewer.vue'), + notebook: () => import('./notebook_viewer.vue'), + openapi: () => import('./openapi_viewer.vue'), }; export const loadViewer = (type, isUsingLfs) => { diff --git a/app/assets/javascripts/repository/components/blob_viewers/notebook_viewer.vue b/app/assets/javascripts/repository/components/blob_viewers/notebook_viewer.vue new file mode 100644 index 00000000000..1114a0942ec --- /dev/null +++ b/app/assets/javascripts/repository/components/blob_viewers/notebook_viewer.vue @@ -0,0 +1,31 @@ +<script> +import { GlLoadingIcon } from '@gitlab/ui'; +import notebookLoader from '~/blob/notebook'; +import { stripPathTail } from '~/lib/utils/url_utility'; + +export default { + components: { + GlLoadingIcon, + }, + props: { + blob: { + type: Object, + required: true, + }, + }, + data() { + return { + url: this.blob.rawPath, + }; + }, + mounted() { + notebookLoader({ el: this.$refs.viewer, relativeRawPath: stripPathTail(this.url) }); + }, +}; +</script> + +<template> + <div ref="viewer" :data-endpoint="url" data-testid="notebook"> + <gl-loading-icon class="gl-my-4" size="lg" /> + </div> +</template> diff --git a/app/assets/javascripts/repository/components/blob_viewers/openapi_viewer.vue b/app/assets/javascripts/repository/components/blob_viewers/openapi_viewer.vue new file mode 100644 index 00000000000..5665e4b0ec4 --- /dev/null +++ b/app/assets/javascripts/repository/components/blob_viewers/openapi_viewer.vue @@ -0,0 +1,24 @@ +<script> +import renderOpenApi from '~/blob/openapi'; + +export default { + props: { + blob: { + type: Object, + required: true, + }, + }, + data() { + return { + url: this.blob.rawPath, + }; + }, + mounted() { + renderOpenApi(this.$refs.viewer); + }, +}; +</script> + +<template> + <div ref="viewer" class="file-content" :data-endpoint="url" data-testid="openapi"></div> +</template> |