refactor(skill): regroup skill body, file tree, and tree hooks

web/app/components/workflow/skill/file-tree/artifacts/artifacts-tree.tsx

@@ -7,8 +7,8 @@ import * as React from 'react'
 import { useCallback, useState } from 'react'
 import FileTypeIcon from '@/app/components/base/file-uploader/file-type-icon'
 import { cn } from '@/utils/classnames'
-import { getFileIconType } from '../utils/file-utils'
-import TreeGuideLines from './tree-guide-lines'
+import { getFileIconType } from '../../utils/file-utils'
+import TreeGuideLines from '../tree/tree-guide-lines'
 
 const INDENT_SIZE = 20
 

web/app/components/workflow/skill/file-tree/tree/drag-action-tooltip.tsx

@@ -4,8 +4,8 @@ import * as React from 'react'
 import { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useStore } from '@/app/components/workflow/store'
-import { ROOT_ID } from '../constants'
-import { useSkillAssetNodeMap } from '../hooks/use-skill-asset-tree'
+import { ROOT_ID } from '../../constants'
+import { useSkillAssetNodeMap } from '../../hooks/file-tree/data/use-skill-asset-tree'
 
 export type DragAction = 'upload' | 'move'
 

web/app/components/workflow/skill/file-tree/tree/file-tree.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import type { MoveHandler, NodeApi, NodeRendererProps, TreeApi } from 'react-arborist'
-import type { TreeNodeData } from '../type'
+import type { TreeNodeData } from '../../type'
 import type { OpensObject } from '@/app/components/workflow/store/workflow/skill-editor/file-tree-slice'
 import type { AppAssetTreeView } from '@/types/app-asset'
 import { RiDragDropLine } from '@remixicon/react'
@@ -16,17 +16,17 @@ import SearchMenu from '@/app/components/base/icons/src/vender/knowledge/SearchM
 import Loading from '@/app/components/base/loading'
 import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
 import { cn } from '@/utils/classnames'
-import { CONTEXT_MENU_TYPE, ROOT_ID } from '../constants'
-import { useInlineCreateNode } from '../hooks/use-inline-create-node'
-import { useNodeMove } from '../hooks/use-node-move'
-import { useNodeReorder } from '../hooks/use-node-reorder'
-import { usePasteOperation } from '../hooks/use-paste-operation'
-import { useRootFileDrop } from '../hooks/use-root-file-drop'
-import { useSkillAssetTreeData } from '../hooks/use-skill-asset-tree'
-import { useSkillShortcuts } from '../hooks/use-skill-shortcuts'
-import { useSkillTreeCollaboration } from '../hooks/use-skill-tree-collaboration'
-import { useSyncTreeWithActiveTab } from '../hooks/use-sync-tree-with-active-tab'
-import { isDescendantOf } from '../utils/tree-utils'
+import { CONTEXT_MENU_TYPE, ROOT_ID } from '../../constants'
+import { useSkillAssetTreeData } from '../../hooks/file-tree/data/use-skill-asset-tree'
+import { useSkillTreeCollaboration } from '../../hooks/file-tree/data/use-skill-tree-collaboration'
+import { useRootFileDrop } from '../../hooks/file-tree/dnd/use-root-file-drop'
+import { useInlineCreateNode } from '../../hooks/file-tree/interaction/use-inline-create-node'
+import { useSkillShortcuts } from '../../hooks/file-tree/interaction/use-skill-shortcuts'
+import { useSyncTreeWithActiveTab } from '../../hooks/file-tree/interaction/use-sync-tree-with-active-tab'
+import { useNodeMove } from '../../hooks/file-tree/operations/use-node-move'
+import { useNodeReorder } from '../../hooks/file-tree/operations/use-node-reorder'
+import { usePasteOperation } from '../../hooks/file-tree/operations/use-paste-operation'
+import { isDescendantOf } from '../../utils/tree-utils'
 import DragActionTooltip from './drag-action-tooltip'
 import SearchResultList from './search-result-list'
 import TreeContextMenu from './tree-context-menu'

web/app/components/workflow/skill/file-tree/tree/node-menu.tsx

@@ -1,8 +1,8 @@
 'use client'
 
 import type { NodeApi, TreeApi } from 'react-arborist'
-import type { NodeMenuType } from '../constants'
-import type { TreeNodeData } from '../type'
+import type { NodeMenuType } from '../../constants'
+import type { TreeNodeData } from '../../type'
 import {
   RiClipboardLine,
   RiDeleteBinLine,
@@ -21,15 +21,15 @@ import { UploadCloud02 } from '@/app/components/base/icons/src/vender/line/gener
 import { Download02 } from '@/app/components/base/icons/src/vender/solid/general'
 import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
 import { cn } from '@/utils/classnames'
-import { NODE_MENU_TYPE } from '../constants'
-import { useFileOperations } from '../hooks/use-file-operations'
+import { NODE_MENU_TYPE } from '../../constants'
+import { useFileOperations } from '../../hooks/file-tree/operations/use-file-operations'
 import MenuItem from './menu-item'
 
-const ImportSkillModal = dynamic(() => import('../start-tab/import-skill-modal'), {
+const ImportSkillModal = dynamic(() => import('../../start-tab/import-skill-modal'), {
   ssr: false,
 })
 
-export const MENU_CONTAINER_STYLES = [
+const MENU_CONTAINER_STYLES = [
   'min-w-[180px] rounded-xl border-[0.5px] border-components-panel-border',
   'bg-components-panel-bg-blur p-1 shadow-lg backdrop-blur-[5px]',
 ] as const

web/app/components/workflow/skill/file-tree/tree/search-result-list.tsx

@@ -4,8 +4,8 @@ import type { AppAssetTreeView } from '@/types/app-asset'
 import { useCallback, useMemo } from 'react'
 import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
 import { cn } from '@/utils/classnames'
-import { useDelayedClick } from '../hooks/use-delayed-click'
-import { flattenMatchingNodes, getAncestorIds } from '../utils/tree-utils'
+import { useDelayedClick } from '../../hooks/file-tree/interaction/use-delayed-click'
+import { flattenMatchingNodes, getAncestorIds } from '../../utils/tree-utils'
 import { TreeNodeIcon } from './tree-node-icon'
 
 type SearchResultListProps = {

web/app/components/workflow/skill/file-tree/tree/tree-context-menu.tsx

@@ -1,13 +1,13 @@
 'use client'
 
 import type { TreeApi } from 'react-arborist'
-import type { TreeNodeData } from '../type'
+import type { TreeNodeData } from '../../type'
 import { FloatingPortal } from '@floating-ui/react'
 import * as React from 'react'
 import { useCallback, useMemo } from 'react'
 import { useContextMenuFloating } from '@/app/components/base/portal-to-follow-elem/use-context-menu-floating'
 import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
-import { getMenuNodeId, getNodeMenuType } from '../utils/tree-utils'
+import { getMenuNodeId, getNodeMenuType } from '../../utils/tree-utils'
 import NodeMenu from './node-menu'
 
 type TreeContextMenuProps = {

web/app/components/workflow/skill/file-tree/tree/tree-edit-input.spec.tsx

@@ -1,5 +1,5 @@
 import type { NodeApi } from 'react-arborist'
-import type { TreeNodeData } from '../type'
+import type { TreeNodeData } from '../../type'
 import { fireEvent, render, screen } from '@testing-library/react'
 import TreeEditInput from './tree-edit-input'
 

web/app/components/workflow/skill/file-tree/tree/tree-edit-input.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import type { NodeApi } from 'react-arborist'
-import type { TreeNodeData } from '../type'
+import type { TreeNodeData } from '../../type'
 import * as React from 'react'
 import { useEffect, useRef } from 'react'
 import { useTranslation } from 'react-i18next'

web/app/components/workflow/skill/file-tree/tree/tree-node-icon.tsx

@@ -7,7 +7,7 @@ import { RiFolderLine, RiFolderOpenLine } from '@remixicon/react'
 import { useTranslation } from 'react-i18next'
 import FileTypeIcon from '@/app/components/base/file-uploader/file-type-icon'
 import { cn } from '@/utils/classnames'
-import { getFileIconType } from '../utils/file-utils'
+import { getFileIconType } from '../../utils/file-utils'
 
 type TreeNodeIconProps = {
   isFolder: boolean

web/app/components/workflow/skill/file-tree/tree/tree-node.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import type { NodeRendererProps } from 'react-arborist'
-import type { TreeNodeData } from '../type'
+import type { TreeNodeData } from '../../type'
 import { RiMoreFill } from '@remixicon/react'
 import * as React from 'react'
 import { useCallback, useEffect, useRef, useState } from 'react'
@@ -13,8 +13,8 @@ import {
 } from '@/app/components/base/portal-to-follow-elem'
 import { useStore, useWorkflowStore } from '@/app/components/workflow/store'
 import { cn } from '@/utils/classnames'
-import { useFolderFileDrop } from '../hooks/use-folder-file-drop'
-import { useTreeNodeHandlers } from '../hooks/use-tree-node-handlers'
+import { useFolderFileDrop } from '../../hooks/file-tree/dnd/use-folder-file-drop'
+import { useTreeNodeHandlers } from '../../hooks/file-tree/interaction/use-tree-node-handlers'
 import NodeMenu from './node-menu'
 import TreeEditInput from './tree-edit-input'
 import TreeGuideLines from './tree-guide-lines'