Copilot commented on code in PR #15901: URL: https://github.com/apache/pinot/pull/15901#discussion_r2107492413
########## pinot-controller/src/main/resources/app/components/Query/VisualizeQueryStageStats.tsx: ########## @@ -27,7 +35,8 @@ import isEmpty from "lodash/isEmpty"; * Main component to visualize query stage stats as a flowchart. */ export const VisualizeQueryStageStats = ({ stageStats }) => { - const { nodes, edges } = generateFlowElements(stageStats); // Generate nodes and edges from input data + const [simpleMode, setSimpleMode] = useState(true); + const { nodes, edges } = generateFlowElements(stageStats, simpleMode); // Generate nodes and edges from input data Review Comment: Running `generateFlowElements` on every render can be expensive; wrap this call in `useMemo` keyed on `[stageStats, simpleMode]` to avoid unnecessary recomputation. ```suggestion const { nodes, edges } = useMemo(() => generateFlowElements(stageStats, simpleMode), [stageStats, simpleMode]); // Generate nodes and edges from input data ``` ########## pinot-controller/src/main/resources/app/components/Query/VisualizeQueryStageStats.tsx: ########## @@ -38,17 +47,22 @@ export const VisualizeQueryStageStats = ({ stageStats }) => { } return ( - <div style={{ height: 500 }}> + <div style={{ height: 1000 }}> Review Comment: [nitpick] Using a fixed height of `1000` may not adapt well to different screen sizes; consider making this configurable or using responsive CSS rules. -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: commits-unsubscr...@pinot.apache.org For queries about this service, please contact Infrastructure at: us...@infra.apache.org --------------------------------------------------------------------- To unsubscribe, e-mail: commits-unsubscr...@pinot.apache.org For additional commands, e-mail: commits-h...@pinot.apache.org