Add latest changes from gitlab-org/gitlab@master

3 files changed, 30 insertions, 6 deletions

diff --git a/app/assets/javascripts/blob/blob_blame_link.js b/app/assets/javascripts/blob/blob_blame_link.js
index 41dfd7b82b8..a5191a3d513 100644
--- a/app/assets/javascripts/blob/blob_blame_link.js
+++ b/app/assets/javascripts/blob/blob_blame_link.js
@@ -1,4 +1,6 @@
-function addBlameLink(containerSelector, linkClass) {
+import { getPageParamValue, getPageSearchString } from './utils';
+
+export function addBlameLink(containerSelector, linkClass) {
   const containerEl = document.querySelector(containerSelector);
 
   if (!containerEl) {
@@ -13,10 +15,14 @@ function addBlameLink(containerSelector, linkClass) {
       lineLinkCopy.classList.remove(linkClass, 'diff-line-num');
 
       const { lineNumber } = lineLink.dataset;
-      const { blamePath } = document.querySelector('.line-numbers').dataset;
       const blameLink = document.createElement('a');
+      const { blamePath } = document.querySelector('.line-numbers').dataset;
       blameLink.classList.add('file-line-blame');
-      blameLink.href = `${blamePath}#L${lineNumber}`;
+      const blamePerPage = document.querySelector('.js-per-page')?.dataset?.blamePerPage;
+      const pageNumber = getPageParamValue(lineNumber, blamePerPage);
+      const searchString = getPageSearchString(blamePath, pageNumber);
+
+      blameLink.href = `${blamePath}${searchString}#L${lineNumber}`;
 
       const wrapper = document.createElement('div');
       wrapper.classList.add('line-links', 'diff-line-num');
@@ -27,5 +33,3 @@ function addBlameLink(containerSelector, linkClass) {
     }
   });
 }
-
-export default addBlameLink;
diff --git a/app/assets/javascripts/blob/blob_line_permalink_updater.js b/app/assets/javascripts/blob/blob_line_permalink_updater.js
index df38c5400e2..928035d7c1e 100644
--- a/app/assets/javascripts/blob/blob_line_permalink_updater.js
+++ b/app/assets/javascripts/blob/blob_line_permalink_updater.js
@@ -1,4 +1,5 @@
 import { getLocationHash } from '../lib/utils/url_utility';
+import { getPageParamValue, getPageSearchString } from './utils';
 
 const lineNumberRe = /^(L|LC)[0-9]+/;
 
@@ -16,7 +17,10 @@ const updateLineNumbersOnBlobPermalinks = (linksToUpdate) => {
           permalinkButton.dataset.originalHref = href;
           return href;
         })();
-      permalinkButton.setAttribute('href', `${baseHref}${hashUrlString}`);
+      const lineNum = parseInt(hash.split('L')[1], 10);
+      const page = getPageParamValue(lineNum);
+      const searchString = getPageSearchString(baseHref, page);
+      permalinkButton.setAttribute('href', `${baseHref}${searchString}${hashUrlString}`);
     });
   }
 };
diff --git a/app/assets/javascripts/blob/utils.js b/app/assets/javascripts/blob/utils.js
index bbc061dd36e..92c6277d4f1 100644
--- a/app/assets/javascripts/blob/utils.js
+++ b/app/assets/javascripts/blob/utils.js
@@ -1,4 +1,5 @@
 import Editor from '~/editor/source_editor';
+import { getBaseURL } from '~/lib/utils/url_utility';
 
 export function initSourceEditor({ el, ...args }) {
   const editor = new Editor({
@@ -13,4 +14,19 @@ export function initSourceEditor({ el, ...args }) {
   });
 }
 
+const blameLinesPerPage = document.querySelector('.js-per-page')?.dataset?.blamePerPage;
+
+export const getPageParamValue = (lineNum, blamePerPage = blameLinesPerPage) => {
+  if (!blamePerPage) return '';
+  const page = Math.ceil(parseInt(lineNum, 10) / parseInt(blamePerPage, 10));
+  return page <= 1 ? '' : page;
+};
+
+export const getPageSearchString = (path, page) => {
+  if (!page) return '';
+  const url = new URL(path, getBaseURL());
+  url.searchParams.set('page', page);
+  return url.search;
+};
+
 export default () => ({});