[Phase 3] Wire Admin UI to Real Backend APIs

[AliHamaSmart]

🔌 Phase 3 — Connect Admin UI to Real Backend APIs

Semua halaman admin saat ini masih menggunakan hardcoded/mock data. Backend API sudah fully implemented sejak Phase 2. Issue ini melacak pekerjaan menghubungkan UI ke API yang sudah ada.

---

Scope Checklist

A. UsersPage

• [UI-USERS-1] Fetch GET /api/v1/users → render tabel user nyata
• [UI-USERS-2] Tombol "Tambah User" → POST /api/v1/users (form modal)
• [UI-USERS-3] Tombol hapus user → DELETE /api/v1/users/{id}
• [UI-USERS-4] Loading state + error handling

B. DevicesPage

• [UI-DEVICES-1] Fetch GET /api/v1/devices → render daftar kiosk nyata
• [UI-DEVICES-2] Tombol "Tambah Device" → POST /api/v1/devices (form modal)
• [UI-DEVICES-3] Revoke/delete device → DELETE /api/v1/devices/{id}
• [UI-DEVICES-4] Loading state + error handling

C. SchedulesPage

• [UI-SCHED-1] Fetch GET /api/v1/schedules → render jadwal shift nyata
• [UI-SCHED-2] Tambah jadwal baru → POST /api/v1/schedules
• [UI-SCHED-3] Edit jadwal → PUT /api/v1/schedules/{id}
• [UI-SCHED-4] Hapus jadwal → DELETE /api/v1/schedules/{id}
• [UI-SCHED-5] Loading state + error handling

D. AttendancePage

• [UI-ATT-1] Fetch GET /api/v1/attendance → render data absensi nyata
• [UI-ATT-2] Filter by date range
• [UI-ATT-3] Tombol Export → GET /api/v1/reports/attendance/export?format=csv
• [UI-ATT-4] Loading state + error handling

E. Dashboard Stats

• [UI-DASH-1] Fetch GET /api/v1/reports/attendance/daily → stat cards nyata
• [UI-DASH-2] SuperAdmin dashboard stats dari GET /api/v1/tenants

F. Shared Infrastructure

• [UI-INFRA-1] Centralized API client dengan auth header injection (Bearer token dari authStore)
• [UI-INFRA-2] Reusable error toast / error boundary untuk API failures
• [UI-INFRA-3] TypeScript types dari backend response shapes

---

API yang Sudah Ada di Backend

Endpoint	Method	Dipakai di
/api/v1/users	GET, POST	UsersPage
/api/v1/users/{id}	DELETE	UsersPage
/api/v1/devices	GET, POST	DevicesPage
/api/v1/devices/{id}	DELETE	DevicesPage
/api/v1/schedules	GET, POST	SchedulesPage
/api/v1/schedules/{id}	PUT, DELETE	SchedulesPage
/api/v1/attendance	GET	AttendancePage
/api/v1/reports/attendance/daily	GET	Dashboard
/api/v1/reports/attendance/export	GET	AttendancePage
/api/v1/tenants	GET	SuperAdmin

---

Definition of Done

• Tidak ada lagi hardcoded ROWS, DEVICES, SCHEDULES array di UI
• Semua halaman menampilkan data dari backend yang berjalan
• Auth token dikirim di setiap request
• Loading dan error state di-handle dengan baik
• TypeScript tidak ada any baru

[AliHamaSmart]

Update — Phase 3 Selesai

Semua halaman admin telah dihubungkan ke backend API nyata:

Selesai ✅

• [UI-USERS-1,2,4] UsersPage: list + create user dari API, loading state, error handling
• [UI-DEVICES-1,2,3,4] DevicesPage: list, register, revoke device
• [UI-SCHED-1,2,5] SchedulesPage: list + create jadwal
• [UI-ATT-1,2,3,4] AttendancePage: list dengan date filter, export URL
• [UI-DASH-1,2] Dashboard stats: SuperAdmin (tenants, users, daily report) + TenantAdmin
• [UI-INFRA-1] Shared API client di adminApi.ts + enrollmentApi.ts dengan auth header injection
• [UI-INFRA-2] Toast notification system global (sukses/error di semua halaman CRUD)

Belum dikerjakan ⚠️

• [UI-USERS-3] Delete user (DELETE /api/v1/users/{id}) — endpoint backend perlu dicek
• [UI-SCHED-3,4] Edit & delete jadwal — belum ada di UI

Closing tidak dilakukan karena 2 item masih pending. Dapat dilanjutkan di sprint berikutnya.