T08a: Frontend DMS + Tags + Permissions UI — 33 tests, tsc clean, vite build pass

- DMS file browser: folder tree + file grid + upload dropzone + search + preview modal
- DMS share dialog: user/group share + public share links with password+expiry
- DMS bulk actions: bulk move + bulk delete with confirm dialogs
- DMS trash view: deleted files list with restore button
- Tags: TagPicker on company/contact detail pages (new tabs tab)
- Tags: TagCloud + BulkTagDialog for bulk tag assignment
- Permissions: share link creation, permission display, copy-link button
- API clients: dms.ts, tags.ts, permissions.ts
- Routes: /dms, /dms/trash added to router
- Sidebar: DMS nav link updated
- i18n: de.json + en.json translations for DMS/Tags/Permissions
- 33 new tests (5 test files), full regression 276/276 pass
- tsc --noEmit: 0 errors, vite build: 252 modules
This commit is contained in:
leocrm-bot
2026-07-01 16:54:32 +02:00
parent f646c597dc
commit 0962f3a961
31 changed files with 3368 additions and 41 deletions
+123
View File
@@ -0,0 +1,123 @@
# T08a: Frontend DMS + Tags + Permissions UI — Implementation Briefing
## Task
Implement frontend UI for DMS plugin (file browser, upload, preview, share, trash), Tags UI (assign, bulk, tag cloud), and Permissions UI (share links, permission display).
## Requirements
- F-DMS-0107: DMS file browser, folder tree, upload, preview, share, trash, search
- F-FILEUI-0106: File UI components (dropzone, preview modal, share dialog, bulk actions, trash view)
- F-TAG-0104: Tags UI (assign, bulk assign, tag cloud, tag picker)
- F-PERM-0305: Permissions UI (share links, permission display)
- F-LINK-0105: Entity links UI
## Acceptance Criteria (12 ACs)
1. DMS route /dms renders file browser with folder tree + file grid
2. DMS upload: drag file to dropzone → upload progress → file appears in list
3. DMS file preview modal opens with PDF.js for PDF files
4. DMS share dialog: select user/group, set permission, share created
5. DMS public share link: copy button generates URL, optional password+expiry fields
6. DMS bulk select → bulk-move or bulk-delete actions appear
7. DMS trash view: deleted files list, restore button per file
8. Mail: shared mailbox selector (DO NOT IMPLEMENT — belongs to T08c)
9. Tags: tag picker on company/contact detail → assign/unassign
10. Tags: bulk select entities → bulk-tag dialog
11. Plugin deactivate → plugin route+menu-item disappear from SPA
12. Plugin activate → plugin route+menu-item appear in SPA
## Backend API Endpoints (already implemented)
### DMS (/api/v1/dms)
- GET /folders — list folder tree
- POST /folders — create folder
- PATCH /folders/{id} — rename/move folder
- DELETE /folders/{id} — delete folder
- POST /files/upload — upload file (multipart)
- GET /files/{id} — get file detail
- PATCH /files/{id} — update file (rename/move)
- DELETE /files/{id} — soft-delete file
- POST /files/{id}/restore — restore from trash
- GET /files/{id}/preview — stream file for preview
- POST /files/{id}/edit-session — create OnlyOffice edit session
- POST /files/{id}/share — share file with user/group
- DELETE /files/{id}/share — remove share
- GET /search?q=text — search files
- GET /shared-with-me — files shared with current user
- POST /files/bulk-move — bulk move files
- POST /files/bulk-delete — bulk delete files
### Tags (/api/v1/tags)
- GET / — list tags
- POST / — create tag
- PATCH /{id} — update tag
- DELETE /{id} — delete tag
- POST /assign — assign tag to entity
- DELETE /assign — unassign tag
- POST /bulk-assign — bulk assign tags
- GET /{id}/entities — list entities for tag
### Permissions (/api/v1/permissions)
- GET /files/{id}/permissions — list permissions
- POST /files/{id}/permissions — grant permission
- DELETE /files/{id}/permissions/{user_id} — revoke permission
- POST /files/{id}/share-link — create public share link
- DELETE /share-links/{id} — revoke share link
## Frontend Architecture (follow existing patterns)
- **Framework:** React + TypeScript + Vite
- **Routing:** react-router-dom (createBrowserRouter, see src/routes/index.tsx)
- **State:** TanStack Query (useQuery/useMutation)
- **HTTP:** axios via src/api/client.ts (apiClient, baseURL /api/v1)
- **API pattern:** See src/api/calendar.ts for plugin API client example
- **UI components:** src/components/ui/ (Button, Card, Input, Modal, Table, Badge, ConfirmDialog, EmptyState, Pagination, Select, Skeleton, Toast)
- **Shared components:** src/components/shared/ (DataGrid, SearchDropdown, Tabs, ActivityFeed)
- **Store:** src/store/ (authStore, uiStore)
- **Layout:** src/components/layout/AppShell (sidebar + main area)
- **i18n:** src/i18n/ (add de.json + en.json keys for DMS/Tags)
## Files to Create
- `src/api/dms.ts` — DMS API client (types + functions)
- `src/api/tags.ts` — Tags API client
- `src/api/permissions.ts` — Permissions API client
- `src/pages/Dms.tsx` — DMS file browser page (folder tree + file grid)
- `src/pages/DmsTrash.tsx` — DMS trash view
- `src/components/dms/FolderTree.tsx` — folder tree sidebar
- `src/components/dms/FileGrid.tsx` — file grid with icons
- `src/components/dms/UploadDropzone.tsx` — drag-drop upload
- `src/components/dms/FilePreviewModal.tsx` — file preview modal
- `src/components/dms/ShareDialog.tsx` — share dialog
- `src/components/dms/BulkActions.tsx` — bulk select actions
- `src/components/tags/TagPicker.tsx` — tag assign/unassign picker
- `src/components/tags/TagCloud.tsx` — tag cloud display
- `src/components/tags/BulkTagDialog.tsx` — bulk tag assignment dialog
- `src/__tests__/dms/DmsPage.test.tsx` — DMS page tests
- `src/__tests__/dms/UploadDropzone.test.tsx` — upload tests
- `src/__tests__/tags/TagPicker.test.tsx` — tag picker tests
- `src/__tests__/tags/BulkTagDialog.test.tsx` — bulk tag tests
- `src/__tests__/permissions/ShareDialog.test.tsx` — share dialog tests
## Files to Modify
- `src/routes/index.tsx` — Add /dms, /dms/trash routes
- `src/components/layout/AppShell.tsx` — Add DMS + Tags menu items to sidebar
- `src/pages/CompanyDetail.tsx` — Add TagPicker component
- `src/pages/ContactDetail.tsx` — Add TagPicker component
- `src/i18n/locales/de.json` — Add DMS/Tags translations
- `src/i18n/locales/en.json` — Add DMS/Tags translations
## Test Spec
- Run: `cd /a0/usr/workdir/dev-projects/leocrm/frontend && npx vitest run src/__tests__/dms/ src/__tests__/tags/ src/__tests__/permissions/ --reporter=verbose`
- Coverage: `npx vitest run src/__tests__/dms/ src/__tests__/tags/ --coverage`
- Build: `npx vite build`
- Type check: `npx tsc --noEmit`
- Coverage target: 80%
- Follow existing test pattern from src/__tests__/companies/ or src/__tests__/calendar/
## Forbidden Patterns
- No inline styles — use Tailwind classes
- No any types — use proper TypeScript interfaces
- No direct fetch() — use apiClient from src/api/client.ts
- No hardcoded strings — use i18n (t() function)
- No Lorem Ipsum — use realistic test data
- No missing loading/error/empty states
## Estimated Size
- ~600 lines code (pages + components + API clients)
- ~300+ lines tests
+19 -20
View File
@@ -1,29 +1,28 @@
# LeoCRM — Current Status
**Phase**: 3 (Implementation)
**Plan Mode**: implementation_allowed
**Last completed**: T05Calendar Plugin Backend (commit 7fbeeda, pushed to Forgejo)
**Date**: 2026-06-30
**Last completed**: T06Mail Plugin Backend (commit f646c59)
**Date**: 2026-07-01
## Completed Tasks
## Completed Tasks (11/14)
- T01: Core Infrastructure + Multi-Tenant + Auth System ✅
- T02: Company + Contact + Import/Export System ✅
- T03: Plugin System Framework ✅
- T04: DMS Plugin Backend (Folders, Files, Preview, OnlyOffice, Shares, Search, Bulk)
- T05: Calendar Plugin Backend (Appointments, Tasks, Kanban, ICS, Resources, Recurrence)
- T07a: Frontend Core SPA — Shell, Auth, Routing, i18n, UI Library
- T07b: Frontend Feature Pages — Companies, Contacts, Settings, Audit, Dashboard, Search
- T09: KI-Copilot API + Hybrid Workflow Engine Backend
- T11: Tags Plugin + Permissions Plugin + Entity Links Backend
- T04: DMS Plugin Backend ✅
- T05: Calendar Plugin Backend ✅
- T06: Mail Plugin Backend (IMAP/SMTP, PGP, Rules, Vacation, Delegates)
- T07a: Frontend Core SPA
- T07b: Frontend Feature Pages
- T08b: Frontend Calendar UI
- T09: KI-Copilot API + Workflow Engine ✅
- T11: Tags + Permissions + Entity Links Backend ✅
## T05 Verification
- 69 calendar tests pass (33 AC integration + 36 recurrence unit)
- Coverage: 86.87% (routes.py 82.33%, recurrence.py 90.43%, ics_utils.py 75.21%)
- 481 total tests pass (full regression, 0 failures)
- 0 ruff errors, ruff format clean
- Pushed to Forgejo: 7fbeeda
## Remaining Tasks (3)
- T08a: Frontend DMS + Tags + Permissions UI (free)
- T08c: Frontend Mail UI + Global Search UI (blocked by T06 — now unblocked)
- T10: Monitoring, Performance, Documentation & Env Config (free)
## Next Candidates
- T06: Mail Plugin Backend (IMAP/SMTP, Threading, Templates, Rules, PGP)
- T08a: DMS Frontend (prerequisite T04 ✅ — now unblocked)
- T08b: Calendar Frontend (prerequisite T05 ✅ — now unblocked)
- T10: Monitoring, Performance, Documentation
## Test Summary
- Backend: 527 tests pass (0 failures)
- Mail: 46 tests, 74.56% coverage
- Frontend: 112 tests pass
+2 -3
View File
@@ -1,8 +1,7 @@
# LeoCRM — Next Steps
1. **User decision needed**: Which task next?
- T06: Mail Plugin Backend (IMAP/SMTP, Threading, Templates, Rules, PGP)
- T08a: DMS Frontend (prerequisite T04 ✅ — now unblocked)
- T08b: Calendar Frontend (prerequisite T05 ✅ — now unblocked)
- T08a: DMS Frontend (prerequisite T04 ✅, T07b ✅ — unblocked)
- T08c: Mail Frontend (prerequisite T06 ✅ — now unblocked)
- T10: Monitoring, Performance, Documentation & Environment Config
2. After task selection: delegate to implementation_engineer with briefing
3. After implementation: test_debug_engineer for validation
+5 -5
View File
@@ -1,10 +1,10 @@
{
"project_name": "leocrm",
"phase": "phase-3-implementation",
"status": "T08b_complete_phase3_5_tasks_remaining",
"last_commit": "7350739",
"completed_tasks": ["T01","T02","T03","T04","T05","T07a","T08b","T09","T11"],
"status": "T06_complete_3_tasks_remaining",
"last_commit": "f646c59",
"completed_tasks": ["T01","T02","T03","T04","T05","T06","T07a","T07b","T08b","T09","T11"],
"current_task": null,
"next_task": "T07b",
"updated_at": "2026-06-30T11:47:00+02:00"
"next_task": "T08a",
"updated_at": "2026-07-01T15:41:00+02:00"
}
+10
View File
@@ -144,3 +144,13 @@
- ARIA spec: aria-sort value corrected to 'ascending'
- **Results:** 112/112 tests pass, tsc clean, vite build successful
- **Commit:** e28d11f
## 2026-07-01 15:41 — T06: Mail Plugin Backend Complete
- **Mail Plugin implementiert:** 8 neue Dateien, 4667 Zeilen
- **14 Models:** mail_accounts, mail_folders, mails, attachments, labels, rules, templates, signatures, vacation_sent_log, seen_by, delegates, send_permissions, pgp_keys, contact_pgp_keys
- **Features:** IMAP sync, SMTP send/reply/forward, threading, templates, rules, vacation (dedup), PGP, shared mailboxes, delegates, send permissions, HTML sanitization, FTS search, contact linking, calendar event creation
- **Tests:** 46/46 pass, 74.56% coverage
- **Regression:** 527/527 pass (0 failures)
- **Ruff:** 0 errors, format clean
- **Commit:** f646c59
- **Risks:** Coverage 74.56% (target 80%), ILIKE fallback instead of tsvector, ARQ worker not wired