Don't accept input until slash commands are loaded (#11162)

packages/cli/src/nonInteractiveCliCommands.ts

@@ -39,9 +39,8 @@ export const handleSlashCommand = async (
   }
 
   // Only custom commands are supported for now.
-  const loaders = [new FileCommandLoader(config)];
   const commandService = await CommandService.create(
-    loaders,
+    [new FileCommandLoader(config)],
     abortController.signal,
   );
   const commands = commandService.getCommands();

packages/cli/src/ui/AppContainer.tsx

@@ -681,6 +681,7 @@ Logging in with Google... Please restart Gemini CLI to continue.
   const isInputActive =
     !initError &&
     !isProcessing &&
+    !!slashCommands &&
     (streamingState === StreamingState.Idle ||
       streamingState === StreamingState.Responding) &&
     !proQuotaRequest;

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

@@ -58,7 +58,9 @@ export const Composer = () => {
         />
       )}
 
-      {!uiState.isConfigInitialized && <ConfigInitDisplay />}
+      {(!uiState.slashCommands || !uiState.isConfigInitialized) && (
+        <ConfigInitDisplay />
+      )}
 
       <QueuedMessageDisplay messageQueue={uiState.messageQueue} />
 
@@ -133,7 +135,7 @@ export const Composer = () => {
           userMessages={uiState.userMessages}
           onClearScreen={uiActions.handleClearScreen}
           config={config}
-          slashCommands={uiState.slashCommands}
+          slashCommands={uiState.slashCommands || []}
           commandContext={uiState.commandContext}
           shellModeActive={uiState.shellModeActive}
           setShellModeActive={uiActions.setShellModeActive}

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

@@ -56,7 +56,7 @@ export interface UIState {
   isSettingsDialogOpen: boolean;
   isModelDialogOpen: boolean;
   isPermissionsDialogOpen: boolean;
-  slashCommands: readonly SlashCommand[];
+  slashCommands: readonly SlashCommand[] | undefined;
   pendingSlashCommandHistoryItems: HistoryItemWithoutId[];
   commandContext: CommandContext;
   shellConfirmationRequest: ShellConfirmationRequest | null;

packages/cli/src/ui/hooks/slashCommandProcessor.test.ts

@@ -342,6 +342,8 @@ describe('useSlashCommandProcessor', () => {
         setMockIsProcessing,
       );
 
+      await waitFor(() => expect(result.current.slashCommands).toBeDefined());
+
       await act(async () => {
         await result.current.handleSlashCommand('/fail');
       });

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

@@ -74,7 +74,9 @@ export const useSlashCommandProcessor = (
   isConfigInitialized: boolean,
 ) => {
   const session = useSessionStats();
-  const [commands, setCommands] = useState<readonly SlashCommand[]>([]);
+  const [commands, setCommands] = useState<readonly SlashCommand[] | undefined>(
+    undefined,
+  );
   const [reloadTrigger, setReloadTrigger] = useState(0);
 
   const reloadCommands = useCallback(() => {
@@ -257,20 +259,18 @@ export const useSlashCommandProcessor = (
 
   useEffect(() => {
     const controller = new AbortController();
-    const load = async () => {
+
-      const loaders = [
+    (async () => {
+      const commandService = await CommandService.create(
+        [
           new McpPromptLoader(config),
           new BuiltinCommandLoader(config),
           new FileCommandLoader(config),
-      ];
+        ],
-      const commandService = await CommandService.create(
-        loaders,
         controller.signal,
       );
       setCommands(commandService.getCommands());
-    };
+    })();
-
-    load();
 
     return () => {
       controller.abort();
@@ -283,6 +283,9 @@ export const useSlashCommandProcessor = (
       oneTimeShellAllowlist?: Set<string>,
       overwriteConfirmed?: boolean,
     ): Promise<SlashCommandProcessorResult | false> => {
+      if (!commands) {
+        return false;
+      }
       if (typeof rawQuery !== 'string') {
         return false;
       }