Merge branch 'migrate-viewer-switcher-button' into 'master'

Migrate viewer switcher button

Closes #219890

See merge request gitlab-org/gitlab!37135

app/assets/javascripts/blob/components/blob_header_viewer_switcher.vue

 <script>
-import { GlDeprecatedButton, GlButtonGroup, GlIcon, GlTooltipDirective } from '@gitlab/ui';
+import { GlButton, GlButtonGroup, GlIcon, GlTooltipDirective } from '@gitlab/ui';
 import {
   RICH_BLOB_VIEWER,
   RICH_BLOB_VIEWER_TITLE,
@@ -11,7 +11,7 @@ export default {
   components: {
     GlIcon,
     GlButtonGroup,
-    GlDeprecatedButton,
+    GlButton,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -46,7 +46,7 @@ export default {
 </script>
 <template>
   <gl-button-group class="js-blob-viewer-switcher mx-2">
-    <gl-deprecated-button
+    <gl-button
       v-gl-tooltip.hover
       :aria-label="$options.SIMPLE_BLOB_VIEWER_TITLE"
       :title="$options.SIMPLE_BLOB_VIEWER_TITLE"
@@ -55,8 +55,8 @@ export default {
       @click="switchToViewer($options.SIMPLE_BLOB_VIEWER)"
     >
       <gl-icon name="code" :size="14" />
-    </gl-deprecated-button>
-    <gl-deprecated-button
+    </gl-button>
+    <gl-button
       v-gl-tooltip.hover
       :aria-label="$options.RICH_BLOB_VIEWER_TITLE"
       :title="$options.RICH_BLOB_VIEWER_TITLE"
@@ -65,6 +65,6 @@ export default {
       @click="switchToViewer($options.RICH_BLOB_VIEWER)"
     >
       <gl-icon name="document" :size="14" />
-    </gl-deprecated-button>
+    </gl-button>
   </gl-button-group>
 </template>

spec/frontend/blob/components/blob_header_viewer_switcher_spec.js

@@ -6,7 +6,7 @@ import {
   SIMPLE_BLOB_VIEWER,
   SIMPLE_BLOB_VIEWER_TITLE,
 } from '~/blob/components/constants';
-import { GlButtonGroup, GlDeprecatedButton } from '@gitlab/ui';
+import { GlButtonGroup, GlButton } from '@gitlab/ui';
 
 describe('Blob Header Viewer Switcher', () => {
   let wrapper;
@@ -35,7 +35,7 @@ describe('Blob Header Viewer Switcher', () => {
     beforeEach(() => {
       createComponent();
       btnGroup = wrapper.find(GlButtonGroup);
-      buttons = wrapper.findAll(GlDeprecatedButton);
+      buttons = wrapper.findAll(GlButton);
     });
 
     it('renders gl-button-group component', () => {
@@ -57,7 +57,7 @@ describe('Blob Header Viewer Switcher', () => {
 
     function factory(propsData = {}) {
       createComponent(propsData);
-      buttons = wrapper.findAll(GlDeprecatedButton);
+      buttons = wrapper.findAll(GlButton);
       simpleBtn = buttons.at(0);
       richBtn = buttons.at(1);