Function ConfigTree

src/renderer/src/components/common/ConfigTree.tsx:42–215

({
  items,
  folders,
  selectedId,
  onSelect,
  itemIcon,
  itemNameKey,
  isItem,
  batchUpdateItemsOrder,
  createItem,
  updateItem,
  deleteItem,
  copyItem,
  createFolder,
  updateFolder,
  deleteFolder,
  clearFolder,
  toggleFolderExpanded,
  defaultItemId,
  emptyText = '暂无配置',
  addItemText = '新建配置',
  createItemLabel = '新建配置',
  createFolderLabel = '新建文件夹'
}: ConfigTreeProps<T>)

}

export function ConfigTree<T extends ConfigItemBase>({
  items,
  folders,
  selectedId,
  onSelect,
  itemIcon,
  itemNameKey,
  isItem,
  batchUpdateItemsOrder,
  createItem,
  updateItem,
  deleteItem,
  copyItem,
  createFolder,
  updateFolder,
  deleteFolder,
  clearFolder,
  toggleFolderExpanded,
  defaultItemId,
  emptyText = '暂无配置',
  addItemText = '新建配置',
  createItemLabel = '新建配置',
  createFolderLabel = '新建文件夹'
}: ConfigTreeProps<T>): React.JSX.Element {
  const { showDeleteConfirm } = useConfirmDialog()
  const [multiSelect, setMultiSelect] = useState(false)
  const [checkedKeys, setCheckedKeys] = useState<string[]>([])

  const handleCreate = (): void => {
    const item = createItem()
    onSelect(item.id)
  }

  const handleCreateFolder = (): void => {
    const folder = createFolder('新文件夹')
    onSelect(folder.id)
  }

  const handleCreateItemInFolder = useCallback(
    (folderId: string): void => {
      const item = createItem(folderId)
      onSelect(item.id)
    },
    [createItem, onSelect]
  )

  const handleCreateSubFolder = useCallback(
    (parentFolderId: string): void => {
      const folder = createFolder('新文件夹', parentFolderId)
      onSelect(folder.id)
    },
    [createFolder, onSelect]
  )

  const handleToggleMultiSelect = (): void => {
    setMultiSelect(!multiSelect)
    if (multiSelect) {
      setCheckedKeys([])