fix: resolve import errors and test failures after segment 4 merge

- Update BaseNodeData import path to dify_graph.entities.base_node_data
- Change NodeType.COMMAND/FILE_UPLOAD to BuiltinNodeTypes constants
- Fix system_oauth_encryption -> system_encryption rename in commands
- Remove tests for deleted agent runner modules
- Fix Avatar: named import + string size API in collaboration files
- Add missing skill feature deps: @monaco-editor/react, react-arborist,
  @tanstack/react-virtual
- Fix frontend test mocks: add useUserProfile, useLeaderRestoreListener,
  next/navigation mock, and nodeOutputVars to expected payload

Made-with: Cursor

web/app/components/base/avatar/index.tsx

@@ -20,6 +20,7 @@ export type AvatarProps = {
   avatar: string | null
   size?: AvatarSize
   className?: string
+  backgroundColor?: string
   onLoadingStatusChange?: (status: ImageLoadingStatus) => void
 }
 
@@ -30,12 +31,16 @@ export const Avatar = ({
   avatar,
   size = 'md',
   className,
+  backgroundColor,
   onLoadingStatusChange,
 }: AvatarProps) => {
   const sizeConfig = SIZES[size]
 
   return (
-    <BaseAvatar.Root className={cn(BASE_CLASS, sizeConfig.root, className)}>
+    <BaseAvatar.Root
+      className={cn(BASE_CLASS, sizeConfig.root, className)}
+      style={backgroundColor ? { backgroundColor } : undefined}
+    >
       {avatar && (
         <BaseAvatar.Image
           src={avatar}

web/app/components/base/prompt-editor/plugins/workflow-variable-block/__tests__/node.spec.tsx

@@ -104,6 +104,7 @@ describe('WorkflowVariableBlockNode', () => {
         variables: ['node-1', 'answer'],
         workflowNodesMap: { 'node-1': { title: 'A', type: BlockEnum.LLM } },
         getVarType,
+        nodeOutputVars: [],
         environmentVariables,
         conversationVariables,
         ragVariables,

web/app/components/base/user-avatar-list/index.tsx

@@ -1,6 +1,7 @@
 import type { FC } from 'react'
+import type { AvatarSize } from '@/app/components/base/avatar'
 import { memo } from 'react'
-import Avatar from '@/app/components/base/avatar'
+import { Avatar } from '@/app/components/base/avatar'
 import { getUserColor } from '@/app/components/workflow/collaboration/utils/user-color'
 import { useAppContext } from '@/context/app-context'
 
@@ -10,6 +11,30 @@ type User = {
   avatar_url?: string | null
 }
 
+/** Map legacy pixel size to Avatar token (closest; ties favor smaller px, e.g. 28 -> sm). */
+function numericPxToAvatarSize(px: number): AvatarSize {
+  const candidates: { px: number, size: AvatarSize }[] = [
+    { px: 16, size: 'xxs' },
+    { px: 20, size: 'xs' },
+    { px: 24, size: 'sm' },
+    { px: 32, size: 'md' },
+    { px: 36, size: 'lg' },
+    { px: 40, size: 'xl' },
+    { px: 48, size: '2xl' },
+    { px: 64, size: '3xl' },
+  ]
+  let best = candidates[0]!
+  let bestDist = Math.abs(px - best.px)
+  for (const c of candidates) {
+    const d = Math.abs(px - c.px)
+    if (d < bestDist || (d === bestDist && c.px < best.px)) {
+      best = c
+      bestDist = d
+    }
+  }
+  return best.size
+}
+
 type UserAvatarListProps = {
   users: User[]
   maxVisible?: number
@@ -50,7 +75,7 @@ export const UserAvatarList: FC<UserAvatarListProps> = memo(({
             <Avatar
               name={user.name}
               avatar={user.avatar_url || null}
-              size={size}
+              size={numericPxToAvatarSize(size)}
               className="ring-2 ring-components-panel-bg"
               backgroundColor={userColor}
             />