docs: update internal documentation hub with granular permissions and new 2FA features

This commit is contained in:
2026-05-21 22:26:01 +07:00
parent 7965b34c85
commit 9b17d91380
38 changed files with 186 additions and 155 deletions
+64 -33
View File
@@ -308,14 +308,26 @@ Content-Type: application/json
</thead>
<tbody>
{[
{ perm: 'user.view', u: true, a: true, s: true },
{ perm: 'user.create', u: false, a: true, s: true },
{ perm: 'user.edit', u: false, a: true, s: true },
{ perm: 'user.delete', u: false, a: true, s: true },
{ perm: 'role.view', u: false, a: true, s: true },
{ perm: 'role.manage', u: false, a: false, s: true },
{ perm: 'settings.manage',u: false, a: false, s: true },
{ perm: 'reports.view', u: false, a: true, s: true },
{ perm: 'user.view', u: true, a: true, s: true },
{ perm: 'user.create', u: false, a: true, s: true },
{ perm: 'user.edit', u: false, a: true, s: true },
{ perm: 'user.delete', u: false, a: true, s: true },
{ perm: 'user.restore', u: false, a: true, s: true },
{ perm: 'user.force-delete', u: false, a: false, s: true },
{ perm: 'user.export', u: false, a: true, s: true },
{ perm: 'user.import', u: false, a: true, s: true },
{ perm: 'role.view', u: false, a: true, s: true },
{ perm: 'role.create', u: false, a: true, s: true },
{ perm: 'role.delete', u: false, a: true, s: true },
{ perm: 'role.manage', u: false, a: true, s: true },
{ perm: 'notifications.view', u: false, a: true, s: true },
{ perm: 'notifications.send', u: false, a: true, s: true },
{ perm: 'activity-logs.view', u: false, a: true, s: true },
{ perm: 'activity-logs.delete', u: false, a: false, s: true },
{ perm: 'settings.view', u: false, a: false, s: true },
{ perm: 'settings.edit', u: false, a: false, s: true },
{ perm: 'settings.test-email', u: false, a: false, s: true },
{ perm: 'documentation.view', u: false, a: false, s: true },
].map(row => (
<tr key={row.perm} className="border-b border-gray-50 dark:border-white/5 last:border-0">
<td className="py-3 pr-6 font-mono font-bold text-[#3D4E4B] dark:text-white">{row.perm}</td>
@@ -493,44 +505,63 @@ $this->authorize('user.delete');
{/* ── 2FA ── */}
<section>
<SectionHeader id="2fa" title="Two-Factor Authentication" badge="TOTP" badgeColor="amber" />
<div className="bg-white dark:bg-[#1A2120] rounded-2xl border border-gray-100 dark:border-white/10 shadow-sm p-8 space-y-4">
<SectionHeader id="2fa" title="Two-Factor Authentication" badge="TOTP + EMAIL" badgeColor="amber" />
<div className="bg-white dark:bg-[#1A2120] rounded-2xl border border-gray-100 dark:border-white/10 shadow-sm p-8 space-y-6">
<p className="text-sm text-gray-500 dark:text-gray-400 font-medium leading-relaxed">
2FA menggunakan protokol <strong className="text-[#3D4E4B] dark:text-white">TOTP (Time-based One-Time Password)</strong> yang kompatibel dengan Google Authenticator, Authy, dan 1Password.
Sistem mendukung dual-modality 2FA: <strong className="text-[#3D4E4B] dark:text-white">TOTP (Google Authenticator)</strong> dan <strong className="text-[#3D4E4B] dark:text-white">Email Verification OTP</strong>. Integrasi 2FA dirancang dengan prioritas keamanan ketat dan kontrol administrasi global.
</p>
<div className="space-y-3">
{[
{ step: '1', title: 'Buka tab Two-Factor Auth', desc: 'Masuk ke Account Settings (/settings) → tab "Two-Factor Auth"' },
{ step: '2', title: 'Scan QR Code', desc: 'Gunakan aplikasi authenticator (Google Authenticator / Authy) untuk scan QR' },
{ step: '3', title: 'Masukkan kode verifikasi', desc: 'Ketik 6 digit dari aplikasi untuk mengaktifkan 2FA' },
{ step: '4', title: 'Simpan recovery codes', desc: '8 kode cadangan tersedia — simpan di tempat aman jika kehilangan akses ke authenticator' },
{ step: '5', title: 'Login berikutnya', desc: 'Setelah diaktifkan, setiap login akan redirect ke halaman 2FA Challenge sebelum masuk dashboard' },
].map(s => (
<div key={s.step} className="flex items-start gap-4 p-4 bg-gray-50 dark:bg-white/5 rounded-xl">
<div className="w-7 h-7 rounded-full bg-[#3D4E4B] text-white text-xs font-black flex items-center justify-center shrink-0">{s.step}</div>
<div>
<div className="text-sm font-bold text-[#3D4E4B] dark:text-white">{s.title}</div>
<div className="text-xs text-gray-400 font-medium mt-0.5">{s.desc}</div>
</div>
</div>
))}
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<div className="p-5 bg-gray-50 dark:bg-white/5 rounded-xl border border-gray-100 dark:border-white/10">
<div className="text-xs font-black text-[#D4A017] uppercase tracking-widest mb-3">📱 Google Authenticator / TOTP</div>
<ul className="space-y-2 text-xs font-medium text-gray-500 dark:text-gray-400 list-disc list-inside">
<li>Protokol standar industri RFC 6238</li>
<li>Dilengkapi 8 Recovery Codes cadangan sekali pakai</li>
<li>Dapat di-scan instan via QR Code</li>
</ul>
</div>
<div className="p-5 bg-gray-50 dark:bg-white/5 rounded-xl border border-gray-100 dark:border-white/10">
<div className="text-xs font-black text-[#D4A017] uppercase tracking-widest mb-3"> Email OTP 2FA</div>
<ul className="space-y-2 text-xs font-medium text-gray-500 dark:text-gray-400 list-disc list-inside">
<li>Pengiriman kode 6-digit dinamis langsung ke email user</li>
<li>Masa berlaku kode terbatas (TTL 10 menit)</li>
<li>Mencegah aktivasi jika SMTP Mailer belum tervalidasi</li>
</ul>
</div>
</div>
<div className="p-4 bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-700/40 rounded-xl">
<p className="text-xs font-bold text-blue-700 dark:text-blue-400">2FA bersifat opsional per user. Setelah diaktifkan, setiap login akan meminta kode 6 digit dari authenticator.</p>
<div>
<h3 className="text-xs font-black text-[#3D4E4B] dark:text-white uppercase tracking-widest mb-3">Alur Aktivasi Keamanan 2FA</h3>
<div className="space-y-3">
{[
{ step: '1', title: 'Verifikasi SMTP / Mail Delivery', desc: 'Sebelum mengaktifkan Email 2FA, pastikan SMTP Mailer di System Settings terkonfigurasi dengan benar dan di-tes sukses handshake-nya.' },
{ step: '2', title: 'Pilih Metode di Pengaturan Pengguna', desc: 'Akses halaman Account Settings (/settings) → tab "Two-Factor Auth" untuk memilih metode yang diinginkan.' },
{ step: '3', title: 'Konfirmasi Kode OTP / Autentikator', desc: 'Masukkan kode validasi perdana untuk memastikan setup sinkron dengan sistem sebelum metode di-lock.' },
{ step: '4', title: 'Global Admin Override (Force Disable)', desc: 'Apabila administrator menonaktifkan metode 2FA secara global di System Settings, bypass otomatis akan di-enforce di login screen.' },
].map(s => (
<div key={s.step} className="flex items-start gap-4 p-4 bg-gray-50 dark:bg-white/5 rounded-xl">
<div className="w-7 h-7 rounded-full bg-[#3D4E4B] text-white text-xs font-black flex items-center justify-center shrink-0">{s.step}</div>
<div>
<div className="text-sm font-bold text-[#3D4E4B] dark:text-white">{s.title}</div>
<div className="text-xs text-gray-400 font-medium mt-0.5">{s.desc}</div>
</div>
</div>
))}
</div>
</div>
</div>
</section>
{/* ── SYSTEM SETTINGS ── */}
<section>
<SectionHeader id="settings" title="System Settings" badge="Super Admin" badgeColor="red" />
<SectionHeader id="settings" title="System Settings" badge="Admin / Super Admin" badgeColor="red" />
<div className="bg-white dark:bg-[#1A2120] rounded-2xl border border-gray-100 dark:border-white/10 shadow-sm p-8 space-y-4">
<p className="text-sm text-gray-500 dark:text-gray-400 font-medium">Hanya bisa diakses oleh pengguna dengan role <Badge color="red">super-admin</Badge>. Tersedia di <code className="text-xs bg-gray-100 dark:bg-white/10 px-2 py-0.5 rounded font-mono">/system-settings</code>.</p>
<p className="text-sm text-gray-500 dark:text-gray-400 font-medium">Dapat diakses oleh pengguna dengan role <Badge color="red">super-admin</Badge> atau memiliki permission <Badge color="blue">settings.view</Badge>. Perubahan konfigurasi membutuhkan permission <Badge color="blue">settings.edit</Badge>. Tersedia di <code className="text-xs bg-gray-100 dark:bg-white/10 px-2 py-0.5 rounded font-mono">/system-settings</code>.</p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{[
{ tab: 'General & Branding', items: ['Nama aplikasi', 'Logo upload', 'Teks logo fallback', 'Registrasi publik on/off', 'Verifikasi email on/off'] },
{ tab: 'General & Branding', items: ['Nama aplikasi', 'Logo upload', 'Teks logo fallback', 'Registrasi publik on/off', 'Verifikasi email on/off', 'Global TOTP 2FA toggle (Aktif/Nonaktif)', 'Global Email 2FA toggle (Aktif/Nonaktif)'] },
{ tab: 'Security & OAuth', items: ['Password minimum panjang', 'Wajib huruf besar/kecil/angka/simbol', 'Google OAuth (Client ID & Secret)', 'GitHub OAuth (Client ID & Secret)'] },
{ tab: 'Email / SMTP', items: ['Host & port SMTP', 'Enkripsi (TLS/SSL)', 'Username & password SMTP', 'From name & address', 'Test kirim email dari UI'] },
{ tab: 'Email / SMTP', items: ['Host & port SMTP', 'Enkripsi (TLS/SSL)', 'Username & password SMTP', 'From name & address', 'Test kirim email handshake real-time (butuh settings.test-email)'] },
{ tab: 'Mobile App Control', items: ['Versi terbaru & minimum Android', 'URL Play Store', 'Mode maintenance mobile app', 'Pesan maintenance kustom'] },
].map(t => (
<div key={t.tab} className="p-5 bg-gray-50 dark:bg-white/5 rounded-xl">