Bookmarks currently sit in whatever order they were added. Folders exist, but moving a bookmark into one is done through a select dropdown, and there is no way to reorder within a list at all.
There is already a working reference implementation in this repo. src/components/browser/TabBar.tsx does pointer-event based drag reordering for tabs. It is not HTML5 drag-and-drop, it tracks pointerdown/pointermove/pointerup directly, which avoids the drag-image and dragover quirks. Read that first and follow the same approach.
What needs doing
- Port the pointer-based drag pattern from
TabBar.tsx to src/components/sidebar/BookmarksPanel.tsx. The axis is vertical here rather than horizontal.
- Persist the new order in
src/stores/bookmarks.ts. The store is already versioned with a persist migration, follow the existing pattern rather than inventing a new one.
- Dragging onto a folder should move the bookmark into it, which would be nicer than the current dropdown.
Worth knowing
- Bookmarks are scoped per workspace. Reordering in one workspace must not touch another.
- The panel is inside a scrollable sidebar, so dragging near the top or bottom edge should scroll.
TabBar does not have to deal with this, so it is the one part you cannot copy.
- Do not use HTML5
draggable. There was a reason the tab bar avoided it and mixing the two approaches in one app would be inconsistent.
Frontend only, no Rust, no WebView2. Probably the most self-contained issue currently open.
Bookmarks currently sit in whatever order they were added. Folders exist, but moving a bookmark into one is done through a select dropdown, and there is no way to reorder within a list at all.
There is already a working reference implementation in this repo.
src/components/browser/TabBar.tsxdoes pointer-event based drag reordering for tabs. It is not HTML5 drag-and-drop, it tracks pointerdown/pointermove/pointerup directly, which avoids the drag-image and dragover quirks. Read that first and follow the same approach.What needs doing
TabBar.tsxtosrc/components/sidebar/BookmarksPanel.tsx. The axis is vertical here rather than horizontal.src/stores/bookmarks.ts. The store is already versioned with a persist migration, follow the existing pattern rather than inventing a new one.Worth knowing
TabBardoes not have to deal with this, so it is the one part you cannot copy.draggable. There was a reason the tab bar avoided it and mixing the two approaches in one app would be inconsistent.Frontend only, no Rust, no WebView2. Probably the most self-contained issue currently open.