feat: Kontakt-Ordner mit Drag&Drop Baum (wie KI-Chat Sidebar)

- Backend: ContactFolder model (hierarchisch, parent_id, sort_order)
- Migration 0022: contact_folders Tabelle + folder_id FK auf contacts
- CRUD Routes: /api/v1/contact-folders (list, create, update, delete, reorder)
- Move Contact API: /api/v1/contact-folders/contacts/{id}/move
- folder_id Filter in contacts list API
- Frontend: ContactFolderTree mit Baum-Struktur, Drag&Drop, Kontext-Menü
- Kontakt-Personen-Icon statt Ordner-Symbol
- ContactList Items draggable (List/Table/Cards View)
- React Query Hooks für Folder CRUD + Move Contact
- Alle 266 Frontend-Tests passing
This commit is contained in:
Agent Zero
2026-07-20 01:33:44 +02:00
parent 4bc11efc25
commit 29202325a6
17 changed files with 942 additions and 8 deletions
@@ -113,6 +113,11 @@ export function ContactList({
{contacts.map((contact) => (
<li key={contact.id}>
<button
draggable
onDragStart={(e) => {
e.dataTransfer.setData('text/plain', contact.id);
e.dataTransfer.effectAllowed = 'move';
}}
onClick={() => onSelectContact(contact)}
className={clsx(
'flex items-center gap-3 w-full px-3 py-2.5 text-left min-h-touch transition-colors',
@@ -201,6 +206,11 @@ export function ContactList({
{contacts.map((contact) => (
<tr
key={contact.id}
draggable
onDragStart={(e) => {
e.dataTransfer.setData('text/plain', contact.id);
e.dataTransfer.effectAllowed = 'move';
}}
onClick={() => onSelectContact(contact)}
className={clsx(
'cursor-pointer transition-colors',
@@ -247,6 +257,11 @@ export function ContactList({
{contacts.map((contact) => (
<div
key={contact.id}
draggable
onDragStart={(e) => {
e.dataTransfer.setData('text/plain', contact.id);
e.dataTransfer.effectAllowed = 'move';
}}
onClick={() => onSelectContact(contact)}
className={clsx(
'p-3 rounded-lg border cursor-pointer transition-colors min-h-touch',