From bdd2496be211ea758dbe27a2f6b9baa3dfbe3bfc Mon Sep 17 00:00:00 2001 From: linonetwo Date: Fri, 12 Dec 2025 23:19:55 +0800 Subject: [PATCH] fix: not able to open prompt editor by click prompt tree --- .../agentChatStore/actions/previewActions.ts | 29 ------ src/pages/Agent/store/agentChatStore/index.ts | 1 - src/pages/Agent/store/agentChatStore/types.ts | 20 ----- .../PromptPreviewDialog/EditView.tsx | 88 ++++++++++++++----- .../PromptConfigForm/store/arrayFieldStore.ts | 39 ++++++++ .../templates/ArrayFieldItemTemplate.tsx | 37 +++++--- .../templates/ArrayFieldTemplate.tsx | 78 +++++++++++++--- .../PromptPreviewDialog.promptConcat.test.tsx | 1 - .../__tests__/PromptPreviewDialog.ui.test.tsx | 1 - .../components/PromptPreviewDialog/index.tsx | 22 +++-- .../ChatTabContent/components/PromptTree.tsx | 6 +- 11 files changed, 214 insertions(+), 108 deletions(-) diff --git a/src/pages/Agent/store/agentChatStore/actions/previewActions.ts b/src/pages/Agent/store/agentChatStore/actions/previewActions.ts index f070e8a2..8a4db384 100644 --- a/src/pages/Agent/store/agentChatStore/actions/previewActions.ts +++ b/src/pages/Agent/store/agentChatStore/actions/previewActions.ts @@ -23,7 +23,6 @@ export const previewActionsMiddleware: StateCreator { set({ formFieldsToScrollTo: fieldPaths }); }, - setArrayItemExpanded: (itemId: string, expanded: boolean) => { - const { expandedArrayItems } = get(); - const newMap = new Map(expandedArrayItems); - if (expanded) { - newMap.set(itemId, true); - } else { - newMap.delete(itemId); - } - set({ expandedArrayItems: newMap }); - }, - isArrayItemExpanded: (itemId: string) => { - const { expandedArrayItems } = get(); - return expandedArrayItems.get(itemId) ?? false; - }, - expandPathToTarget: (targetPath: string[]) => { - const { expandedArrayItems } = get(); - const newMap = new Map(expandedArrayItems); - - // For a path like ['prompts', 'system', 'children', 'default-main'] - // We need to expand each ID that represents an array item: 'system' and 'default-main' - for (let index = 1; index < targetPath.length; index += 1) { - if (targetPath[index]) { - newMap.set(targetPath[index], true); - } - } - - set({ expandedArrayItems: newMap }); - }, updatePreviewProgress: (progress: number, step: string, currentPlugin?: string) => { set({ diff --git a/src/pages/Agent/store/agentChatStore/index.ts b/src/pages/Agent/store/agentChatStore/index.ts index edd5af8c..875f5a18 100644 --- a/src/pages/Agent/store/agentChatStore/index.ts +++ b/src/pages/Agent/store/agentChatStore/index.ts @@ -28,7 +28,6 @@ export const useAgentChatStore = create()((set, get, api) => previewResult: null, lastUpdated: null, formFieldsToScrollTo: [], - expandedArrayItems: new Map(), }; // Merge all actions and initial state diff --git a/src/pages/Agent/store/agentChatStore/types.ts b/src/pages/Agent/store/agentChatStore/types.ts index 783c2463..82eb1c7e 100644 --- a/src/pages/Agent/store/agentChatStore/types.ts +++ b/src/pages/Agent/store/agentChatStore/types.ts @@ -39,7 +39,6 @@ export interface PreviewDialogState { } | null; lastUpdated: Date | null; formFieldsToScrollTo: string[]; - expandedArrayItems: Map; } // Basic actions interface @@ -159,25 +158,6 @@ export interface PreviewActions { */ setFormFieldsToScrollTo: (fieldPaths: string[]) => void; - /** - * Sets the expansion state of a specific array item by its ID - * @param itemId The unique ID of the array item - * @param expanded Whether the item should be expanded - */ - setArrayItemExpanded: (itemId: string, expanded: boolean) => void; - - /** - * Checks if a specific array item is expanded by its ID - * @param itemId The unique ID of the array item - */ - isArrayItemExpanded: (itemId: string) => boolean; - - /** - * Expands all parent paths leading to a target field - * @param targetPath The target field path to expand to - */ - expandPathToTarget: (targetPath: string[]) => void; - /** * Updates preview progress state * @param progress Progress value from 0 to 1 diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/EditView.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/EditView.tsx index 3c2896f0..cc8c2663 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/EditView.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/EditView.tsx @@ -11,6 +11,7 @@ import { useShallow } from 'zustand/react/shallow'; import { AgentFrameworkConfig } from '@services/agentInstance/promptConcat/promptConcatSchema'; import { useAgentChatStore } from '../../../Agent/store/agentChatStore/index'; import { PromptConfigForm } from './PromptConfigForm'; +import { useArrayFieldStore } from './PromptConfigForm/store/arrayFieldStore'; // Lazy load Monaco Editor only when needed const MonacoEditor = lazy(async () => await import('@monaco-editor/react')); @@ -34,14 +35,16 @@ export const EditView: FC = ({ const [editorMode, setEditorMode] = useState<'form' | 'code'>('form'); const [monacoInitialized, setMonacoInitialized] = useState(false); - const { formFieldsToScrollTo, setFormFieldsToScrollTo, expandPathToTarget } = useAgentChatStore( + const { formFieldsToScrollTo, setFormFieldsToScrollTo } = useAgentChatStore( useShallow((state) => ({ formFieldsToScrollTo: state.formFieldsToScrollTo, setFormFieldsToScrollTo: state.setFormFieldsToScrollTo, - expandPathToTarget: state.expandPathToTarget, })), ); + // Use a stable reference for expandItemsByPath + const expandItemsByPath = useArrayFieldStore(useCallback((state) => state.expandItemsByPath, [])); + const { loading: agentFrameworkConfigLoading, config: agentFrameworkConfig, @@ -52,26 +55,66 @@ export const EditView: FC = ({ agentId: agent?.id, }); + // Use a ref to track if we're currently processing a scroll request + const isProcessingScrollReference = React.useRef(false); + const savedPathReference = React.useRef([]); + useEffect(() => { - if (formFieldsToScrollTo.length > 0 && editorMode === 'form') { - expandPathToTarget(formFieldsToScrollTo); + if (formFieldsToScrollTo.length > 0 && editorMode === 'form' && agentFrameworkConfig && !isProcessingScrollReference.current) { + // Mark as processing and save the path + isProcessingScrollReference.current = true; + savedPathReference.current = [...formFieldsToScrollTo]; + const savedPath = savedPathReference.current; + + // Clear formFieldsToScrollTo - but don't let the cleanup cancel our timeouts + setFormFieldsToScrollTo([]); + + // Path format: ['prompts', 'system', 'child-id', 'child-id'] or ['prompts', 'system'] + // - savedPath[0]: top-level key (prompts, plugins, response) + // - savedPath[1]: parent item id + // - savedPath[2+]: nested child item ids (if present) + + // Step 1: Expand the top-level item first + setTimeout(() => { + const topLevelKey = savedPath[0]; + if (savedPath.length > 1) { + const firstItemId = savedPath[1]; + expandItemsByPath(topLevelKey, [firstItemId]); + } + }, 100); + + // Step 2: After the parent expands and children render, expand nested items + // If path has more than 2 elements, we have nested children to expand + const hasNestedChildren = savedPath.length > 2; + if (hasNestedChildren) { + setTimeout(() => { + const topLevelKey = savedPath[0]; + const firstItemId = savedPath[1]; + const topLevelArray = agentFrameworkConfig[topLevelKey as keyof typeof agentFrameworkConfig]; + if (Array.isArray(topLevelArray)) { + const parentIndex = topLevelArray.findIndex((item: unknown) => { + const data = item as Record | null; + return data?.id === firstItemId || data?.caption === firstItemId || data?.title === firstItemId; + }); + + if (parentIndex !== -1) { + const nestedFieldPath = `${topLevelKey}_${parentIndex}_children`; + // Get the nested item IDs (from savedPath[2] onwards) + const nestedItemIds = savedPath.slice(2); + expandItemsByPath(nestedFieldPath, nestedItemIds); + } + } + }, 300); // Longer delay to wait for nested array to render + } - const scrollTimeout = setTimeout(() => { - const targetId = formFieldsToScrollTo[formFieldsToScrollTo.length - 1]; + // Step 3: Scroll to the target element (after nested items have expanded) + const scrollDelay = hasNestedChildren ? 500 : 200; + setTimeout(() => { + const targetId = savedPath[savedPath.length - 1]; // Find input element whose value exactly matches the target ID const targetElement = document.querySelector(`input[value="${targetId}"]`); if (targetElement) { - // Expand parent accordions - let current = targetElement.parentElement; - while (current) { - const accordion = current.querySelector('[aria-expanded="false"]'); - if (accordion instanceof HTMLElement) { - accordion.click(); - } - current = current.parentElement; - } - // Scroll to element and highlight setTimeout(() => { if (targetElement instanceof HTMLElement) { @@ -84,15 +127,12 @@ export const EditView: FC = ({ } }, 300); } - - setFormFieldsToScrollTo([]); - }, 100); - - return () => { - clearTimeout(scrollTimeout); - }; + + // Mark processing as complete + isProcessingScrollReference.current = false; + }, scrollDelay); } - }, [formFieldsToScrollTo, editorMode, setFormFieldsToScrollTo, expandPathToTarget]); + }, [formFieldsToScrollTo, editorMode, expandItemsByPath, agentFrameworkConfig, setFormFieldsToScrollTo]); const { getPreviewPromptResult } = useAgentChatStore( useShallow((state) => ({ diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/store/arrayFieldStore.ts b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/store/arrayFieldStore.ts index 8d7b8f86..8652bbc1 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/store/arrayFieldStore.ts +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/store/arrayFieldStore.ts @@ -49,6 +49,8 @@ interface ArrayFieldActions { cleanupField: (fieldPath: string) => void; /** Register move callbacks for an item */ registerMoveCallbacks: (fieldPath: string, itemIndex: number, callbacks: ItemMoveCallbacks) => void; + /** Expand items along a path by their IDs (caption field) */ + expandItemsByPath: (fieldPath: string, itemIds: string[]) => void; /** Reset all state */ reset: () => void; } @@ -67,11 +69,20 @@ export const useArrayFieldStore = create()( ...initialState, setItemExpanded: (fieldPath, itemIndex, expanded) => { + console.log('[arrayFieldStore] setItemExpanded called', { + fieldPath, + itemIndex, + expanded, + }); set((state) => { if (!state.expandedStates[fieldPath]) { state.expandedStates[fieldPath] = []; } state.expandedStates[fieldPath][itemIndex] = expanded; + console.log('[arrayFieldStore] expandedStates updated', { + fieldPath, + newExpandedStates: state.expandedStates[fieldPath], + }); }); }, @@ -195,6 +206,34 @@ export const useArrayFieldStore = create()( }); }, + expandItemsByPath: (fieldPath, itemIds) => { + set((state) => { + const items = state.itemsData[fieldPath]; + if (!items || !Array.isArray(items)) { + return; + } + + const expandedStates = state.expandedStates[fieldPath]; + if (!expandedStates) { + return; + } + + // For each ID in the path, find matching item and expand it + itemIds.forEach((itemId) => { + const itemIndex = items.findIndex((item) => { + if (!item || typeof item !== 'object') return false; + const data = item as Record; + // Match by id, caption, or title field + return data.id === itemId || data.caption === itemId || data.title === itemId; + }); + + if (itemIndex !== -1 && itemIndex < expandedStates.length) { + expandedStates[itemIndex] = true; + } + }); + }); + }, + reset: () => { set(initialState); }, diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldItemTemplate.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldItemTemplate.tsx index 7c39fd8b..77e1a1a9 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldItemTemplate.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldItemTemplate.tsx @@ -8,6 +8,7 @@ import { Box, Checkbox, IconButton } from '@mui/material'; import { ArrayFieldItemTemplateProps, FormContextType, getTemplate, getUiOptions, RJSFSchema } from '@rjsf/utils'; import React, { useCallback, useEffect, useMemo } from 'react'; import { useTranslation } from 'react-i18next'; +import { useShallow } from 'zustand/react/shallow'; import { ArrayItemProvider, useArrayItemContext } from '../context/ArrayItemContext'; import { ExtendedFormContext } from '../index'; import { useArrayFieldStore } from '../store/arrayFieldStore'; @@ -37,16 +38,25 @@ export function ArrayFieldItemTemplate state.expandedStates[fieldPath]?.[index] ?? false, [fieldPath, index]), + // Get ALL relevant store data in one subscription + // Use useShallow to prevent unnecessary re-renders + const { + expandedStates, + stableItemIds: allStableItemIds, + setItemExpanded, + registerMoveCallbacks, + } = useArrayFieldStore( + useShallow((state) => ({ + expandedStates: state.expandedStates, + stableItemIds: state.stableItemIds, + setItemExpanded: state.setItemExpanded, + registerMoveCallbacks: state.registerMoveCallbacks, + })), ); - // Get stable item ID from store for dnd-kit - const stableItemId = useArrayFieldStore( - useCallback((state) => state.stableItemIds[fieldPath]?.[index] ?? `item-${index}`, [fieldPath, index]), - ); - const setItemExpanded = useArrayFieldStore((state) => state.setItemExpanded); - const registerMoveCallbacks = useArrayFieldStore((state) => state.registerMoveCallbacks); + + // Get data for this specific item + const expanded = expandedStates[fieldPath]?.[index] ?? false; + const stableItemId = allStableItemIds[fieldPath]?.[index] ?? `item-${index}`; // Register move callbacks so they can be accessed during drag operations useEffect(() => { @@ -65,8 +75,15 @@ export function ArrayFieldItemTemplate { + console.log('[ArrayFieldItemTemplate] handleToggleExpanded called', { + fieldPath, + index, + currentExpanded: expanded, + willBeExpanded: !expanded, + itemCaption: (itemData as any)?.caption, + }); setItemExpanded(fieldPath, index, !expanded); - }, [fieldPath, index, expanded, setItemExpanded]); + }, [fieldPath, index, expanded, setItemExpanded, itemData]); // 获取当前项的数据来显示 caption const itemCaption = useMemo(() => { diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldTemplate.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldTemplate.tsx index c8cc1120..148598d2 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldTemplate.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/PromptConfigForm/templates/ArrayFieldTemplate.tsx @@ -4,6 +4,7 @@ import { Box, Typography } from '@mui/material'; import { ArrayFieldTemplateProps } from '@rjsf/utils'; import React, { useCallback, useEffect, useMemo, useState } from 'react'; import { useTranslation } from 'react-i18next'; +import { useShallow } from 'zustand/react/shallow'; import { ArrayAddButton, ArrayContainer, ArrayHeader, ArrayItemCount, EmptyState, HelpTooltip, StyledFieldLabel } from '../components'; import { ArrayItemProvider } from '../context/ArrayItemContext'; import { ExtendedFormContext } from '../index'; @@ -16,7 +17,7 @@ import { useArrayFieldStore } from '../store/arrayFieldStore'; export const ArrayFieldTemplate: React.FC = (props) => { const { items, onAddClick, canAdd, title, schema, registry } = props; const formData = props.formData as unknown[] | undefined; - const fieldPathId = (props as unknown as { fieldPathId?: { path: (string | number)[] } }).fieldPathId; + const fieldPathId = (props as unknown as { fieldPathId?: { path: (string | number)[]; $id?: string } }).fieldPathId; const { t } = useTranslation('agent'); // Get formContext for direct data manipulation @@ -25,18 +26,42 @@ export const ArrayFieldTemplate: React.FC = (props) => const description = schema.description; // Generate a stable field path for this array - // Use title as fallback since idSchema might not be available - const fieldPath = useMemo(() => title || 'array', [title]); + // Use fieldPathId from RJSF which contains the actual property path + const fieldPath = useMemo(() => { + // First try to use fieldPathId which contains the actual path like ["prompts"] or ["prompts", 0, "children"] + if (fieldPathId?.path && Array.isArray(fieldPathId.path) && fieldPathId.path.length > 0) { + return fieldPathId.path.join('_'); + } + // Fallback to fieldPathId.$id with root_ prefix removed + if (fieldPathId?.$id) { + return fieldPathId.$id.replace(/^root_/, ''); + } + return title || 'array'; + }, [fieldPathId?.path, fieldPathId?.$id, title]); - // Get store actions and state - const initializeField = useArrayFieldStore((state) => state.initializeField); - const updateItemsData = useArrayFieldStore((state) => state.updateItemsData); - const cleanupField = useArrayFieldStore((state) => state.cleanupField); - const moveItem = useArrayFieldStore((state) => state.moveItem); - // Get stable item IDs from store - these persist across re-renders - const stableItemIds = useArrayFieldStore((state) => state.stableItemIds[fieldPath] ?? []); - // Get items order from store - used for optimistic rendering during drag - const itemsOrder = useArrayFieldStore((state) => state.itemsOrder[fieldPath] ?? []); + // Get ALL store data and functions in one subscription to avoid multiple subscriptions + // Use useShallow to prevent unnecessary re-renders when the returned object has the same values + const { + initializeField, + updateItemsData, + cleanupField, + moveItem, + stableItemIds: allStableItemIds, + itemsOrder: allItemsOrder, + } = useArrayFieldStore( + useShallow((state) => ({ + initializeField: state.initializeField, + updateItemsData: state.updateItemsData, + cleanupField: state.cleanupField, + moveItem: state.moveItem, + stableItemIds: state.stableItemIds, + itemsOrder: state.itemsOrder, + })), + ); + + // Get data for this specific fieldPath + const stableItemIds = allStableItemIds[fieldPath] ?? []; + const itemsOrder = allItemsOrder[fieldPath] ?? []; // Track active drag item for overlay const [activeId, setActiveId] = useState(null); @@ -48,9 +73,36 @@ export const ArrayFieldTemplate: React.FC = (props) => }, [fieldPath, items.length, initializeField]); // Update store when formData changes (from RJSF) + // Use ref to track previous formData and only update when content actually changes + const previousFormDataReference = React.useRef(undefined); + const previousLengthReference = React.useRef(-1); + useEffect(() => { const itemsData = Array.isArray(formData) ? formData : []; - updateItemsData(fieldPath, itemsData); + const currentLength = itemsData.length; + + // Only update if: + // 1. This is the first render (previousLengthReference.current === -1) + // 2. Length changed + // 3. Content changed (only check if length is the same) + if (previousLengthReference.current === -1 || previousLengthReference.current !== currentLength) { + previousFormDataReference.current = itemsData; + previousLengthReference.current = currentLength; + updateItemsData(fieldPath, itemsData); + } else if (previousFormDataReference.current) { + // Length is the same, do a shallow comparison of items + let hasChanged = false; + for (let itemIndex = 0; itemIndex < itemsData.length; itemIndex++) { + if (itemsData[itemIndex] !== previousFormDataReference.current[itemIndex]) { + hasChanged = true; + break; + } + } + if (hasChanged) { + previousFormDataReference.current = itemsData; + updateItemsData(fieldPath, itemsData); + } + } }, [formData, fieldPath, updateItemsData]); // Cleanup on unmount diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.promptConcat.test.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.promptConcat.test.tsx index 86f2028e..86ce2d0a 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.promptConcat.test.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.promptConcat.test.tsx @@ -50,7 +50,6 @@ describe('PromptPreviewDialog - Tool Information Rendering', () => { previewCurrentPlugin: null, lastUpdated: null, formFieldsToScrollTo: [], - expandedArrayItems: new Map(), }); // Clear all mock calls diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.ui.test.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.ui.test.tsx index 8ceb0be2..76e7d927 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.ui.test.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/__tests__/PromptPreviewDialog.ui.test.tsx @@ -45,7 +45,6 @@ describe('PromptPreviewDialog - Tool Information Rendering', () => { previewCurrentPlugin: null, lastUpdated: null, formFieldsToScrollTo: [], - expandedArrayItems: new Map(), }); }); diff --git a/src/pages/ChatTabContent/components/PromptPreviewDialog/index.tsx b/src/pages/ChatTabContent/components/PromptPreviewDialog/index.tsx index cbe78a21..fd79b42c 100644 --- a/src/pages/ChatTabContent/components/PromptPreviewDialog/index.tsx +++ b/src/pages/ChatTabContent/components/PromptPreviewDialog/index.tsx @@ -38,6 +38,7 @@ export const PromptPreviewDialog: React.FC = ({ const [isFullScreen, setIsFullScreen] = useState(false); const [baseMode, setBaseMode] = useState<'preview' | 'edit'>(initialBaseMode); const [showSideBySide, setShowSideBySide] = useState(false); + const [baseModeBeforeSideBySide, setBaseModeBeforeSideBySide] = useState<'preview' | 'edit'>(initialBaseMode); const { loading: agentFrameworkConfigLoading, @@ -75,10 +76,19 @@ export const PromptPreviewDialog: React.FC = ({ }, []); const handleToggleEditMode = useCallback((): void => { - setShowSideBySide(previous => !previous); - }, []); + setShowSideBySide(previous => { + if (!previous) { + // Entering side-by-side, save current baseMode + setBaseModeBeforeSideBySide(baseMode); + } else { + // Exiting side-by-side, restore previous baseMode + setBaseMode(baseModeBeforeSideBySide); + } + return !previous; + }); + }, [baseMode, baseModeBeforeSideBySide]); - // Listen for form field scroll targets to automatically switch to edit mode + // Listen for form field scroll targets to automatically switch to side-by-side mode const { formFieldsToScrollTo } = useAgentChatStore( useShallow((state) => ({ formFieldsToScrollTo: state.formFieldsToScrollTo, @@ -86,10 +96,12 @@ export const PromptPreviewDialog: React.FC = ({ ); useEffect(() => { if (formFieldsToScrollTo.length > 0) { + // Save current baseMode before switching to side-by-side + setBaseModeBeforeSideBySide(baseMode); setBaseMode('edit'); - setShowSideBySide(false); + setShowSideBySide(true); // Show side-by-side when clicking from PromptTree } - }, [formFieldsToScrollTo]); + }, [formFieldsToScrollTo, baseMode]); useEffect(() => { if (open) { diff --git a/src/pages/ChatTabContent/components/PromptTree.tsx b/src/pages/ChatTabContent/components/PromptTree.tsx index c0c0e74f..58852e7c 100644 --- a/src/pages/ChatTabContent/components/PromptTree.tsx +++ b/src/pages/ChatTabContent/components/PromptTree.tsx @@ -49,10 +49,9 @@ export const PromptTreeNode = memo(({ depth: number; fieldPath?: string[]; }): React.ReactElement => { - const { setFormFieldsToScrollTo, expandPathToTarget } = useAgentChatStore( + const { setFormFieldsToScrollTo } = useAgentChatStore( useShallow((state) => ({ setFormFieldsToScrollTo: state.setFormFieldsToScrollTo, - expandPathToTarget: state.expandPathToTarget, })), ); const handleNodeClick = useCallback((event: React.MouseEvent) => { @@ -61,8 +60,7 @@ export const PromptTreeNode = memo(({ const targetFieldPath = (node.source && node.source.length > 0) ? node.source : [...fieldPath, node.id]; setFormFieldsToScrollTo(targetFieldPath); - expandPathToTarget(targetFieldPath); - }, [node.source, node.id, fieldPath, setFormFieldsToScrollTo, expandPathToTarget]); + }, [node.source, node.id, fieldPath, setFormFieldsToScrollTo]); return (