Add latest changes from gitlab-org/gitlab@master

29 files changed, 104 insertions, 104 deletions

diff --git a/app/assets/javascripts/boards/components/board.js b/app/assets/javascripts/boards/components/board.js
index ac02c229a07..517a13ceb27 100644
--- a/app/assets/javascripts/boards/components/board.js
+++ b/app/assets/javascripts/boards/components/board.js
@@ -113,9 +113,6 @@ export default Vue.extend({
       // eslint-disable-next-line @gitlab/require-i18n-strings
       return `boards.${this.boardId}.${this.list.type}.${this.list.id}`;
     },
-    helpLink() {
-      return boardsStore.scopedLabels.helpLink;
-    },
   },
   watch: {
     filter: {
diff --git a/app/assets/javascripts/boards/components/board_column.vue b/app/assets/javascripts/boards/components/board_column.vue
index faecd77d598..fb854616a04 100644
--- a/app/assets/javascripts/boards/components/board_column.vue
+++ b/app/assets/javascripts/boards/components/board_column.vue
@@ -113,9 +113,6 @@ export default {
       // eslint-disable-next-line @gitlab/require-i18n-strings
       return `boards.${this.boardId}.${this.list.type}.${this.list.id}`;
     },
-    helpLink() {
-      return boardsStore.scopedLabels.helpLink;
-    },
   },
   watch: {
     filter: {
@@ -286,7 +283,6 @@ export default {
               :background-color="list.label.color"
               :description="list.label.description"
               :scoped="showScopedLabels(list.label)"
-              :scoped-labels-documentation-link="helpLink"
               :size="!list.isExpanded ? 'sm' : ''"
               :title="list.label.title"
               tooltip-placement="bottom"
diff --git a/app/assets/javascripts/boards/components/board_form.vue b/app/assets/javascripts/boards/components/board_form.vue
index c0df8b72095..ec715759406 100644
--- a/app/assets/javascripts/boards/components/board_form.vue
+++ b/app/assets/javascripts/boards/components/board_form.vue
@@ -58,11 +58,6 @@ export default {
       required: false,
       default: false,
     },
-    scopedLabelsDocumentationLink: {
-      type: String,
-      required: false,
-      default: '#',
-    },
   },
   data() {
     return {
@@ -208,7 +203,6 @@ export default {
           :can-admin-board="canAdminBoard"
           :milestone-path="milestonePath"
           :labels-path="labelsPath"
-          :scoped-labels-documentation-link="scopedLabelsDocumentationLink"
           :enable-scoped-labels="enableScopedLabels"
           :project-id="projectId"
           :group-id="groupId"
diff --git a/app/assets/javascripts/boards/components/board_sidebar.js b/app/assets/javascripts/boards/components/board_sidebar.js
index 66a5e134205..0433b612d0b 100644
--- a/app/assets/javascripts/boards/components/board_sidebar.js
+++ b/app/assets/javascripts/boards/components/board_sidebar.js
@@ -70,9 +70,6 @@ export default Vue.extend({
     selectedLabels() {
       return this.hasLabels ? this.issue.labels.map(l => l.title).join(',') : '';
     },
-    helpLink() {
-      return boardsStore.scopedLabels.helpLink;
-    },
   },
   watch: {
     detail: {
diff --git a/app/assets/javascripts/boards/components/boards_selector.vue b/app/assets/javascripts/boards/components/boards_selector.vue
index f2c976be7ae..80db9930259 100644
--- a/app/assets/javascripts/boards/components/boards_selector.vue
+++ b/app/assets/javascripts/boards/components/boards_selector.vue
@@ -86,11 +86,6 @@ export default {
       required: false,
       default: false,
     },
-    scopedLabelsDocumentationLink: {
-      type: String,
-      required: false,
-      default: '#',
-    },
   },
   data() {
     return {
@@ -348,7 +343,6 @@ export default {
         :scoped-issue-board-feature-enabled="scopedIssueBoardFeatureEnabled"
         :weights="weights"
         :enable-scoped-labels="enabledScopedLabels"
-        :scoped-labels-documentation-link="scopedLabelsDocumentationLink"
       />
     </span>
   </div>
diff --git a/app/assets/javascripts/boards/components/issue_card_inner.vue b/app/assets/javascripts/boards/components/issue_card_inner.vue
index daaa12c096b..a589fb325b2 100644
--- a/app/assets/javascripts/boards/components/issue_card_inner.vue
+++ b/app/assets/javascripts/boards/components/issue_card_inner.vue
@@ -102,9 +102,6 @@ export default {
     orderedLabels() {
       return sortBy(this.issue.labels.filter(this.isNonListLabel), 'title');
     },
-    helpLink() {
-      return boardsStore.scopedLabels.helpLink;
-    },
   },
   methods: {
     isIndexLessThanlimit(index) {
@@ -181,7 +178,6 @@ export default {
           :description="label.description"
           size="sm"
           :scoped="showScopedLabel(label)"
-          :scoped-labels-documentation-link="helpLink"
           @click="filterByLabel(label)"
         />
       </template>
diff --git a/app/assets/javascripts/boards/stores/boards_store.js b/app/assets/javascripts/boards/stores/boards_store.js
index b8ae6396475..fdbd7e89bfb 100644
--- a/app/assets/javascripts/boards/stores/boards_store.js
+++ b/app/assets/javascripts/boards/stores/boards_store.js
@@ -28,7 +28,6 @@ const boardsStore = {
     limitToHours: false,
   },
   scopedLabels: {
-    helpLink: '',
     enabled: false,
   },
   filter: {
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue b/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue
index e618fb3daae..24499fb9f6d 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue
@@ -24,8 +24,8 @@ export default {
     discardModalTitle() {
       return sprintf(__('Discard changes to %{path}?'), { path: this.activeFile.path });
     },
-    isStaged() {
-      return !this.activeFile.changed && this.activeFile.staged;
+    canDiscard() {
+      return this.activeFile.changed || this.activeFile.staged;
     },
   },
   methods: {
@@ -53,7 +53,7 @@ export default {
     <changed-file-icon :file="activeFile" :is-centered="false" />
     <div class="ml-auto">
       <button
-        v-if="!isStaged"
+        v-if="canDiscard"
         ref="discardButton"
         type="button"
         class="btn btn-remove btn-inverted append-right-8"
diff --git a/app/assets/javascripts/jira_import/components/jira_import_app.vue b/app/assets/javascripts/jira_import/components/jira_import_app.vue
index b2c6ec47a26..b6c50b89382 100644
--- a/app/assets/javascripts/jira_import/components/jira_import_app.vue
+++ b/app/assets/javascripts/jira_import/components/jira_import_app.vue
@@ -1,5 +1,6 @@
 <script>
-import { GlAlert, GlLoadingIcon } from '@gitlab/ui';
+import { GlAlert, GlLoadingIcon, GlSprintf } from '@gitlab/ui';
+import last from 'lodash/last';
 import { __ } from '~/locale';
 import getJiraImportDetailsQuery from '../queries/get_jira_import_details.query.graphql';
 import initiateJiraImportMutation from '../queries/initiate_jira_import.mutation.graphql';
@@ -13,6 +14,7 @@ export default {
   components: {
     GlAlert,
     GlLoadingIcon,
+    GlSprintf,
     JiraImportForm,
     JiraImportProgress,
     JiraImportSetup,
@@ -51,6 +53,7 @@ export default {
     return {
       errorMessage: '',
       showAlert: false,
+      selectedProject: undefined,
     };
   },
   apollo: {
@@ -63,7 +66,7 @@ export default {
       },
       update: ({ project }) => ({
         status: project.jiraImportStatus,
-        import: project.jiraImports.nodes[0],
+        imports: project.jiraImports.nodes,
       }),
       skip() {
         return !this.isJiraConfigured;
@@ -77,6 +80,24 @@ export default {
     jiraProjectsOptions() {
       return this.jiraProjects.map(([text, value]) => ({ text, value }));
     },
+    mostRecentImport() {
+      // The backend returns JiraImports ordered by created_at asc in app/models/project.rb
+      return last(this.jiraImportDetails?.imports);
+    },
+    numberOfPreviousImportsForProject() {
+      return this.jiraImportDetails?.imports?.reduce?.(
+        (acc, jiraProject) => (jiraProject.jiraProjectKey === this.selectedProject ? acc + 1 : acc),
+        0,
+      );
+    },
+    importLabel() {
+      return this.selectedProject
+        ? `jira-import::${this.selectedProject}-${this.numberOfPreviousImportsForProject + 1}`
+        : 'jira-import::KEY-1';
+    },
+    hasPreviousImports() {
+      return this.numberOfPreviousImportsForProject > 0;
+    },
   },
   methods: {
     dismissAlert() {
@@ -97,6 +118,13 @@ export default {
               return;
             }
 
+            const cacheData = store.readQuery({
+              query: getJiraImportDetailsQuery,
+              variables: {
+                fullPath: this.projectPath,
+              },
+            });
+
             store.writeQuery({
               query: getJiraImportDetailsQuery,
               variables: {
@@ -106,7 +134,10 @@ export default {
                 project: {
                   jiraImportStatus: IMPORT_STATE.SCHEDULED,
                   jiraImports: {
-                    nodes: [data.jiraImportStart.jiraImport],
+                    nodes: [
+                      ...cacheData.project.jiraImports.nodes,
+                      data.jiraImportStart.jiraImport,
+                    ],
                     __typename: 'JiraImportConnection',
                   },
                   // eslint-disable-next-line @gitlab/require-i18n-strings
@@ -119,6 +150,8 @@ export default {
         .then(({ data }) => {
           if (data.jiraImportStart.errors.length) {
             this.setAlertMessage(data.jiraImportStart.errors.join('. '));
+          } else {
+            this.selectedProject = undefined;
           }
         })
         .catch(() => this.setAlertMessage(__('There was an error importing the Jira project.')));
@@ -136,6 +169,19 @@ export default {
     <gl-alert v-if="showAlert" variant="danger" @dismiss="dismissAlert">
       {{ errorMessage }}
     </gl-alert>
+    <gl-alert v-if="hasPreviousImports" variant="warning" :dismissible="false">
+      <gl-sprintf
+        :message="
+          __(
+            'You have imported from this project %{numberOfPreviousImportsForProject} times before. Each new import will create duplicate issues.',
+          )
+        "
+      >
+        <template #numberOfPreviousImportsForProject>{{
+          numberOfPreviousImportsForProject
+        }}</template>
+      </gl-sprintf>
+    </gl-alert>
 
     <jira-import-setup
       v-if="!isJiraConfigured"
@@ -146,13 +192,15 @@ export default {
     <jira-import-progress
       v-else-if="isImportInProgress"
       :illustration="inProgressIllustration"
-      :import-initiator="jiraImportDetails.import.scheduledBy.name"
-      :import-project="jiraImportDetails.import.jiraProjectKey"
-      :import-time="jiraImportDetails.import.scheduledAt"
+      :import-initiator="mostRecentImport.scheduledBy.name"
+      :import-project="mostRecentImport.jiraProjectKey"
+      :import-time="mostRecentImport.scheduledAt"
       :issues-path="issuesPath"
     />
     <jira-import-form
       v-else
+      v-model="selectedProject"
+      :import-label="importLabel"
       :issues-path="issuesPath"
       :jira-projects="jiraProjectsOptions"
       @initiateJiraImport="initiateJiraImport"
diff --git a/app/assets/javascripts/jira_import/components/jira_import_form.vue b/app/assets/javascripts/jira_import/components/jira_import_form.vue
index 0146f564260..c2fe7b29c28 100644
--- a/app/assets/javascripts/jira_import/components/jira_import_form.vue
+++ b/app/assets/javascripts/jira_import/components/jira_import_form.vue
@@ -13,6 +13,10 @@ export default {
   currentUserAvatarUrl: gon.current_user_avatar_url,
   currentUsername: gon.current_username,
   props: {
+    importLabel: {
+      type: String,
+      required: true,
+    },
     issuesPath: {
       type: String,
       required: true,
@@ -21,21 +25,25 @@ export default {
       type: Array,
       required: true,
     },
+    value: {
+      type: String,
+      required: false,
+      default: undefined,
+    },
   },
   data() {
     return {
-      selectedOption: null,
       selectState: null,
     };
   },
   methods: {
     initiateJiraImport(event) {
       event.preventDefault();
-      if (!this.selectedOption) {
-        this.showValidationError();
-      } else {
+      if (this.value) {
         this.hideValidationError();
-        this.$emit('initiateJiraImport', this.selectedOption);
+        this.$emit('initiateJiraImport', this.value);
+      } else {
+        this.showValidationError();
       }
     },
     hideValidationError() {
@@ -62,10 +70,11 @@ export default {
       >
         <gl-form-select
           id="jira-project-select"
-          v-model="selectedOption"
           class="mb-2"
           :options="jiraProjects"
           :state="selectState"
+          :value="value"
+          @change="$emit('input', $event)"
         />
       </gl-form-group>
 
@@ -79,7 +88,7 @@ export default {
           id="jira-project-label"
           class="mb-2"
           background-color="#428BCA"
-          title="jira-import::KEY-1"
+          :title="importLabel"
           scoped
         />
       </gl-form-group>
diff --git a/app/assets/javascripts/jira_import/queries/get_jira_import_details.query.graphql b/app/assets/javascripts/jira_import/queries/get_jira_import_details.query.graphql
index 0eaaad580fc..aa8d03c7f17 100644
--- a/app/assets/javascripts/jira_import/queries/get_jira_import_details.query.graphql
+++ b/app/assets/javascripts/jira_import/queries/get_jira_import_details.query.graphql
@@ -3,7 +3,7 @@
 query($fullPath: ID!) {
   project(fullPath: $fullPath) {
     jiraImportStatus
-    jiraImports(last: 1) {
+    jiraImports {
       nodes {
         ...JiraImport
       }
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index fb7e06cad15..9edce353a66 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -55,7 +55,6 @@ export default class LabelsSelect {
         })
         .get();
       const scopedLabels = $dropdown.data('scopedLabels');
-      const scopedLabelsDocumentationLink = $dropdown.data('scopedLabelsDocumentationLink');
       const { handleClick } = options;
       $sidebarLabelTooltip.tooltip();
 
@@ -104,7 +103,6 @@ export default class LabelsSelect {
                 labels: sortBy(data.labels, 'title'),
                 issueUpdateURL,
                 enableScopedLabels: scopedLabels,
-                scopedLabelsDocumentationLink,
               });
               labelCount = data.labels.length;
 
@@ -497,14 +495,6 @@ export default class LabelsSelect {
       return escapeStr(label.text_color === '#FFFFFF' ? label.color : label.text_color);
     };
 
-    const infoIconTemplate = template(
-      [
-        '<a href="<%= scopedLabelsDocumentationLink %>" class="gl-link gl-label-icon" target="_blank" rel="noopener">',
-        '<i class="fa fa-question-circle"></i>',
-        '</a>',
-      ].join(''),
-    );
-
     const scopedLabelTemplate = template(
       [
         '<span class="gl-label gl-label-scoped" style="color: <%= escapeStr(label.color) %>;">',
@@ -516,7 +506,6 @@ export default class LabelsSelect {
         '<%- label.title.slice(label.title.lastIndexOf("::") + 2) %>',
         '</span>',
         '</a>',
-        '<%= infoIconTemplate({ label, scopedLabelsDocumentationLink, escapeStr }) %>',
         '</span>',
       ].join(''),
     );
@@ -538,7 +527,7 @@ export default class LabelsSelect {
         '<% labels.forEach(function(label){ %>',
         '<% if (isScopedLabel(label) && enableScopedLabels) { %>',
         '<span class="d-inline-block position-relative scoped-label-wrapper">',
-        '<%= scopedLabelTemplate({ label, issueUpdateURL, isScopedLabel, enableScopedLabels, rightLabelTextColor, infoIconTemplate, scopedLabelsDocumentationLink, tooltipTitleTemplate, escapeStr, linkAttrs: \'data-html="true"\' }) %>',
+        '<%= scopedLabelTemplate({ label, issueUpdateURL, isScopedLabel, enableScopedLabels, rightLabelTextColor, tooltipTitleTemplate, escapeStr, linkAttrs: \'data-html="true"\' }) %>',
         '</span>',
         '<% } else { %>',
         '<%= labelTemplate({ label, issueUpdateURL, isScopedLabel, enableScopedLabels, tooltipTitleTemplate, escapeStr, linkAttrs: "" }) %>',
@@ -551,7 +540,6 @@ export default class LabelsSelect {
       ...tplData,
       labelTemplate,
       rightLabelTextColor,
-      infoIconTemplate,
       scopedLabelTemplate,
       tooltipTitleTemplate,
       isScopedLabel,
diff --git a/app/assets/javascripts/monitoring/components/alert_widget.vue b/app/assets/javascripts/monitoring/components/alert_widget.vue
index 2c6223c5dd7..86a793c854e 100644
--- a/app/assets/javascripts/monitoring/components/alert_widget.vue
+++ b/app/assets/javascripts/monitoring/components/alert_widget.vue
@@ -240,7 +240,7 @@ export default {
         class="d-flex-center text-truncate"
       >
         <gl-icon name="warning" :size="16" class="flex-shrink-0" />
-        <span class="text-truncate gl-pl-1">
+        <span class="text-truncate gl-pl-1-deprecated-no-really-do-not-use-me">
           <gl-sprintf
             :message="
               hasMultipleAlerts ? multipleAlertsSummary.message : singleAlertSummary.message
diff --git a/app/assets/javascripts/monitoring/components/dashboard_panel.vue b/app/assets/javascripts/monitoring/components/dashboard_panel.vue
index 29d6a2a46c5..a269ef83799 100644
--- a/app/assets/javascripts/monitoring/components/dashboard_panel.vue
+++ b/app/assets/javascripts/monitoring/components/dashboard_panel.vue
@@ -268,7 +268,7 @@ export default {
       <slot name="topLeft"></slot>
       <h5
         ref="graphTitle"
-        class="prometheus-graph-title gl-font-size-large font-weight-bold text-truncate append-right-8"
+        class="prometheus-graph-title gl-font-lg font-weight-bold text-truncate append-right-8"
       >
         {{ title }}
       </h5>
diff --git a/app/assets/javascripts/pages/projects/pipelines/index/index.js b/app/assets/javascripts/pages/projects/pipelines/index/index.js
index 4b4a274794d..894185fa8c2 100644
--- a/app/assets/javascripts/pages/projects/pipelines/index/index.js
+++ b/app/assets/javascripts/pages/projects/pipelines/index/index.js
@@ -10,6 +10,7 @@ import { __ } from '~/locale';
 import PipelinesStore from '../../../../pipelines/stores/pipelines_store';
 import pipelinesComponent from '../../../../pipelines/components/pipelines.vue';
 import Translate from '../../../../vue_shared/translate';
+import initVueAlerts from '../../../../vue_alerts';
 
 Vue.use(Translate);
 Vue.use(GlToast);
@@ -55,3 +56,5 @@ document.addEventListener(
       },
     }),
 );
+
+document.addEventListener('DOMContentLoaded', initVueAlerts);
diff --git a/app/assets/javascripts/pages/projects/show/index.js b/app/assets/javascripts/pages/projects/show/index.js
index 6ae10c98058..f74a7b41895 100644
--- a/app/assets/javascripts/pages/projects/show/index.js
+++ b/app/assets/javascripts/pages/projects/show/index.js
@@ -12,8 +12,10 @@ import initReadMore from '~/read_more';
 import leaveByUrl from '~/namespaces/leave_by_url';
 import Star from '../../../star';
 import notificationsDropdown from '../../../notifications_dropdown';
+import initVueAlerts from '../../../vue_alerts';
 
 document.addEventListener('DOMContentLoaded', () => {
+  initVueAlerts();
   initReadMore();
   new Star(); // eslint-disable-line no-new
   notificationsDropdown();
diff --git a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
index ebd7a17040a..15c220a554d 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_group_dropdown.vue
@@ -69,7 +69,9 @@ export default {
     >
       <ci-icon :status="group.status" />
 
-      <span class="ci-status-text text-truncate mw-70p gl-pl-1 d-inline-block align-bottom">
+      <span
+        class="ci-status-text text-truncate mw-70p gl-pl-1-deprecated-no-really-do-not-use-me d-inline-block align-bottom"
+      >
         {{ group.name }}
       </span>
 
diff --git a/app/assets/javascripts/pipelines/components/graph/job_name_component.vue b/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
index 7125790ac3d..74a261f35d7 100644
--- a/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/job_name_component.vue
@@ -27,7 +27,9 @@ export default {
 <template>
   <span class="ci-job-name-component mw-100">
     <ci-icon :status="status" />
-    <span class="ci-status-text text-truncate mw-70p gl-pl-1 d-inline-block align-bottom">
+    <span
+      class="ci-status-text text-truncate mw-70p gl-pl-1-deprecated-no-really-do-not-use-me d-inline-block align-bottom"
+    >
       {{ name }}
     </span>
   </span>
diff --git a/app/assets/javascripts/releases/components/evidence_block.vue b/app/assets/javascripts/releases/components/evidence_block.vue
index 59c1b3eb48e..9bb423ef2fa 100644
--- a/app/assets/javascripts/releases/components/evidence_block.vue
+++ b/app/assets/javascripts/releases/components/evidence_block.vue
@@ -80,7 +80,9 @@ export default {
             <span class="js-short monospace">{{ shortSha(index) }}</span>
           </template>
           <template slot="expanded">
-            <span class="js-expanded monospace gl-pl-1">{{ sha(index) }}</span>
+            <span class="js-expanded monospace gl-pl-1-deprecated-no-really-do-not-use-me">{{
+              sha(index)
+            }}</span>
           </template>
         </expand-button>
         <clipboard-button
diff --git a/app/assets/javascripts/releases/components/release_block_header.vue b/app/assets/javascripts/releases/components/release_block_header.vue
index 6f7e1dcfe2f..1e703c247ae 100644
--- a/app/assets/javascripts/releases/components/release_block_header.vue
+++ b/app/assets/javascripts/releases/components/release_block_header.vue
@@ -41,7 +41,7 @@ export default {
 
 <template>
   <div class="card-header d-flex align-items-center bg-white pr-0">
-    <h2 class="card-title my-2 mr-auto gl-font-size-20">
+    <h2 class="card-title my-2 mr-auto gl-font-size-20-deprecated-no-really-do-not-use-me">
       <gl-link v-if="selfLink" :href="selfLink" class="font-size-inherit">
         {{ release.name }}
       </gl-link>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment_info.vue b/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment_info.vue
index 33db9b87b17..2f922b990d9 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment_info.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/deployment/deployment_info.vue
@@ -75,7 +75,7 @@ export default {
           :href="deployment.url"
           target="_blank"
           rel="noopener noreferrer nofollow"
-          class="js-deploy-meta gl-font-size-12"
+          class="js-deploy-meta gl-font-sm"
         >
           {{ deployment.name }}
         </gl-link>
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_collapsible_extension.vue b/app/assets/javascripts/vue_merge_request_widget/components/mr_collapsible_extension.vue
index ba8da46d207..294871ca5c2 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/mr_collapsible_extension.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_collapsible_extension.vue
@@ -51,7 +51,7 @@ export default {
     <div class="mr-widget-extension d-flex align-items-center pl-3">
       <div v-if="hasError" class="ci-widget media">
         <div class="media-body">
-          <span class="gl-font-size-small mr-widget-margin-left gl-line-height-24 js-error-state">{{
+          <span class="gl-font-sm mr-widget-margin-left gl-line-height-24 js-error-state">{{
             title
           }}</span>
         </div>
diff --git a/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue b/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue
index ffc616d7309..37998f8aa97 100644
--- a/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue
+++ b/app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue
@@ -169,15 +169,15 @@ export default {
       menu-class="date-time-picker-menu"
       toggle-class="date-time-picker-toggle text-truncate"
     >
-      <div class="d-flex justify-content-between gl-p-2">
+      <div class="d-flex justify-content-between gl-p-2-deprecated-no-really-do-not-use-me">
         <gl-form-group
           v-if="customEnabled"
           :label="__('Custom range')"
           label-for="custom-from-time"
-          label-class="gl-pb-1"
-          class="custom-time-range-form-group col-md-7 gl-pl-1 gl-pr-0 m-0"
+          label-class="gl-pb-1-deprecated-no-really-do-not-use-me"
+          class="custom-time-range-form-group col-md-7 gl-pl-1-deprecated-no-really-do-not-use-me gl-pr-0 m-0"
         >
-          <div class="gl-pt-2">
+          <div class="gl-pt-2-deprecated-no-really-do-not-use-me">
             <date-time-picker-input
               id="custom-time-from"
               v-model="startInput"
@@ -198,9 +198,12 @@ export default {
             </gl-deprecated-button>
           </gl-form-group>
         </gl-form-group>
-        <gl-form-group label-for="group-id-dropdown" class="col-md-5 gl-pl-1 gl-pr-1 m-0">
+        <gl-form-group
+          label-for="group-id-dropdown"
+          class="col-md-5 gl-pl-1-deprecated-no-really-do-not-use-me gl-pr-1-deprecated-no-really-do-not-use-me m-0"
+        >
           <template #label>
-            <span class="gl-pl-5">{{ __('Quick range') }}</span>
+            <span class="gl-pl-5-deprecated-no-really-do-not-use-me">{{ __('Quick range') }}</span>
           </template>
 
           <gl-dropdown-item
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue
index 44cc11a6aaa..5eef439aa90 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue
@@ -80,11 +80,6 @@ export default {
       required: false,
       default: false,
     },
-    scopedLabelsDocumentationLink: {
-      type: String,
-      required: false,
-      default: '#',
-    },
   },
   computed: {
     hiddenInputName() {
@@ -136,7 +131,6 @@ export default {
     <dropdown-value
       :labels="context.labels"
       :label-filter-base-path="labelFilterBasePath"
-      :scoped-labels-documentation-link="scopedLabelsDocumentationLink"
       :enable-scoped-labels="enableScopedLabels"
     >
       <slot></slot>
@@ -157,7 +151,6 @@ export default {
           :namespace="namespace"
           :labels="context.labels"
           :show-extra-options="!showCreate"
-          :scoped-labels-documentation-link="scopedLabelsDocumentationLink"
           :enable-scoped-labels="enableScopedLabels"
         />
         <div
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_button.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_button.vue
index c3bc61d0053..30f7e6a5980 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_button.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_button.vue
@@ -36,11 +36,6 @@ export default {
       required: false,
       default: false,
     },
-    scopedLabelsDocumentationLink: {
-      type: String,
-      required: false,
-      default: '#',
-    },
   },
   computed: {
     dropdownToggleText() {
@@ -72,7 +67,6 @@ export default {
     :data-namespace-path="namespace"
     :data-show-any="showExtraOptions"
     :data-scoped-labels="enableScopedLabels"
-    :data-scoped-labels-documentation-link="scopedLabelsDocumentationLink"
     type="button"
     class="dropdown-menu-toggle wide js-label-select js-multiselect js-context-config-modal"
     data-toggle="dropdown"
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value.vue
index fe43f77b1ee..71d7069dd57 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value.vue
@@ -20,11 +20,6 @@ export default {
       required: false,
       default: false,
     },
-    scopedLabelsDocumentationLink: {
-      type: String,
-      required: false,
-      default: '#',
-    },
   },
   computed: {
     isEmpty() {
@@ -64,7 +59,6 @@ export default {
         :title="label.title"
         :description="label.description"
         :scoped="showScopedLabels(label)"
-        :scoped-labels-documentation-link="scopedLabelsDocumentationLink"
       />
     </template>
   </div>
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue
index 695af775750..12ad2acf308 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue
@@ -9,12 +9,7 @@ export default {
     GlLabel,
   },
   computed: {
-    ...mapState([
-      'selectedLabels',
-      'allowScopedLabels',
-      'labelsFilterBasePath',
-      'scopedLabelsDocumentationPath',
-    ]),
+    ...mapState(['selectedLabels', 'allowScopedLabels', 'labelsFilterBasePath']),
   },
   methods: {
     labelFilterUrl(label) {
@@ -45,7 +40,6 @@ export default {
         :background-color="label.color"
         :target="labelFilterUrl(label)"
         :scoped="scopedLabel(label)"
-        :scoped-labels-documentation-link="scopedLabelsDocumentationPath"
         tooltip-placement="top"
       />
     </template>
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue
index 78102caacf5..0ab45e3308c 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue
@@ -67,11 +67,6 @@ export default {
       required: false,
       default: '',
     },
-    scopedLabelsDocumentationPath: {
-      type: String,
-      required: false,
-      default: '',
-    },
     labelsListTitle: {
       type: String,
       required: false,
@@ -113,7 +108,6 @@ export default {
       labelsFetchPath: this.labelsFetchPath,
       labelsManagePath: this.labelsManagePath,
       labelsFilterBasePath: this.labelsFilterBasePath,
-      scopedLabelsDocumentationPath: this.scopedLabelsDocumentationPath,
       labelsListTitle: this.labelsListTitle,
       labelsCreateTitle: this.labelsCreateTitle,
       footerCreateLabelTitle: this.footerCreateLabelTitle,
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/store/state.js b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/store/state.js
index ceabc696693..c83bf9e47ec 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/store/state.js
+++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/store/state.js
@@ -11,7 +11,6 @@ export default () => ({
   namespace: '',
   labelsFetchPath: '',
   labelsFilterBasePath: '',
-  scopedLabelsDocumentationPath: '#',
 
   // UI Flags
   allowLabelCreate: false,