Mark the self_monitoring dashboard as system dashboard

Set `system_dashboard` to true for the self monitoring dashboard so
that the "Add metric" button is made visible on the dashboard.

Also add some jest specs for the "Add metric" button.

app/services/metrics/dashboard/self_monitoring_dashboard_service.rb

@@ -29,7 +29,7 @@ module Metrics
             path: DASHBOARD_PATH,
             display_name: _(DASHBOARD_NAME),
             default: true,
-            system_dashboard: false,
+            system_dashboard: true,
             out_of_the_box_dashboard: out_of_the_box_dashboard?
           }]
         end

changelogs/unreleased/rp-add-metrics-button-self-monitor-dashboard.yml

+---
+title: Make Add metrics button visible on self monitoring dashboard
+merge_request: 36169
+author:
+type: fixed

spec/frontend/monitoring/components/dashboard_header_spec.js

@@ -349,4 +349,72 @@ describe('Dashboard header', () => {
       });
     });
   });
+
+  describe('Add metric button', () => {
+    const findAddMetricButton = () => wrapper.find('[data-qa-selector="add_metric_button"]');
+
+    it('is not rendered when custom metrics are not available', () => {
+      store.state.monitoringDashboard.emptyState = false;
+
+      createShallowWrapper({
+        customMetricsAvailable: false,
+      });
+
+      setupAllDashboards(store, dashboardGitResponse[0].path);
+
+      return wrapper.vm.$nextTick(() => {
+        expect(findAddMetricButton().exists()).toBe(false);
+      });
+    });
+
+    it('is not rendered when displaying empty state', () => {
+      store.state.monitoringDashboard.emptyState = true;
+
+      createShallowWrapper({
+        customMetricsAvailable: true,
+      });
+
+      setupAllDashboards(store, dashboardGitResponse[0].path);
+
+      return wrapper.vm.$nextTick(() => {
+        expect(findAddMetricButton().exists()).toBe(false);
+      });
+    });
+
+    describe('system dashboards', () => {
+      const systemDashboards = [
+        dashboardGitResponse[0].path,
+        selfMonitoringDashboardGitResponse[0].path,
+      ];
+      const nonSystemDashboards = [
+        dashboardGitResponse[1].path,
+        dashboardGitResponse[2].path,
+        selfMonitoringDashboardGitResponse[1].path,
+      ];
+
+      beforeEach(() => {
+        store.state.monitoringDashboard.emptyState = false;
+
+        createShallowWrapper({
+          customMetricsAvailable: true,
+        });
+      });
+
+      test.each(systemDashboards)('is rendered for system dashboards', dashboardPath => {
+        setupAllDashboards(store, dashboardPath);
+
+        return wrapper.vm.$nextTick(() => {
+          expect(findAddMetricButton().exists()).toBe(true);
+        });
+      });
+
+      test.each(nonSystemDashboards)('is not rendered for non-system dashboards', dashboardPath => {
+        setupAllDashboards(store, dashboardPath);
+
+        return wrapper.vm.$nextTick(() => {
+          expect(findAddMetricButton().exists()).toBe(false);
+        });
+      });
+    });
+  });
 });

spec/frontend/monitoring/mock_data.js

@@ -209,7 +209,7 @@ export const selfMonitoringDashboardGitResponse = [
     default: true,
     display_name: 'Default',
     can_edit: false,
-    system_dashboard: false,
+    system_dashboard: true,
     out_of_the_box_dashboard: true,
     project_blob_path: null,
     path: 'config/prometheus/self_monitoring_default.yml',

spec/lib/gitlab/metrics/dashboard/finder_spec.rb

@@ -165,7 +165,7 @@ RSpec.describe Gitlab::Metrics::Dashboard::Finder, :use_clean_rails_memory_store
           path: self_monitoring_dashboard_path,
           display_name: 'Default dashboard',
           default: true,
-          system_dashboard: false,
+          system_dashboard: true,
           out_of_the_box_dashboard: true
         }
       end

spec/services/metrics/dashboard/self_monitoring_dashboard_service_spec.rb

@@ -50,7 +50,7 @@ RSpec.describe Metrics::Dashboard::SelfMonitoringDashboardService, :use_clean_ra
           path: described_class::DASHBOARD_PATH,
           display_name: described_class::DASHBOARD_NAME,
           default: true,
-          system_dashboard: false,
+          system_dashboard: true,
           out_of_the_box_dashboard: true
         }]
       )