Disable chat input while extensions load (#4417)

ui/desktop/src/utils/appInitialization.ts

@@ -15,6 +15,7 @@ interface InitializationDependencies {
   addExtension?: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void>;
   setPairChat: (chat: ChatType | ((prev: ChatType) => ChatType)) => void;
   setMessage: (message: string | null) => void;
+  setIsExtensionsLoading: (loading: boolean) => void;
   provider: string;
   model: string;
 }
@@ -24,6 +25,7 @@ export const initializeApp = async ({
   addExtension,
   setPairChat,
   setMessage,
+  setIsExtensionsLoading,
   provider,
   model,
 }: InitializationDependencies) => {
@@ -36,7 +38,13 @@ export const initializeApp = async ({
 
   if (resumeSessionId) {
     console.log('Session resume detected, letting useChat hook handle navigation');
-    await initializeForSessionResume({ getExtensions, addExtension, provider, model });
+    await initializeForSessionResume({
+      getExtensions,
+      addExtension,
+      setIsExtensionsLoading,
+      provider,
+      model,
+    });
     return;
   }
 
@@ -47,6 +55,7 @@ export const initializeApp = async ({
       getExtensions,
       addExtension,
       setPairChat,
+      setIsExtensionsLoading,
       provider,
       model,
     });
@@ -82,6 +91,7 @@ export const initializeApp = async ({
         initializeSystem(provider, model, {
           getExtensions,
           addExtension,
+          setIsExtensionsLoading,
         }),
       ];
 
@@ -115,15 +125,20 @@ export const initializeApp = async ({
 const initializeForSessionResume = async ({
   getExtensions,
   addExtension,
+  setIsExtensionsLoading,
   provider,
   model,
-}: Pick<InitializationDependencies, 'getExtensions' | 'addExtension' | 'provider' | 'model'>) => {
+}: Pick<
+  InitializationDependencies,
+  'getExtensions' | 'addExtension' | 'setIsExtensionsLoading' | 'provider' | 'model'
+>) => {
   await initConfig();
   await readAllConfig({ throwOnError: true });
 
   await initializeSystem(provider, model, {
     getExtensions,
     addExtension,
+    setIsExtensionsLoading,
   });
 };
 
@@ -132,11 +147,12 @@ const initializeForRecipe = async ({
   getExtensions,
   addExtension,
   setPairChat,
+  setIsExtensionsLoading,
   provider,
   model,
 }: Pick<
   InitializationDependencies,
-  'getExtensions' | 'addExtension' | 'setPairChat' | 'provider' | 'model'
+  'getExtensions' | 'addExtension' | 'setPairChat' | 'setIsExtensionsLoading' | 'provider' | 'model'
 > & {
   recipeConfig: Recipe;
 }) => {
@@ -146,6 +162,7 @@ const initializeForRecipe = async ({
   await initializeSystem(provider, model, {
     getExtensions,
     addExtension,
+    setIsExtensionsLoading,
   });
 
   setPairChat((prevChat) => ({

ui/desktop/src/utils/providerUtils.ts

@@ -115,6 +115,7 @@ export const initializeSystem = async (
   options?: {
     getExtensions?: (b: boolean) => Promise<FixedExtensionEntry[]>;
     addExtension?: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void>;
+    setIsExtensionsLoading?: (loading: boolean) => void;
   }
 ) => {
   try {
@@ -182,6 +183,8 @@ export const initializeSystem = async (
     // Add enabled extensions to agent in parallel
     const enabledExtensions = refreshedExtensions.filter((ext) => ext.enabled);
 
+    options?.setIsExtensionsLoading?.(true);
+
     const extensionLoadingPromises = enabledExtensions.map(async (extensionEntry) => {
       const extensionConfig = extractExtensionConfig(extensionEntry);
       const extensionName = extensionConfig.name;
@@ -198,8 +201,10 @@ export const initializeSystem = async (
     });
 
     await Promise.allSettled(extensionLoadingPromises);
+    options?.setIsExtensionsLoading?.(false);
   } catch (error) {
     console.error('Failed to initialize agent:', error);
+    options?.setIsExtensionsLoading?.(false);
     throw error;
   }
 };