🔧 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/Chat/Input/MCPConfigDialog.tsx

@@ -1,13 +1,9 @@
 import React, { useEffect } from 'react';
 import { useForm, Controller } from 'react-hook-form';
 import { Button, Input, Label, OGDialog, OGDialogTemplate } from '@librechat/client';
+import type { ConfigFieldDetail } from '~/common';
 import { useLocalize } from '~/hooks';
 
-export interface ConfigFieldDetail {
-  title: string;
-  description: string;
-}
-
 interface MCPConfigDialogProps {
   isOpen: boolean;
   onOpenChange: (isOpen: boolean) => void;
@@ -34,7 +30,7 @@ export default function MCPConfigDialog({
     control,
     handleSubmit,
     reset,
-    formState: { errors, _ },
+    formState: { errors },
   } = useForm<Record<string, string>>({
     defaultValues: initialValues,
   });
@@ -56,14 +52,12 @@ export default function MCPConfigDialog({
   };
 
   const dialogTitle = localize('com_ui_configure_mcp_variables_for', { 0: serverName });
-  const dialogDescription = localize('com_ui_mcp_dialog_desc');
 
   return (
     <OGDialog open={isOpen} onOpenChange={onOpenChange}>
       <OGDialogTemplate
         className="sm:max-w-lg"
         title={dialogTitle}
-        description={dialogDescription}
         headerClassName="px-6 pt-6 pb-4"
         main={
           <form onSubmit={handleSubmit(onFormSubmit)} className="space-y-4 px-6 pb-2">