Function Explorer

src/renderer/src/components/panels/Explorer.tsx:31–386

()

import './Explorer.css'

export function Explorer(): React.JSX.Element {
  const {
    pages,
    folders,
    batchUpdateItemsOrder,
    batchUpdateItemsOrderWithRename,
    checkBatchMoveConflicts,
    createPage,
    deletePage,
    deletePages,
    updatePage,
    createFolder,
    deleteFolder,
    deleteFolders,
    clearFolder,
    updateFolder,
    toggleFolderExpanded,
    openPage
  } = usePages()

  const { tabs, activeTabId } = useTabsStore()
  const activePageId = tabs.find((t) => t.id === activeTabId)?.dataId
  const { showDeleteConfirm } = useConfirmDialog()
  const { setActivePanel } = useLayoutStore()
  const { setOptions: setSearchOptions } = useGlobalSearchStore()

  const [selectedKey, setSelectedKey] = useState<string | null>(null)
  const [multiSelect, setMultiSelect] = useState(false)
  const [checkedKeys, setCheckedKeys] = useState<string[]>([])
  const [moveTarget, setMoveTarget] = useState<{
    type: 'page' | 'folder'
    id: string
    parentFolderId?: string
  } | null>(null)
  const [moveConflict, setMoveConflict] = useState<MoveConflictInfo | null>(null)
  const [pendingDragOperation, setPendingDragOperation] = useState<{
    items: (ChatPage | PageFolder)[]
    parentFolderId: string | undefined
    conflictNames: string[]
  } | null>(null)

  const messagesCache = useMessagesStore((state) => state.cache)

  useEffect(() => {
    if (activePageId) {
      setSelectedKey(activePageId)
    }
  }, [activePageId])

  const handleSelect = (id: string | null): void => {
    setSelectedKey(id)
    if (id) {
      const page = pages.find((p) => p.id === id)
      if (page) {
        openPage(id, true)
      }
    }
  }