youngkingdom/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-05-05 09:58:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(skill): merge BlankAreaMenu into NodeMenu

Browse Source 
Consolidate menu components by extending NodeMenu to support a 'root'
type, eliminating the redundant BlankAreaMenu component. This reduces
code duplication and simplifies the context menu logic by storing
isFolder in the context menu state instead of re-querying tree data.
This commit is contained in:
yyh
2026-01-19 14:22:25 +08:00
parent 5947e04226
commit 9aed4f830f
5 changed files with 43 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -18,8 +18,13 @@ import { cn } from '@/utils/classnames'
import { useFileOperations } from '../hooks/use-file-operations'
import MenuItem from './menu-item'
export 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
type NodeMenuProps = {
type: 'file' | 'folder'
type: 'file' | 'folder' | 'root'
nodeId?: string
onClose: () => void
className?: string
@ -36,9 +41,8 @@ const NodeMenu: FC<NodeMenuProps> = ({
node,
}) => {
const { t } = useTranslation('workflow')
const isFolder = type === 'folder'
const derivedNodeId = node?.data.id ?? nodeId ?? ''
const isRoot = derivedNodeId === 'root'
const isRoot = type === 'root'
const isFolder = type === 'folder' || isRoot
const {
fileInputRef,
@ -65,12 +69,7 @@ const NodeMenu: FC<NodeMenuProps> = ({
: t('skillSidebar.menu.fileDeleteConfirmContent')
return (
<div className={cn(
'min-w-[180px] rounded-xl border-[0.5px] border-components-panel-border',
'bg-components-panel-bg-blur p-1 shadow-lg backdrop-blur-[5px]',
className,
)}
>
<div className={cn(MENU_CONTAINER_STYLES, className)}>
{isFolder && (
<>
<input
@ -80,14 +79,16 @@ const NodeMenu: FC<NodeMenuProps> = ({
className="hidden"
onChange={handleFileChange}
/>
<input
ref={folderInputRef}
type="file"
// @ts-expect-error webkitdirectory is a non-standard attribute
webkitdirectory=""
className="hidden"
onChange={handleFolderChange}
/>
{!isRoot && (
<input
ref={folderInputRef}
type="file"
// @ts-expect-error webkitdirectory is a non-standard attribute
webkitdirectory=""
className="hidden"
onChange={handleFolderChange}
/>
)}
<MenuItem
icon={RiFileAddLine}
@ -110,12 +111,14 @@ const NodeMenu: FC<NodeMenuProps> = ({
onClick={() => fileInputRef.current?.click()}
disabled={isLoading}
/>
<MenuItem
icon={RiFolderUploadLine}
label={t('skillSidebar.menu.uploadFolder')}
onClick={() => folderInputRef.current?.click()}
disabled={isLoading}
/>
{!isRoot && (
<MenuItem
icon={RiFolderUploadLine}
label={t('skillSidebar.menu.uploadFolder')}
onClick={() => folderInputRef.current?.click()}
disabled={isLoading}
/>
)}
{showRenameDelete && <div className="my-1 h-px bg-divider-subtle" />}
</>