refactor: integrate tooltip functionality into activity log action button for improved user interaction and clarity
This commit is contained in:
parent
cf7e199306
commit
29f4498ede
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user