Add self-monitoring deprecation notice for self-monitoring project

What does this MR do and why?

It adds a deprecation notice to GitLab self-monitoring project.

Addresses #353145 (closed)

Screenshots or screen recordings

How to set up and validate locally

1. Go to On the Admin > Settings > Metrics and profiling page (where self-monitoring is enabled)
2. Select self-monitoring project and check the alert on the project details page.
3. The alert should be visible in both cases, empty project and project with files.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

• I have evaluated the MR acceptance checklist for this MR.

Related to #353145 (closed)

app/assets/javascripts/self_monitor/components/self_monitor_form.vue

 <script>
-import { GlFormGroup, GlButton, GlModal, GlToast, GlToggle, GlLink } from '@gitlab/ui';
+import { GlFormGroup, GlButton, GlModal, GlToast, GlToggle, GlLink, GlAlert } from '@gitlab/ui';
 import Vue from 'vue';
 import { mapState, mapActions } from 'vuex';
 import SafeHtml from '~/vue_shared/directives/safe_html';
@@ -17,6 +17,7 @@ export default {
     GlModal,
     GlToggle,
     GlLink,
+    GlAlert,
   },
   directives: {
     SafeHtml,
@@ -49,6 +50,19 @@ export default {
     selfMonitorProjectFullUrl() {
       return `${getBaseURL()}/${this.projectPath}`;
     },
+    selfMonitoringDeprecationNotice() {
+      return sprintf(
+        s__(
+          'SelfMonitoring|Self-monitoring was %{deprecation}deprecated%{link_end} in GitLab 14.9, and is %{removal}scheduled for removal%{link_end} in GitLab 16.0. For information on a possible replacement, %{opstrace}learn more about Opstrace%{link_end}.'
+        ),{
+          deprecation: `<a href="https://google.com">`,
+          removal: `<a href="https://gitlab.com/gitlab-org/gitlab/-/issues/348909">`,
+          opstrace: `<a href="https://gitlab.com/groups/gitlab-org/-/epics/6976">`,
+          link_end: `</a>`
+        },
+        false,
+      );
+    },
     selfMonitoringFormText() {
       if (this.projectCreated) {
         return sprintf(
@@ -143,6 +157,14 @@ export default {
     <div class="settings-content">
       <form name="self-monitoring-form">
         <p ref="selfMonitoringFormText" v-safe-html="selfMonitoringFormText"></p>
+        <gl-alert
+          class="gl-mb-3"
+          :title="s__('SelfMonitoring|Deprecation notice')"
+          :dismissible="false"
+          variant="danger"
+        >
+          <p v-safe-html="selfMonitoringDeprecationNotice"></p>
+        </gl-alert>
         <gl-form-group>
           <gl-toggle
             v-model="selfMonitorEnabled"