fix: terminal flicker when waiting for login

packages/cli/src/ui/components/QwenOAuthProgress.tsx

@@ -5,7 +5,7 @@
  */
 
 import React, { useState, useEffect } from 'react';
-import { Box, Text, useInput } from 'ink';
+import { Box, Text, useInput, Static } from 'ink';
 import Spinner from 'ink-spinner';
 import Link from 'ink-link';
 import qrcode from 'qrcode-terminal';
@@ -26,6 +26,13 @@ interface QwenOAuthProgressProps {
   authMessage?: string | null;
 }
 
+interface StaticItem {
+  key: string;
+  type: 'title' | 'instructions' | 'url' | 'qr-instructions' | 'qr-code' | 'auth-content';
+  url?: string;
+  qrCode?: string;
+}
+
 export function QwenOAuthProgress({
   onTimeout,
   onCancel,
@@ -54,7 +61,8 @@ export function QwenOAuthProgress({
       return;
     }
 
-    // Generate QR code string
+    // Only generate QR code if we don't have one yet for this URL
+    if (qrCodeData === null) {
       const generateQR = () => {
         try {
           qrcode.generate(
@@ -71,7 +79,8 @@ export function QwenOAuthProgress({
       };
 
       generateQR();
-  }, [deviceAuth]);
+    }
+  }, [deviceAuth, qrCodeData]);
 
   // Countdown timer
   useEffect(() => {
@@ -161,12 +170,23 @@ export function QwenOAuthProgress({
   }
 
   return (
+    <>
+      {qrCodeData && (
+        <Static items={[
+          { key: 'auth-content', type: 'auth-content' as const, url: deviceAuth.verification_uri_complete, qrCode: qrCodeData }
+        ] as StaticItem[]}
+          style={{
+            width: "100%"
+          }}
+        >
+          {(item: StaticItem) => (
             <Box
               borderStyle="round"
               borderColor={Colors.AccentBlue}
               flexDirection="column"
               padding={1}
               width="100%"
+              key={item.key}
             >
               <Text bold color={Colors.AccentBlue}>
                 Qwen OAuth Authentication
@@ -175,21 +195,31 @@ export function QwenOAuthProgress({
               <Box marginTop={1}>
                 <Text>Please visit this URL to authorize:</Text>
               </Box>
-      <Link url={deviceAuth.verification_uri_complete} fallback={false}>
+
+              <Link url={item.url || ''} fallback={false}>
                 <Text color={Colors.AccentGreen} bold>
-          {deviceAuth.verification_uri_complete}
+                  {item.url || ''}
                 </Text>
               </Link>
-      {qrCodeData && (
+
-        <>
               <Box marginTop={1}>
                 <Text>Or scan the QR code below:</Text>
               </Box>
+
               <Box marginTop={1}>
-            <Text>{qrCodeData}</Text>
+                <Text>{item.qrCode || ''}</Text>
+              </Box>
             </Box>
-        </>
           )}
+        </Static>
+      )}
+      <Box
+        borderStyle="round"
+        borderColor={Colors.AccentBlue}
+        flexDirection="column"
+        padding={1}
+        width="100%"
+      >
 
         <Box marginTop={1}>
           <Text>
@@ -204,5 +234,6 @@ export function QwenOAuthProgress({
           <Text color={Colors.AccentPurple}>(Press ESC to cancel)</Text>
         </Box>
       </Box>
+    </>
   );
 }