Switch to linkify-html rather than linkify-string

fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutNotes.vue

@@ -3,14 +3,14 @@
     <Card>
       <template #title>{{ $t('workouts.NOTES') }}</template>
       <template #content>
-        <span v-html="notes !== '' ? $sanitize(linkifyStr(notes, { target: '_blank' })) : $t('workouts.NO_NOTES')" />
+        <span v-html="notes !== '' ? $sanitize(linkifyHtml(notes, { target: '_blank' })) : $t('workouts.NO_NOTES')" />
       </template>
     </Card>
   </div>
 </template>
 
 <script setup lang="ts">
-import linkifyStr from 'linkify-string'
+import linkifyHtml from 'linkify-html'
 import { toRefs, withDefaults } from 'vue'
 
 interface Props {

fittrackee_client/src/main.ts

@@ -48,7 +48,7 @@ const app = createApp(App)
   .use(store)
   .use(router)
   .use(VueFullscreen, { name: 'VFullscreen' })
-  .use(Vue3Sanitize, { allowedTags: ['a'] })
+  .use(Vue3Sanitize, { allowedTags: ['a'], disallowedTagsMode: 'escape' })
   .directive('click-outside', clickOutsideDirective)
 
 customComponents.forEach((component) => {