06. Dynamic Role-Based Access Control (RBAC)

Ringkasan

Aplikasi dilengkapi dengan Sistem Dinamis RBAC untuk mengontrol hak akses halaman dasbor serta eksekusi tRPC API berdasarkan kombinasi *Role* (Peran) dan *Permission* (Izin Hak Akses).

Cara Kerja

Peran pengguna (seperti SUPER_ADMIN, CASHIER, MANAGER) dihubungkan secara dinamis ke daftar izin hak akses (seperti users.view, roles.manage, theme.update, audit.view) menggunakan tabel relasi junction di database MySQL.

mermaid

graph LR
    User["Data User"] -->|roleId| Role["Role (Contoh: Kasir)"]
    Role -->|RolePermission| Permission["Permission (Contoh: users.view)"]
    
    subgraph Pengaman Akses
        ClientGuard["Komponen RouteGuard"]
        tRPCGuard["Helper checkPermission()"]
    end
    
    Role --> ClientGuard
    Permission --> tRPCGuard

Verifikasi Otorisasi di Sisi Server (tRPC API Guard)

Setiap mutasi database/API memanggil pemeriksaan hak akses untuk menjamin validitas peran sebelum data diubah:

typescript

async function checkPermission(userId: string, requiredPermission: string) {
  const user = await db.user.findUnique({
    where: { id: userId },
    include: {
      role: {
        include: {
          permissions: {
            include: { permission: true },
          },
        },
      },
    },
  });

  const permissions = user?.role?.permissions.map((p) => p.permission.name) ?? [];
  if (!permissions.includes(requiredPermission) && user?.role?.name !== "SUPER_ADMIN") {
    throw new TRPCError({
      code: "FORBIDDEN",
      message: `Required permission '${requiredPermission}' is missing.`,
    });
  }
}

Cara Penggunaan

Pengaturan hak akses dapat dilakukan secara visual melalui panel admin:

Masuk ke Settings -> Roles & Permissions (/settings/roles).

Buat peran baru atau edit peran yang sudah ada.

Centang/hilangkan centang pada matriks izin hak akses (RBAC Matrix) untuk menambah atau mencabut akses secara live.

Kaitkan peran tersebut ke pengguna di menu Users Management (/users).

Berkas Terkait

src/server/api/routers/roles.ts — Router tRPC untuk CRUD Role & Permission

src/components/route-guard.tsx — Guard component untuk membatasi pemuatan halaman dasbor

src/app/(admin)/settings/roles/page.tsx — UI Manajemen Matriks RBAC

Tabel Database Terkait

Role — Tabel peran (ID, Nama Peran, Deskripsi, Tag Warna)

Permission — Tabel izin hak akses (ID, Nama Action Key)

RolePermission — Tabel relasi penghubung Peran dengan Izin Akses