diff --git a/ee/app/views/admin/application_settings/_add_license.html.haml b/ee/app/views/admin/application_settings/_add_license.html.haml
index dc54ae1f5fd5a78f67d493c580b5c7307e0097ea..3d813fcf1d253d91b846d6dfecb1580567b9abf5 100644
--- a/ee/app/views/admin/application_settings/_add_license.html.haml
+++ b/ee/app/views/admin/application_settings/_add_license.html.haml
@@ -4,7 +4,7 @@
   .settings-header{ data: { testid: 'expand_add_license_header' } }
     %h4
       = _('Add License')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button', data: { qa_selector: 'expand_add_license_button' } }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle', data: { qa_selector: 'expand_add_license_button' } }) do
       = expanded_by_default? ? 'Collapse' : 'Expand'
     %p
       - if License.current
diff --git a/ee/app/views/admin/application_settings/_custom_templates_form.html.haml b/ee/app/views/admin/application_settings/_custom_templates_form.html.haml
index d438d393fadec7b39afd671aa01cf2dc84280a97..f4c2785990ae68f6cf77197bad7038b0f79c94d0 100644
--- a/ee/app/views/admin/application_settings/_custom_templates_form.html.haml
+++ b/ee/app/views/admin/application_settings/_custom_templates_form.html.haml
@@ -3,7 +3,7 @@
     .settings-header
       %h4
         = _('Custom project templates')
-      %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+      = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
         = expanded ? _('Collapse') : _('Expand')
       %p
         = s_('AdminSettings|Select a group to use as the source for instance-level project templates.')
diff --git a/ee/app/views/admin/application_settings/_ee_network_settings.haml b/ee/app/views/admin/application_settings/_ee_network_settings.haml
index 4a8cc822bc3e824a34ff632691eecbb27e7c71f4..3dda5289b3b8e7c44eee96d16dc60d17b54d5689 100644
--- a/ee/app/views/admin/application_settings/_ee_network_settings.haml
+++ b/ee/app/views/admin/application_settings/_ee_network_settings.haml
@@ -3,7 +3,7 @@
     .settings-header
       %h4
         = _('Incident Management Limits')
-      %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+      = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
         = expanded_by_default? ? _('Collapse') : _('Expand')
       %p
         = _('Limit the number of inbound incident management alerts that can be sent to a project.')
diff --git a/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml b/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
index b3a0bb1fba8a6a900f2a3c687d9cefef37bc6d6a..f3739add7bf2c4e9b6d3468a995de1732ede7786 100644
--- a/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
+++ b/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
@@ -7,7 +7,7 @@
   .settings-header
     %h4
       = _('Advanced Search')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button', data: { qa_selector: 'expand_advanced_search_button' } }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle', data: { qa_selector: 'expand_advanced_search_button' } }) do
       = expanded_by_default? ? _('Collapse') : _('Expand')
     %p
       = _('Configure settings for Advanced Search with Elasticsearch.')
@@ -195,7 +195,7 @@
   .settings-header
     %h4
       = _('Elasticsearch zero-downtime reindexing')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
       = expanded_by_default? ? _('Collapse') : _('Expand')
     %p
       = _('Trigger cluster reindexing. Only use this with an index that was created in GitLab 13.0 or later.')
diff --git a/ee/app/views/admin/application_settings/_maintenance_mode_settings_form.html.haml b/ee/app/views/admin/application_settings/_maintenance_mode_settings_form.html.haml
index b783bc29e8cf69050389ae939b4e6b4048733358..2f47e3d9f7c8d7dc63a866e9275016334964a6ae 100644
--- a/ee/app/views/admin/application_settings/_maintenance_mode_settings_form.html.haml
+++ b/ee/app/views/admin/application_settings/_maintenance_mode_settings_form.html.haml
@@ -4,7 +4,7 @@
   .settings-header
     %h4
       = _('Maintenance mode')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
       = expanded_by_default? ? _('Collapse') : _('Expand')
     %p
       = _('Prevent users from performing write operations while GitLab maintenance is in progress.')
diff --git a/ee/app/views/admin/application_settings/_required_instance_ci_setting.html.haml b/ee/app/views/admin/application_settings/_required_instance_ci_setting.html.haml
index 566c22090284e8b7b7d56f0dc42cf20f406f605a..fd8e25169e029e98ff056487be9e0a014009b41f 100644
--- a/ee/app/views/admin/application_settings/_required_instance_ci_setting.html.haml
+++ b/ee/app/views/admin/application_settings/_required_instance_ci_setting.html.haml
@@ -4,7 +4,7 @@
   .settings-header
     %h4
       = s_('AdminSettings|Required pipeline configuration')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
       = expanded ? _('Collapse') : _('Expand')
     %p
       - config_link_start = '<a href="%{url}">'.html_safe % { url: help_page_path('user/admin_area/settings/continuous_integration', anchor: 'required-pipeline-configuration') }
diff --git a/ee/app/views/admin/application_settings/_slack.html.haml b/ee/app/views/admin/application_settings/_slack.html.haml
index f5812a76df82dac485ae930d51d12bf9ec57828c..e1e454c3f482aa8df73e6f3e840ff119d3d7b5da 100644
--- a/ee/app/views/admin/application_settings/_slack.html.haml
+++ b/ee/app/views/admin/application_settings/_slack.html.haml
@@ -5,7 +5,7 @@
   .settings-header
     %h4
       = _('Slack application')
-    %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+    = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
       = expanded ? _('Collapse') : _('Expand')
     %p
       = _('Slack integration allows you to interact with GitLab via slash commands in a chat window.')
diff --git a/ee/app/views/admin/application_settings/_templates.html.haml b/ee/app/views/admin/application_settings/_templates.html.haml
index 9fe83b54cb32e81be6b41035a2756e6af0734935..a25eafa159af53435da631b3ab56ba00334148ff 100644
--- a/ee/app/views/admin/application_settings/_templates.html.haml
+++ b/ee/app/views/admin/application_settings/_templates.html.haml
@@ -3,7 +3,7 @@
     .settings-header
       %h4
         = _('Templates')
-      %button.btn.gl-button.btn-default.js-settings-toggle{ type: 'button' }
+      = render Pajamas::ButtonComponent.new(button_options: { class: 'js-settings-toggle' }) do
         = expanded ? _('Collapse') : _('Expand')
       %p
         = _('Select a repository containing templates for common files.')