From c821d9795d791add54d42c833e6dfa22ca03b2f6 Mon Sep 17 00:00:00 2001
From: "[Valentino Heman Budiarto]" <[hemanvalentino@gmail.com]>
Date: Fri, 29 May 2026 20:26:41 +0700
Subject: [PATCH] fetch

---
 frontend/app/dashboard/page.tsx | 30 +++++++++++++++++++-----------
 1 file changed, 19 insertions(+), 11 deletions(-)

diff --git a/frontend/app/dashboard/page.tsx b/frontend/app/dashboard/page.tsx
index a41a59f..ab3f99a 100644
--- a/frontend/app/dashboard/page.tsx
+++ b/frontend/app/dashboard/page.tsx
@@ -20,6 +20,7 @@ export default function Dashboard() {
   const [user, setUser] = useState<any>(null);
   const [rooms, setRooms] = useState<Room[]>([]);
   const [loading, setLoading] = useState(true);
+  const [apiError, setApiError] = useState(""); // State baru untuk menangkap pesan error API
 
   // --- STATE UNTUK MODAL BOOKING ---
   const [isModalOpen, setIsModalOpen] = useState(false);
@@ -45,13 +46,15 @@ export default function Dashboard() {
 
   const fetchRooms = async (token: string) => {
     try {
-      const response = await axios.get("http://172.17.110.6:8080/api/rooms", {
+      // UBAH IP KE SERVER KAMPUS (172.17.172.17)
+      const response = await axios.get("http://172.17.172.17:8080/api/rooms", {
         headers: { Authorization: `Bearer ${token}` },
       });
       setRooms(response.data.data);
-    } catch (error) {
-      console.error("Error:", error);
-      router.push("/login");
+    } catch (error: any) {
+      console.error("Error fetching rooms:", error);
+      // Jangan langsung tendang ke login, tampilkan pesan errornya di layar
+      setApiError(error.response?.data?.error || "Gagal memuat data ruangan dari server.");
     } finally {
       setLoading(false);
     }
@@ -61,7 +64,6 @@ export default function Dashboard() {
   const openBookingModal = (room: Room) => {
     setSelectedRoom(room);
     setIsModalOpen(true);
-    // Reset form
     setStartTime("");
     setEndTime("");
     setPurpose("");
@@ -78,8 +80,9 @@ export default function Dashboard() {
       const startISO = new Date(startTime).toISOString();
       const endISO = new Date(endTime).toISOString();
 
+      // UBAH IP KE SERVER KAMPUS (172.17.172.17)
       await axios.post(
-        "http://172.17.110.6:8080/api/bookings",
+        "http://172.17.172.17:8080/api/bookings",
         {
           room_id: selectedRoom?.room_id,
           start_time: startISO,
@@ -92,7 +95,8 @@ export default function Dashboard() {
       );
 
       alert("Booking Berhasil Diajukan! Menunggu persetujuan.");
-      setIsModalOpen(false); // Tutup modal
+      setIsModalOpen(false); 
+      fetchRooms(token!); // Refresh data ruangan setelah booking
 
     } catch (error: any) {
       const errorMsg = error.response?.data?.error || "Gagal melakukan booking.";
@@ -102,7 +106,7 @@ export default function Dashboard() {
     }
   };
 
-  if (loading) return <div className="p-10 text-center">Memuat data...</div>;
+  if (loading) return <div className="p-10 text-center text-blue-600 font-semibold text-lg animate-pulse">Memuat data kelas S-CLASS...</div>;
 
   return (
     <div className="w-full">
@@ -119,9 +123,15 @@ export default function Dashboard() {
         </button>
       </div>
       
+      {/* Jika terjadi error koneksi ke Backend */}
+      {apiError && (
+         <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-6">
+            <strong>Terjadi Kesalahan:</strong> {apiError}
+         </div>
+      )}
+
       {/* Grid Daftar Kelas */}
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-        {/* TAMBAHKAN PENGURUTAN ABJAD DI SINI */}
         {[...rooms]
           .sort((a, b) => a.name.localeCompare(b.name))
           .map((room) => (
@@ -161,7 +171,6 @@ export default function Dashboard() {
         <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4 backdrop-blur-sm">
           <div className="bg-white rounded-2xl w-full max-w-md shadow-xl overflow-hidden border border-gray-100">
             
-            {/* Header Modal */}
             <div className="bg-blue-600 p-4 flex justify-between items-center text-white">
               <h3 className="font-semibold text-lg">Form Peminjaman</h3>
               <button onClick={() => setIsModalOpen(false)} className="hover:bg-blue-700 p-1 rounded-lg transition-colors">
@@ -169,7 +178,6 @@ export default function Dashboard() {
               </button>
             </div>
 
-            {/* Body Form */}
             <form onSubmit={handleBookingSubmit} className="p-6 space-y-4">
               <div className="bg-blue-50 p-3 rounded-lg border border-blue-100 mb-2">
                 <p className="text-sm text-blue-800 font-semibold">Ruangan: {selectedRoom.name}</p>