Add confidentiality widget to graphql board sidebar

Allow user to edit issue confidentiality from board sidebar

app/assets/javascripts/boards/components/board_content_sidebar.vue

@@ -10,6 +10,7 @@ import BoardSidebarTitle from '~/boards/components/sidebar/board_sidebar_title.v
 import { ISSUABLE } from '~/boards/constants';
 import { contentTop } from '~/lib/utils/common_utils';
 import SidebarAssigneesWidget from '~/sidebar/components/assignees/sidebar_assignees_widget.vue';
+import SidebarConfidentialityWidget from '~/sidebar/components/confidential/sidebar_confidentiality_widget.vue';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 
 export default {
@@ -18,6 +19,7 @@ export default {
     GlDrawer,
     BoardSidebarTitle,
     SidebarAssigneesWidget,
+    SidebarConfidentialityWidget,
     BoardSidebarTimeTracker,
     BoardSidebarLabelsSelect,
     BoardSidebarDueDate,
@@ -50,7 +52,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(['toggleBoardItem', 'setAssignees']),
+    ...mapActions(['toggleBoardItem', 'setAssignees', 'setActiveItemConfidential']),
     handleClose() {
       this.toggleBoardItem({ boardItem: this.activeBoardItem, sidebarType: this.sidebarType });
     },
@@ -90,6 +92,12 @@ export default {
       <board-sidebar-due-date />
       <board-sidebar-labels-select class="labels" />
       <board-sidebar-weight-input v-if="glFeatures.issueWeights" class="weight" />
+      <sidebar-confidentiality-widget
+        :iid="activeBoardItem.iid"
+        :full-path="fullPath"
+        :issuable-type="issuableType"
+        @confidentialityUpdated="setActiveItemConfidential($event)"
+      />
       <board-sidebar-subscription class="subscriptions" />
     </template>
   </gl-drawer>

app/assets/javascripts/boards/stores/actions.js

@@ -652,6 +652,15 @@ export default {
     });
   },
 
+  setActiveItemConfidential: ({ commit, getters }, confidential) => {
+    const { activeBoardItem } = getters;
+    commit(types.UPDATE_BOARD_ITEM_BY_ID, {
+      itemId: activeBoardItem.id,
+      prop: 'confidential',
+      value: confidential,
+    });
+  },
+
   fetchGroupProjects: ({ commit, state }, { search = '', fetchNext = false }) => {
     commit(types.REQUEST_GROUP_PROJECTS, fetchNext);
 

ee/app/assets/javascripts/boards/components/epic_board_content_sidebar.vue

@@ -30,7 +30,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(['toggleBoardItem', 'setActiveEpicConfidential']),
+    ...mapActions(['toggleBoardItem', 'setActiveItemConfidential']),
     handleClose() {
       this.toggleBoardItem({ boardItem: this.activeBoardItem, sidebarType: this.sidebarType });
     },
@@ -67,7 +67,7 @@ export default {
         :iid="activeBoardItem.iid"
         :full-path="fullPath"
         issuable-type="epic"
-        @confidentialityUpdated="setActiveEpicConfidential($event)"
+        @confidentialityUpdated="setActiveItemConfidential($event)"
       />
       <board-sidebar-subscription class="subscriptions" />
     </template>

ee/app/assets/javascripts/boards/stores/actions.js

@@ -781,13 +781,4 @@ export default {
       value: data.updateEpic.epic.labels.nodes,
     });
   },
-
-  setActiveEpicConfidential: ({ commit, getters }, confidential) => {
-    const { activeBoardItem } = getters;
-    commit(typesCE.UPDATE_BOARD_ITEM_BY_ID, {
-      itemId: activeBoardItem.id,
-      prop: 'confidential',
-      value: confidential,
-    });
-  },
 };

ee/spec/frontend/boards/stores/actions_spec.js

@@ -1389,30 +1389,3 @@ describe('setActiveEpicLabels', () => {
     await expect(actions.setActiveEpicLabels({ getters }, input)).rejects.toThrow(Error);
   });
 });
-
-describe('setActiveEpicConfidential', () => {
-  const state = { boardItems: { [mockEpic.id]: mockEpic } };
-  const getters = { activeBoardItem: mockEpic };
-
-  it('set confidential value on epic', (done) => {
-    const payload = {
-      itemId: getters.activeBoardItem.id,
-      prop: 'confidential',
-      value: true,
-    };
-
-    testAction(
-      actions.setActiveEpicConfidential,
-      true,
-      { ...state, ...getters },
-      [
-        {
-          type: typesCE.UPDATE_BOARD_ITEM_BY_ID,
-          payload,
-        },
-      ],
-      [],
-      done,
-    );
-  });
-});

spec/frontend/boards/stores/actions_spec.js

@@ -1535,6 +1535,33 @@ describe('setActiveItemTitle', () => {
   });
 });
 
+describe('setActiveItemConfidential', () => {
+  const state = { boardItems: { [mockIssue.id]: mockIssue } };
+  const getters = { activeBoardItem: mockIssue };
+
+  it('set confidential value on board item', (done) => {
+    const payload = {
+      itemId: getters.activeBoardItem.id,
+      prop: 'confidential',
+      value: true,
+    };
+
+    testAction(
+      actions.setActiveItemConfidential,
+      true,
+      { ...state, ...getters },
+      [
+        {
+          type: types.UPDATE_BOARD_ITEM_BY_ID,
+          payload,
+        },
+      ],
+      [],
+      done,
+    );
+  });
+});
+
 describe('fetchGroupProjects', () => {
   const state = {
     fullPath: 'gitlab-org',

spec/support/shared_examples/features/sidebar_shared_examples.rb

@@ -78,6 +78,25 @@ RSpec.shared_examples 'issue boards sidebar' do
     end
   end
 
+  context 'confidentiality' do
+    it 'make issue confidential' do
+      page.within('.confidentiality') do
+        expect(page).to have_content('Not confidential')
+
+        click_button 'Edit'
+        expect(page).to have_css('.sidebar-item-warning-message')
+
+        within('.sidebar-item-warning-message') do
+          click_button 'Turn on'
+        end
+
+        wait_for_requests
+
+        expect(page).to have_content('This issue is confidential')
+      end
+    end
+  end
+
   context 'in time tracking' do
     it 'displays time tracking feature with default message' do
       page.within('[data-testid="time-tracker"]') do