Save feature flag toggle switch state on edit page

Pass state of switch to backend

ee/app/assets/javascripts/feature_flags/components/edit_feature_flag.vue

@@ -83,7 +83,7 @@ export default {
         {{ $options.translations.legacyFlagAlert }}
       </gl-alert>
       <div class="d-flex align-items-center mb-3 mt-3">
-        <gl-toggle :value="active" class="m-0 mr-3" @change="toggleActive" />
+        <gl-toggle :value="active" class="m-0 mr-3 js-feature-flag-status" @change="toggleActive" />
         <h3 class="page-title m-0">{{ title }}</h3>
       </div>
 

ee/app/assets/javascripts/feature_flags/store/modules/helpers.js

@@ -190,6 +190,7 @@ export const mapStrategiesToRails = params => ({
     name: params.name,
     description: params.description,
     version: params.version,
+    active: params.active,
     strategies_attributes: (params.strategies || []).map(s => ({
       id: s.id,
       name: s.name,

ee/spec/features/projects/feature_flags/user_updates_feature_flag_spec.rb

@@ -17,7 +17,7 @@ describe 'User updates feature flag', :js do
 
   context 'with a new version feature flag' do
     let!(:feature_flag) do
-      create_flag(project, 'test_flag', true, version: Operations::FeatureFlag.versions['new_version_flag'],
+      create_flag(project, 'test_flag', false, version: Operations::FeatureFlag.versions['new_version_flag'],
                   description: 'For testing')
     end
 
@@ -51,6 +51,16 @@ describe 'User updates feature flag', :js do
         expect(page).to have_text 'All environments'
       end
     end
+
+    it 'user toggles the flag on' do
+      visit(edit_project_feature_flag_path(project, feature_flag))
+      status_toggle_button.click
+      click_button 'Save changes'
+
+      within_feature_flag_row(1) do
+        expect_status_toggle_button_to_be_checked
+      end
+    end
   end
 
   context 'with a legacy feature flag' do

ee/spec/frontend/feature_flags/store/helpers_spec.js

@@ -400,6 +400,7 @@ describe('feature flags helpers spec', () => {
           name: 'test',
           description: 'test description',
           version: NEW_VERSION_FLAG,
+          active: true,
           strategies: [
             {
               id: '1',
@@ -421,6 +422,7 @@ describe('feature flags helpers spec', () => {
           name: 'test',
           description: 'test description',
           version: NEW_VERSION_FLAG,
+          active: true,
           strategies_attributes: [
             {
               id: '1',
@@ -446,6 +448,7 @@ describe('feature flags helpers spec', () => {
           name: 'test',
           description: 'test description',
           version: NEW_VERSION_FLAG,
+          active: true,
           strategies: [
             {
               id: '1',
@@ -460,6 +463,7 @@ describe('feature flags helpers spec', () => {
           name: 'test',
           description: 'test description',
           version: NEW_VERSION_FLAG,
+          active: true,
           strategies_attributes: [
             {
               id: '1',
@@ -480,6 +484,7 @@ describe('feature flags helpers spec', () => {
       const result = mapStrategiesToRails({
         name: 'test',
         version: NEW_VERSION_FLAG,
+        active: true,
         strategies: [
           {
             id: '1',
@@ -494,5 +499,16 @@ describe('feature flags helpers spec', () => {
 
       expect(strategyAttrs.parameters).toEqual({ userIds: 'user1,user2,user3' });
     });
+
+    it('preserves the value of active', () => {
+      const result = mapStrategiesToRails({
+        name: 'test',
+        version: NEW_VERSION_FLAG,
+        active: false,
+        strategies: [],
+      });
+
+      expect(result.operations_feature_flag.active).toBe(false);
+    });
   });
 });

ee/spec/support/helpers/feature_flag_helpers.rb

@@ -60,6 +60,14 @@ module FeatureFlagHelpers
     find('.js-feature-flag-edit-button')
   end
 
+  def status_toggle_button
+    find('.js-feature-flag-status button')
+  end
+
+  def expect_status_toggle_button_to_be_checked
+    expect(page).to have_css('.js-feature-flag-status button.is-checked')
+  end
+
   def expect_user_to_see_feature_flags_index_page
     expect(page).to have_css('h3.page-title', text: 'Feature Flags')
     expect(page).to have_text('All')