Client - move input sanitization in utils

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

@@ -3,31 +3,38 @@
     <Card>
       <template #title>{{ $t('workouts.NOTES') }}</template>
       <template #content>
-        <span v-html="notes !== '' ? $sanitize(linkifyHtml(notes, { target: '_blank' })) : $t('workouts.NO_NOTES')" />
+        <span
+          v-html="
+            notes && notes !== ''
+              ? linkifyAndClean(notes)
+              : $t('workouts.NO_NOTES')
+          "
+        />
       </template>
     </Card>
   </div>
 </template>
 
 <script setup lang="ts">
-import linkifyHtml from 'linkify-html'
-import { toRefs, withDefaults } from 'vue'
+  import { toRefs, withDefaults } from 'vue'
 
-interface Props {
-  notes?: string | null
-}
-const props = withDefaults(defineProps<Props>(), {
-  notes: () => null,
-})
+  import { linkifyAndClean } from '@/utils/inputs'
 
-const { notes } = toRefs(props)
+  interface Props {
+    notes?: string | null
+  }
+  const props = withDefaults(defineProps<Props>(), {
+    notes: () => null,
+  })
+
+  const { notes } = toRefs(props)
 </script>
 
 <style lang="scss" scoped>
-#workout-note {
-  ::v-deep(.card-content) {
-    font-style: italic;
-    white-space: pre-wrap;
+  #workout-note {
+    ::v-deep(.card-content) {
+      font-style: italic;
+      white-space: pre-wrap;
+    }
   }
-}
 </style>