refactor: integrate tooltip functionality into activity log action button for improved user interaction and clarity

This commit is contained in:
Yoga Pangestu 2026-06-21 01:56:49 +07:00
parent cf7e199306
commit 29f4498ede

View File

@ -1,6 +1,9 @@
<script setup lang="ts">
import { Eye } from '@lucide/vue';
import { Button } from '@/components/ui/button';
import Tooltip from '@/components/ui/tooltip/Tooltip.vue';
import TooltipContent from '@/components/ui/tooltip/TooltipContent.vue';
import TooltipTrigger from '@/components/ui/tooltip/TooltipTrigger.vue';
import type { ActivityLogListItem } from '@/types/activity-log';
defineProps<{
@ -13,8 +16,13 @@ const emit = defineEmits<{
</script>
<template>
<Button variant="ghost" size="icon-sm" @click="emit('view')">
<Eye class="size-4" />
<span class="sr-only">Lihat detail</span>
</Button>
<Tooltip>
<TooltipTrigger as-child>
<Button variant="ghost" size="icon" class="size-8" @click="emit('view')">
<Eye class="size-4" />
<span class="sr-only">Lihat</span>
</Button>
</TooltipTrigger>
<TooltipContent>Lihat</TooltipContent>
</Tooltip>
</template>