1 files changed, 36 insertions, 18 deletions

diff --git a/app/assets/javascripts/code_navigation/store/actions.js b/app/assets/javascripts/code_navigation/store/actions.js
index 9b607023f39..6ecede32944 100644
--- a/app/assets/javascripts/code_navigation/store/actions.js
+++ b/app/assets/javascripts/code_navigation/store/actions.js
@@ -12,20 +12,25 @@ export default {
   fetchData({ commit, dispatch, state }) {
     commit(types.REQUEST_DATA);
 
-    axios
-      .get(state.codeNavUrl)
-      .then(({ data }) => {
-        const normalizedData = data.reduce((acc, d) => {
-          if (d.hover) {
-            acc[`${d.start_line}:${d.start_char}`] = d;
-            addInteractionClass(d);
-          }
-          return acc;
-        }, {});
-
-        commit(types.REQUEST_DATA_SUCCESS, normalizedData);
-      })
-      .catch(() => dispatch('requestDataError'));
+    state.blobs.forEach(({ path, codeNavigationPath }) => {
+      axios
+        .get(codeNavigationPath)
+        .then(({ data }) => {
+          const normalizedData = data.reduce((acc, d) => {
+            if (d.hover) {
+              acc[`${d.start_line}:${d.start_char}`] = d;
+              addInteractionClass(path, d);
+            }
+            return acc;
+          }, {});
+
+          commit(types.REQUEST_DATA_SUCCESS, { path, normalizedData });
+        })
+        .catch(() => dispatch('requestDataError'));
+    });
+  },
+  showBlobInteractionZones({ state }, path) {
+    Object.values(state.data[path]).forEach(d => addInteractionClass(path, d));
   },
   showDefinition({ commit, state }, { target: el }) {
     let definition;
@@ -39,15 +44,28 @@ export default {
       getCurrentHoverElement().classList.remove('hll');
     }
 
-    if (el.classList.contains('js-code-navigation') && !isCurrentElementPopoverOpen) {
+    const blobEl = el.closest('[data-path]');
+
+    if (!blobEl) {
+      commit(types.SET_CURRENT_DEFINITION, { definition, position });
+
+      return;
+    }
+
+    const data = state.data[blobEl.dataset.path];
+
+    if (!data) return;
+
+    if (el.closest('.js-code-navigation') && !isCurrentElementPopoverOpen) {
       const { lineIndex, charIndex } = el.dataset;
+      const { x, y } = el.getBoundingClientRect();
 
       position = {
-        x: el.offsetLeft,
-        y: el.offsetTop,
+        x: x || 0,
+        y: y + window.scrollY || 0,
         height: el.offsetHeight,
       };
-      definition = state.data[`${lineIndex}:${charIndex}`];
+      definition = data[`${lineIndex}:${charIndex}`];
 
       el.classList.add('hll');