You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
[Task]: Optimasi Responsif Mobile UI Menu Mitra Faskes Panel Admin (apps/web) #33
Problem: Layout menu Mitra Fasilitas Kesehatan pada portal admin (apps/web) saat ini dioptimalkan untuk desktop dengan grid master-detail 5:7 berdampingan, tabs filter 5 kolom yang sempit di mobile, dan panel detail yang menumpuk panjang ke bawah pada viewport ponsel (< 768px).
Scope:
Menyesuaikan tab navigasi filter status (all, pending, approved, rejected, suspended) agar mendukung horizontal scroll / overflow responsif tanpa pemotongan teks.
Mengoptimasi alur master-detail pada layar mobile: navigasi transisi/drawer/modal atau navigasi kembali yang intuitif agar pengguna tidak perlu menggulir jauh ke bawah.
Merapikan elemen di PartnerDetailPanel: penyesuaian header mitra, kartu catatan penolakan/revisi, grup tombol aksi verifikasi, serta daftar psikolog naungan faskes agar touch-friendly dan bebas horizontal overflow.
Out of Scope:
Modifikasi logika backend/API atau kontrak database mock portal.
Perubahan di luar menu Mitra Faskes.
Acceptance Criteria
Tab filter status mitra dapat di-scroll secara horizontal atau tersusun rapi pada layar sempit (360px–480px) tanpa teks terpotong.
Daftar antrean faskes dan detail mitra dapat dinavigasi dengan mudah di mobile tanpa merusak viewport.
Tombol aksi persetujuan/penolakan dan dialog alasan penolakan proporsional serta mudah ditekan (touch-friendly).
Daftar psikolog di bawah naungan faskes tampil responsif (kartu ringkas atau tabel berkontainer scroll aman).
Tidak ada regresi visual pada breakpoint tablet (md) dan desktop (lg, xl).
Lulus pengujian build (pnpm build atau npm run build di apps/web) tanpa error TypeScript maupun linting.
Technical Notes & Architecture
Menggunakan Tailwind CSS utility breakpoint (sm:, md:, lg:).
Mematuhi design tokens Eva UI (warna primary, ink, border #E2E8F0).
Komponen target: apps/web/src/components/portal/admin/AdminPartnersModule.tsx dan PartnerDetailPanel.tsx.
Definition of Done
Unit / UI verification dijalankan pada simulasi mobile (360px, 390px, 412px, 768px).
Branch dibuat mematuhi konvensi {type}/{issue}-{slug} (contoh: feat/{issue}-mobile-responsive-admin-partners).
Pull request menyertakan bukti screenshot/evidence tampilan mobile dan desktop.
Activity