🔧 fix: MCP Selection Persist and UI Flicker Issues (#9324)

* refactor: useMCPSelect

    - Add useGetMCPTools to use in useMCPSelect and elsewhere hooks for fetching MCP tools
    - remove memoized key
    - remove use of `useChatContext` and require conversationId as prop

* feat: Add MCPPanelContext and integrate conversationId as prop for useMCPSelect across components

- Introduced MCPPanelContext to manage conversationId state.
- Updated MCPSelect, MCPSubMenu, and MCPConfigDialog to accept conversationId as a prop.
- Modified ToolsDropdown and BadgeRow to pass conversationId to relevant components.
- Refactored MCPPanel to utilize MCPPanelProvider for context management.

* fix: remove nested ternary in ServerInitializationSection

- Replaced conditional operator with if-else statements for better readability in determining button text based on server initialization state and reinitialization status.

* refactor: wrap setValueWrap in useCallback for performance optimization

* refactor: streamline useMCPSelect by consolidating storageKey definition

* fix: prevent clearing selections on page refresh by tracking initial load completion

* refactor: simplify concern of useMCPSelect hook

* refactor: move ConfigFieldDetail interface to common types for better reusability, isolate usage of `useGetMCPTools`

* refactor: integrate mcpServerNames into BadgeRowContext and update ToolsDropdown and MCPSelect components

client/src/components/MCP/MCPConfigDialog.tsx

@@ -8,15 +8,11 @@ import {
   OGDialogContent,
 } from '@librechat/client';
 import type { MCPServerStatus } from 'librechat-data-provider';
+import type { ConfigFieldDetail } from '~/common';
 import ServerInitializationSection from './ServerInitializationSection';
 import CustomUserVarsSection from './CustomUserVarsSection';
 import { useLocalize } from '~/hooks';
 
-export interface ConfigFieldDetail {
-  title: string;
-  description: string;
-}
-
 interface MCPConfigDialogProps {
   isOpen: boolean;
   onOpenChange: (isOpen: boolean) => void;
@@ -27,6 +23,7 @@ interface MCPConfigDialogProps {
   onRevoke?: () => void;
   serverName: string;
   serverStatus?: MCPServerStatus;
+  conversationId?: string | null;
 }
 
 export default function MCPConfigDialog({
@@ -38,6 +35,7 @@ export default function MCPConfigDialog({
   onRevoke,
   serverName,
   serverStatus,
+  conversationId,
 }: MCPConfigDialogProps) {
   const localize = useLocalize();
 
@@ -126,6 +124,7 @@ export default function MCPConfigDialog({
         {/* Server Initialization Section */}
         <ServerInitializationSection
           serverName={serverName}
+          conversationId={conversationId}
           requiresOAuth={serverStatus?.requiresOAuth || false}
           hasCustomUserVars={fieldsSchema && Object.keys(fieldsSchema).length > 0}
         />

client/src/components/MCP/ServerInitializationSection.tsx

@@ -9,12 +9,14 @@ interface ServerInitializationSectionProps {
   serverName: string;
   requiresOAuth: boolean;
   hasCustomUserVars?: boolean;
+  conversationId?: string | null;
 }
 
 export default function ServerInitializationSection({
-  sidePanel = false,
   serverName,
   requiresOAuth,
+  conversationId,
+  sidePanel = false,
   hasCustomUserVars = false,
 }: ServerInitializationSectionProps) {
   const localize = useLocalize();
@@ -26,7 +28,7 @@ export default function ServerInitializationSection({
     isInitializing,
     isCancellable,
     getOAuthUrl,
-  } = useMCPServerManager();
+  } = useMCPServerManager({ conversationId });
 
   const serverStatus = connectionStatus[serverName];
   const isConnected = serverStatus?.connectionState === 'connected';
@@ -69,13 +71,18 @@ export default function ServerInitializationSection({
   const isReinit = shouldShowReinit;
   const outerClass = isReinit ? 'flex justify-start' : 'flex justify-end';
   const buttonVariant = isReinit ? undefined : 'default';
-  const buttonText = isServerInitializing
-    ? localize('com_ui_loading')
-    : isReinit
-      ? localize('com_ui_reinitialize')
-      : requiresOAuth
-        ? localize('com_ui_authenticate')
-        : localize('com_ui_mcp_initialize');
+
+  let buttonText = '';
+  if (isServerInitializing) {
+    buttonText = localize('com_ui_loading');
+  } else if (isReinit) {
+    buttonText = localize('com_ui_reinitialize');
+  } else if (requiresOAuth) {
+    buttonText = localize('com_ui_authenticate');
+  } else {
+    buttonText = localize('com_ui_mcp_initialize');
+  }
+
   const icon = isServerInitializing ? (
     <Spinner className="h-4 w-4" />
   ) : (