Add tree organization system with categories, tags, and folders
Features: - Categories: Global and team-specific tree categorization (admin-managed) - Tags: Flexible tree tagging with autocomplete (author + admin) - User folders: Personal tree collections with subfolder support - Hierarchical structure (max 3 levels deep) - Right-click context menu for folder management - Cascade delete for subfolders - Filter trees by category, tags, and folder in library view Backend: - New models: Category, Tag, UserFolder with relationships - New API endpoints for categories, tags, and folders - Tree organization migrations (005, 006) Frontend: - FolderSidebar with hierarchical folder tree - FolderEditModal for create/edit with color picker - AddToFolderMenu for quick tree organization - TagInput with autocomplete and TagBadges display - Updated TreeMetadataForm and TreeLibraryPage Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -101,6 +101,9 @@ interface TreeEditorState {
|
||||
name: string
|
||||
description: string
|
||||
category: string
|
||||
categoryId: string | null
|
||||
tags: string[]
|
||||
isPublic: boolean
|
||||
treeStructure: TreeStructure | null
|
||||
originalTree: Tree | null // For comparison in edit mode
|
||||
|
||||
@@ -127,6 +130,11 @@ interface TreeEditorState {
|
||||
setName: (name: string) => void
|
||||
setDescription: (description: string) => void
|
||||
setCategory: (category: string) => void
|
||||
setCategoryId: (categoryId: string | null) => void
|
||||
setTags: (tags: string[]) => void
|
||||
addTag: (tag: string) => void
|
||||
removeTag: (tag: string) => void
|
||||
setIsPublic: (isPublic: boolean) => void
|
||||
|
||||
// Actions - Node CRUD
|
||||
addNode: (parentId: string | null, type: NodeType, insertIndex?: number) => string
|
||||
@@ -169,6 +177,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
name: '',
|
||||
description: '',
|
||||
category: '',
|
||||
categoryId: null,
|
||||
tags: [],
|
||||
isPublic: false,
|
||||
treeStructure: null,
|
||||
originalTree: null,
|
||||
selectedNodeId: null,
|
||||
@@ -188,6 +199,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
state.name = ''
|
||||
state.description = ''
|
||||
state.category = ''
|
||||
state.categoryId = null
|
||||
state.tags = []
|
||||
state.isPublic = false
|
||||
state.treeStructure = {
|
||||
id: 'root',
|
||||
type: 'decision',
|
||||
@@ -213,6 +227,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
state.name = tree.name
|
||||
state.description = tree.description || ''
|
||||
state.category = tree.category || ''
|
||||
state.categoryId = tree.category_id || null
|
||||
state.tags = tree.tags || []
|
||||
state.isPublic = tree.is_public || false
|
||||
state.treeStructure = tree.tree_structure
|
||||
state.originalTree = tree
|
||||
state.selectedNodeId = tree.tree_structure?.id || null
|
||||
@@ -236,6 +253,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
state.name = draft.name || ''
|
||||
state.description = draft.description || ''
|
||||
state.category = draft.category || ''
|
||||
state.categoryId = draft.categoryId || null
|
||||
state.tags = draft.tags || []
|
||||
state.isPublic = draft.isPublic || false
|
||||
state.treeStructure = draft.treeStructure || null
|
||||
state.isDirty = true
|
||||
state.draftSavedAt = draft.savedAt ? new Date(draft.savedAt) : null
|
||||
@@ -261,6 +281,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
state.name = ''
|
||||
state.description = ''
|
||||
state.category = ''
|
||||
state.categoryId = null
|
||||
state.tags = []
|
||||
state.isPublic = false
|
||||
state.treeStructure = null
|
||||
state.originalTree = null
|
||||
state.selectedNodeId = null
|
||||
@@ -299,6 +322,48 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
setCategoryId: (categoryId: string | null) => {
|
||||
set((state) => {
|
||||
state.categoryId = categoryId
|
||||
state.isDirty = true
|
||||
})
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
setTags: (tags: string[]) => {
|
||||
set((state) => {
|
||||
state.tags = tags
|
||||
state.isDirty = true
|
||||
})
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
addTag: (tag: string) => {
|
||||
set((state) => {
|
||||
if (!state.tags.includes(tag)) {
|
||||
state.tags.push(tag)
|
||||
state.isDirty = true
|
||||
}
|
||||
})
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
removeTag: (tag: string) => {
|
||||
set((state) => {
|
||||
state.tags = state.tags.filter(t => t !== tag)
|
||||
state.isDirty = true
|
||||
})
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
setIsPublic: (isPublic: boolean) => {
|
||||
set((state) => {
|
||||
state.isPublic = isPublic
|
||||
state.isDirty = true
|
||||
})
|
||||
get().autoSaveDraft()
|
||||
},
|
||||
|
||||
// Node CRUD
|
||||
addNode: (parentId: string | null, type: NodeType, insertIndex?: number) => {
|
||||
const newId = generateId()
|
||||
@@ -605,6 +670,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
name: state.name,
|
||||
description: state.description,
|
||||
category: state.category,
|
||||
categoryId: state.categoryId,
|
||||
tags: state.tags,
|
||||
isPublic: state.isPublic,
|
||||
treeStructure: state.treeStructure,
|
||||
savedAt: new Date().toISOString()
|
||||
}
|
||||
@@ -628,6 +696,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
name: state.name,
|
||||
description: state.description || undefined,
|
||||
category: state.category || undefined,
|
||||
category_id: state.categoryId || undefined,
|
||||
tags: state.tags.length > 0 ? state.tags : undefined,
|
||||
is_public: state.isPublic,
|
||||
tree_structure: state.treeStructure!
|
||||
}
|
||||
},
|
||||
@@ -694,6 +765,9 @@ export const useTreeEditorStore = create<TreeEditorState>()(
|
||||
name: state.name,
|
||||
description: state.description,
|
||||
category: state.category,
|
||||
categoryId: state.categoryId,
|
||||
tags: state.tags,
|
||||
isPublic: state.isPublic,
|
||||
treeStructure: state.treeStructure
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user