From 4515b08cbe062571f7a87b038357ec2acaba29e6 Mon Sep 17 00:00:00 2001
From: Zack Cuddy <zcuddy@gitlab.com>
Date: Fri, 15 Sep 2023 09:43:03 +0000
Subject: [PATCH] Silent Mode - Add experiment badge
This change adds the experiment badge to the settings.
Changelog: added
---
.../silent_mode_settings/components/app.vue | 10 ++++++++--
.../silent_mode_settings/components/app_spec.js | 13 ++++++++++++-
2 files changed, 20 insertions(+), 3 deletions(-)
diff --git a/app/assets/javascripts/silent_mode_settings/components/app.vue b/app/assets/javascripts/silent_mode_settings/components/app.vue
index a151492c75c54..2dd0449448cb2 100644
--- a/app/assets/javascripts/silent_mode_settings/components/app.vue
+++ b/app/assets/javascripts/silent_mode_settings/components/app.vue
@@ -1,5 +1,5 @@
<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>
diff --git a/spec/frontend/silent_mode_settings/components/app_spec.js b/spec/frontend/silent_mode_settings/components/app_spec.js
index dfa2b1bfcbb6d..5997bfd1b5f31 100644
--- a/spec/frontend/silent_mode_settings/components/app_spec.js
+++ b/spec/frontend/silent_mode_settings/components/app_spec.js
@@ -1,4 +1,4 @@
-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 });
--
GitLab