From 28b374eea4e2890514067ac7875b4c1d252c5cdd Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Thu, 1 Sep 2022 14:15:38 +0000 Subject: Add latest changes from gitlab-org/gitlab@15-3-stable-ee --- .../batch_comments/components/review_bar.vue | 28 ------------------- app/assets/javascripts/batch_comments/i18n.js | 3 --- .../stores/modules/batch_comments/actions.js | 5 ---- app/assets/javascripts/blob/blob_blame_link.js | 31 ++++++++++++++++++++++ app/assets/javascripts/blob/blob_links_tracking.js | 9 +++++-- app/assets/javascripts/pages/projects/init_blob.js | 7 ----- .../repository/components/blob_content_viewer.vue | 2 ++ .../components/source_viewer/source_viewer.vue | 2 ++ app/assets/stylesheets/framework/highlight.scss | 23 +++++----------- 9 files changed, 49 insertions(+), 61 deletions(-) delete mode 100644 app/assets/javascripts/batch_comments/i18n.js create mode 100644 app/assets/javascripts/blob/blob_blame_link.js (limited to 'app/assets') diff --git a/app/assets/javascripts/batch_comments/components/review_bar.vue b/app/assets/javascripts/batch_comments/components/review_bar.vue index 111b670596b..3cd1a2525e9 100644 --- a/app/assets/javascripts/batch_comments/components/review_bar.vue +++ b/app/assets/javascripts/batch_comments/components/review_bar.vue @@ -2,20 +2,10 @@ import { mapActions, mapGetters } from 'vuex'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { REVIEW_BAR_VISIBLE_CLASS_NAME } from '../constants'; -import { PREVENT_LEAVING_PENDING_REVIEW } from '../i18n'; import PreviewDropdown from './preview_dropdown.vue'; import PublishButton from './publish_button.vue'; import SubmitDropdown from './submit_dropdown.vue'; -function closeInterrupt(event) { - event.preventDefault(); - - // This is the correct way to write backwards-compatible beforeunload listeners - // https://developer.chrome.com/blog/page-lifecycle-api/#the-beforeunload-event - /* eslint-disable-next-line no-return-assign, no-param-reassign */ - return (event.returnValue = PREVENT_LEAVING_PENDING_REVIEW); -} - export default { components: { PreviewDropdown, @@ -35,26 +25,8 @@ export default { }, mounted() { document.body.classList.add(REVIEW_BAR_VISIBLE_CLASS_NAME); - /* - * This stuff is a lot trickier than it looks. - * - * Mandatory reading: https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event - * Some notable sentences: - * - "[...] browsers may not display prompts created in beforeunload event handlers unless the - * page has been interacted with, or may even not display them at all." - * - "Especially on mobile, the beforeunload event is not reliably fired." - * - "The beforeunload event is not compatible with the back/forward cache (bfcache) [...] - * It is recommended that developers listen for beforeunload only in this scenario, and only - * when they actually have unsaved changes, so as to minimize the effect on performance." - * - * Please ensure that this is really not working before you modify it, because there are a LOT - * of scenarios where browser behavior will make it _seem_ like it's not working, but it actually - * is under the right combination of contexts. - */ - window.addEventListener('beforeunload', closeInterrupt, { capture: true }); }, beforeDestroy() { - window.removeEventListener('beforeunload', closeInterrupt, { capture: true }); document.body.classList.remove(REVIEW_BAR_VISIBLE_CLASS_NAME); }, methods: { diff --git a/app/assets/javascripts/batch_comments/i18n.js b/app/assets/javascripts/batch_comments/i18n.js deleted file mode 100644 index 6cdbf00f9ca..00000000000 --- a/app/assets/javascripts/batch_comments/i18n.js +++ /dev/null @@ -1,3 +0,0 @@ -import { __ } from '~/locale'; - -export const PREVENT_LEAVING_PENDING_REVIEW = __('There are unsubmitted review comments.'); diff --git a/app/assets/javascripts/batch_comments/stores/modules/batch_comments/actions.js b/app/assets/javascripts/batch_comments/stores/modules/batch_comments/actions.js index 863d2a99972..a44b9827fe9 100644 --- a/app/assets/javascripts/batch_comments/stores/modules/batch_comments/actions.js +++ b/app/assets/javascripts/batch_comments/stores/modules/batch_comments/actions.js @@ -1,12 +1,9 @@ import { isEmpty } from 'lodash'; - import createFlash from '~/flash'; import { scrollToElement } from '~/lib/utils/common_utils'; import { __ } from '~/locale'; - import { CHANGES_TAB, DISCUSSION_TAB, SHOW_TAB } from '../../../constants'; import service from '../../../services/drafts_service'; - import * as types from './mutation_types'; export const saveDraft = ({ dispatch }, draft) => @@ -18,7 +15,6 @@ export const addDraftToDiscussion = ({ commit }, { endpoint, data }) => .then((res) => res.data) .then((res) => { commit(types.ADD_NEW_DRAFT, res); - return res; }) .catch(() => { @@ -33,7 +29,6 @@ export const createNewDraft = ({ commit }, { endpoint, data }) => .then((res) => res.data) .then((res) => { commit(types.ADD_NEW_DRAFT, res); - return res; }) .catch(() => { diff --git a/app/assets/javascripts/blob/blob_blame_link.js b/app/assets/javascripts/blob/blob_blame_link.js new file mode 100644 index 00000000000..41dfd7b82b8 --- /dev/null +++ b/app/assets/javascripts/blob/blob_blame_link.js @@ -0,0 +1,31 @@ +function addBlameLink(containerSelector, linkClass) { + const containerEl = document.querySelector(containerSelector); + + if (!containerEl) { + return; + } + + containerEl.addEventListener('mouseover', (e) => { + const isLineLink = e.target.classList.contains(linkClass); + if (isLineLink) { + const lineLink = e.target; + const lineLinkCopy = lineLink.cloneNode(true); + lineLinkCopy.classList.remove(linkClass, 'diff-line-num'); + + const { lineNumber } = lineLink.dataset; + const { blamePath } = document.querySelector('.line-numbers').dataset; + const blameLink = document.createElement('a'); + blameLink.classList.add('file-line-blame'); + blameLink.href = `${blamePath}#L${lineNumber}`; + + const wrapper = document.createElement('div'); + wrapper.classList.add('line-links', 'diff-line-num'); + + wrapper.appendChild(blameLink); + wrapper.appendChild(lineLinkCopy); + lineLink.replaceWith(wrapper); + } + }); +} + +export default addBlameLink; diff --git a/app/assets/javascripts/blob/blob_links_tracking.js b/app/assets/javascripts/blob/blob_links_tracking.js index 9a49aa8b0fc..713cc3fad05 100644 --- a/app/assets/javascripts/blob/blob_links_tracking.js +++ b/app/assets/javascripts/blob/blob_links_tracking.js @@ -1,7 +1,12 @@ import Tracking from '~/tracking'; -function addBlobLinksTracking(containerSelector, eventsToTrack) { - const containerEl = document.querySelector(containerSelector); +const eventsToTrack = [ + { selector: '.file-line-blame', property: 'blame' }, + { selector: '.file-line-num', property: 'link' }, +]; + +function addBlobLinksTracking() { + const containerEl = document.querySelector('.file-holder'); if (!containerEl) { return; diff --git a/app/assets/javascripts/pages/projects/init_blob.js b/app/assets/javascripts/pages/projects/init_blob.js index f7849e8d588..f37a2987685 100644 --- a/app/assets/javascripts/pages/projects/init_blob.js +++ b/app/assets/javascripts/pages/projects/init_blob.js @@ -4,7 +4,6 @@ import BlobForkSuggestion from '~/blob/blob_fork_suggestion'; import BlobLinePermalinkUpdater from '~/blob/blob_line_permalink_updater'; import LineHighlighter from '~/blob/line_highlighter'; import initBlobBundle from '~/blob_edit/blob_bundle'; -import addBlobLinksTracking from '~/blob/blob_links_tracking'; export default () => { new LineHighlighter(); // eslint-disable-line no-new @@ -16,12 +15,6 @@ export default () => { document.querySelectorAll('.js-data-file-blob-permalink-url, .js-blob-blame-link'), ); - const eventsToTrack = [ - { selector: '.file-line-blame', property: 'blame' }, - { selector: '.file-line-num', property: 'link' }, - ]; - addBlobLinksTracking('#blob-content-holder', eventsToTrack); - const fileBlobPermalinkUrlElement = document.querySelector('.js-data-file-blob-permalink-url'); const fileBlobPermalinkUrl = fileBlobPermalinkUrlElement && fileBlobPermalinkUrlElement.getAttribute('href'); diff --git a/app/assets/javascripts/repository/components/blob_content_viewer.vue b/app/assets/javascripts/repository/components/blob_content_viewer.vue index 7999b916e0f..78572f11f6f 100644 --- a/app/assets/javascripts/repository/components/blob_content_viewer.vue +++ b/app/assets/javascripts/repository/components/blob_content_viewer.vue @@ -13,6 +13,7 @@ import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import WebIdeLink from '~/vue_shared/components/web_ide_link.vue'; import CodeIntelligence from '~/code_navigation/components/app.vue'; import LineHighlighter from '~/blob/line_highlighter'; +import addBlameLink from '~/blob/blob_blame_link'; import getRefMixin from '../mixins/get_ref'; import blobInfoQuery from '../queries/blob_info.query.graphql'; import userInfoQuery from '../queries/user_info.query.graphql'; @@ -242,6 +243,7 @@ export default { if (type === SIMPLE_BLOB_VIEWER) { new LineHighlighter(); // eslint-disable-line no-new + addBlameLink('.file-holder', 'js-line-links'); } }); diff --git a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue index ccc8b44942a..f471db24889 100644 --- a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue +++ b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue @@ -3,6 +3,7 @@ import { GlSafeHtmlDirective, GlLoadingIcon } from '@gitlab/ui'; import LineHighlighter from '~/blob/line_highlighter'; import eventHub from '~/notes/event_hub'; import languageLoader from '~/content_editor/services/highlight_js_language_loader'; +import addBlobLinksTracking from '~/blob/blob_links_tracking'; import Tracking from '~/tracking'; import { EVENT_ACTION, @@ -66,6 +67,7 @@ export default { }, }, async created() { + addBlobLinksTracking(); this.trackEvent(EVENT_LABEL_VIEWER); if (this.unsupportedLanguage) { diff --git a/app/assets/stylesheets/framework/highlight.scss b/app/assets/stylesheets/framework/highlight.scss index 2b76e70fa17..ab426f388c6 100644 --- a/app/assets/stylesheets/framework/highlight.scss +++ b/app/assets/stylesheets/framework/highlight.scss @@ -95,23 +95,14 @@ td.line-numbers { .blob-viewer { .line-numbers { + min-width: 6rem; // for server-side-rendering .line-links { @include gl-display-flex; - - - &:first-child { - margin-top: 10px; - } - - &:last-child { - margin-bottom: 10px; - } } // for client &.line-links { - min-width: 6rem; border-bottom-left-radius: 0; + pre { @@ -120,15 +111,15 @@ td.line-numbers { } } - .line-links { - &:hover a::before, - &:focus-within a::before { - @include gl-visibility-visible; - } + .line-numbers:not(.line-links) a:hover::before, + .line-numbers:not(.line-links) a:focus-within::before, + .line-links:hover a::before, + .line-links:focus-within a::before { + @include gl-visibility-visible; } + .file-line-num { - min-width: 4.5rem; @include gl-justify-content-end; @include gl-flex-grow-1; @include gl-pr-3; -- cgit v1.2.3