feat: add chat folders with drag-and-drop organization

[Claude]

Summary

• Projects can now have subfolders for organizing conversations
• Sessions can be moved between folders or to project root via drag-and-drop
• Full CRUD operations for folders: create, rename, delete, reorder
• Folders are collapsible, show session counts, and persist across sessions

Type of Change

• ✨ New feature (non-breaking change that adds functionality)
• 🎨 UI / design improvement

Related Issues

Addresses organization features from issue feedback.

How to Test

1. Open a project in the sidebar
2. Click the ⋯ menu and select "New folder"
3. Enter a folder name and press Enter
4. Drag a chat session onto the folder to move it
5. Drag a session out to the project area to remove from folder
6. Rename/delete folders via the ⋯ menu on each folder
7. Verify folders persist after restart

Screenshots / Screen Recording

Checklist

• I've tested this on macOS (required for Electron/native features)
• TypeScript compiles with no errors (pnpm build)
• No any types introduced
• Logical margins used (ms-*/me-* instead of ml-*/mr-*)
• User-generated content containers have wrap-break-word
• New shared types go in shared/types/, not src/types/
• Large components/hooks are decomposed into sub-components/sub-hooks if needed

---

Implementation Details

Data Model:

• Added ChatFolder interface with id, name, projectId, createdAt, order
• Extended SessionBase with optional folderId field
• Folders stored in Project.folders[] array in projects.json
• Session folder assignments persisted in session JSON and metadata sidecars

IPC Layer:

// New IPC handlers
projects:create-folder(projectId, name) -> { folder }
projects:rename-folder(projectId, folderId, name)
projects:delete-folder(projectId, folderId)
projects:reorder-folder(projectId, folderId, targetFolderId)
sessions:move-to-folder(projectId, sessionId, folderId | null)

UI Components:

• FolderSection: Renders collapsible folders with session counts, rename/delete actions
• ProjectSection: Refactored to separate foldered vs non-foldered sessions, handle drag targets
• SessionItem: Made draggable with application/x-session-id data transfer

Drag-and-Drop:

• Session → Folder: Moves session into folder
• Session → Project root: Removes from folder (sets folderId: null)
• Folder → Folder: Reorders folders by splicing and updating order field
• Visual feedback with drag-over highlighting

State Management:

• Extended useProjectManager with createFolder, renameFolder, deleteFolder, reorderFolder
• Added handleMoveSessionToFolder in AppLayout for session updates
• Local state synced after IPC calls via setProjects and setSessions

Sessions not in folders render below folders using existing date-based grouping (Today/Yesterday/Last 7 Days/Older). Folder creation uses inline text input with Enter to confirm, Escape to cancel.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>[Feature]: More chat organizational features</issue_title>
<issue_description>### Problem / Motivation

Hey! Love the concept, spaces is unique and useful! I do find it a bit limiting in terms organizing my chats and have some proposals/ideas around better organization features.
Good luck! A lot of things happening in this space.

Proposed Solution

1. Do not limit projects to one space only. I feel like projects should be a separate concept spaces. Projects is where I might want to work in, spaces is where i might organize my chats.
2. Introduce some concept of a workstream. I think 1code and conductor do it well. They use "workspaces" as a unit of work that's tied to a folder/repo you make changes in but they can have multiple chats within (e..g. a planning agent and implementation agent)

3. I would find it useful to even have an additional organizational unit of "workstream groups" within a space. Conductor has a fixed "in progress/backlog/..." but having an ability to create custom folder would be cool.

Alternatives Considered

No response

Area

Session Management

Relevant Engine

All engines, Not engine-specific

How important is this to you?

Blocking my use of Harnss

Contribution

• I'd be willing to submit a PR for this feature

Additional Context

No response</issue_description>

<agent_instructions>We need to implement chat folders. So each project can have subfolders, and inside we can have chats. We should also be able to move chats to the folder and out, by just dragging and dropping. Ignore anything issue specific, this is the only thing we need to do.</agent_instructions>

Comments on the Issue (you are @claude[agent] in this section)

@OpenSource03 I am definitely looking into making the UI, UX and project organization better. Next few updates should definitely take the user experience up overall! Thanks for the feedback.

• Fixes [Feature]: More chat organizational features #16

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 1d31466f15

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Clear session folder assignments when deleting a folder

This handler only removes the folder entry from the project and never updates sessions that still reference that folderId. Those sessions are then excluded from the non-foldered list (src/components/sidebar/ProjectSection.tsx groups by session.folderId) and have no folder section to render under, so chats inside a deleted folder disappear from the sidebar and become effectively inaccessible. Deleting a folder should also unset/migrate folderId for affected sessions (including metadata sidecars).

Useful? React with 👍 / 👎.

[chatgpt-codex-connector]

Preserve folder IDs when hydrating sessions for sidebar groups

This grouping path depends on session.folderId, but the session hydration flow still constructs sidebar session objects without folderId (src/hooks/session/useSessionLifecycle.ts maps only id/project/title/timestamps/model/etc.). After restart, moved chats are treated as non-foldered and folder organization appears lost even though folder assignments were saved. The list IPC/type/hydration path needs to carry folderId through.

Useful? React with 👍 / 👎.

[chatgpt-codex-connector]

Reject cross-project drops when moving sessions to folders

Any dropped session is moved into targetFolderId without verifying project ownership. If a user drags a chat from project A into a folder shown under project B, the session is persisted with a foreign folder id; project A has no matching folder, so that chat no longer renders in the sidebar. Include the source project in drag payload (or validate target folder belongs to the same project) before calling the move handler.

Useful? React with 👍 / 👎.