diff options
Diffstat (limited to 'app/assets/javascripts/repository/components/blob_viewers')
-rw-r--r-- | app/assets/javascripts/repository/components/blob_viewers/image_viewer.vue | 19 | ||||
-rw-r--r-- | app/assets/javascripts/repository/components/blob_viewers/index.js | 6 |
2 files changed, 25 insertions, 0 deletions
diff --git a/app/assets/javascripts/repository/components/blob_viewers/image_viewer.vue b/app/assets/javascripts/repository/components/blob_viewers/image_viewer.vue new file mode 100644 index 00000000000..83d36209bb3 --- /dev/null +++ b/app/assets/javascripts/repository/components/blob_viewers/image_viewer.vue @@ -0,0 +1,19 @@ +<script> +export default { + props: { + url: { + type: String, + required: true, + }, + alt: { + type: String, + required: true, + }, + }, +}; +</script> +<template> + <div class="gl-text-center gl-p-7 gl-bg-gray-50"> + <img :src="url" :alt="alt" data-testid="image" /> + </div> +</template> diff --git a/app/assets/javascripts/repository/components/blob_viewers/index.js b/app/assets/javascripts/repository/components/blob_viewers/index.js index 4e16b16041f..3b4f4eb51fe 100644 --- a/app/assets/javascripts/repository/components/blob_viewers/index.js +++ b/app/assets/javascripts/repository/components/blob_viewers/index.js @@ -6,6 +6,8 @@ export const loadViewer = (type) => { return () => import(/* webpackChunkName: 'blob_text_viewer' */ './text_viewer.vue'); case 'download': return () => import(/* webpackChunkName: 'blob_download_viewer' */ './download_viewer.vue'); + case 'image': + return () => import(/* webpackChunkName: 'blob_image_viewer' */ './image_viewer.vue'); default: return null; } @@ -23,5 +25,9 @@ export const viewerProps = (type, blob) => { filePath: blob.rawPath, fileSize: blob.rawSize, }, + image: { + url: blob.rawPath, + alt: blob.name, + }, }[type]; }; |