Silent Mode - Add experiment badge

This change adds the experiment badge to the settings.

Changelog: added

app/assets/javascripts/silent_mode_settings/components/app.vue

 <script>
-import { GlToggle } from '@gitlab/ui';
+import { GlToggle, GlBadge } from '@gitlab/ui';
 import { updateApplicationSettings } from '~/rest_api';
 import { createAlert } from '~/alert';
 import toast from '~/vue_shared/plugins/global_toast';
@@ -13,9 +13,11 @@ export default {
     saveError: s__('SilentMode|There was an error updating the Silent Mode Settings.'),
     enabled: __('enabled'),
     disabled: __('disabled'),
+    experiment: __('Experiment'),
   },
   components: {
     GlToggle,
+    GlBadge,
   },
   props: {
     isSilentModeEnabled: {
@@ -60,5 +62,9 @@ export default {
     :label="$options.i18n.toggleLabel"
     :is-loading="isLoading"
     @change="updateSilentModeSettings"
-  />
+  >
+    <template #label
+      >{{ $options.i18n.toggleLabel }} <gl-badge>{{ $options.i18n.experiment }}</gl-badge></template
+    >
+  </gl-toggle>
 </template>

spec/frontend/silent_mode_settings/components/app_spec.js

-import { GlToggle } from '@gitlab/ui';
+import { GlToggle, GlBadge } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import waitForPromises from 'helpers/wait_for_promises';
 import { createAlert } from '~/alert';
@@ -29,8 +29,19 @@ describe('SilentModeSettingsApp', () => {
   };
 
   const findGlToggle = () => wrapper.findComponent(GlToggle);
+  const findGlBadge = () => wrapper.findComponent(GlBadge);
 
   describe('template', () => {
+    describe('experiment badge', () => {
+      beforeEach(() => {
+        createComponent();
+      });
+
+      it('renders properly', () => {
+        expect(findGlBadge().exists()).toBe(true);
+      });
+    });
+
     describe('when silent mode is already enabled', () => {
       beforeEach(() => {
         createComponent({ isSilentModeEnabled: true });