Merge remote-tracking branch 'origin/dev' into fe-refactor-division-40

app/components/pub/base/data-table/data-table.vue

@@ -31,7 +31,7 @@ function handleActionCellClick(event: Event, _cellRef: string) {
   const cell = event.currentTarget as HTMLElement
   const triggerButton = cell.querySelector('button[data-state]') || cell.querySelector('button')
   if (triggerButton) {
-    (triggerButton as HTMLButtonElement).click()
+    ;(triggerButton as HTMLButtonElement).click()
   }
 }
 </script>
@@ -41,9 +41,11 @@ function handleActionCellClick(event: Event, _cellRef: string) {
     <TableHeader class="bg-gray-50">
       <TableRow>
         <TableHead
-v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
+          v-for="(h, idx) in header[0]"
+          :key="`head-${idx}`"
+          class="border"
           :style="{ width: cols[idx]?.width ? `${cols[idx].width}px` : undefined }"
->
+        >
           {{ h.label }}
         </TableHead>
       </TableRow>
@@ -53,13 +55,13 @@ v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
       <!-- Loading state with 5 skeleton rows -->
       <TableRow v-for="n in getSkeletonSize" :key="`skeleton-${n}`">
         <TableCell v-for="(key, cellIndex) in keys" :key="`cell-skel-${n}-${cellIndex}`" class="border">
-          <Skeleton class="bg-gray-100 animate-pulse text-muted-foreground w-full h-6" />
+          <Skeleton class="h-6 w-full animate-pulse bg-gray-100 text-muted-foreground" />
         </TableCell>
       </TableRow>
     </TableBody>
     <TableBody v-else-if="rows.length === 0">
       <TableRow>
-        <TableCell :colspan="keys.length" class="text-center py-8">
+        <TableCell :colspan="keys.length" class="py-8 text-center">
           <div class="flex items-center justify-center">
             <Info class="size-5 text-muted-foreground" />
             <span class="ml-2">Tidak ada data tersedia</span>
@@ -74,7 +76,11 @@ v-for="(h, idx) in header[0]" :key="`head-${idx}`" class="border"
           :key="`cell-${rowIndex}-${cellIndex}`"
           class="border"
           :class="{ 'cursor-pointer': key === 'action' && funcComponent[key] }"
-          @click="key === 'action' && funcComponent[key] ? handleActionCellClick($event, `cell-${rowIndex}-${cellIndex}`) : null"
+          @click="
+            key === 'action' && funcComponent[key]
+              ? handleActionCellClick($event, `cell-${rowIndex}-${cellIndex}`)
+              : null
+          "
         >
           <!-- If funcComponent has a renderer -->
           <component