diff --git a/frontend/src/components/tools/automate/ToolSelector.tsx b/frontend/src/components/tools/automate/ToolSelector.tsx index 4fb87548f..3526ff4e6 100644 --- a/frontend/src/components/tools/automate/ToolSelector.tsx +++ b/frontend/src/components/tools/automate/ToolSelector.tsx @@ -93,7 +93,7 @@ export default function ToolSelector({ const renderedTools = useMemo(() => displayGroups.map((subcategory) => - renderToolButtons(t, subcategory, null, handleToolSelect, !isSearching) + renderToolButtons(t, subcategory, null, handleToolSelect, !isSearching, true) ), [displayGroups, handleToolSelect, isSearching, t] ); @@ -150,7 +150,7 @@ export default function ToolSelector({
{}} rounded={true}> + onSelect={()=>{}} rounded={true} disableNavigation={true}>
) : ( // Show search input when no tool selected OR when dropdown is opened diff --git a/frontend/src/components/tools/shared/renderToolButtons.tsx b/frontend/src/components/tools/shared/renderToolButtons.tsx index 4d92d4798..340ad559d 100644 --- a/frontend/src/components/tools/shared/renderToolButtons.tsx +++ b/frontend/src/components/tools/shared/renderToolButtons.tsx @@ -12,7 +12,8 @@ export const renderToolButtons = ( subcategory: SubcategoryGroup, selectedToolKey: string | null, onSelect: (id: string) => void, - showSubcategoryHeader: boolean = true + showSubcategoryHeader: boolean = true, + disableNavigation: boolean = false ) => ( {showSubcategoryHeader && ( @@ -26,6 +27,7 @@ export const renderToolButtons = ( tool={tool} isSelected={selectedToolKey === id} onSelect={onSelect} + disableNavigation={disableNavigation} /> ))} diff --git a/frontend/src/components/tools/toolPicker/ToolButton.tsx b/frontend/src/components/tools/toolPicker/ToolButton.tsx index ee9c6062c..f84fa9189 100644 --- a/frontend/src/components/tools/toolPicker/ToolButton.tsx +++ b/frontend/src/components/tools/toolPicker/ToolButton.tsx @@ -12,9 +12,10 @@ interface ToolButtonProps { isSelected: boolean; onSelect: (id: string) => void; rounded?: boolean; + disableNavigation?: boolean; } -const ToolButton: React.FC = ({ id, tool, isSelected, onSelect }) => { +const ToolButton: React.FC = ({ id, tool, isSelected, onSelect, disableNavigation = false }) => { const isUnavailable = !tool.component && !tool.link; const { getToolNavigation } = useToolNavigation(); @@ -29,8 +30,8 @@ const ToolButton: React.FC = ({ id, tool, isSelected, onSelect onSelect(id); }; - // Get navigation props for URL support - const navProps = !isUnavailable && !tool.link ? getToolNavigation(id, tool) : null; + // Get navigation props for URL support (only if navigation is not disabled) + const navProps = !isUnavailable && !tool.link && !disableNavigation ? getToolNavigation(id, tool) : null; const tooltipContent = isUnavailable ? (Coming soon: {tool.description})