Replace v-html with v-safe-html in groups_dropdown_filter.vue

ee/app/assets/javascripts/analytics/shared/components/groups_dropdown_filter.vue

 <script>
-/* eslint-disable vue/no-v-html */
-import { escape, debounce } from 'lodash';
+import { debounce } from 'lodash';
 import {
   GlIcon,
   GlLoadingIcon,
@@ -9,6 +8,7 @@ import {
   GlNewDropdownHeader as GlDropdownHeader,
   GlNewDropdownItem as GlDropdownItem,
   GlSearchBoxByType,
+  GlSafeHtmlDirective as SafeHtml,
 } from '@gitlab/ui';
 import { s__, __ } from '~/locale';
 import Api from '~/api';
@@ -26,6 +26,9 @@ export default {
     GlDropdownItem,
     GlSearchBoxByType,
   },
+  directives: {
+    SafeHtml,
+  },
   props: {
     label: {
       type: String,
@@ -105,9 +108,7 @@ export default {
       const parts = fullName.split('/');
       const lastPart = parts.length - 1;
       return parts
-        .map((part, idx) =>
-          idx === lastPart ? `<strong>${escape(part.trim())}</strong>` : escape(part.trim()),
-        )
+        .map((part, idx) => (idx === lastPart ? `<strong>${part.trim()}</strong>` : part.trim()))
         .join(' / ');
     },
   },
@@ -151,7 +152,10 @@ export default {
           :src="group.avatar_url"
           shape="rect"
         />
-        <div class="js-group-path align-middle" v-html="formatGroupPath(group.full_name)"></div>
+        <div
+          v-safe-html="formatGroupPath(group.full_name)"
+          class="js-group-path align-middle"
+        ></div>
       </div>
     </gl-dropdown-item>
     <gl-dropdown-item v-show="noResultsAvailable" class="gl-pointer-events-none text-secondary">{{

ee/changelogs/unreleased/241875-Replace-v-html.yml

+---
+title: Replace v-html with v-safe-html in groups_dropdown_filter.vue
+merge_request: 41212
+author: Kev @KevSlashNull
+type: other