# Access Control Frontend

The frontend module provides the admin-facing UI for managing admins, roles, and permissions.

Source: `apps/admin/src/core/AccessControl/`

## Directory Structure

```txt
AccessControl/
  config/        Routes, menu, messages, translations.
  data/
    api/         Raw HTTP calls and DTOs.
    mappers/     DTO-to-entity mapping.
    queries/     React Query hooks, keys, and cache invalidation.
  entities/      Admin, role, permission entities and enums.
  pages/         Route-level pages.
  view/
    forms/       Admin and role forms.
    layouts/     Module layout.
    widgets/     Tables and modal triggers.
```

## Routes

Frontend route config:

```txt
config/routing.tsx
```

Mounted module path:

```txt
/access-control
```

| Route                   | Page            | Purpose                                   |
| ----------------------- | --------------- | ----------------------------------------- |
| `/access-control/admin` | `AdminListPage` | Manage admin accounts and assigned roles. |
| `/access-control/role`  | `RoleListPage`  | Manage roles and assigned permissions.    |

## Data Layer

Raw API calls live in:

```txt
data/api/AdminAPI.ts
data/api/RoleAPI.ts
data/api/PermissionAPI.ts
data/api/dto.ts
```

Query hooks live in:

```txt
data/queries/admin.ts
data/queries/role.ts
data/queries/permission.ts
```

Cache invalidation helpers live in:

```txt
data/queries/cache.ts
```

Current helpers:

```ts
invalidateAdminList();
invalidateAdminDetailed(id?);
invalidateRoleList();
invalidateRoleDetailed(id?);
invalidatePermissionList();
```

## DTO Mapping

The API layer returns DTOs. Query hooks map DTOs into entities before data reaches UI code.

```txt
data/mappers/AdminMapper.ts
data/mappers/RoleMapper.ts
data/mappers/PermissionMapper.ts
entities/AdminEntity.ts
entities/RoleEntity.ts
entities/PermissionEntity.ts
```

Keep backend response shape in DTOs. Keep UI/domain shape in entities.

## Forms

Admin form:

```txt
view/forms/AdminForm/
```

Responsibilities:

- Create and update admin data.
- Select admin status.
- Assign roles.
- Optionally update password.

Role form:

```txt
view/forms/RoleForm/
```

Responsibilities:

- Create and update role name.
- Group available permissions by module slug prefix.
- Assign permission slugs to the role.

## Widgets

| Widget               | Purpose                                      |
| -------------------- | -------------------------------------------- |
| `AdminTable`         | Admin list, filters, actions, create button. |
| `RoleTable`          | Role list, actions, create button.           |
| `ManageAdminTrigger` | Admin create/edit dialog orchestration.      |
| `ManageRoleTrigger`  | Role create/edit dialog orchestration.       |
| `DeleteAdminTrigger` | Admin delete confirmation and mutation.      |
| `DeleteRoleTrigger`  | Role delete confirmation and mutation.       |

## Translations

Translations are module-local:

```txt
config/messages.ts
config/translation/en.json
config/translation/uk.json
```

Use only `ACCESS_CONTROL.*` keys inside this module.