feat: draggable section groups in sidebar
- Wrap sidebar section groups in @dnd-kit sortable context - Add grip-vertical drag handle visible on hover of section headers - Sort sections by `order` property from Type document entries - On drag end, compute new sequential order values and persist to each Type document's frontmatter via handleReorderSections - Add onReorderSections callback from Sidebar → App.tsx → vault Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
11
src/App.tsx
11
src/App.tsx
@@ -112,6 +112,15 @@ function App() {
|
||||
vault.updateEntry(typeEntry.path, { icon, color })
|
||||
}, [vault, notes])
|
||||
|
||||
const handleReorderSections = useCallback((orderedTypes: { typeName: string; order: number }[]) => {
|
||||
for (const { typeName, order } of orderedTypes) {
|
||||
const typeEntry = vault.entries.find((e) => e.isA === 'Type' && e.title === typeName)
|
||||
if (!typeEntry) continue
|
||||
notes.handleUpdateFrontmatter(typeEntry.path, 'order', order)
|
||||
vault.updateEntry(typeEntry.path, { order })
|
||||
}
|
||||
}, [vault, notes])
|
||||
|
||||
useAppKeyboard({
|
||||
onQuickOpen: () => setShowQuickOpen(true),
|
||||
onCreateNote: openCreateDialog,
|
||||
@@ -161,7 +170,7 @@ function App() {
|
||||
<div className="app-shell">
|
||||
<div className="app">
|
||||
<div className="app__sidebar" style={{ width: sidebarWidth }}>
|
||||
<Sidebar entries={vault.entries} selection={selection} onSelect={setSelection} onSelectNote={notes.handleSelectNote} onCreateType={openCreateDialog} onCreateNewType={openCreateTypeDialog} onCustomizeType={handleCustomizeType} modifiedCount={vault.modifiedFiles.length} onCommitPush={() => setShowCommitDialog(true)} />
|
||||
<Sidebar entries={vault.entries} selection={selection} onSelect={setSelection} onSelectNote={notes.handleSelectNote} onCreateType={openCreateDialog} onCreateNewType={openCreateTypeDialog} onCustomizeType={handleCustomizeType} onReorderSections={handleReorderSections} modifiedCount={vault.modifiedFiles.length} onCommitPush={() => setShowCommitDialog(true)} />
|
||||
</div>
|
||||
<ResizeHandle onResize={handleSidebarResize} />
|
||||
<div className="app__note-list" style={{ width: noteListWidth }}>
|
||||
|
||||
Reference in New Issue
Block a user