From e0c5deaf1b06787f7af9f376975925335dab20f7 Mon Sep 17 00:00:00 2001
From: Adriel Santiago <asantiago@gitlab.com>
Date: Tue, 28 May 2019 06:41:34 +0000
Subject: Add expand/collapse button

Add ability to expand/collapse operation settings
---
 .../operation_settings/components/external_dashboard.vue           | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

(limited to 'app/assets/javascripts/operation_settings')

diff --git a/app/assets/javascripts/operation_settings/components/external_dashboard.vue b/app/assets/javascripts/operation_settings/components/external_dashboard.vue
index 0a87d193b72..b2b37355033 100644
--- a/app/assets/javascripts/operation_settings/components/external_dashboard.vue
+++ b/app/assets/javascripts/operation_settings/components/external_dashboard.vue
@@ -1,5 +1,6 @@
 <script>
 import { GlButton, GlFormGroup, GlFormInput, GlLink } from '@gitlab/ui';
+import initSettingsPanels from '~/settings_panels';
 
 export default {
   components: {
@@ -19,15 +20,19 @@ export default {
       required: true,
     },
   },
+  mounted() {
+    initSettingsPanels();
+  },
 };
 </script>
 
 <template>
-  <section class="settings expanded">
+  <section class="settings no-animate">
     <div class="settings-header">
       <h4 class="js-section-header">
         {{ s__('ExternalMetrics|External Dashboard') }}
       </h4>
+      <gl-button class="js-settings-toggle">{{ __('Expand') }}</gl-button>
       <p class="js-section-sub-header">
         {{
           s__(
-- 
cgit v1.2.3