# Phase 4: Per-Board Access Control UI **Status:** Done **Parent plan:** [PLAN.md](./PLAN.md) **Domain:** fullstack ## Objective Add a user-friendly access control interface for boards, allowing admins to manage per-board permissions with user/group pickers and visual indicators. ## Tasks - [x] Task 1: Create `src/lib/components/board/BoardAccessControl.svelte` — inline permission editor for boards - [x] Task 2: Add access control tab/section to board editor page - [x] Task 3: Create `src/routes/api/boards/[id]/permissions/+server.ts` — GET/POST/DELETE permissions for a board - [x] Task 4: Update `src/lib/components/admin/PermissionEditor.svelte` — enhance with user/group search/autocomplete - [x] Task 5: Update `src/lib/components/board/BoardCard.svelte` — show access level indicator (icon/badge) - [x] Task 6: Update `src/routes/boards/+page.svelte` — show access indicators on board list - [x] Task 7: Add guest access toggle with preview description to board editor - [x] Task 8: Create `src/lib/components/board/BoardShareDialog.svelte` — quick share dialog for boards ## Files to Modify/Create - `src/lib/components/board/BoardAccessControl.svelte` — NEW - `src/lib/components/board/BoardShareDialog.svelte` — NEW - `src/routes/api/boards/[id]/permissions/+server.ts` — NEW - `src/routes/boards/[boardId]/edit/+page.svelte` — MODIFY - `src/routes/boards/[boardId]/edit/+page.server.ts` — MODIFY - `src/lib/components/admin/PermissionEditor.svelte` — MODIFY - `src/lib/components/board/BoardCard.svelte` — MODIFY - `src/routes/boards/+page.svelte` — MODIFY (server only — +page.server.ts) - `src/routes/boards/[boardId]/+page.svelte` — MODIFY - `src/routes/boards/[boardId]/+page.server.ts` — MODIFY - `src/lib/components/board/BoardHeader.svelte` — MODIFY - `src/lib/i18n/en.json` — MODIFY - `src/lib/i18n/ru.json` — MODIFY ## Acceptance Criteria - Board editor has a permissions section for managing access - Admins can grant/revoke view/edit/admin permissions per user or group - Board list shows access indicators (shared icon, guest badge, etc.) - Quick share dialog allows easy permission granting - Guest access toggle works with visual feedback ## Notes - The permission system already exists from MVP (permissionService) - This phase adds the UI layer on top of existing backend - ⚠️ Big Bang: may need integration fixes in Phase 6 ## Review Checklist - [x] All tasks completed - [x] Code follows project conventions - [ ] No unintended side effects - [ ] Build passes - [ ] Tests pass (new + existing) ## Handoff to Next Phase - Created `BoardAccessControl.svelte` — self-contained board permission manager with search/autocomplete, fetches from `/api/boards/[id]/permissions` - Created `BoardShareDialog.svelte` — modal dialog for quick sharing with copy link, guest toggle, and permission management - Created `/api/boards/[id]/permissions` API endpoint with GET/POST/DELETE for board-scoped permissions - Enhanced `PermissionEditor.svelte` with search/autocomplete inputs replacing plain dropdowns - Updated `BoardCard.svelte` with globe (guest), lock (private), and users (shared) icons - Updated board editor with dedicated Guest Access and Permissions sections - Updated `BoardHeader.svelte` with Share button that opens the share dialog - Updated board view page (`[boardId]/+page.svelte`) and its server load to support share dialog with user/group data - Updated boards list server to compute `hasSharedPermissions` flag per board - Added ~20 new i18n keys in both `en.json` and `ru.json` for all new UI strings - Big Bang strategy: no build/test verification — Phase 6 integration may be needed