feat(ui): add flicker detection and metrics (#10821)

packages/cli/src/ui/layouts/DefaultAppLayout.tsx

@@ -12,12 +12,19 @@ import { DialogManager } from '../components/DialogManager.js';
 import { Composer } from '../components/Composer.js';
 import { ExitWarning } from '../components/ExitWarning.js';
 import { useUIState } from '../contexts/UIStateContext.js';
+import { useFlickerDetector } from '../hooks/useFlickerDetector.js';
 
 export const DefaultAppLayout: React.FC = () => {
   const uiState = useUIState();
+  const { rootUiRef, terminalHeight } = uiState;
+  useFlickerDetector(rootUiRef, terminalHeight);
 
   return (
-    <Box flexDirection="column" width={uiState.mainAreaWidth}>
+    <Box
+      flexDirection="column"
+      width={uiState.mainAreaWidth}
+      ref={uiState.rootUiRef}
+    >
       <MainContent />
 
       <Box flexDirection="column" ref={uiState.mainControlsRef}>