Add project groups with drag-and-drop reordering

[teal-bauer]

Implement comprehensive project grouping functionality with visual drag-and-drop indicators for organizing projects and sessions.

Features:

• Project groups: Create, edit, delete, and organize projects into named groups
• Drag-and-drop: Reorder projects within groups and move between groups with visual insertion indicators
• Visual feedback: Blue line indicators show exactly where items will be inserted
• Ungrouped section: Always-visible virtual group for ungrouped projects
• State persistence: Groups remember their expanded/collapsed state across restarts
• Multi-repository context: Projects in the same group share context via --add-dir flags

UI Improvements:

• Add Group and Add Project buttons in sidebar header
• Inline editing for group names
• Folder icons to distinguish groups visually
• Insertion indicators for projects, sessions, and folders
• Smooth animations and hover states

Technical Details:

• Database: New project_groups and project_group_members tables
• IPC handlers: Full CRUD operations for groups
• Claude integration: Automatic --add-dir flags for peer repositories in groups
• Drag state management: Tracks insertion position (before/after) for accurate placement
• Event propagation: Proper handling to support both group-level and item-level drops

Database Migration:

• 006_add_project_groups.sql: Creates project_groups and project_group_members tables

Files Modified:

• Frontend: DraggableProjectTreeView, Sidebar, Settings, type definitions
• Backend: Database service, IPC handlers, UI state manager, Claude integration

Description

Type of Change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation update
• Performance improvement
• Code refactoring

Checklist

• I have read the CONTRIBUTING.md guidelines
• My code follows the code style of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• I have run pnpm typecheck and pnpm lint locally
• I have tested the Electron app locally with pnpm electron-dev

Critical Areas Modified

• Session output handling (requires explicit permission)
• Timestamp handling
• State management/IPC events
• Diff viewer CSS

Screenshots (if applicable)

Additional Notes

[teal-bauer]

https://github.com/stravu/crystal/CONTRIBUTING.md 404s btw. Correct link should be https://github.com/stravu/crystal/blob/main/CONTRIBUTING.md.

[jordan-BAIC]

@teal-bauer is this ready for review? It is still marked as draft

[jordan-BAIC]

Can you tell me a little bit about the use case for this? Seems like it adds an extra layer of hierarchy. I'm actually considering doing the opposite and making it so that each project is a separate window if you are doing multiple projects

[teal-bauer]

Use case is for working in projects that are related to each other / interdependent etc., in my specific case primarily librescoot, a collection of services running on two embedded systems in an electric moped and communicating through various channels. The agents need to know about and have access to the other services, tech documentation etc.

However I am not sure this is the best approach, as sometimes changes are required across multiple services, so the agent should become smart enough to create worktrees/branches for all related repos...