Merge branch '207463-refactor-views' into 'master'

Re-name Snippet App to Snippet Show

See merge request gitlab-org/gitlab!27598

app/assets/javascripts/pages/projects/snippets/show/index.js

@@ -3,7 +3,7 @@ import ZenMode from '~/zen_mode';
 import LineHighlighter from '~/line_highlighter';
 import BlobViewer from '~/blob/viewer';
 import snippetEmbed from '~/snippet/snippet_embed';
-import initSnippetsApp from '~/snippets';
+import { SnippetShowInit } from '~/snippets';
 
 document.addEventListener('DOMContentLoaded', () => {
   if (!gon.features.snippetsVue) {
@@ -13,7 +13,7 @@ document.addEventListener('DOMContentLoaded', () => {
     new ZenMode(); // eslint-disable-line no-new
     snippetEmbed();
   } else {
-    initSnippetsApp();
+    SnippetShowInit();
     initNotes();
   }
 });

app/assets/javascripts/pages/snippets/show/index.js

@@ -3,7 +3,7 @@ import BlobViewer from '~/blob/viewer';
 import ZenMode from '~/zen_mode';
 import initNotes from '~/init_notes';
 import snippetEmbed from '~/snippet/snippet_embed';
-import initSnippetsApp from '~/snippets';
+import { SnippetShowInit } from '~/snippets';
 
 document.addEventListener('DOMContentLoaded', () => {
   if (!gon.features.snippetsVue) {
@@ -13,7 +13,7 @@ document.addEventListener('DOMContentLoaded', () => {
     new ZenMode(); // eslint-disable-line no-new
     snippetEmbed();
   } else {
-    initSnippetsApp();
+    SnippetShowInit();
     initNotes();
   }
 });

app/assets/javascripts/snippets/index.js

@@ -3,19 +3,16 @@ import Translate from '~/vue_shared/translate';
 import VueApollo from 'vue-apollo';
 import createDefaultClient from '~/lib/graphql';
 
-import SnippetsApp from './components/app.vue';
+import SnippetsApp from './components/show.vue';
 
 Vue.use(VueApollo);
 Vue.use(Translate);
 
-export default () => {
-  const el = document.getElementById('js-snippet-view');
-
+function appFactory(el, Component) {
   if (!el) {
     return false;
   }
 
-  const { snippetGid } = el.dataset;
   const apolloProvider = new VueApollo({
     defaultClient: createDefaultClient(),
   });
@@ -24,11 +21,17 @@ export default () => {
     el,
     apolloProvider,
     render(createElement) {
-      return createElement(SnippetsApp, {
+      return createElement(Component, {
         props: {
-          snippetGid,
+          ...el.dataset,
         },
       });
     },
   });
+}
+
+export const SnippetShowInit = () => {
+  appFactory(document.getElementById('js-snippet-view'), SnippetsApp);
 };
+
+export default () => {};

spec/frontend/snippets/components/app_spec.js → spec/frontend/snippets/components/show_spec.js

-import SnippetApp from '~/snippets/components/app.vue';
+import SnippetApp from '~/snippets/components/show.vue';
 import SnippetHeader from '~/snippets/components/snippet_header.vue';
 import SnippetTitle from '~/snippets/components/snippet_title.vue';
 import SnippetBlob from '~/snippets/components/snippet_blob_view.vue';