Alexander/FitTrackee
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add vue-3-sanitize and linkifyjs to allow safe link formatting in notes

Browse Source
This commit is contained in:
Joshua Taillon
2022-11-05 00:53:54 -06:00
parent da5f7d12e7
commit fb10a87444
5 changed files with 62 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
fittrackee_client/src/components/Workout/WorkoutDetail/WorkoutNotes.vue
View File

@ -3,30 +3,31 @@
<Card>
<template #title>{{ $t('workouts.NOTES') }}</template>
<template #content>
{{ notes && notes !== '' ? notes : $t('workouts.NO_NOTES') }}
<span v-html="notes !== '' ? $sanitize(linkifyStr(notes, { target: '_blank' })) : $t('workouts.NO_NOTES')" />
</template>
</Card>
</div>
</template>
<script setup lang="ts">
import { toRefs, withDefaults } from 'vue'
import linkifyStr from 'linkify-string'
import { toRefs, withDefaults } from 'vue'
interface Props {
notes?: string | null
}
const props = withDefaults(defineProps<Props>(), {
notes: () => null,
})
interface Props {
notes?: string | null
}
const props = withDefaults(defineProps<Props>(), {
notes: () => null,
})
const { notes } = toRefs(props)
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>