diff --git a/app/assets/javascripts/vue_pipelines_index/index.js.es6 b/app/assets/javascripts/vue_pipelines_index/index.js.es6
index 3666155344464ce2b56c30f7f87aa672e3891ead..fcf91107da5d12145fbc4982e723f497a4b71f34 100644
--- a/app/assets/javascripts/vue_pipelines_index/index.js.es6
+++ b/app/assets/javascripts/vue_pipelines_index/index.js.es6
@@ -4,5 +4,4 @@
 //= require ./store.js.es6
 //= require ./running_icon.vue.js.es6
 //= require ./running.vue.js.es6
-//= require ./status_data_icons.js.es6
 //= require ./pipelines.vue.js.es6
diff --git a/app/assets/javascripts/vue_pipelines_index/pipelines.vue.js.es6 b/app/assets/javascripts/vue_pipelines_index/pipelines.vue.js.es6
index ba6ef3011ab355cba010ba9309c9bbce82bcf83e..1ff7b117223cb90bfbf0b33f3aa1f510c8a1f2b6 100644
--- a/app/assets/javascripts/vue_pipelines_index/pipelines.vue.js.es6
+++ b/app/assets/javascripts/vue_pipelines_index/pipelines.vue.js.es6
@@ -9,7 +9,7 @@
     data() {
       return {
         pipelines: [],
-        runnerStats: new gl.RunnerStats(),
+        commits: [],
       };
     },
     props: [
@@ -17,6 +17,7 @@
       'store',
     ],
     created() {
+      this.store.fetchCommits.call(this, Vue);
       this.store.fetchDataLoop.call(this, Vue);
     },
     methods: {
@@ -57,10 +58,28 @@
                 <path fill="#8F8F8F" fill-rule="evenodd" d="M28.7769836,18 C27.8675252,13.9920226 24.2831748,11 20,11 C15.7168252,11 12.1324748,13.9920226 11.2230164,18 L4.0085302,18 C2.90195036,18 2,18.8954305 2,20 C2,21.1122704 2.8992496,22 4.0085302,22 L11.2230164,22 C12.1324748,26.0079774 15.7168252,29 20,29 C24.2831748,29 27.8675252,26.0079774 28.7769836,22 L35.9914698,22 C37.0980496,22 38,21.1045695 38,20 C38,18.8877296 37.1007504,18 35.9914698,18 L28.7769836,18 L28.7769836,18 Z M20,25 C22.7614237,25 25,22.7614237 25,20 C25,17.2385763 22.7614237,15 20,15 C17.2385763,15 15,17.2385763 15,20 C15,22.7614237 17.2385763,25 20,25 L20,25 Z"></path>
               </svg>
             </div>
-            <a class="commit-id monospace" href="/gitlab-org/gitlab-ce/commit/29141ed3ea6157a60d9748921782015626a17f9e">{{shortSha(pipeline)}}</a>
+            <a
+              class="commit-id monospace"
+              href="/gitlab-org/gitlab-ce/commit/{{pipeline.sha}}">{{shortSha(pipeline)}}
+            </a>
             <p class="commit-title">
-            <a href="mailto:james@jameslopez.es"><img class="avatar has-tooltip s20 hidden-xs" alt="James Lopez's avatar" title="James Lopez" data-container="body" src="http://www.gravatar.com/avatar/80d3b651b4be1f1db39435c2d11f1f23?s=40&amp;d=identicon"></a>
-            <a class="commit-row-message" href="/gitlab-org/gitlab-ce/commit/29141ed3ea6157a60d9748921782015626a17f9e">fix broken repo 500 errors in UI and added relevant specs</a>
+              <a
+                href="mailto:james@jameslopez.es"
+              >
+                <img
+                  class="avatar has-tooltip s20 hidden-xs"
+                  alt="James Lopez's avatar"
+                  title="James Lopez"
+                  data-container="body"
+                  src="http://www.gravatar.com/avatar/80d3b651b4be1f1db39435c2d11f1f23?s=40&amp;d=identicon"
+                >
+              </a>
+              <a
+                class="commit-row-message"
+                href="/gitlab-org/gitlab-ce/commit/{{pipeline.sha}}"
+              >
+                fix broken repo 500 errors in UI and added relevant specs
+              </a>
             </p>
           </td>
           <td class="stage-cell">
diff --git a/app/assets/javascripts/vue_pipelines_index/store.js.es6 b/app/assets/javascripts/vue_pipelines_index/store.js.es6
index f1cd991994df78c1ab7f7ef195d9e0ce075c9a5f..f9e802714dfe465d6f7519b92062b41e0269b4eb 100644
--- a/app/assets/javascripts/vue_pipelines_index/store.js.es6
+++ b/app/assets/javascripts/vue_pipelines_index/store.js.es6
@@ -12,11 +12,28 @@
             console.error('API Error for Pipelines');
           });
 
-      goFetch(Vue);
       setInterval(() => {
         console.log('DID IT');
         goFetch(Vue);
-      }, 3000);
+      }, 30000);
+    }
+
+    fetchCommits(vue) {
+      const goFetch = vueSet =>
+        this.$http.get(`/api/v3/projects/${this.scope}/pipelines`)
+          .then((response) => {
+            vueSet.set(this, 'pipelines', JSON.parse(response.body));
+          }, () => {
+            console.error('API Error for Pipelines');
+          });
+
+      this.$http.get(`/api/v3/projects/${this.scope}/repository/commits`)
+        .then((response) => {
+          vue.set(this, 'commits', JSON.parse(response.body));
+        }, () => {
+          console.error('API Error for Pipelines');
+        })
+        .then(() => goFetch(vue));
     }
   };
 })(window.gl || (window.gl = {}));
diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml
index 6309de5140921efddab10c93625a59ce8921d145..718e6b73c936ebadfcc6b91d257bc20913cc8406 100644
--- a/app/views/projects/pipelines/index.html.haml
+++ b/app/views/projects/pipelines/index.html.haml
@@ -53,6 +53,7 @@
     el: ".app",
     data:{
       scope: "#{@project.id}",
+      commits: "#{@commit}",
       store: new gl.PipelineStore(),
     },
     components: {