1 files changed, 16 insertions, 21 deletions
diff --git a/app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue b/app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue
index fe488ab6cfa..5ac30424f98 100644
--- a/app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue
+++ b/app/assets/javascripts/vue_shared/components/content_viewer/content_viewer.vue
@@ -4,6 +4,11 @@ import ImageViewer from './viewers/image_viewer.vue';
 import DownloadViewer from './viewers/download_viewer.vue';
 
 export default {
+  components: {
+    MarkdownViewer,
+    ImageViewer,
+    DownloadViewer,
+  },
   props: {
     content: {
       type: String,
@@ -45,35 +50,25 @@ export default {
       default: () => ({}),
     },
   },
-  computed: {
-    viewer() {
-      if (!this.path) return null;
-      if (!this.type) return DownloadViewer;
-
-      switch (this.type) {
-        case 'markdown':
-          return MarkdownViewer;
-        case 'image':
-          return ImageViewer;
-        default:
-          return DownloadViewer;
-      }
-    },
-  },
 };
 </script>
 
 <template>
   <div class="preview-container">
-    <component
-      :is="viewer"
-      :path="path"
+    <image-viewer v-if="type === 'image'" :path="path" :file-size="fileSize" />
+    <markdown-viewer
+      v-if="type === 'markdown'"
+      :content="content"
+      :commit-sha="commitSha"
       :file-path="filePath"
-      :file-size="fileSize"
       :project-path="projectPath"
-      :content="content"
       :images="images"
-      :commit-sha="commitSha"
+    />
+    <download-viewer
+      v-if="!type && path"
+      :path="path"
+      :file-path="filePath"
+      :file-size="fileSize"
     />
   </div>
 </template>