begin pagination logic - add Flash to error - refactor

app/assets/javascripts/vue_pipelines_index/index.js.es6

@@ -13,7 +13,7 @@
 
   Vue.use(VueResource);
 
-  new Vue({
+  return new Vue({
     el: '.vue-pipelines-index',
     data: {
       scope: project.dataset.projectId,

app/assets/javascripts/vue_pipelines_index/pipelines.vue.js.es6

@@ -11,6 +11,7 @@
         pipelines: [],
         currentPage: '',
         intervalId: '',
+        pageNum: 'page=1',
       };
     },
     props: [
@@ -18,7 +19,10 @@
       'store',
     ],
     created() {
-      this.store.fetchDataLoop.call(this, Vue);
+      const url = window.location.href;
+      if (url.includes('?')) this.pageNum = url.split('?')[1];
+      // now fetch page appropriate data
+      this.store.fetchDataLoop.call(this, Vue, this.pageNum);
     },
     methods: {
       shortSha(pipeline) {
@@ -26,8 +30,7 @@
       },
       changePage() {
         // clearInterval(this.intervalId);
-        // this.store.fetchCommits.call(this, Vue);
-        // this.store.fetchDataLoop.call(this, Vue);
+        // this.store.fetchDataLoop.call(this, Vue, this.pageNum);
       },
     },
     template: `

app/assets/javascripts/vue_pipelines_index/store.js.es6

-/* global gl */
+/* global gl, Flash */
 /* eslint-disable no-param-reassign */
 
 ((gl) => {
   const api = '/api/v3/projects';
 
   gl.PipelineStore = class {
-    fetchDataLoop(Vue) {
+    fetchDataLoop(Vue, pageNum) {
       const goFetch = () =>
-        this.$http.get(
-          `${api}/${this.scope}/pipelines?per_page=5&page=1`
-        )
+        this.$http.get(`${api}/${this.scope}/pipelines?per_page=30&${pageNum}`)
           .then((response) => {
             Vue.set(this, 'pipelines', JSON.parse(response.body));
-          }, () => {
-            console.error('API Error for Pipelines');
-          });
+          }, () => new Flash('Something went wrong on our end.'));
 
+      // inital fetch and then start timeout loop
       goFetch();
 
       // eventually clearInterval(this.intervalId)
       this.intervalId = setInterval(() => {
-        console.log('DID IT');
         goFetch();
-      }, 30000);
+      }, 60000);
     }
   };
 })(window.gl || (window.gl = {}));