Browse Source

perf: narrow ControlPanel selector to only selected node

Replace subscribing to the full nodes array with a Zustand selector that
returns only the single selected node. The selector runs the filter
internally but only causes a re-render when the selected node reference
changes, rather than on every store mutation.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
handoff-20260429-1057
shrimbly 4 months ago
parent
commit
c3c37c9f94
  1. 12
      src/components/nodes/ControlPanel.tsx

12
src/components/nodes/ControlPanel.tsx

@ -108,16 +108,12 @@ function generateEasingPolyline(
* Displays controls for the currently selected node
*/
export function ControlPanel() {
const nodes = useWorkflowStore((state) => state.nodes);
const selectedNode = useWorkflowStore((state) => {
const selected = state.nodes.filter((n) => n.selected);
return selected.length === 1 ? selected[0] : null;
});
const { inlineParametersEnabled } = useInlineParameters();
// Get the single selected node
const selectedNode = useMemo(() => {
const selected = nodes.filter((n) => n.selected);
if (selected.length !== 1) return null;
return selected[0];
}, [nodes]);
// Check if the selected node is configurable
const isConfigurable = selectedNode && CONFIGURABLE_NODE_TYPES.includes(selectedNode.type as NodeType);

Loading…
Cancel
Save