Merge branch '344305-suggestion_diff_header-badges-pajamas-compliant' into 'master'

Migrate badge in suggestion_diff_header.vue to GlBadge

See merge request gitlab-org/gitlab!73425

app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue

 <script>
-import { GlButton, GlLoadingIcon, GlTooltipDirective, GlIcon } from '@gitlab/ui';
+import { GlBadge, GlButton, GlLoadingIcon, GlTooltipDirective, GlIcon } from '@gitlab/ui';
 import { isLoggedIn } from '~/lib/utils/common_utils';
 import { __ } from '~/locale';
 import ApplySuggestion from './apply_suggestion.vue';
 
 export default {
-  components: { GlIcon, GlButton, GlLoadingIcon, ApplySuggestion },
+  components: { GlBadge, GlIcon, GlButton, GlLoadingIcon, ApplySuggestion },
   directives: { 'gl-tooltip': GlTooltipDirective },
   props: {
     batchSuggestionsCount: {
@@ -134,9 +134,9 @@ export default {
         <gl-icon name="question-o" css-classes="link-highlight" />
       </a>
     </div>
-    <div v-if="isApplied" class="badge badge-success" data-qa-selector="applied_badge">
+    <gl-badge v-if="isApplied" variant="success" data-qa-selector="applied_badge">
       {{ __('Applied') }}
-    </div>
+    </gl-badge>
     <div
       v-else-if="isApplying"
       class="d-flex align-items-center text-secondary"