Merge branch 'master' into bootstrap4

1 files changed, 15 insertions, 4 deletions

diff --git a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
index a7b8df68f42..dc30175d4f0 100644
--- a/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/confidential/confidential_issue_sidebar.vue
@@ -1,15 +1,19 @@
 <script>
-import Flash from '../../../flash';
+import { __ } from '~/locale';
+import Flash from '~/flash';
+import tooltip from '~/vue_shared/directives/tooltip';
+import Icon from '~/vue_shared/components/icon.vue';
+import eventHub from '~/sidebar/event_hub';
 import editForm from './edit_form.vue';
-import Icon from '../../../vue_shared/components/icon.vue';
-import { __ } from '../../../locale';
-import eventHub from '../../event_hub';
 
 export default {
   components: {
     editForm,
     Icon,
   },
+  directives: {
+    tooltip,
+  },
   props: {
     isConfidential: {
       required: true,
@@ -33,6 +37,9 @@ export default {
     confidentialityIcon() {
       return this.isConfidential ? 'eye-slash' : 'eye';
     },
+    tooltipLabel() {
+      return this.isConfidential ? __('Confidential') : __('Not confidential');
+    },
   },
   created() {
     eventHub.$on('closeConfidentialityForm', this.toggleForm);
@@ -65,6 +72,10 @@ export default {
     <div
       class="sidebar-collapsed-icon"
       @click="toggleForm"
+      v-tooltip
+      data-container="body"
+      data-placement="left"
+      :title="tooltipLabel"
     >
       <icon
         :name="confidentialityIcon"