From 29f4498ede3d14085b4eb88dbea7d9ff7f45121d Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Sun, 21 Jun 2026 01:56:49 +0700
Subject: [PATCH] refactor: integrate tooltip functionality into activity log
 action button for improved user interaction and clarity

---
 .../activity-logs/table/data-table-actions.vue   | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/resources/js/pages/admin/system/activity-logs/table/data-table-actions.vue b/resources/js/pages/admin/system/activity-logs/table/data-table-actions.vue
index b0b4d40..5e121c2 100644
--- a/resources/js/pages/admin/system/activity-logs/table/data-table-actions.vue
+++ b/resources/js/pages/admin/system/activity-logs/table/data-table-actions.vue
@@ -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>