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

feat: Unify sandbox detection and apply Agent icon override

Browse Source
This commit is contained in:
zhsama
2026-02-08 02:59:06 +08:00
parent e528112394
commit 68f7f2f19b
10 changed files with 100 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
web/app/components/workflow/block-icon.tsx
View File

@ -1,6 +1,13 @@
import type { FC } from 'react'
import { memo } from 'react'
import {
memo,
useCallback,
useMemo,
useSyncExternalStore,
} from 'react'
import { useStore as useAppStore } from '@/app/components/app/store'
import AppIcon from '@/app/components/base/app-icon'
import { useFeaturesStore } from '@/app/components/base/features/hooks'
import { Folder as FolderLine } from '@/app/components/base/icons/src/vender/line/files'
import {
Agent,
@ -28,7 +35,9 @@ import {
WebhookLine,
WindowCursor,
} from '@/app/components/base/icons/src/vender/workflow'
import { STORAGE_KEYS } from '@/config/storage-keys'
import { cn } from '@/utils/classnames'
import { storage } from '@/utils/storage'
import { BlockEnum } from './types'
type BlockIconProps = {
@ -114,13 +123,45 @@ const ICON_CONTAINER_BG_COLOR_MAP: Record<string, string> = {
[BlockEnum.TriggerWebhook]: 'bg-util-colors-blue-blue-500',
[BlockEnum.TriggerPlugin]: 'bg-util-colors-blue-blue-500',
}
const useDisplayBlockType = (type: BlockEnum) => {
const appDetail = useAppStore(s => s.appDetail)
const featuresStore = useFeaturesStore()
const subscribe = useCallback((listener: () => void) => {
if (!featuresStore)
return () => {}
return featuresStore.subscribe(listener)
}, [featuresStore])
const getSnapshot = useCallback(() => {
if (!featuresStore)
return false
return featuresStore.getState().features.sandbox?.enabled ?? false
}, [featuresStore])
const isSandboxFeatureEnabled = useSyncExternalStore(subscribe, getSnapshot, () => false)
const isSandboxRuntime = appDetail?.runtime_type === 'sandboxed'
const isSandboxSelection = useMemo(() => {
if (!appDetail?.id)
return false
return storage.getBoolean(`${STORAGE_KEYS.LOCAL.WORKFLOW.SANDBOX_RUNTIME_PREFIX}${appDetail.id}`) === true
}, [appDetail?.id])
const isSandboxed = isSandboxRuntime || isSandboxFeatureEnabled || isSandboxSelection
return isSandboxed && type === BlockEnum.LLM
? BlockEnum.Agent
: type
}
const BlockIcon: FC<BlockIconProps> = ({
type,
size = 'sm',
className,
toolIcon,
}) => {
const isToolOrDataSourceOrTriggerPlugin = type === BlockEnum.Tool || type === BlockEnum.DataSource || type === BlockEnum.TriggerPlugin
const displayType = useDisplayBlockType(type)
const isToolOrDataSourceOrTriggerPlugin = displayType === BlockEnum.Tool || displayType === BlockEnum.DataSource || displayType === BlockEnum.TriggerPlugin
const showDefaultIcon = !isToolOrDataSourceOrTriggerPlugin || !toolIcon
return (
@ -128,7 +169,7 @@ const BlockIcon: FC<BlockIconProps> = ({
cn(
'flex items-center justify-center border-[0.5px] border-white/2 text-white',
ICON_CONTAINER_CLASSNAME_SIZE_MAP[size],
showDefaultIcon && ICON_CONTAINER_BG_COLOR_MAP[type],
showDefaultIcon && ICON_CONTAINER_BG_COLOR_MAP[displayType],
toolIcon && '!shadow-none',
className,
)
@ -136,7 +177,7 @@ const BlockIcon: FC<BlockIconProps> = ({
>
{
showDefaultIcon && (
getIcon(type, (type === BlockEnum.TriggerSchedule || type === BlockEnum.TriggerWebhook)
getIcon(displayType, (displayType === BlockEnum.TriggerSchedule || displayType === BlockEnum.TriggerWebhook)
? (size === 'xs' ? 'w-4 h-4' : 'w-4.5 h-4.5')
: (size === 'xs' ? 'w-3 h-3' : 'w-3.5 h-3.5'))
)
@ -175,9 +216,11 @@ export const VarBlockIcon: FC<BlockIconProps> = ({
type,
className,
}) => {
const displayType = useDisplayBlockType(type)
return (
<>
{getIcon(type, `w-3 h-3 ${className}`)}
{getIcon(displayType, `w-3 h-3 ${className}`)}
</>
)
}

4
web/app/components/workflow/block-selector/blocks.tsx
View File

@ -103,7 +103,7 @@ const Blocks = ({
<BlockIcon
size="md"
className="mb-2"
type={block.metaData.type}
type={block.metaData.iconType || block.metaData.type}
/>
<div className="system-md-medium mb-1 text-text-primary">{block.metaData.title}</div>
<div className="system-xs-regular text-text-tertiary">{block.metaData.description}</div>
@ -117,7 +117,7 @@ const Blocks = ({
>
<BlockIcon
className="mr-2 shrink-0"
type={block.metaData.type}
type={block.metaData.iconType || block.metaData.type}
/>
<div className="grow text-sm text-text-secondary">{block.metaData.title}</div>
{

2
web/app/components/workflow/nodes/_base/components/next-step/index.tsx
View File

@ -100,7 +100,7 @@ const NextStep = ({
<div className="flex py-1">
<div className="relative flex h-9 w-9 shrink-0 items-center justify-center rounded-lg border-[0.5px] border-divider-regular bg-background-default shadow-xs">
<BlockIcon
type={selectedNode!.data.type}
type={selectedNode!.data._iconTypeOverride ?? selectedNode!.data.type}
toolIcon={toolIcon}
/>
</div>

2
web/app/components/workflow/nodes/_base/components/next-step/item.tsx
View File

@ -42,7 +42,7 @@ const Item = ({
className="group relative flex h-9 cursor-pointer items-center rounded-lg border-[0.5px] border-divider-regular bg-background-default px-2 text-xs text-text-secondary shadow-xs last-of-type:mb-0 hover:bg-background-default-hover"
>
<BlockIcon
type={data.type}
type={data._iconTypeOverride ?? data.type}
toolIcon={toolIcon}
className="mr-1.5 shrink-0"
/>

2
web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx
View File

@ -527,7 +527,7 @@ const BasePanel: FC<BasePanelProps> = ({
<div className="flex items-center px-4 pb-1 pt-4">
<BlockIcon
className="mr-1 shrink-0"
type={data.type}
type={data._iconTypeOverride ?? data.type}
toolIcon={toolIcon}
size="md"
/>

7
web/app/components/workflow/nodes/_base/node.tsx
View File

@ -69,11 +69,8 @@ const BaseNode: FC<BaseNodeProps> = ({
const { t } = useTranslation()
const nodeRef = useRef<HTMLDivElement>(null)
const { nodesReadOnly } = useNodesReadOnly()
const { _subGraphEntry, _iconTypeOverride } = data as {
_subGraphEntry?: boolean
_iconTypeOverride?: BlockEnum
}
const iconType = _iconTypeOverride ?? data.type
const { _subGraphEntry } = data
const iconType = data._iconTypeOverride ?? data.type
const { handleNodeIterationChildSizeChange } = useNodeIterationInteractions()
const { handleNodeLoopChildSizeChange } = useNodeLoopInteractions()

3
web/app/components/workflow/types.ts
View File

@ -91,6 +91,8 @@ export type CommonNodeType<T = {}> = {
_retryIndex?: number
_dataSourceStartToAdd?: boolean
_isTempNode?: boolean
_subGraphEntry?: boolean
_iconTypeOverride?: BlockEnum
isInIteration?: boolean
iteration_id?: string
selected?: boolean
@ -369,6 +371,7 @@ export type NodeDefaultBase = {
classification: BlockClassificationEnum
sort: number
type: BlockEnum
iconType?: BlockEnum
title: string
author: string
description?: string