feat: add tooltips for class in search results table

acdh-oeaw · Feb 9, 2024 · a0a2a07 · a0a2a07
1 parent 880a852
commit a0a2a07
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/components/search-results-table.vue b/components/search-results-table.vue
@@ -34,8 +34,17 @@ const { d } = useI18n();
 		<TableBody>
 			<TableRow v-for="entity of props.entities" :key="entity.properties._id">
 				<TableCell class="font-medium">
-					<Component :is="getEntityIcon(entity.systemClass)" class="size-4 shrink-0" />
-					<span class="sr-only">{{ entity.systemClass }}</span>
+					<TooltipProvider>
+						<Tooltip>
+							<TooltipTrigger class="cursor-default">
+								<Component :is="getEntityIcon(entity.systemClass)" class="size-4 shrink-0" />
+							</TooltipTrigger>
+							<TooltipContent>
+								{{ t(`SystemClassNames.${entity.systemClass}`) }}
+							</TooltipContent>
+						</Tooltip>
+					</TooltipProvider>
+					<span class="sr-only">{{ t(`SystemClassNames.${entity.systemClass}`) }}</span>
 				</TableCell>
 				<TableCell>
 					<NavLink

diff --git a/components/ui/tooltip/TooltipTrigger.vue b/components/ui/tooltip/TooltipTrigger.vue
@@ -5,7 +5,7 @@ const props = defineProps<TooltipTriggerProps>();
 </script>
 
 <template>
-	<TooltipTrigger v-bind="props" class="">
+	<TooltipTrigger v-bind="props">
 		<slot />
 	</TooltipTrigger>
 </template>