feat(cli): extract QuotaContext and resolve infinite render loop (#24959)

packages/cli/src/test-utils/render.tsx

@@ -602,6 +602,7 @@ const mockUIActions: UIActions = {
 
 import { type TextBuffer } from '../ui/components/shared/text-buffer.js';
 import { InputContext, type InputState } from '../ui/contexts/InputContext.js';
+import { QuotaContext, type QuotaState } from '../ui/contexts/QuotaContext.js';
 
 let capturedOverflowState: OverflowState | undefined;
 let capturedOverflowActions: OverflowActions | undefined;
@@ -619,6 +620,7 @@ export const renderWithProviders = async (
     shellFocus = true,
     settings = mockSettings,
     uiState: providedUiState,
+    quotaState: providedQuotaState,
     inputState: providedInputState,
     width,
     mouseEventsEnabled = false,
@@ -631,6 +633,7 @@ export const renderWithProviders = async (
     shellFocus?: boolean;
     settings?: LoadedSettings;
     uiState?: Partial<UIState>;
+    quotaState?: Partial<QuotaState>;
     inputState?: Partial<InputState>;
     width?: number;
     mouseEventsEnabled?: boolean;
@@ -666,6 +669,16 @@ export const renderWithProviders = async (
     },
   ) as UIState;
 
+  const quotaState: QuotaState = {
+    userTier: undefined,
+    stats: undefined,
+    proQuotaRequest: null,
+    validationRequest: null,
+    overageMenuRequest: null,
+    emptyWalletRequest: null,
+    ...providedQuotaState,
+  };
+
   const inputState = {
     buffer: { text: '' } as unknown as TextBuffer,
     userMessages: [],
@@ -727,65 +740,67 @@ export const renderWithProviders = async (
     <AppContext.Provider value={appState}>
       <ConfigContext.Provider value={config}>
         <SettingsContext.Provider value={settings}>
-          <InputContext.Provider value={inputState}>
-            <UIStateContext.Provider value={finalUiState}>
-              <VimModeProvider>
-                <ShellFocusContext.Provider value={shellFocus}>
-                  <SessionStatsProvider sessionId={config.getSessionId()}>
-                    <StreamingContext.Provider
-                      value={finalUiState.streamingState}
-                    >
-                      <UIActionsContext.Provider value={finalUIActions}>
-                        <OverflowProvider>
-                          <ToolActionsProvider
-                            config={config}
-                            toolCalls={allToolCalls}
-                            isExpanded={
-                              toolActions?.isExpanded ??
-                              vi.fn().mockReturnValue(false)
-                            }
-                            toggleExpansion={
-                              toolActions?.toggleExpansion ?? vi.fn()
-                            }
-                            toggleAllExpansion={
-                              toolActions?.toggleAllExpansion ?? vi.fn()
-                            }
-                          >
-                            <AskUserActionsProvider
-                              request={null}
-                              onSubmit={vi.fn()}
-                              onCancel={vi.fn()}
+          <QuotaContext.Provider value={quotaState}>
+            <InputContext.Provider value={inputState}>
+              <UIStateContext.Provider value={finalUiState}>
+                <VimModeProvider>
+                  <ShellFocusContext.Provider value={shellFocus}>
+                    <SessionStatsProvider sessionId={config.getSessionId()}>
+                      <StreamingContext.Provider
+                        value={finalUiState.streamingState}
+                      >
+                        <UIActionsContext.Provider value={finalUIActions}>
+                          <OverflowProvider>
+                            <ToolActionsProvider
+                              config={config}
+                              toolCalls={allToolCalls}
+                              isExpanded={
+                                toolActions?.isExpanded ??
+                                vi.fn().mockReturnValue(false)
+                              }
+                              toggleExpansion={
+                                toolActions?.toggleExpansion ?? vi.fn()
+                              }
+                              toggleAllExpansion={
+                                toolActions?.toggleAllExpansion ?? vi.fn()
+                              }
                             >
-                              <KeypressProvider>
-                                <MouseProvider
-                                  mouseEventsEnabled={mouseEventsEnabled}
-                                >
-                                  <TerminalProvider>
-                                    <ScrollProvider>
-                                      <ContextCapture>
-                                        <Box
-                                          width={terminalWidth}
-                                          flexShrink={0}
-                                          flexGrow={0}
-                                          flexDirection="column"
-                                        >
-                                          {comp}
-                                        </Box>
-                                      </ContextCapture>
-                                    </ScrollProvider>
-                                  </TerminalProvider>
-                                </MouseProvider>
-                              </KeypressProvider>
-                            </AskUserActionsProvider>
-                          </ToolActionsProvider>
-                        </OverflowProvider>
-                      </UIActionsContext.Provider>
-                    </StreamingContext.Provider>
-                  </SessionStatsProvider>
-                </ShellFocusContext.Provider>
-              </VimModeProvider>
-            </UIStateContext.Provider>
-          </InputContext.Provider>
+                              <AskUserActionsProvider
+                                request={null}
+                                onSubmit={vi.fn()}
+                                onCancel={vi.fn()}
+                              >
+                                <KeypressProvider>
+                                  <MouseProvider
+                                    mouseEventsEnabled={mouseEventsEnabled}
+                                  >
+                                    <TerminalProvider>
+                                      <ScrollProvider>
+                                        <ContextCapture>
+                                          <Box
+                                            width={terminalWidth}
+                                            flexShrink={0}
+                                            flexGrow={0}
+                                            flexDirection="column"
+                                          >
+                                            {comp}
+                                          </Box>
+                                        </ContextCapture>
+                                      </ScrollProvider>
+                                    </TerminalProvider>
+                                  </MouseProvider>
+                                </KeypressProvider>
+                              </AskUserActionsProvider>
+                            </ToolActionsProvider>
+                          </OverflowProvider>
+                        </UIActionsContext.Provider>
+                      </StreamingContext.Provider>
+                    </SessionStatsProvider>
+                  </ShellFocusContext.Provider>
+                </VimModeProvider>
+              </UIStateContext.Provider>
+            </InputContext.Provider>
+          </QuotaContext.Provider>
         </SettingsContext.Provider>
       </ConfigContext.Provider>
     </AppContext.Provider>

packages/cli/src/ui/AppContainer.test.tsx

@@ -123,16 +123,19 @@ vi.mock('ink', async (importOriginal) => {
 });
 
 import { InputContext, type InputState } from './contexts/InputContext.js';
+import { QuotaContext, type QuotaState } from './contexts/QuotaContext.js';
 
 // Helper component will read the context values provided by AppContainer
 // so we can assert against them in our tests.
 let capturedUIState: UIState;
 let capturedInputState: InputState;
+let capturedQuotaState: QuotaState;
 let capturedUIActions: UIActions;
 let capturedOverflowActions: OverflowActions;
 function TestContextConsumer() {
   capturedUIState = useContext(UIStateContext)!;
   capturedInputState = useContext(InputContext)!;
+  capturedQuotaState = useContext(QuotaContext)!;
   capturedUIActions = useContext(UIActionsContext)!;
   capturedOverflowActions = useOverflowActions()!;
   return null;
@@ -1309,15 +1312,15 @@ describe('AppContainer State Management', () => {
   });
 
   describe('Quota and Fallback Integration', () => {
-    it('passes a null proQuotaRequest to UIStateContext by default', async () => {
+    it('passes a null proQuotaRequest to QuotaContext by default', async () => {
       // The default mock from beforeEach already sets proQuotaRequest to null
       const { unmount } = await act(async () => renderAppContainer());
       // Assert that the context value is as expected
-      expect(capturedUIState.quota.proQuotaRequest).toBeNull();
+      expect(capturedQuotaState.proQuotaRequest).toBeNull();
       unmount();
     });
 
-    it('passes a valid proQuotaRequest to UIStateContext when provided by the hook', async () => {
+    it('passes a valid proQuotaRequest to QuotaContext when provided by the hook', async () => {
       // Arrange: Create a mock request object that a UI dialog would receive
       const mockRequest = {
         failedModel: 'gemini-pro',
@@ -1332,7 +1335,7 @@ describe('AppContainer State Management', () => {
       // Act: Render the container
       const { unmount } = await act(async () => renderAppContainer());
       // Assert: The mock request is correctly passed through the context
-      expect(capturedUIState.quota.proQuotaRequest).toEqual(mockRequest);
+      expect(capturedQuotaState.proQuotaRequest).toEqual(mockRequest);
       unmount();
     });
 

packages/cli/src/ui/AppContainer.tsx

@@ -25,6 +25,7 @@ import {
 import { App } from './App.js';
 import { AppContext } from './contexts/AppContext.js';
 import { UIStateContext, type UIState } from './contexts/UIStateContext.js';
+import { QuotaContext } from './contexts/QuotaContext.js';
 import {
   UIActionsContext,
   type UIActions,
@@ -2401,6 +2402,26 @@ Logging in with Google... Restarting Gemini CLI to continue.
     ],
   );
 
+  const quotaState = useMemo(
+    () => ({
+      userTier,
+      stats: quotaStats,
+      proQuotaRequest,
+      validationRequest,
+      // G1 AI Credits dialog state
+      overageMenuRequest,
+      emptyWalletRequest,
+    }),
+    [
+      userTier,
+      quotaStats,
+      proQuotaRequest,
+      validationRequest,
+      overageMenuRequest,
+      emptyWalletRequest,
+    ],
+  );
+
   const uiState: UIState = useMemo(
     () => ({
       history: historyManager.history,
@@ -2473,15 +2494,6 @@ Logging in with Google... Restarting Gemini CLI to continue.
       showApprovalModeIndicator,
       allowPlanMode,
       currentModel,
-      quota: {
-        userTier,
-        stats: quotaStats,
-        proQuotaRequest,
-        validationRequest,
-        // G1 AI Credits dialog state
-        overageMenuRequest,
-        emptyWalletRequest,
-      },
       contextFileNames,
       errorCount,
       availableTerminalHeight,
@@ -2592,12 +2604,6 @@ Logging in with Google... Restarting Gemini CLI to continue.
       queueErrorMessage,
       showApprovalModeIndicator,
       allowPlanMode,
-      userTier,
-      quotaStats,
-      proQuotaRequest,
-      validationRequest,
-      overageMenuRequest,
-      emptyWalletRequest,
       contextFileNames,
       errorCount,
       availableTerminalHeight,
@@ -2816,34 +2822,36 @@ Logging in with Google... Restarting Gemini CLI to continue.
 
   return (
     <UIStateContext.Provider value={uiState}>
-      <InputContext.Provider value={inputState}>
-        <UIActionsContext.Provider value={uiActions}>
-          <ConfigContext.Provider value={config}>
-            <AppContext.Provider
-              value={{
-                version: props.version,
-                startupWarnings: props.startupWarnings || [],
-              }}
-            >
-              <ToolActionsProvider
-                config={config}
-                toolCalls={allToolCalls}
-                isExpanded={isExpanded}
-                toggleExpansion={toggleExpansion}
-                toggleAllExpansion={toggleAllExpansion}
+      <QuotaContext.Provider value={quotaState}>
+        <InputContext.Provider value={inputState}>
+          <UIActionsContext.Provider value={uiActions}>
+            <ConfigContext.Provider value={config}>
+              <AppContext.Provider
+                value={{
+                  version: props.version,
+                  startupWarnings: props.startupWarnings || [],
+                }}
               >
-                <ShellFocusContext.Provider value={isFocused}>
-                  <MouseProvider mouseEventsEnabled={mouseMode}>
-                    <ScrollProvider>
-                      <App key={`app-${forceRerenderKey}`} />
-                    </ScrollProvider>
-                  </MouseProvider>
-                </ShellFocusContext.Provider>
-              </ToolActionsProvider>
-            </AppContext.Provider>
-          </ConfigContext.Provider>
-        </UIActionsContext.Provider>
-      </InputContext.Provider>
+                <ToolActionsProvider
+                  config={config}
+                  toolCalls={allToolCalls}
+                  isExpanded={isExpanded}
+                  toggleExpansion={toggleExpansion}
+                  toggleAllExpansion={toggleAllExpansion}
+                >
+                  <ShellFocusContext.Provider value={isFocused}>
+                    <MouseProvider mouseEventsEnabled={mouseMode}>
+                      <ScrollProvider>
+                        <App key={`app-${forceRerenderKey}`} />
+                      </ScrollProvider>
+                    </MouseProvider>
+                  </ShellFocusContext.Provider>
+                </ToolActionsProvider>
+              </AppContext.Provider>
+            </ConfigContext.Provider>
+          </UIActionsContext.Provider>
+        </InputContext.Provider>
+      </QuotaContext.Provider>
     </UIStateContext.Provider>
   );
 };

packages/cli/src/ui/ToolConfirmationFullFrame.test.tsx

@@ -11,9 +11,9 @@ import {
   CoreToolCallStatus,
   ApprovalMode,
   makeFakeConfig,
+  type SerializableConfirmationDetails,
 } from '@google/gemini-cli-core';
 import { type UIState } from './contexts/UIStateContext.js';
-import type { SerializableConfirmationDetails } from '@google/gemini-cli-core';
 import { act } from 'react';
 import { StreamingState } from './types.js';
 
@@ -107,15 +107,6 @@ describe('Full Terminal Tool Confirmation Snapshot', () => {
       constrainHeight: true,
       isConfigInitialized: true,
       cleanUiDetailsVisible: true,
-      quota: {
-        userTier: 'PRO',
-        stats: {
-          limits: {},
-          usage: {},
-        },
-        proQuotaRequest: null,
-        validationRequest: null,
-      },
       pendingHistoryItems: [
         {
           id: 2,
@@ -145,6 +136,13 @@ describe('Full Terminal Tool Confirmation Snapshot', () => {
     const { waitUntilReady, lastFrame, generateSvg, unmount } =
       await renderWithProviders(<App />, {
         uiState: mockUIState,
+        quotaState: {
+          userTier: 'PRO',
+          stats: {
+            remaining: 100,
+            limit: 1000,
+          },
+        },
         config: mockConfig,
         settings: createMockSettings({
           merged: {

packages/cli/src/ui/components/Composer.test.tsx

@@ -201,12 +201,6 @@ const createMockUIState = (overrides: Partial<UIState> = {}): UIState =>
     isBackgroundTaskVisible: false,
     embeddedShellFocused: false,
     showIsExpandableHint: false,
-    quota: {
-      userTier: undefined,
-      stats: undefined,
-      proQuotaRequest: null,
-      validationRequest: null,
-    },
     ...overrides,
   }) as UIState;
 
@@ -245,6 +239,7 @@ const createMockConfig = (overrides = {}): Config =>
     ...overrides,
   }) as unknown as Config;
 
+import { QuotaContext, type QuotaState } from '../contexts/QuotaContext.js';
 import { InputContext, type InputState } from '../contexts/InputContext.js';
 
 const renderComposer = async (
@@ -253,6 +248,7 @@ const renderComposer = async (
   config = createMockConfig(),
   uiActions = createMockUIActions(),
   inputStateOverrides: Partial<InputState> = {},
+  quotaStateOverrides: Partial<QuotaState> = {},
 ) => {
   const inputState = {
     buffer: { text: '' } as unknown as TextBuffer,
@@ -266,16 +262,28 @@ const renderComposer = async (
     ...inputStateOverrides,
   };
 
+  const quotaState: QuotaState = {
+    userTier: undefined,
+    stats: undefined,
+    proQuotaRequest: null,
+    validationRequest: null,
+    overageMenuRequest: null,
+    emptyWalletRequest: null,
+    ...quotaStateOverrides,
+  };
+
   const result = await render(
     <ConfigContext.Provider value={config as unknown as Config}>
       <SettingsContext.Provider value={settings as unknown as LoadedSettings}>
-        <InputContext.Provider value={inputState}>
-          <UIStateContext.Provider value={uiState}>
-            <UIActionsContext.Provider value={uiActions}>
-              <Composer isFocused={true} />
-            </UIActionsContext.Provider>
-          </UIStateContext.Provider>
-        </InputContext.Provider>
+        <QuotaContext.Provider value={quotaState}>
+          <InputContext.Provider value={inputState}>
+            <UIStateContext.Provider value={uiState}>
+              <UIActionsContext.Provider value={uiActions}>
+                <Composer isFocused={true} />
+              </UIActionsContext.Provider>
+            </UIStateContext.Provider>
+          </InputContext.Provider>
+        </QuotaContext.Provider>
       </SettingsContext.Provider>
     </ConfigContext.Provider>,
   );

packages/cli/src/ui/components/DialogManager.test.tsx

@@ -9,6 +9,7 @@ import { DialogManager } from './DialogManager.js';
 import { describe, it, expect, vi } from 'vitest';
 import { Text } from 'ink';
 import { type UIState } from '../contexts/UIStateContext.js';
+import { type QuotaState } from '../contexts/QuotaContext.js';
 import { type RestartReason } from '../hooks/useIdeTrustListener.js';
 import { type IdeInfo } from '@google/gemini-cli-core';
 
@@ -75,14 +76,6 @@ describe('DialogManager', () => {
     terminalWidth: 80,
     confirmUpdateExtensionRequests: [],
     showIdeRestartPrompt: false,
-    quota: {
-      userTier: undefined,
-      stats: undefined,
-      proQuotaRequest: null,
-      validationRequest: null,
-      overageMenuRequest: null,
-      emptyWalletRequest: null,
-    },
     shouldShowIdePrompt: false,
     isFolderTrustDialogOpen: false,
     loopDetectionConfirmationRequest: null,
@@ -112,7 +105,7 @@ describe('DialogManager', () => {
     unmount();
   });
 
-  const testCases: Array<[Partial<UIState>, string]> = [
+  const testCases: Array<[Partial<UIState>, string, Partial<QuotaState>?]> = [
     [
       {
         showIdeRestartPrompt: true,
@@ -121,23 +114,17 @@ describe('DialogManager', () => {
       'IdeTrustChangeDialog',
     ],
     [
+      {},
+      'ProQuotaDialog',
       {
-        quota: {
-          userTier: undefined,
-          stats: undefined,
-          proQuotaRequest: {
-            failedModel: 'a',
-            fallbackModel: 'b',
-            message: 'c',
-            isTerminalQuotaError: false,
-            resolve: vi.fn(),
-          },
-          validationRequest: null,
-          overageMenuRequest: null,
-          emptyWalletRequest: null,
+        proQuotaRequest: {
+          failedModel: 'a',
+          fallbackModel: 'b',
+          message: 'c',
+          isTerminalQuotaError: false,
+          resolve: vi.fn(),
         },
       },
-      'ProQuotaDialog',
     ],
     [
       {
@@ -195,7 +182,11 @@ describe('DialogManager', () => {
 
   it.each(testCases)(
     'renders %s when state is %o',
-    async (uiStateOverride, expectedComponent) => {
+    async (
+      uiStateOverride: Partial<UIState>,
+      expectedComponent: string,
+      quotaStateOverride?: Partial<QuotaState>,
+    ) => {
       const { lastFrame, unmount } = await renderWithProviders(
         <DialogManager {...defaultProps} />,
         {
@@ -203,6 +194,7 @@ describe('DialogManager', () => {
             ...baseUiState,
             ...uiStateOverride,
           } as Partial<UIState> as UIState,
+          quotaState: quotaStateOverride,
         },
       );
       expect(lastFrame()).toContain(expectedComponent);

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

@@ -27,6 +27,7 @@ import { PermissionsModifyTrustDialog } from './PermissionsModifyTrustDialog.js'
 import { ModelDialog } from './ModelDialog.js';
 import { theme } from '../semantic-colors.js';
 import { useUIState } from '../contexts/UIStateContext.js';
+import { useQuotaState } from '../contexts/QuotaContext.js';
 import { useUIActions } from '../contexts/UIActionsContext.js';
 import { useConfig } from '../contexts/ConfigContext.js';
 import { useSettings } from '../contexts/SettingsContext.js';
@@ -52,6 +53,7 @@ export const DialogManager = ({
   const settings = useSettings();
 
   const uiState = useUIState();
+  const quotaState = useQuotaState();
   const uiActions = useUIActions();
   const {
     constrainHeight,
@@ -74,54 +76,50 @@ export const DialogManager = ({
       />
     );
   }
-  if (uiState.quota.proQuotaRequest) {
+  if (quotaState.proQuotaRequest) {
     return (
       <ProQuotaDialog
-        failedModel={uiState.quota.proQuotaRequest.failedModel}
-        fallbackModel={uiState.quota.proQuotaRequest.fallbackModel}
-        message={uiState.quota.proQuotaRequest.message}
-        isTerminalQuotaError={
-          uiState.quota.proQuotaRequest.isTerminalQuotaError
-        }
-        isModelNotFoundError={
-          !!uiState.quota.proQuotaRequest.isModelNotFoundError
-        }
-        authType={uiState.quota.proQuotaRequest.authType}
+        failedModel={quotaState.proQuotaRequest.failedModel}
+        fallbackModel={quotaState.proQuotaRequest.fallbackModel}
+        message={quotaState.proQuotaRequest.message}
+        isTerminalQuotaError={quotaState.proQuotaRequest.isTerminalQuotaError}
+        isModelNotFoundError={!!quotaState.proQuotaRequest.isModelNotFoundError}
+        authType={quotaState.proQuotaRequest.authType}
         tierName={config?.getUserTierName()}
         onChoice={uiActions.handleProQuotaChoice}
       />
     );
   }
-  if (uiState.quota.validationRequest) {
+  if (quotaState.validationRequest) {
     return (
       <ValidationDialog
-        validationLink={uiState.quota.validationRequest.validationLink}
+        validationLink={quotaState.validationRequest.validationLink}
         validationDescription={
-          uiState.quota.validationRequest.validationDescription
+          quotaState.validationRequest.validationDescription
         }
-        learnMoreUrl={uiState.quota.validationRequest.learnMoreUrl}
+        learnMoreUrl={quotaState.validationRequest.learnMoreUrl}
         onChoice={uiActions.handleValidationChoice}
       />
     );
   }
-  if (uiState.quota.overageMenuRequest) {
+  if (quotaState.overageMenuRequest) {
     return (
       <OverageMenuDialog
-        failedModel={uiState.quota.overageMenuRequest.failedModel}
-        fallbackModel={uiState.quota.overageMenuRequest.fallbackModel}
-        resetTime={uiState.quota.overageMenuRequest.resetTime}
-        creditBalance={uiState.quota.overageMenuRequest.creditBalance}
+        failedModel={quotaState.overageMenuRequest.failedModel}
+        fallbackModel={quotaState.overageMenuRequest.fallbackModel}
+        resetTime={quotaState.overageMenuRequest.resetTime}
+        creditBalance={quotaState.overageMenuRequest.creditBalance}
         onChoice={uiActions.handleOverageMenuChoice}
       />
     );
   }
-  if (uiState.quota.emptyWalletRequest) {
+  if (quotaState.emptyWalletRequest) {
     return (
       <EmptyWalletDialog
-        failedModel={uiState.quota.emptyWalletRequest.failedModel}
-        fallbackModel={uiState.quota.emptyWalletRequest.fallbackModel}
-        resetTime={uiState.quota.emptyWalletRequest.resetTime}
-        onGetCredits={uiState.quota.emptyWalletRequest.onGetCredits}
+        failedModel={quotaState.emptyWalletRequest.failedModel}
+        fallbackModel={quotaState.emptyWalletRequest.fallbackModel}
+        resetTime={quotaState.emptyWalletRequest.resetTime}
+        onGetCredits={quotaState.emptyWalletRequest.onGetCredits}
         onChoice={uiActions.handleEmptyWalletChoice}
       />
     );

packages/cli/src/ui/components/Footer.test.tsx

@@ -267,17 +267,12 @@ describe('<Footer />', () => {
       width: 120,
       uiState: {
         sessionStats: mockSessionStats,
-        quota: {
-          userTier: undefined,
-          stats: {
-            remaining: 15,
-            limit: 100,
-            resetTime: undefined,
-          },
-          proQuotaRequest: null,
-          validationRequest: null,
-          overageMenuRequest: null,
-          emptyWalletRequest: null,
+      },
+      quotaState: {
+        stats: {
+          remaining: 15,
+          limit: 100,
+          resetTime: undefined,
         },
       },
     });
@@ -292,17 +287,12 @@ describe('<Footer />', () => {
       width: 120,
       uiState: {
         sessionStats: mockSessionStats,
-        quota: {
-          userTier: undefined,
-          stats: {
-            remaining: 85,
-            limit: 100,
-            resetTime: undefined,
-          },
-          proQuotaRequest: null,
-          validationRequest: null,
-          overageMenuRequest: null,
-          emptyWalletRequest: null,
+      },
+      quotaState: {
+        stats: {
+          remaining: 85,
+          limit: 100,
+          resetTime: undefined,
         },
       },
     });
@@ -317,17 +307,12 @@ describe('<Footer />', () => {
       width: 120,
       uiState: {
         sessionStats: mockSessionStats,
-        quota: {
-          userTier: undefined,
-          stats: {
-            remaining: 0,
-            limit: 100,
-            resetTime: undefined,
-          },
-          proQuotaRequest: null,
-          validationRequest: null,
-          overageMenuRequest: null,
-          emptyWalletRequest: null,
+      },
+      quotaState: {
+        stats: {
+          remaining: 0,
+          limit: 100,
+          resetTime: undefined,
         },
       },
     });

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

@@ -23,6 +23,7 @@ import { ContextUsageDisplay } from './ContextUsageDisplay.js';
 import { QuotaDisplay } from './QuotaDisplay.js';
 import { DebugProfiler } from './DebugProfiler.js';
 import { useUIState } from '../contexts/UIStateContext.js';
+import { useQuotaState } from '../contexts/QuotaContext.js';
 import { useConfig } from '../contexts/ConfigContext.js';
 import { useSettings } from '../contexts/SettingsContext.js';
 import { useVimMode } from '../contexts/VimModeContext.js';
@@ -174,6 +175,7 @@ interface FooterColumn {
 
 export const Footer: React.FC = () => {
   const uiState = useUIState();
+  const quotaState = useQuotaState();
   const { copyModeEnabled } = useInputState();
   const config = useConfig();
   const settings = useSettings();
@@ -203,7 +205,6 @@ export const Footer: React.FC = () => {
     promptTokenCount,
     isTrustedFolder,
     terminalWidth,
-    quotaStats,
   } = {
     model: uiState.currentModel,
     targetDir: config.getTargetDir(),
@@ -216,9 +217,10 @@ export const Footer: React.FC = () => {
     promptTokenCount: uiState.sessionStats.lastPromptTokenCount,
     isTrustedFolder: uiState.isTrustedFolder,
     terminalWidth: uiState.terminalWidth,
-    quotaStats: uiState.quota.stats,
   };
 
+  const quotaStats = quotaState.stats;
+
   const isFullErrorVerbosity = settings.merged.ui.errorVerbosity === 'full';
   const showErrorSummary =
     !showErrorDetails &&

packages/cli/src/ui/contexts/QuotaContext.tsx

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2026 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { createContext, useContext } from 'react';
+import type { QuotaStats } from '../types.js';
+import type { UserTierId } from '@google/gemini-cli-core';
+import type {
+  ProQuotaDialogRequest,
+  ValidationDialogRequest,
+  OverageMenuDialogRequest,
+  EmptyWalletDialogRequest,
+} from './UIStateContext.js';
+
+export interface QuotaState {
+  userTier?: UserTierId;
+  stats?: QuotaStats;
+  proQuotaRequest?: ProQuotaDialogRequest | null;
+  validationRequest?: ValidationDialogRequest | null;
+  overageMenuRequest?: OverageMenuDialogRequest | null;
+  emptyWalletRequest?: EmptyWalletDialogRequest | null;
+}
+
+export const QuotaContext = createContext<QuotaState | null>(null);
+
+export const useQuotaState = () => {
+  const context = useContext(QuotaContext);
+  if (!context) {
+    throw new Error('useQuotaState must be used within a QuotaProvider');
+  }
+  return context;
+};

packages/cli/src/ui/contexts/UIStateContext.tsx

@@ -9,7 +9,6 @@ import type {
   HistoryItem,
   ThoughtSummary,
   ConfirmationRequest,
-  QuotaStats,
   LoopDetectionConfirmationRequest,
   HistoryItemWithoutId,
   StreamingState,
@@ -21,7 +20,6 @@ import type { CommandContext, SlashCommand } from '../commands/types.js';
 import type {
   IdeContext,
   ApprovalMode,
-  UserTierId,
   IdeInfo,
   AuthType,
   FallbackIntent,
@@ -86,16 +84,6 @@ import { type RestartReason } from '../hooks/useIdeTrustListener.js';
 import type { TerminalBackgroundColor } from '../utils/terminalCapabilityManager.js';
 import type { BackgroundTask } from '../hooks/useExecutionLifecycle.js';
 
-export interface QuotaState {
-  userTier: UserTierId | undefined;
-  stats: QuotaStats | undefined;
-  proQuotaRequest: ProQuotaDialogRequest | null;
-  validationRequest: ValidationDialogRequest | null;
-  // G1 AI Credits overage flow
-  overageMenuRequest: OverageMenuDialogRequest | null;
-  emptyWalletRequest: EmptyWalletDialogRequest | null;
-}
-
 export interface AccountSuspensionInfo {
   message: string;
   appealUrl?: string;
@@ -169,8 +157,6 @@ export interface UIState {
   queueErrorMessage: string | null;
   showApprovalModeIndicator: ApprovalMode;
   allowPlanMode: boolean;
-  // Quota-related state
-  quota: QuotaState;
   currentModel: string;
   contextFileNames: string[];
   errorCount: number;

packages/cli/src/ui/hooks/useComposerStatus.ts

@@ -6,6 +6,7 @@
 
 import { useMemo } from 'react';
 import { useUIState } from '../contexts/UIStateContext.js';
+import { useQuotaState } from '../contexts/QuotaContext.js';
 import { useSettings } from '../contexts/SettingsContext.js';
 import { CoreToolCallStatus, ApprovalMode } from '@google/gemini-cli-core';
 import { type HistoryItemToolGroup, StreamingState } from '../types.js';
@@ -18,6 +19,7 @@ import { theme } from '../semantic-colors.js';
  */
 export const useComposerStatus = () => {
   const uiState = useUIState();
+  const quotaState = useQuotaState();
   const settings = useSettings();
 
   const hasPendingToolConfirmation = useMemo(
@@ -40,8 +42,8 @@ export const useComposerStatus = () => {
     Boolean(uiState.authConsentRequest) ||
     (uiState.confirmUpdateExtensionRequests?.length ?? 0) > 0 ||
     Boolean(uiState.loopDetectionConfirmationRequest) ||
-    Boolean(uiState.quota.proQuotaRequest) ||
-    Boolean(uiState.quota.validationRequest) ||
+    Boolean(quotaState.proQuotaRequest) ||
+    Boolean(quotaState.validationRequest) ||
     Boolean(uiState.customDialog);
 
   const isInteractiveShellWaiting = Boolean(