fixup! fix(capabilities): conditionally show links to calendar

Signed-off-by: Maksim Sukharev <[email protected]>

Author: Antreesy

src/components/UIShared/CalendarEventSmall.vue

@@ -5,6 +5,7 @@
 
 <script setup lang="ts">
 import { t } from '@nextcloud/l10n'
+import { computed } from 'vue'
 import IconReload from 'vue-material-design-icons/Reload.vue'
 
 const props = defineProps<{
@@ -14,16 +15,31 @@ const props = defineProps<{
 	isRecurring?: boolean
 	href?: string
 }>()
+
+const event = computed(() => {
+	if (props.href) {
+		return {
+			component: 'a',
+			attrs: {
+				href: props.href,
+				title: t('spreed', 'Open Calendar'),
+				tabindex: 0,
+				target: '_blank',
+			},
+		}
+	}
+
+	return {
+		component: 'span',
+	}
+})
 </script>
 
 <template>
 	<li class="calendar-event">
-		<a class="calendar-event__item"
-			:class="{ 'calendar-event__item--thumb': !href }"
-			:href="href"
-			:title="href ? t('spreed', 'Open Calendar') : name ?? undefined"
-			:tabindex="0"
-			target="_blank">
+		<component :is="event.component"
+			class="calendar-event__item"
+			v-bind="event.attrs">
 			<span class="calendar-event__badge" :style="{ backgroundColor: color }" />
 			<span class="calendar-event__content">
 				<span class="calendar-event__header">
@@ -32,7 +48,7 @@ const props = defineProps<{
 				</span>
 				<span>{{ start }}</span>
 			</span>
-		</a>
+		</component>
 	</li>
 </template>
 
@@ -47,10 +63,6 @@ const props = defineProps<{
 		height: 100%;
 		border-radius: var(--border-radius);
 
-		&--thumb {
-			cursor: default;
-		}
-
 		&:hover {
 			background-color: var(--color-background-hover);
 		}