From 2d57ab4f0a7a521729b7e342dfde10f31b3e3f06 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Mon, 30 Mar 2026 08:46:05 +0700
Subject: [PATCH] refactor: replace custom empty states with Filament
 empty-state components and improve code formatting in modals

---
 .../assignments-modal.blade.php               | 21 ++++++++++---------
 .../class-sessions/attendance-modal.blade.php | 21 ++++++++++++-------
 .../class-sessions/materials-modal.blade.php  | 17 +++++++--------
 3 files changed, 32 insertions(+), 27 deletions(-)

diff --git a/resources/views/filament/resources/learning/class-sessions/assignments-modal.blade.php b/resources/views/filament/resources/learning/class-sessions/assignments-modal.blade.php
index 246e303..422e3c0 100644
--- a/resources/views/filament/resources/learning/class-sessions/assignments-modal.blade.php
+++ b/resources/views/filament/resources/learning/class-sessions/assignments-modal.blade.php
@@ -1,12 +1,14 @@
 <div class="space-y-4 py-2">
     @forelse($assignments as $assignment)
-        <div class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
+        <div
+            class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
             <div class="flex items-center gap-3">
                 <div class="p-2 rounded-lg bg-primary-100 dark:bg-primary-900/20 text-primary-600 dark:text-primary-400">
                     <x-heroicon-o-pencil-square class="w-5 h-5" />
                 </div>
                 <div class="flex flex-col">
-                    <span class="font-bold text-gray-900 dark:text-white leading-tight uppercase font-mono text-[11px] mb-0.5 tracking-tight text-primary-600/60 dark:text-primary-400/50 block">
+                    <span
+                        class="font-bold text-gray-900 dark:text-white leading-tight uppercase font-mono text-[11px] mb-0.5 tracking-tight text-primary-600/60 dark:text-primary-400/50 block">
                         {{ $assignment->type_label }}
                     </span>
                     <span class="font-bold text-gray-900 dark:text-white leading-tight">{{ $assignment->title }}</span>
@@ -19,18 +21,17 @@
                 </div>
             </div>
             <div class="flex items-center gap-2">
-                <a href="{{ \App\Filament\Resources\Learning\Assignments\AssignmentResource::getUrl('submit', ['record' => $assignment->id]) }}" 
-                   wire:navigate
-                   class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
-                   title="Lihat Detail">
+                <a href="{{ \App\Filament\Resources\Learning\Assignments\AssignmentResource::getUrl('submit', ['record' => $assignment->id]) }}"
+                    wire:navigate
+                    class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
+                    title="Lihat Detail">
                     <x-heroicon-o-chevron-right class="w-5 h-5" />
                 </a>
             </div>
         </div>
     @empty
-        <div class="flex flex-col items-center justify-center py-8 text-center bg-gray-50 dark:bg-white/5 rounded-xl border border-dashed border-gray-200 dark:border-white/10">
-            <x-heroicon-o-pencil-square class="w-12 h-12 text-gray-300 dark:text-gray-600" />
-            <p class="mt-2 text-sm font-medium text-gray-500 dark:text-gray-400">Belum ada tugas untuk sesi ini.</p>
-        </div>
+        <x-filament::empty-state icon="heroicon-o-clipboard-document" heading="Tidak ada data yang ditemukan"
+            description="Belum ada tugas untuk sesi ini." iconColor="gray">
+        </x-filament::empty-state>
     @endforelse
 </div>
diff --git a/resources/views/filament/resources/learning/class-sessions/attendance-modal.blade.php b/resources/views/filament/resources/learning/class-sessions/attendance-modal.blade.php
index 6545ccb..3bbeb4d 100644
--- a/resources/views/filament/resources/learning/class-sessions/attendance-modal.blade.php
+++ b/resources/views/filament/resources/learning/class-sessions/attendance-modal.blade.php
@@ -1,11 +1,11 @@
 <div class="space-y-3">
     @if ($attendances->isEmpty())
-        <div class="flex flex-col items-center justify-center py-8 text-center">
-            <x-heroicon-o-user-group class="w-12 h-12 text-gray-400 mb-3" />
-            <p class="text-sm text-gray-500 font-medium">Belum ada mahasiswa yang melakukan presensi pada sesi ini.</p>
-        </div>
+        <x-filament::empty-state icon="heroicon-o-user-group" heading="Tidak ada data yang ditemukan"
+            description="Belum ada mahasiswa yang melakukan presensi pada sesi ini." iconColor="gray">
+        </x-filament::empty-state>
     @else
-        <div class="fi-ta-content overflow-x-auto rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
+        <div
+            class="fi-ta-content overflow-x-auto rounded-xl border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900">
             <table class="w-full text-sm text-left divider-y dark:divider-white/5">
                 <thead class="bg-gray-50 dark:bg-white/5">
                     <tr>
@@ -19,11 +19,14 @@
                             <td class="px-4 py-3 text-gray-950 dark:text-white font-medium">
                                 <div class="flex flex-col">
                                     <span>{{ $attendance->student->full_name }}</span>
-                                    <span class="text-[10px] text-gray-500 dark:text-gray-400 font-normal uppercase tabular-nums">NIM: {{ $attendance->student->student_number }}</span>
+                                    <span
+                                        class="text-[10px] text-gray-500 dark:text-gray-400 font-normal uppercase tabular-nums">NIM:
+                                        {{ $attendance->student->student_number }}</span>
                                 </div>
                             </td>
                             <td class="px-4 py-3 text-right">
-                                <span class="inline-flex items-center rounded-md bg-success-50 dark:bg-success-400/10 px-2 py-1 text-xs font-bold text-success-700 dark:text-success-400 ring-1 ring-inset ring-success-600/20 tabular-nums">
+                                <span
+                                    class="inline-flex items-center rounded-md bg-success-50 dark:bg-success-400/10 px-2 py-1 text-xs font-bold text-success-700 dark:text-success-400 ring-1 ring-inset ring-success-600/20 tabular-nums">
                                     {{ $attendance->attended_at->format('H:i') }} WIB
                                 </span>
                             </td>
@@ -34,7 +37,9 @@
         </div>
         <div class="mt-4 flex items-center justify-between px-2">
             <p class="text-xs text-gray-500 font-medium">
-                Total Kehadiran: <span class="text-primary-600 dark:text-primary-400 font-bold font-mono">{{ $attendances->count() }} Mahasiswa</span>
+                Total Kehadiran: <span
+                    class="text-primary-600 dark:text-primary-400 font-bold font-mono">{{ $attendances->count() }}
+                    Mahasiswa</span>
             </p>
         </div>
     @endif
diff --git a/resources/views/filament/resources/learning/class-sessions/materials-modal.blade.php b/resources/views/filament/resources/learning/class-sessions/materials-modal.blade.php
index 330535c..ae5860c 100644
--- a/resources/views/filament/resources/learning/class-sessions/materials-modal.blade.php
+++ b/resources/views/filament/resources/learning/class-sessions/materials-modal.blade.php
@@ -1,6 +1,7 @@
 <div class="space-y-4 py-2">
     @forelse($materials as $material)
-        <div class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
+        <div
+            class="flex items-center justify-between p-3 rounded-lg border border-gray-100 dark:border-white/5 bg-gray-50/50 dark:bg-white/5 hover:bg-white dark:hover:bg-white/10 transition-colors shadow-sm">
             <div class="flex items-center gap-3">
                 <div class="p-2 rounded-lg bg-amber-100 dark:bg-amber-900/20 text-amber-600 dark:text-amber-400">
                     <x-heroicon-o-document-text class="w-5 h-5" />
@@ -13,18 +14,16 @@
                 </div>
             </div>
             <div class="flex items-center gap-2">
-                <button type="button" 
-                   wire:click="mountAction('viewMaterialDetail', { record: {{ $material->id }} })"
-                   class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
-                   title="Lihat Detail">
+                <button type="button" wire:click="mountAction('viewMaterialDetail', { record: {{ $material->id }} })"
+                    class="p-1.5 rounded-full hover:bg-gray-200 dark:hover:bg-white/10 text-gray-500 transition-colors"
+                    title="Lihat Detail">
                     <x-heroicon-o-chevron-right class="w-5 h-5" />
                 </button>
             </div>
         </div>
     @empty
-        <div class="flex flex-col items-center justify-center py-8 text-center bg-gray-50 dark:bg-white/5 rounded-xl border border-dashed border-gray-200 dark:border-white/10">
-            <x-heroicon-o-document-minus class="w-12 h-12 text-gray-300 dark:text-gray-600" />
-            <p class="mt-2 text-sm font-medium text-gray-500 dark:text-gray-400">Belum ada materi untuk sesi ini.</p>
-        </div>
+        <x-filament::empty-state icon="heroicon-o-document-minus" heading="Tidak ada data yang ditemukan"
+            description="Belum ada materi untuk sesi ini." iconColor="gray">
+        </x-filament::empty-state>
     @endforelse
 </div>