fix: subscription icon not rendered correctly

The computed property "icon" which holds the icon string to be rendered was overriding the <icon> component. Therefore, the component wasn't rendered at all, instead vue would render a html tag with the icon name.
This commit is contained in:
kolaente 2022-01-29 22:30:47 +01:00
parent c98ab42e75
commit b3697cb9bf
No known key found for this signature in database
GPG key ID: F40E70337AB24C9B

View file

@ -1,7 +1,7 @@
<template> <template>
<x-button <x-button
variant="secondary" variant="secondary"
:icon="icon" :icon="iconName"
v-tooltip="tooltipText" v-tooltip="tooltipText"
@click="changeSubscription" @click="changeSubscription"
:disabled="disabled || null" :disabled="disabled || null"
@ -16,7 +16,7 @@
v-else v-else
> >
<span class="icon"> <span class="icon">
<icon :icon="icon"/> <icon :icon="iconName"/>
</span> </span>
{{ buttonText }} {{ buttonText }}
</a> </a>
@ -73,7 +73,7 @@ const tooltipText = computed(() => {
}) })
const buttonText = computed(() => props.subscription !== null ? t('task.subscription.unsubscribe') : t('task.subscription.subscribe')) const buttonText = computed(() => props.subscription !== null ? t('task.subscription.unsubscribe') : t('task.subscription.subscribe'))
const icon = computed(() => props.subscription !== null ? ['far', 'bell-slash'] : 'bell') const iconName = computed(() => props.subscription !== null ? ['far', 'bell-slash'] : 'bell')
const disabled = computed(() => { const disabled = computed(() => {
if (props.subscription === null) { if (props.subscription === null) {
return false return false