(feat) Drag and drop manual reorder of agents on the sessions group in the sidebar

[ashrafchowdury]

Goal

Agents within the session group on the sidebar are currently ordered automatically (e.g. most sessions). Users need the ability to manually reorder them via drag and drop, so they can place frequently-used or important agents at the top regardless of when they were created or last used.

Description

Add drag-and-drop support to the agent list inside the sessions group on the left sidebar. Users should be able to click, hold, and drag an agent card/row to a new position within the list. The order should persist across page refreshes and sessions.

Requirements

• Drag handle: Each agent row should show a grab/drag icon on hover (or always visible) to signal draggability.
• Visual feedback: During drag, show a ghost/placeholder where the item would land and a subtle elevation of the dragged item.
• Drop zone: Dropping the agent at a new position reorders the list immediately.
• Persistence: The new order is saved to the backend/API so it persists across reloads.
• Touch support: Works on touch devices as well (long-press to drag).

Implementation notes

• This is a frontend-only feature with a simple backend persistence layer (reorder API or saving a sort_order field per agent).
• Likely uses the HTML5 drag-and-drop API or a library like dnd-kit / react-beautiful-dnd.
• Scope is limited to the sessions group — not the agents sidebar globally, but specifically agents listed under the session grouping.

[linear-code]

AGE-4246