Add latest changes from gitlab-org/gitlab@master

19 files changed, 89 insertions, 36 deletions

diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
index 22512a6f12a..da96e6f36b4 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
@@ -2,7 +2,8 @@
 import Vue from 'vue';
 import Cookies from 'js-cookie';
 import Translate from '../../../../../vue_shared/translate';
-import illustrationSvg from '../icons/intro_illustration.svg';
+// Full path is needed for Jest to be able to correctly mock this file
+import illustrationSvg from '~/pages/projects/pipeline_schedules/shared/icons/intro_illustration.svg';
 import { parseBoolean } from '~/lib/utils/common_utils';
 
 Vue.use(Translate);
diff --git a/app/assets/javascripts/snippets/components/snippet_header.vue b/app/assets/javascripts/snippets/components/snippet_header.vue
index df239427224..c0967e9093c 100644
--- a/app/assets/javascripts/snippets/components/snippet_header.vue
+++ b/app/assets/javascripts/snippets/components/snippet_header.vue
@@ -127,7 +127,7 @@ export default {
   },
   methods: {
     redirectToSnippets() {
-      window.location.pathname = this.snippet.project?.fullPath || 'dashboard/snippets';
+      window.location.pathname = `${this.snippet.project?.fullPath || 'dashboard'}/snippets`;
     },
     closeDeleteModal() {
       this.$refs.deleteModal.hide();
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_pipeline_tour.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_pipeline_tour.vue
index 01a195049ba..f6bfb178437 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_pipeline_tour.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_pipeline_tour.vue
@@ -1,5 +1,4 @@
 <script>
-import { s__, sprintf } from '~/locale';
 import { GlPopover, GlDeprecatedButton } from '@gitlab/ui';
 import Icon from '~/vue_shared/components/icon.vue';
 import Cookies from 'js-cookie';
@@ -15,18 +14,6 @@ export default {
   dismissTrackValue: 20,
   showTrackValue: 10,
   trackEvent: 'click_button',
-  popoverContent: sprintf(
-    '%{messageText1}%{lineBreak}%{messageText2}%{lineBreak}%{messageText3}%{lineBreak}%{messageText4}%{lineBreak}%{messageText5}',
-    {
-      messageText1: s__('mrWidget|Detect issues before deployment with a CI pipeline'),
-      messageText2: s__('mrWidget|that continuously tests your code. We created'),
-      messageText3: s__("mrWidget|a quick guide that'll show you how to create"),
-      messageText4: s__('mrWidget|one. Make your code more secure and more'),
-      messageText5: s__('mrWidget|robust in just a minute.'),
-      lineBreak: '<br/>',
-    },
-    false,
-  ),
   components: {
     GlPopover,
     GlDeprecatedButton,
@@ -110,7 +97,13 @@ export default {
     <div class="svg-content svg-150 pt-1">
       <img :src="pipelineSvgPath" />
     </div>
-    <p v-html="$options.popoverContent"></p>
+    <p>
+      {{
+        s__(
+          'mrWidget|Detect issues before deployment with a CI pipeline that continuously tests your code. We created a quick guide that will show you how to create one. Make your code more secure and more robust in just a minute.',
+        )
+      }}
+    </p>
     <gl-deprecated-button
       ref="ok"
       category="primary"
diff --git a/app/assets/stylesheets/bootstrap_migration.scss b/app/assets/stylesheets/bootstrap_migration.scss
index ed5c133950d..1c15400542a 100644
--- a/app/assets/stylesheets/bootstrap_migration.scss
+++ b/app/assets/stylesheets/bootstrap_migration.scss
@@ -211,7 +211,7 @@ h3.popover-header {
 }
 
 .info-well {
-  background: $gray-50;
+  background: $gray-10;
   color: $gl-text-color;
   border: 1px solid $border-color;
   border-radius: 4px;
diff --git a/app/assets/stylesheets/components/dashboard_skeleton.scss b/app/assets/stylesheets/components/dashboard_skeleton.scss
index 2e2c1fefc79..ce33aa94df3 100644
--- a/app/assets/stylesheets/components/dashboard_skeleton.scss
+++ b/app/assets/stylesheets/components/dashboard_skeleton.scss
@@ -68,7 +68,7 @@
       background-size: cover;
       background-image: linear-gradient(to right,
       $gray-100 0%,
-      $gray-50 20%,
+      $gray-10 20%,
       $gray-100 40%,
       $gray-100 100%);
       border-radius: $gl-padding;
diff --git a/app/assets/stylesheets/framework/animations.scss b/app/assets/stylesheets/framework/animations.scss
index d222fc4aefe..13174687e5d 100644
--- a/app/assets/stylesheets/framework/animations.scss
+++ b/app/assets/stylesheets/framework/animations.scss
@@ -193,7 +193,7 @@ a {
       background-size: cover;
       background-image: linear-gradient(to right,
       $gray-100 0%,
-      $gray-50 20%,
+      $gray-10 20%,
       $gray-100 40%,
       $gray-100 100%);
       height: 10px;
diff --git a/app/assets/stylesheets/framework/typography.scss b/app/assets/stylesheets/framework/typography.scss
index aaad640b7f0..1afcbc6d514 100644
--- a/app/assets/stylesheets/framework/typography.scss
+++ b/app/assets/stylesheets/framework/typography.scss
@@ -86,7 +86,7 @@
     line-height: 10px;
     color: $gl-gray-700;
     vertical-align: middle;
-    background-color: $gray-50;
+    background-color: $gray-10;
     border-width: 1px;
     border-style: solid;
     border-color: $gray-200 $gray-200 $gray-400;
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 38f5ebdc4fa..ac4d431ea57 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -163,7 +163,8 @@ $red-800: #8b2615;
 $red-900: #711e11;
 $red-950: #4b140b;
 
-$gray-50: #fafafa;
+$gray-10: #fafafa;
+$gray-50: #f0f0f0;
 $gray-100: #f2f2f2;
 $gray-200: #dfdfdf;
 $gray-300: #ccc;
@@ -232,6 +233,7 @@ $reds: (
 );
 
 $grays: (
+  '10': $gray-10,
   '50': $gray-50,
   '100': $gray-100,
   '200': $gray-200,
@@ -699,7 +701,7 @@ $logs-p-color: #333;
 */
 $input-height: 34px;
 $input-danger-bg: #f2dede;
-$input-group-addon-bg: $gray-50;
+$input-group-addon-bg: $gray-10;
 $gl-field-focus-shadow: rgba(0, 0, 0, 0.075);
 $gl-field-focus-shadow-error: rgba($red-500, 0.6);
 $input-short-width: 200px;
diff --git a/app/assets/stylesheets/page_bundles/_ide_monaco_overrides.scss b/app/assets/stylesheets/page_bundles/_ide_monaco_overrides.scss
index 49175a244de..5675835a622 100644
--- a/app/assets/stylesheets/page_bundles/_ide_monaco_overrides.scss
+++ b/app/assets/stylesheets/page_bundles/_ide_monaco_overrides.scss
@@ -147,7 +147,7 @@
     .monaco-editor,
     .monaco-editor-background,
     .monaco-editor .inputarea.ime-input {
-      background-color: $gray-50;
+      background-color: $gray-10;
     }
   }
 }
diff --git a/app/assets/stylesheets/page_bundles/ide.scss b/app/assets/stylesheets/page_bundles/ide.scss
index 37a176adf84..61914740ac0 100644
--- a/app/assets/stylesheets/page_bundles/ide.scss
+++ b/app/assets/stylesheets/page_bundles/ide.scss
@@ -1124,7 +1124,7 @@ $ide-commit-header-height: 48px;
 .ide-commit-editor-header {
   height: 65px;
   padding: 8px 16px;
-  background-color: var(--ide-background, $gray-50);
+  background-color: var(--ide-background, $gray-10);
   box-shadow: inset 0 -1px var(--ide-border-color, $white-dark);
 }
 
diff --git a/app/assets/stylesheets/pages/prometheus.scss b/app/assets/stylesheets/pages/prometheus.scss
index d86bf92eac4..0f56b98a78d 100644
--- a/app/assets/stylesheets/pages/prometheus.scss
+++ b/app/assets/stylesheets/pages/prometheus.scss
@@ -151,7 +151,7 @@
       > .arrow::after {
         border-top: 6px solid transparent;
         border-bottom: 6px solid transparent;
-        border-left: 4px solid $gray-50;
+        border-left: 4px solid $gray-10;
       }
 
       .arrow-shadow {
@@ -173,7 +173,7 @@
       > .arrow::after {
         border-top: 6px solid transparent;
         border-bottom: 6px solid transparent;
-        border-right: 4px solid $gray-50;
+        border-right: 4px solid $gray-10;
       }
 
       .arrow-shadow {
@@ -207,7 +207,7 @@
     }
 
     > .popover-title {
-      background-color: $gray-50;
+      background-color: $gray-10;
       border-radius: $border-radius-default $border-radius-default 0 0;
     }
   }
diff --git a/app/assets/stylesheets/snippets.scss b/app/assets/stylesheets/snippets.scss
index 93a12cf28a2..d410a16a1d9 100644
--- a/app/assets/stylesheets/snippets.scss
+++ b/app/assets/stylesheets/snippets.scss
@@ -40,10 +40,9 @@
     margin: 0;
     padding: 0;
     table-layout: fixed;
+    overflow-x: auto;
 
     .blob-content {
-      overflow-x: auto;
-
       pre {
         height: 100%;
         padding: 10px;
@@ -61,6 +60,7 @@
         font-family: $monospace-font;
         font-size: $code-font-size;
         line-height: $code-line-height;
+        display: inline-block;
       }
     }
 
@@ -73,7 +73,7 @@
         font-family: $monospace-font;
         display: block;
         font-size: $code-font-size;
-        min-height: $code-line-height;
+        line-height: $code-line-height;
         white-space: nowrap;
         color: $black-transparent;
         min-width: 30px;
diff --git a/app/finders/alert_management/alerts_finder.rb b/app/finders/alert_management/alerts_finder.rb
index e5fde50849e..cb35be43c15 100644
--- a/app/finders/alert_management/alerts_finder.rb
+++ b/app/finders/alert_management/alerts_finder.rb
@@ -2,6 +2,12 @@
 
 module AlertManagement
   class AlertsFinder
+    # @return [Hash<Integer,Integer>] Mapping of status id to count
+    #          ex) { 0: 6, ...etc }
+    def self.counts_by_status(current_user, project, params = {})
+      new(current_user, project, params).execute.counts_by_status
+    end
+
     def initialize(current_user, project, params)
       @current_user = current_user
       @project = project
diff --git a/app/graphql/resolvers/alert_management/alert_status_counts_resolver.rb b/app/graphql/resolvers/alert_management/alert_status_counts_resolver.rb
new file mode 100644
index 00000000000..7f4346632ca
--- /dev/null
+++ b/app/graphql/resolvers/alert_management/alert_status_counts_resolver.rb
@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module Resolvers
+  module AlertManagement
+    class AlertStatusCountsResolver < BaseResolver
+      type Types::AlertManagement::AlertStatusCountsType, null: true
+
+      def resolve(**args)
+        ::Gitlab::AlertManagement::AlertStatusCounts.new(context[:current_user], object, args)
+      end
+    end
+  end
+end
diff --git a/app/graphql/resolvers/alert_management_alert_resolver.rb b/app/graphql/resolvers/alert_management_alert_resolver.rb
index 8e7fe566d32..51ebbb96476 100644
--- a/app/graphql/resolvers/alert_management_alert_resolver.rb
+++ b/app/graphql/resolvers/alert_management_alert_resolver.rb
@@ -23,9 +23,9 @@ module Resolvers
 
     def resolve(**args)
       parent = object.respond_to?(:sync) ? object.sync : object
-      return AlertManagement::Alert.none if parent.nil?
+      return ::AlertManagement::Alert.none if parent.nil?
 
-      AlertManagement::AlertsFinder.new(context[:current_user], parent, args).execute
+      ::AlertManagement::AlertsFinder.new(context[:current_user], parent, args).execute
     end
   end
 end
diff --git a/app/graphql/types/alert_management/alert_status_counts_type.rb b/app/graphql/types/alert_management/alert_status_counts_type.rb
new file mode 100644
index 00000000000..f80b289eabc
--- /dev/null
+++ b/app/graphql/types/alert_management/alert_status_counts_type.rb
@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+# Service for managing alert counts and cache updates.
+module Types
+  module AlertManagement
+    class AlertStatusCountsType < BaseObject
+      graphql_name 'AlertManagementAlertStatusCountsType'
+      description "Represents total number of alerts for the represented categories"
+
+      authorize :read_alert_management_alert
+
+      ::Gitlab::AlertManagement::AlertStatusCounts::STATUSES.each_key do |status|
+        field status,
+              GraphQL::INT_TYPE,
+              null: true,
+              description: "Number of alerts with status #{status.upcase} for the project"
+      end
+
+      field :open,
+            GraphQL::INT_TYPE,
+            null: true,
+            description: 'Number of alerts with status TRIGGERED or ACKNOWLEDGED for the project'
+
+      field :all,
+            GraphQL::INT_TYPE,
+            null: true,
+            description: 'Total number of alerts for the project'
+    end
+  end
+end
diff --git a/app/graphql/types/project_type.rb b/app/graphql/types/project_type.rb
index e7a83446610..4e438ed2576 100644
--- a/app/graphql/types/project_type.rb
+++ b/app/graphql/types/project_type.rb
@@ -218,6 +218,12 @@ module Types
           description: 'A single Alert Management alert of the project',
           resolver: Resolvers::AlertManagementAlertResolver.single
 
+    field :alert_management_alert_status_counts,
+          Types::AlertManagement::AlertStatusCountsType,
+          null: true,
+          description: 'Counts of alerts by status for the project',
+          resolver: Resolvers::AlertManagement::AlertStatusCountsResolver
+
     field :releases,
           Types::ReleaseType.connection_type,
           null: true,
diff --git a/app/models/alert_management/alert.rb b/app/models/alert_management/alert.rb
index c030987e770..acaf474ecc2 100644
--- a/app/models/alert_management/alert.rb
+++ b/app/models/alert_management/alert.rb
@@ -106,6 +106,8 @@ module AlertManagement
     scope :order_severity,      -> (sort_order) { order(severity: sort_order) }
     scope :order_status,        -> (sort_order) { order(status: sort_order) }
 
+    scope :counts_by_status, -> { group(:status).count }
+
     def self.sort_by_attribute(method)
       case method.to_s
       when 'start_time_asc'     then order_start_time(:asc)
diff --git a/app/views/shared/milestones/_merge_requests_tab.haml b/app/views/shared/milestones/_merge_requests_tab.haml
index 9c193f901e2..4dba2473efc 100644
--- a/app/views/shared/milestones/_merge_requests_tab.haml
+++ b/app/views/shared/milestones/_merge_requests_tab.haml
@@ -3,10 +3,10 @@
 
 .row.prepend-top-default
   .col-md-3
-    = render 'shared/milestones/issuables', args.merge(title: 'Work in progress (open and unassigned)', issuables: merge_requests.opened.unassigned, id: 'unassigned', show_counter: true)
+    = render 'shared/milestones/issuables', args.merge(title: _('Work in progress (open and unassigned)'), issuables: merge_requests.opened.unassigned, id: 'unassigned', show_counter: true)
   .col-md-3
-    = render 'shared/milestones/issuables', args.merge(title: 'Waiting for merge (open and assigned)', issuables: merge_requests.opened.assigned, id: 'ongoing', show_counter: true)
+    = render 'shared/milestones/issuables', args.merge(title: _('Waiting for merge (open and assigned)'), issuables: merge_requests.opened.assigned, id: 'ongoing', show_counter: true)
   .col-md-3
-    = render 'shared/milestones/issuables', args.merge(title: 'Rejected (closed)', issuables: merge_requests.closed, id: 'closed', show_counter: true)
+    = render 'shared/milestones/issuables', args.merge(title: _('Rejected (closed)'), issuables: merge_requests.closed, id: 'closed', show_counter: true)
   .col-md-3
-    = render 'shared/milestones/issuables', args.merge(title: 'Merged', issuables: merge_requests.merged, id: 'merged', primary: true, show_counter: true)
+    = render 'shared/milestones/issuables', args.merge(title: _('Merged'), issuables: merge_requests.merged, id: 'merged', primary: true, show_counter: true)