Resetting of active Line + setting it for the async display functions

3 files changed, 22 insertions, 13 deletions

diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue
index 04732489c5f..9a9d200b8c6 100644
--- a/app/assets/javascripts/repo/components/repo_preview.vue
+++ b/app/assets/javascripts/repo/components/repo_preview.vue
@@ -14,6 +14,11 @@ export default {
     highlightFile() {
       $(this.$el).find('.file-content').syntaxHighlight();
     },
+    highlightLine() {
+      if (Store.activeLine > -1) {
+        this.lineHighlighter.highlightHash(`#L${Store.activeLine}`);
+      }
+    }
   },
   mounted() {
     this.highlightFile();
@@ -26,10 +31,11 @@ export default {
     html() {
       this.$nextTick(() => {
         this.highlightFile();
+        this.highlightLine();
       });
     },
     activeLine() {
-      this.lineHighlighter.highlightHash(`#L${Store.activeLine}`);
+      this.highlightLine();
     },
   },
 };
diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue
index 99bf471b83d..10de23d0199 100644
--- a/app/assets/javascripts/repo/components/repo_sidebar.vue
+++ b/app/assets/javascripts/repo/components/repo_sidebar.vue
@@ -33,26 +33,25 @@ export default {
         // Maybe it is not in the current tree but in the opened tabs
         selectedFile = Helper.getFileFromPath(location.pathname);
       }
+
+      let lineNumber = null;
+      if (location.hash.indexOf('#L') > -1) lineNumber = Number(location.hash.substr(2));
+
       if (selectedFile) {
         if (selectedFile.url !== this.activeFile.url) {
-          this.fileClicked(selectedFile);
-        }
-
-        if (location.hash.indexOf('#L') > -1) {
-          const lineNumber = Number(location.hash.substr(2));
-          if (!isNaN(lineNumber)) {
-            Store.setActiveLine(lineNumber);
-          }
+          this.fileClicked(selectedFile, lineNumber);
+        } else {
+          Store.setActiveLine(lineNumber);
         }
       } else {
         // Not opened at all lets open new tab
         this.fileClicked({
           url: location.href,
-        });
+        }, lineNumber);
       }
     },
 
-    fileClicked(clickedFile) {
+    fileClicked(clickedFile, lineNumber) {
       let file = clickedFile;
       if (file.loading) return;
       file.loading = true;
@@ -60,17 +59,20 @@ export default {
       if (file.type === 'tree' && file.opened) {
         file = Store.removeChildFilesOfTree(file);
         file.loading = false;
+        Store.setActiveLine(lineNumber);
       } else {
         const openFile = Helper.getFileFromPath(file.url);
         if (openFile) {
           file.loading = false;
           Store.setActiveFiles(openFile);
+          Store.setActiveLine(lineNumber);
         } else {
           Service.url = file.url;
           Helper.getContent(file)
             .then(() => {
               file.loading = false;
               Helper.scrollTabsRight();
+              Store.setActiveLine(lineNumber);
             })
             .catch(Helper.loadingError);
         }
diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js
index 0d1853ff148..93b39cff27e 100644
--- a/app/assets/javascripts/repo/stores/repo_store.js
+++ b/app/assets/javascripts/repo/stores/repo_store.js
@@ -26,7 +26,7 @@ const RepoStore = {
   },
   activeFile: Helper.getDefaultActiveFile(),
   activeFileIndex: 0,
-  activeLine: 0,
+  activeLine: -1,
   activeFileLabel: 'Raw',
   files: [],
   isCommitable: false,
@@ -85,6 +85,7 @@ const RepoStore = {
 
     if (!file.loading) Helper.updateHistoryEntry(file.url, file.pageTitle || file.name);
     RepoStore.binary = file.binary;
+    RepoStore.setActiveLine(-1);
   },
 
   setFileActivity(file, openedFile, i) {
@@ -102,7 +103,7 @@ const RepoStore = {
   },
 
   setActiveLine(activeLine) {
-    RepoStore.activeLine = activeLine;
+    if (!isNaN(activeLine)) RepoStore.activeLine = activeLine;
   },
 
   setActiveToRaw() {